diff --git a/src/private/AddProductForm.jsx b/src/private/AddProductForm.jsx
new file mode 100644
index 0000000..27e961d
--- /dev/null
+++ b/src/private/AddProductForm.jsx
@@ -0,0 +1,117 @@
+import React, { useState } from 'react';
+import { Box, Button, TextField, Typography, Grid } from '@mui/material';
+
+export default function AddProductForm() {
+ const [product, setProduct] = useState({
+ name: '',
+ price: '',
+ supplier: '',
+ stock: '',
+ category: '',
+ });
+
+ const handleChange = (e) => {
+ const { name, value } = e.target;
+ setProduct((prev) => ({ ...prev, [name]: value }));
+ };
+
+ const handleSave = () => {
+ console.log('Saving product:', product);
+ };
+
+ const handleDelete = () => {
+ console.log('Deleting product');
+ };
+
+ const handleUpdate = () => {
+ console.log('Updating product:', product);
+ };
+
+ return (
+
+
+ Add Products
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/src/private/Admin.jsx b/src/private/Admin.jsx
index 04f70e6..31bdc46 100644
--- a/src/private/Admin.jsx
+++ b/src/private/Admin.jsx
@@ -1,8 +1,9 @@
import SectionContainer from '../components/SectionContainer';
-import React from 'react';
+import React, { useState } from 'react';
import { DataGrid } from '@mui/x-data-grid';
-import { Typography, InputBase, IconButton, Box } from '@mui/material';
+import { Typography, Button, Dialog, DialogTitle, DialogContent } from '@mui/material';
+import AddProductForm from './AddProductForm';
const columns = [
{ field: 'id', headerName: 'ID', width: 70 },
@@ -14,27 +15,47 @@ const columns = [
{ field: 'category', headerName: 'Category', flex: 1 }
];
-const rows = [
- { id: 1, company:'Fendi casa', name: 'Product 1', price: 10.99, provider: 'Provider A', stock: 100, category: 'Home' },
- { id: 2, company:'Fendi casa', name: 'Product 2', price: 20.00, provider: 'Provider B', stock: 50, category: 'Home' },
- { id: 3, company:'Fendi casa', name: 'Product 3', price: 5.50, provider: 'Provider C', stock: 200, category: 'Home' },
- { id: 4, company:'Fendi casa', name: 'Product 4', price: 15.75, provider: 'Provider D', stock: 30, category: 'Home' },
- { id: 5, company:'Fendi casa', name: 'Product 5', price: 8.20, provider: 'Provider E', stock: 75, category: 'Home' }
-];
-
export default function Admin({ children, maxWidth = 'lg', sx = {} }) {
+ const [rows, setRows] = useState([
+ { id: 1, company: 'Fendi casa', name: 'Product 1', price: 10.99, provider: 'Provider A', stock: 100, category: 'Home' },
+ { id: 2, company: 'Fendi casa', name: 'Product 2', price: 20.0, provider: 'Provider B', stock: 50, category: 'Home' },
+ { id: 3, company: 'Fendi casa', name: 'Product 3', price: 5.5, provider: 'Provider C', stock: 200, category: 'Home' },
+ { id: 4, company: 'Fendi casa', name: 'Product 4', price: 15.75, provider: 'Provider D', stock: 30, category: 'Home' },
+ { id: 5, company: 'Fendi casa', name: 'Product 5', price: 8.2, provider: 'Provider E', stock: 75, category: 'Home' }
+ ]);
+
+ const [open, setOpen] = useState(false);
+
+ const handleAddProduct = (newProduct) => {
+ const id = rows.length + 1;
+ setRows([...rows, { id, company: 'Fendi casa', ...newProduct }]);
+ setOpen(false);
+ };
+
return (
Product Catalog
+
+
+
+
+
+
+ rowsPerPageOptions={[5]} />
);
}
\ No newline at end of file