diff --git a/src/screens/ActivePickListScreen.test.tsx b/src/screens/ActivePickListScreen.test.tsx index 8d70205..2ee428f 100644 --- a/src/screens/ActivePickListScreen.test.tsx +++ b/src/screens/ActivePickListScreen.test.tsx @@ -442,7 +442,7 @@ describe('ActivePickListScreen product search', () => { expect(screen.getByRole('radio', { name: /units/i })).toBeDisabled(); }); - it('evaluates packaging filters based on visible (unpicketed) items when hiding picked', async () => { + it('keeps packaging filters enabled when hiding picked items with mixed statuses', async () => { pickItemsMock.mockReturnValue([ { id: 'item-1', @@ -481,10 +481,8 @@ describe('ActivePickListScreen product search', () => { await user.click(screen.getByLabelText(/show picked/i)); - await waitFor(() => expect(screen.getByRole('radio', { name: /cartons/i })).toBeDisabled()); - - expect(screen.getByRole('radio', { name: /all/i })).toBeChecked(); - expect(screen.getByRole('radio', { name: /units/i })).toBeDisabled(); + expect(screen.getByRole('radio', { name: /cartons/i })).toBeEnabled(); + expect(screen.getByRole('radio', { name: /units/i })).toBeEnabled(); }); it('resets the filter when the selected packaging type is unavailable', async () => { @@ -497,7 +495,7 @@ describe('ActivePickListScreen product search', () => { product_id: 'prod-1', quantity: 1, is_carton: true, - status: 'pending', + status: 'picked', created_at: 0, updated_at: 0, }, @@ -597,6 +595,83 @@ describe('ActivePickListScreen product search', () => { expect(screen.getByText('Cola')).toBeVisible(); }); + it('enables packaging filters when there are picked and unpicked items', async () => { + pickItemsMock.mockReturnValue([ + { + id: 'item-1', + pick_list_id: 'list-1', + product_id: 'prod-1', + quantity: 1, + is_carton: true, + status: 'picked', + created_at: 0, + updated_at: 0, + }, + { + id: 'item-2', + pick_list_id: 'list-1', + product_id: 'prod-2', + quantity: 1, + is_carton: false, + status: 'pending', + created_at: 0, + updated_at: 0, + }, + ]); + + const user = userEvent.setup(); + + render( + + + } /> + + , + ); + + const showPickedToggle = screen.getByLabelText(/show picked/i); + await user.click(showPickedToggle); + + expect(screen.getByRole('radio', { name: /cartons/i })).not.toBeDisabled(); + expect(screen.getByRole('radio', { name: /units/i })).not.toBeDisabled(); + }); + + it('disables packaging filters when all items share the same status', () => { + pickItemsMock.mockReturnValue([ + { + id: 'item-1', + pick_list_id: 'list-1', + product_id: 'prod-1', + quantity: 1, + is_carton: true, + status: 'pending', + created_at: 0, + updated_at: 0, + }, + { + id: 'item-2', + pick_list_id: 'list-1', + product_id: 'prod-2', + quantity: 1, + is_carton: false, + status: 'pending', + created_at: 0, + updated_at: 0, + }, + ]); + + render( + + + } /> + + , + ); + + expect(screen.getByRole('radio', { name: /cartons/i })).toBeDisabled(); + expect(screen.getByRole('radio', { name: /units/i })).toBeDisabled(); + }); + it('disables show picked toggle when all items are picked', async () => { pickItemsMock.mockReturnValue([ { diff --git a/src/screens/ActivePickListScreen.tsx b/src/screens/ActivePickListScreen.tsx index 5f1d9d3..0906354 100644 --- a/src/screens/ActivePickListScreen.tsx +++ b/src/screens/ActivePickListScreen.tsx @@ -47,6 +47,15 @@ export const ActivePickListScreen = () => { () => itemState.length > 0 && itemState.every((item) => item.status === 'picked'), [itemState], ); + const hasUnpickedItems = useMemo( + () => itemState.some((item) => item.status !== 'picked'), + [itemState], + ); + const hasPickedItems = useMemo( + () => itemState.some((item) => item.status === 'picked'), + [itemState], + ); + const hasMixedPickStatuses = hasPickedItems && hasUnpickedItems; const productMap = useMemo(() => { const map = new Map(); @@ -132,15 +141,16 @@ export const ActivePickListScreen = () => { }, [pickList?.categories, sortedProducts]); const hasCartonItems = useMemo( - () => visibleItemsByStatus.some((item) => item.is_carton), - [visibleItemsByStatus], + () => itemState.some((item) => item.is_carton), + [itemState], ); const hasUnitItems = useMemo( - () => visibleItemsByStatus.some((item) => !item.is_carton), - [visibleItemsByStatus], + () => itemState.some((item) => !item.is_carton), + [itemState], ); const packagingTypeCount = Number(hasCartonItems) + Number(hasUnitItems); const singlePackagingType = packagingTypeCount === 1; + const packagingFiltersDisabled = !hasMixedPickStatuses; const productIdsInList = useMemo( () => new Set(itemState.map((item) => item.product_id)), @@ -424,13 +434,13 @@ export const ActivePickListScreen = () => { value="cartons" control={} label="Cartons" - disabled={singlePackagingType || !hasCartonItems} + disabled={packagingFiltersDisabled || !hasCartonItems} /> } label="Units" - disabled={singlePackagingType || !hasUnitItems} + disabled={packagingFiltersDisabled || !hasUnitItems} />