diff --git a/src/components/ProductRow.test.tsx b/src/components/ProductRow.test.tsx new file mode 100644 index 0000000..c0bee20 --- /dev/null +++ b/src/components/ProductRow.test.tsx @@ -0,0 +1,35 @@ +import { render, screen } from '@testing-library/react'; +import { describe, expect, it, vi } from 'vitest'; +import { ProductRow } from './ProductRow'; +import { Product } from '../models/Product'; + +const product: Product = { + id: 'prod-1', + name: 'Sparkling Water', + category: 'Drinks', + unit_type: 'bottle', + barcode: '123456', + archived: false, + created_at: 0, + updated_at: 0, +}; + +const categories = ['Drinks', 'Snacks']; + +describe('ProductRow', () => { + it('shows name, category, and barcode without unit text in read-only mode', () => { + render( + , + ); + + expect(screen.getByText('Sparkling Water')).toBeInTheDocument(); + expect(screen.getByText('Drinks')).toBeInTheDocument(); + expect(screen.getByText(/Barcode: 123456/)).toBeInTheDocument(); + expect(screen.queryByText(/bottle/i)).not.toBeInTheDocument(); + }); +}); diff --git a/src/components/ProductRow.tsx b/src/components/ProductRow.tsx index ebfb6af..51fe6d3 100644 --- a/src/components/ProductRow.tsx +++ b/src/components/ProductRow.tsx @@ -154,30 +154,18 @@ export const ProductRow = ({ product, categories, onSave, onDelete }: ProductRow ) : ( - - - - - {product.name} - - - {product.category} • {product.unit_type || DEFAULT_UNIT_TYPE} - - - {product.barcode ? ( - - Barcode: {product.barcode} - - ) : null} - - - setIsEditing(true)} size="small"> - - - onDelete(product.id)} size="small"> - - - + + + {product.name} + + {product.category} + + + {product.barcode ? ( + + Barcode: {product.barcode} + + ) : null} )}