From fcf5b74be20baac203ad3c6f76605e79a4b25e2a Mon Sep 17 00:00:00 2001 From: beatz174-bit Date: Fri, 21 Nov 2025 18:09:12 +1000 Subject: [PATCH] Use fixed unit and bulk labels in product UI --- src/components/ProductRow.tsx | 40 ++++++---------------------- src/db/seed.ts | 13 ++++----- src/models/Product.ts | 3 +++ src/screens/ManageProductsScreen.tsx | 18 ++++++------- 4 files changed, 27 insertions(+), 47 deletions(-) diff --git a/src/components/ProductRow.tsx b/src/components/ProductRow.tsx index d494209..beac226 100644 --- a/src/components/ProductRow.tsx +++ b/src/components/ProductRow.tsx @@ -13,7 +13,7 @@ import EditIcon from '@mui/icons-material/Edit'; import CheckIcon from '@mui/icons-material/Check'; import CloseIcon from '@mui/icons-material/Close'; import { ChangeEvent, useEffect, useState } from 'react'; -import { Product } from '../models/Product'; +import { DEFAULT_BULK_NAME, DEFAULT_UNIT_TYPE, Product } from '../models/Product'; interface ProductRowProps { product: Product; @@ -23,8 +23,6 @@ interface ProductRowProps { updates: { name: string; category: string; - unit_type: string; - bulk_name?: string; units_per_bulk?: number; }, ) => Promise | void; @@ -34,16 +32,12 @@ interface ProductRowProps { interface ProductFormState { name: string; category: string; - unitType: string; - bulkName: string; unitsPerBulk: string; } const getInitialFormState = (product: Product): ProductFormState => ({ name: product.name, category: product.category, - unitType: product.unit_type, - bulkName: product.bulk_name ?? '', unitsPerBulk: product.units_per_bulk?.toString() ?? '', }); @@ -64,8 +58,6 @@ export const ProductRow = ({ product, categories, onSave, onDelete }: ProductRow await onSave(product.id, { name: formState.name, category: formState.category, - unit_type: formState.unitType, - bulk_name: formState.bulkName || undefined, units_per_bulk: formState.unitsPerBulk ? Number(formState.unitsPerBulk) : undefined, }); setIsEditing(false); @@ -95,27 +87,11 @@ export const ProductRow = ({ product, categories, onSave, onDelete }: ProductRow ))} - - - - @@ -124,12 +100,12 @@ export const ProductRow = ({ product, categories, onSave, onDelete }: ProductRow
{product.name} - {product.category} • {product.unit_type} + {product.category} • {product.unit_type || DEFAULT_UNIT_TYPE}
- {product.bulk_name && product.units_per_bulk ? ( + {product.units_per_bulk ? ( - {product.units_per_bulk} per {product.bulk_name} + {product.units_per_bulk} per {product.bulk_name || DEFAULT_BULK_NAME} ) : null} diff --git a/src/db/seed.ts b/src/db/seed.ts index 57cc4cd..23f5c30 100644 --- a/src/db/seed.ts +++ b/src/db/seed.ts @@ -1,5 +1,6 @@ import { v4 as uuidv4 } from 'uuid'; import { StockFillDB } from './index'; +import { DEFAULT_BULK_NAME, DEFAULT_UNIT_TYPE } from '../models/Product'; const now = () => Date.now(); @@ -30,8 +31,8 @@ export const seedDatabase = async (db: StockFillDB) => { id: uuidv4(), name: 'Sparkling Water 500ml', category: 'Drinks', - unit_type: 'bottle', - bulk_name: 'case', + unit_type: DEFAULT_UNIT_TYPE, + bulk_name: DEFAULT_BULK_NAME, units_per_bulk: 12, archived: false, created_at: now(), @@ -41,8 +42,8 @@ export const seedDatabase = async (db: StockFillDB) => { id: uuidv4(), name: 'Salted Chips 50g', category: 'Snacks', - unit_type: 'bag', - bulk_name: 'box', + unit_type: DEFAULT_UNIT_TYPE, + bulk_name: DEFAULT_BULK_NAME, units_per_bulk: 24, archived: false, created_at: now(), @@ -52,8 +53,8 @@ export const seedDatabase = async (db: StockFillDB) => { id: uuidv4(), name: 'Chocolate Bar', category: 'Confectionery', - unit_type: 'bar', - bulk_name: 'slab', + unit_type: DEFAULT_UNIT_TYPE, + bulk_name: DEFAULT_BULK_NAME, units_per_bulk: 32, archived: false, created_at: now(), diff --git a/src/models/Product.ts b/src/models/Product.ts index 0460bab..34595fa 100644 --- a/src/models/Product.ts +++ b/src/models/Product.ts @@ -10,3 +10,6 @@ export interface Product { created_at: number; updated_at: number; } + +export const DEFAULT_UNIT_TYPE = 'unit'; +export const DEFAULT_BULK_NAME = 'carton'; diff --git a/src/screens/ManageProductsScreen.tsx b/src/screens/ManageProductsScreen.tsx index b9b4dbe..1e80f08 100644 --- a/src/screens/ManageProductsScreen.tsx +++ b/src/screens/ManageProductsScreen.tsx @@ -14,6 +14,7 @@ import { v4 as uuidv4 } from 'uuid'; import { ProductRow } from '../components/ProductRow'; import { useCategories, useProducts } from '../hooks/dataHooks'; import { useDatabase } from '../context/DBProvider'; +import { DEFAULT_BULK_NAME, DEFAULT_UNIT_TYPE } from '../models/Product'; export const ManageProductsScreen = () => { const db = useDatabase(); @@ -22,8 +23,6 @@ export const ManageProductsScreen = () => { const [search, setSearch] = useState(''); const [name, setName] = useState(''); const [category, setCategory] = useState(''); - const [unitType, setUnitType] = useState('unit'); - const [bulkName, setBulkName] = useState('case'); const [unitsPerBulk, setUnitsPerBulk] = useState(6); const categoryOptions = useMemo(() => { @@ -53,8 +52,8 @@ export const ManageProductsScreen = () => { id: uuidv4(), name, category, - unit_type: unitType, - bulk_name: bulkName, + unit_type: DEFAULT_UNIT_TYPE, + bulk_name: DEFAULT_BULK_NAME, units_per_bulk: unitsPerBulk, archived: false, created_at: Date.now(), @@ -68,12 +67,15 @@ export const ManageProductsScreen = () => { updates: { name: string; category: string; - unit_type: string; - bulk_name?: string; units_per_bulk?: number; }, ) => { - await db.products.update(productId, { ...updates, updated_at: Date.now() }); + await db.products.update(productId, { + ...updates, + unit_type: DEFAULT_UNIT_TYPE, + bulk_name: DEFAULT_BULK_NAME, + updated_at: Date.now(), + }); }; const deleteProduct = async (productId: string) => { @@ -111,8 +113,6 @@ export const ManageProductsScreen = () => { ))} - setUnitType(event.target.value)} /> - setBulkName(event.target.value)} />