ui updates

barkmanui/src/features/inventory/EditItem.tsx

@@ -1,4 +1,4 @@
-import {Button, Group, TextInput, Text, Textarea, NumberInput, Container, Title, Flex} from '@mantine/core';
+import {Button, Group, TextInput, Textarea, NumberInput, Container, Title, Flex} from '@mantine/core';
 import {useForm} from '@mantine/form';
 import {useParams} from "react-router";
 import {useMutation, useQuery, useQueryClient} from "@tanstack/react-query";
@@ -13,6 +13,7 @@ function EditItem() {
     const editItemForm = useForm<EditableInventoryItem>({
         mode: 'uncontrolled',
         initialValues: {
+            barcode: 0,
             name: "",
             brand: "",
             statusId: "",
@@ -90,7 +91,8 @@ function EditItem() {
 
                     <div>{isFetching ? 'Updating...' : ''}</div>
                     <Title order={1}>Edit Item</Title>
-                    <Text>ID: {data.id}</Text>
+                    <NumberInput  withAsterisk size="md" key={editItemForm.key('barcode')} label="Barcode"
+                                 placeholder="Barcode" {...editItemForm.getInputProps('barcode')}/>
                     <TextInput withAsterisk key={editItemForm.key('brand')} size="md" label="Brand"
                                placeholder="Brand" {...editItemForm.getInputProps('brand')}/>
                     <TextInput withAsterisk key={editItemForm.key('name')} size="md" label="Name"

barkmanui/src/features/inventory/InventoryList.tsx

@@ -46,7 +46,7 @@ function InventoryList() {
             <Table striped>
             <Table.Thead>
                 <Table.Tr>
-                    <Table.Th c="red">ID</Table.Th>
+                    <Table.Th c="red">Barcode</Table.Th>
                     <Table.Th c="red">Brand</Table.Th>
                     <Table.Th c="red">Item</Table.Th>
                     <Table.Th c="red">Status</Table.Th>
@@ -56,7 +56,7 @@ function InventoryList() {
                 <Table.Tbody>
                 {data.map((data) => (
                     <Table.Tr key={data.id}>
-                        <Table.Td>{data.id}</Table.Td>
+                        <Table.Td>{data.barcode}</Table.Td>
                         <Table.Td>{data.brand}</Table.Td>
                         <Table.Td>{data.name}</Table.Td>
                         <Table.Td>{data.statusId}</Table.Td>

barkmanui/src/features/inventory/ItemDetail.tsx

@@ -29,7 +29,7 @@ function ItemDetail() {
             <Container m="lg">
                 <Title order={1}>Item Detail</Title>
                 <div>{isFetching ? 'Updating...' : ''}</div>
-                <Text>ID: {data.id}</Text>
+                <Text>Barcode: {data.barcode}</Text>
                 <Text>Brand: {data.brand}</Text>
                 <Text>Name: {data.name}</Text>
                 <Text>Status: {data.status.name}</Text>

barkmanui/src/features/inventory/types.ts

@@ -1,5 +1,6 @@
 export interface InventoryItem {
     id: number,
+    barcode: number,
     brand: string,
     name: string,
     status: {id: string; name: string},