autocommit 15-06-2024-17-32

pos-frontend/app/inventory/page.tsx

@@ -3,6 +3,11 @@
 import React, { useState } from 'react'
 import { Box, Container, Paper, Table, Button, TextInput, useMantineTheme, Flex, Image } from '@mantine/core'
 import Example from './query'
+// import { Image as NextImage } from 'next/image'
+import NextImage from 'next/image';
+
+import Prawn from "../images/aussietigerprawns.jpg"
+// import Prawn from "/aussietigerprawns.jpg"
 
 interface InventoryItem {
   id: number
@@ -103,12 +108,29 @@ export default function InventoryPage() {
         gap="md"
         justify="flex-start"
         align="flex-start"
-        direction="row"
+        direction="column"
         wrap="wrap"
       >
         {/* would fetch the source from axios */}
-        <Image src="x.png" alt="ITEM" />
-        <Example />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        <NextImage src={Prawn} alt="ITEM" />
+        {/* <Example /> */}
+
+        {/* <Image component={NextImage} src={Prawn} alt="TIGER PRAWNS" /> */}
+
+        {/* from public import everything .jpg */}
+
+        {/* create an Image for each */}
+
+        {/* <NextImage src="cake.jpg" alt="public/cake" /> */}
       </Flex>
     </Box>
   )