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

cleaned up ui and code

Browse Source
This commit is contained in:
Drew Rautenberg
2025-01-23 11:12:43 -06:00
parent 22101fa212
commit 1daa3d23c0
5 changed files with 55 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
barkmanui/src/App.tsx
+8 -9
View File
@@ -1,7 +1,7 @@
import { Routes, Route} from 'react-router'; import {Routes, Route} from 'react-router';
import Home from './pages/home.tsx'; import Home from './pages/home.tsx';
import InventoryList from "./features/inventory/InventoryList.tsx"; import InventoryList from "./features/inventory/InventoryList.tsx";
import { QueryClientProvider, QueryClient } from '@tanstack/react-query'; import {QueryClientProvider, QueryClient} from '@tanstack/react-query';
import {createTheme, MantineProvider} from '@mantine/core'; import {createTheme, MantineProvider} from '@mantine/core';
import '@mantine/core/styles.css'; import '@mantine/core/styles.css';
import ItemDetail from "./features/inventory/ItemDetail.tsx"; import ItemDetail from "./features/inventory/ItemDetail.tsx";
@@ -31,20 +31,19 @@ const barkTheme = createTheme({
}); });
function App() { function App() {
return <MantineProvider defaultColorScheme="auto" theme={barkTheme}>{ ( return <MantineProvider defaultColorScheme="auto" theme={barkTheme}>{(
<QueryClientProvider client={queryClient}> <QueryClientProvider client={queryClient}>
<> <>
<BarkHeader></BarkHeader> <BarkHeader></BarkHeader>
<Routes> <Routes>
<Route index element={<Home />} /> <Route index element={<Home/>}/>
<Route path="inventory" element={<InventoryList />} /> <Route path="inventory" element={<InventoryList/>}/>
<Route path="itemDetail/:itemId" element={<ItemDetail />} /> <Route path="itemDetail/:itemId" element={<ItemDetail/>}/>
<Route path="editItem/:itemId" element={<EditItem />} /> <Route path="editItem/:itemId" element={<EditItem/>}/>
</Routes> </Routes>
</> </>
</QueryClientProvider> </QueryClientProvider>
) }</MantineProvider>; )}</MantineProvider>;
} }
export default App export default App
barkmanui/src/common/components/BarkHeader.tsx
+2 -2
View File
@@ -21,8 +21,8 @@ export function BarkHeader() {
return ( return (
<header className={classes.header}> <header className={classes.header}>
<Container size="md" className={classes.inner}> <Container fluid className={classes.inner}>
<Image src="public/barklogo.png" h={55} w={55}/> <Image ml="lg" src="/barklogo.png" h={55} w={55}/>
<Group gap={5} visibleFrom="xs"> <Group gap={5} visibleFrom="xs">
{items} {items}
</Group> </Group>
barkmanui/src/features/inventory/EditItem.tsx
+18 -18
View File
@@ -10,7 +10,7 @@ type EditableInventoryItem = Omit<InventoryItem, 'id'>;
function EditItem() { function EditItem() {
const params = useParams(); const params = useParams();
const form = useForm<EditableInventoryItem>({ const editItemForm = useForm<EditableInventoryItem>({
mode: 'uncontrolled', mode: 'uncontrolled',
initialValues: { initialValues: {
name: "", name: "",
@@ -67,7 +67,7 @@ function EditItem() {
useEffect(() => { useEffect(() => {
if (data) { if (data) {
// Even if query.data changes, form will be initialized only once // Even if query.data changes, form will be initialized only once
form.initialize(data); editItemForm.initialize(data);
} }
}, [data]); }, [data]);
@@ -76,9 +76,9 @@ function EditItem() {
if (error) return 'An error has occurred: ' + error.message if (error) return 'An error has occurred: ' + error.message
return ( return (
<form onSubmit={form.onSubmit(async (values) => await <form onSubmit={editItemForm.onSubmit(async (values) => await
updateItem.mutateAsync(values))}> updateItem.mutateAsync(values))}>
<Container fluid> <Container m="lg">
<Flex mih={50} <Flex mih={50}
gap="md" gap="md"
justify="flex-start" justify="flex-start"
@@ -89,20 +89,20 @@ function EditItem() {
<div>{isFetching ? 'Updating...' : ''}</div> <div>{isFetching ? 'Updating...' : ''}</div>
<Title order={1}>Edit Item</Title> <Title order={1}>Edit Item</Title>
<Text>ID: {data.id}</Text> <Text>ID: {data.id}</Text>
<TextInput withAsterisk key={form.key('brand')} size="md" label="Brand" <TextInput withAsterisk key={editItemForm.key('brand')} size="md" label="Brand"
placeholder="Brand" {...form.getInputProps('brand')}/> placeholder="Brand" {...editItemForm.getInputProps('brand')}/>
<TextInput withAsterisk key={form.key('name')} size="md" label="Name" <TextInput withAsterisk key={editItemForm.key('name')} size="md" label="Name"
placeholder="Name" {...form.getInputProps('name')}/> placeholder="Name" {...editItemForm.getInputProps('name')}/>
<TextInput size="md" key={form.key('status')} label="Status" <TextInput size="md" key={editItemForm.key('status')} label="Status"
placeholder="Status" {...form.getInputProps('status')}/> placeholder="Status" {...editItemForm.getInputProps('status')}/>
<TextInput size="md" key={form.key('serialNumber')} label="Serial Number" <TextInput size="md" key={editItemForm.key('serialNumber')} label="Serial Number"
placeholder="Serial Number"{...form.getInputProps('serialNumber')}/> placeholder="Serial Number"{...editItemForm.getInputProps('serialNumber')}/>
<NumberInput size="md" key={form.key('rentalPrice')} label="Rental Price" <NumberInput size="md" key={editItemForm.key('rentalPrice')} label="Rental Price"
placeholder="Rental Price" {...form.getInputProps('rentalPrice')}/> placeholder="Rental Price" {...editItemForm.getInputProps('rentalPrice')}/>
<NumberInput size="md" key={form.key('replacementCost')} label="Replacement Cost" <NumberInput size="md" key={editItemForm.key('replacementCost')} label="Replacement Cost"
placeholder="Replacement Cost" {...form.getInputProps('replacementCost')}/> placeholder="Replacement Cost" {...editItemForm.getInputProps('replacementCost')}/>
<Textarea label="Notes" key={form.key('notes')} <Textarea label="Notes" key={editItemForm.key('notes')}
placeholder="Notes" {...form.getInputProps('notes')}/> placeholder="Notes" {...editItemForm.getInputProps('notes')}/>
<Group justify="flex-end" mt="md"> <Group justify="flex-end" mt="md">
<Button type="submit">Submit</Button> <Button type="submit">Submit</Button>
barkmanui/src/features/inventory/ItemDetail.tsx
+1 -1
View File
@@ -26,7 +26,7 @@ function ItemDetail() {
return ( return (
<> <>
<Container fluid> <Container m="lg">
<Title order={1}>Item Detail</Title> <Title order={1}>Item Detail</Title>
<div>{isFetching ? 'Updating...' : ''}</div> <div>{isFetching ? 'Updating...' : ''}</div>
<Text>ID: {data.id}</Text> <Text>ID: {data.id}</Text>
barkmanui/src/pages/home.tsx
+3 -1
View File
@@ -1,4 +1,4 @@
import {Text} from "@mantine/core"; import {Container, Text} from "@mantine/core";
function Home() { function Home() {
@@ -6,7 +6,9 @@ function Home() {
return ( return (
<> <>
<Container m="lg">
<Text>Bark productions: at the intersection of professionalism and degeneracy</Text> <Text>Bark productions: at the intersection of professionalism and degeneracy</Text>
</Container>
</> </>
) )
} }