Added support for adding multiple rows

blocks/components/LCPDataGrid.js

@@ -4,6 +4,30 @@ import 'ag-grid-community/styles/ag-grid.css';
 import 'ag-grid-community/styles/ag-theme-alpine.css';
 
 const LCPDataGrid = ({dataset}) => {
+
+
+    const [rowsToAdd, setRowsToAdd] = useState(1); // Number of rows the user wants to add
+
+    const [currentRowCount, setCurrentRowCount] = useState(dataset.length); // Track the current row count
+
+    // Button click handler to add a new row
+    const addRows = () => {
+        if (gridApi) {
+            const rows = [];
+            // Create the specified number of new rows (empty rows in this case)
+            for (let i = 0; i < rowsToAdd; i++) {
+                rows.push({}); // You can customize the empty row content if needed
+            }
+            
+            // Use the grid API to add the new rows
+            gridApi.applyTransaction({ add: rows });
+
+            // Update the current row count
+            setCurrentRowCount(prevCount => prevCount + rowsToAdd);
+        } else {
+            console.log('Grid is not ready yet');
+        }
+    };
     // let gridData = [
     //     { Department2: 'Sheriffs Office 2', Budget: '150000', MeetAt: '12/12/2025', PreferredColor: '#e0e0e0', PostContent: '<div> </div>' },
     //     { Department2: 'Treasurer2', Budget: '10000', MeetAt: '12-05', PreferredColor: '#232323', PostContent: '<p> </p>' },
@@ -176,18 +200,6 @@ const LCPDataGrid = ({dataset}) => {
     const gridRef = useRef(null);
     const [gridApi, setGridApi] = useState(null); // Store grid API in state
 
-    // Button click handler to add a new row
-    const addRow = () => {
-        if (gridApi) {
-            const newRow = {}; // Empty Row
-            // Use the grid API to add the new row
-            gridApi.applyTransaction({ add: [newRow] });
-
-
-        } else {
-            console.log('Grid is not ready yet');
-        }
-    };
 
     // Default Column Properties
     const defaultColDef = {
@@ -255,7 +267,19 @@ const LCPDataGrid = ({dataset}) => {
 
             {/* Button outside the grid */}
             <div>
-                <button onClick={addRow}>Add Row</button>
+            {/* Input to add multiple rows */}
+            <div>
+                <input
+                    type="number"
+                    value={rowsToAdd}
+                    onChange={(e) => setRowsToAdd(Math.max(1, parseInt(e.target.value, 10)))}
+                    min="1"
+                />
+                <button onClick={addRows}>Add Row(s)</button>
+            </div>
+            <div>
+                <span>{currentRowCount} Rows</span>
+            </div>
             </div>
         </div>
     );