Find largest table in a SQL Server database Monitoring table size over time is very important to the SQL Server Engine. In performance point of view to run queries. At the most optimal and avoid performance issues due to larger table size as it important factor in SQL Server performance There are often many times people ask, how to find the largest tables/objects in a database, so below scripts, will determine which objects in a database are largest. SELECT t.name AS TableName, i.name as indexName, sum(p.rows) as RowCounts, sum(a.total_pages) as TotalPages, sum(a.used_pages) as UsedPages, sum(a.data_pages) as DataPages, (sum(a.total_pages) * 8) / 1024 as TotalSpaceMB, (sum(a.used_pages) * 8) / 1024 as UsedSpaceMB, (sum(a.data_pages) * 8) / 1024 as DataSpaceMB FROM sys.tables t INNER JOIN sys.indexes i ON t.object_id = i.object_id INNER JOIN sys.partitions p ON i.object_id = p.object_id AND i.index_id = p.index_id INNER JOIN sys.allocation_units a ON p.partition_id = a.container_id WHERE t.name NOT LIKE 'dt%' AND i.object_id > 255 AND i.index_id <= 1 GROUP BY t.name, i.object_id, i.index_id, i.name ORDER BY TotalSpaceMB DESC

How can I add empty input fields with onClick function using Formik in React

Vikash

I want to add 4 empty inputText fileds once button Add Person is clicked, which then needs to be filled and update values property. Those empty inputs supposed to be added to values.persons perperty which is an array of objects once addPerson()is called. I have some logic inside, but unfortunatelly nothing happens with this code

const data = [
  {
    luxmedType: {
      package: "Indywidualny",
      type: "Opieka standardowa",
      cost: 0
    },
    companyCost: 91.6,
    comment: null,
    persons: [
      {
        name: "Marian",
        lastName: "Kowalski",
        type: "wspó?pracownik",
        cooperationForm: "B2B"
      }
    ]
  },
  {
    luxmedType: {
      package: "Rodzinny",
      type: "Opieka premium",
      cost: 559.1
    },
    companyCost: 0,
    comment: null,
    persons: [
      {
        name: "Ewa",
        lastName: "Kowalska",
        type: "partner",
        cooperationForm: null
      },
      {
        name: "Maria",
        lastName: "Kowalska",
        type: "dziecko",
        cooperationForm: null
      }
    ]
  },
  {
    luxmedType: {
      package: "osobisty",
      type: "Opieka premium",
      cost: 1000
    },
    companyCost: 0,
    comment: null,
    persons: [
      {
        name: "Anna",
        lastName: "Michalska",
        type: "partner",
        cooperationForm: null
      },
      {
        name: "Maria",
        lastName: "Michalska",
        type: "dziecko",
        cooperationForm: null
      },

      {
        name: "Aleksander",
        lastName: "Michalski",
        type: "dziecko",
        cooperationForm: null
      }
    ]
  }
];

const initialValues = data;

export default function App() {
  const { values, handleChange, onSubmit, setValues } = useFormik({
    initialValues,
    onSubmit: (values) => console.log(values)
  });

  const addPerson = () => {
    const persons = [...values.persons];
    persons.push({
      name: "",
      lastName: "",
      type: "",
      cooperationForm: null,
      id: Math.random()
    });
    setValues({ ...values,persons });
  };

  return (
    <div>
      <h1>Luxmed</h1>
      <form onSubmit={onSubmit}>
        {initialValues.map((object) => {
          let luxmedType = object.luxmedType,
            companyCost = object.companyCost,
            comment = object.comment,
            persons = object.persons;

          return (
            <div style={{ marginBottom: "20px" }}>
              <InputText
                name="package"
                value={luxmedType.package}
                onChange={handleChange}
              />
              <InputText
                name="type"
                value={luxmedType.type}
                onChange={handleChange}
              />
              <InputText
                name="cost"
                value={luxmedType.cost}
                onChange={handleChange}
              />
              <InputText
                name="companyCost"
                value={companyCost}
                onChange={handleChange}
              />
              <InputText
                name="companyCost"
                value={comment || ""}
                onChange={handleChange}
              />
              {persons.map((person) => {
                return (
                  <div>
                    <InputText
                      name="package"
                      value={person.name}
                      onChange={handleChange}
                    />
                    <InputText
                      name="package"
                      value={person.lastName}
                      onChange={handleChange}
                    />
                    <InputText
                      name="package"
                      value={person.type}
                      onChange={handleChange}
                    />
                    <InputText
                      name="package"
                      value={person.cooperationForm}
                      onChange={handleChange}
                    />
                    <button>Remove</button>
                  </div>
                );
              })}
            </div>
          );
        })}
        <button onClick={() => addPerson()}>Add Person</button>

        <button type="submit">submit</button>
      </form>
    </div>
  );
}

Here is also codesandbox for You if You wish https://codesandbox.io/s/serene-bose-x6qk9y?file=/src/App.js:1552-1553&fbclid=IwAR3Q6bnkVyCtox5hTCHaFibtKJ92huwkSDVHKPOSiTdoA743lURBq76Abq0

thanks