keannu125/Ivy-Frontend
1
0
Fork 0
mirror of https://github.com/lemeow125/Ivy-Frontend.git synced 2025-05-14 10:31:07 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Initial Products

Browse source
This commit is contained in:
jurenroy 2023-02-25 02:04:14 +08:00
parent e3bbca7e8c
commit 1fded3cedf
3 changed files with 63 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

41
src/components/ProductInfo/ProductInfo.tsx Normal file
View file

@ -0,0 +1,41 @@
import { Table, TableBody, TableCell, TableContainer, TableHead, TableRow } from '@mui/material';
type Product = {
id: number;
name: string;
stocks: number;
lastModified: string;
};
type ProductInfoProps = {
products: Product[];
};
export default function ProductInfo(props: ProductInfoProps) {
const { products } = props;
return (
<TableContainer>
<Table>
<TableHead>
<TableRow>
<TableCell style={{ color: 'white' }}>Product ID</TableCell>
<TableCell style={{ color: 'white' }}>Product Name</TableCell>
<TableCell style={{ color: 'white' }}>Stocks</TableCell>
<TableCell style={{ color: 'white' }}>Last Modified</TableCell>
</TableRow>
</TableHead>
<TableBody>
{products.map((product) => (
<TableRow key={product.id}>
<TableCell style={{ color: 'white' }}>{product.id}</TableCell>
<TableCell style={{ color: 'white' }}>{product.name}</TableCell>
<TableCell style={{ color: 'white' }}>{product.stocks}</TableCell>
<TableCell style={{ color: 'white' }}>{product.lastModified}</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</TableContainer>
);
}

18
src/components/ProductsLists/ProductsLists.tsx Normal file
View file

@ -0,0 +1,18 @@
const ProductsLists = [
{
id: 1,
name: 'Product 1',
stocks: 10,
lastModified: '2022-02-24'
},
{
id: 2,
name: 'Product 2',
stocks: 5,
lastModified: '2022-02-23'
},
// add more products here
];
export default ProductsLists;