drew/barkman
1
0
Fork 0
mirror of https://github.com/BarkProductions/barkman.git synced 2026-06-13 06:11:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

sort works, barcode is weird

Browse Source
This commit is contained in:
Drew Rautenberg
2025-02-05 11:42:06 -06:00
parent 15e5957ecf
commit f5646fa6cf
1 changed files with 23 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
barkmanui/src/features/inventory/AddItem.tsx
+23 -31
View File
@@ -1,38 +1,22 @@
import {Button, Group, TextInput, NumberInput, Container, Title, Flex} from '@mantine/core'; import {Button, Group, TextInput, NumberInput, Container, Title, Flex} from '@mantine/core';
import {useForm} from '@mantine/form'; import {useForm} from '@mantine/form';
import {useMutation, useQuery} from "@tanstack/react-query"; import {useMutation} from "@tanstack/react-query";
import {InventoryItem, NewItem} from "./types.ts"; import {NewItem} from "./types.ts";
import { useNavigate} from "react-router"; import {useNavigate} from "react-router";
import { IconX, IconCheck } from '@tabler/icons-react'; import {IconX, IconCheck} from '@tabler/icons-react';
import { notifications } from '@mantine/notifications'; import {notifications} from '@mantine/notifications';
import useInventoryList from "./hooks/useInventoryList.tsx";
function AddItem() { function AddItem() {
const navigate = useNavigate(); const navigate = useNavigate();
const { isPending, error, data} = useQuery({ const rawData = useInventoryList();
queryKey: ['inventory'],
queryFn: async (): Promise<InventoryItem[]> => {
const response = await fetch(
import.meta.env.VITE_API_URL + '/inventory',
)
if (!response.ok) throw new Error('Failed to fetch inventory ' + response.statusText)
return await response.json()
},
});
if (isPending) return 'Loading...'
if (error) return 'An error has occurred: ' + error.message
const lastBarcode = data[data.length - 1].barcode;
const newItemForm = useForm<NewItem>({ const newItemForm = useForm<NewItem>({
mode: 'uncontrolled', mode: 'uncontrolled',
initialValues: { initialValues: {
barcode: lastBarcode + 1, barcode: 0,
name: "", name: "",
brand: "", brand: "",
serialNumber: "", serialNumber: "",
@@ -56,8 +40,8 @@ function AddItem() {
if (result.ok) { if (result.ok) {
notifications.show({ notifications.show({
icon: <IconCheck size={20} />, icon: <IconCheck size={20}/>,
color:"teal", color: "teal",
title: "All good!", title: "All good!",
message: "Item Created", message: "Item Created",
position: 'top-center', position: 'top-center',
@@ -68,8 +52,8 @@ function AddItem() {
if (!result.ok) { if (!result.ok) {
notifications.show({ notifications.show({
icon: <IconX size={20} />, icon: <IconX size={20}/>,
color:"red", color: "red",
title: "Bummer!", title: "Bummer!",
message: "Something went wrong", message: "Something went wrong",
position: 'top-center', position: 'top-center',
@@ -77,9 +61,16 @@ function AddItem() {
throw new Error('Failed to create inventory item'); throw new Error('Failed to create inventory item');
} }
} },
}) })
if (rawData.isPending) return 'Loading...'
if (rawData.error) return 'An error has occurred: ' + rawData.error.message
const data = rawData.data
const nextBarcode = data[data.length - 1].barcode + 1;
return ( return (
<> <>
@@ -94,8 +85,9 @@ function AddItem() {
wrap="wrap"> wrap="wrap">
<Title order={1}>Add Item</Title> <Title order={1}>Add Item</Title>
<NumberInput withAsterisk size="md" key={newItemForm.key('barcode')} label="Barcode" <NumberInput withAsterisk size="md" key={newItemForm.key('barcode')} label="Barcode"
placeholder="Barcode" {...newItemForm.getInputProps('barcode')}/> placeholder="Barcode"
value={nextBarcode} {...newItemForm.getInputProps('barcode')}/>
<TextInput withAsterisk key={newItemForm.key('brand')} size="md" label="Brand" <TextInput withAsterisk key={newItemForm.key('brand')} size="md" label="Brand"
placeholder="Brand" {...newItemForm.getInputProps('brand')}/> placeholder="Brand" {...newItemForm.getInputProps('brand')}/>
<TextInput withAsterisk key={newItemForm.key('name')} size="md" label="Name" <TextInput withAsterisk key={newItemForm.key('name')} size="md" label="Name"