diff --git a/src/screens/ActivePickListScreen.test.tsx b/src/screens/ActivePickListScreen.test.tsx
index ebe414d..661e545 100644
--- a/src/screens/ActivePickListScreen.test.tsx
+++ b/src/screens/ActivePickListScreen.test.tsx
@@ -180,4 +180,31 @@ describe('ActivePickListScreen product search', () => {
await user.click(togglePicked);
expect(screen.getByText('Cola')).toBeVisible();
});
+
+ it('disables show picked toggle when all items are picked', async () => {
+ pickItemsMock.mockReturnValue([
+ {
+ id: 'item-1',
+ pick_list_id: 'list-1',
+ product_id: 'prod-1',
+ quantity: 1,
+ is_carton: false,
+ status: 'picked',
+ created_at: 0,
+ updated_at: 0,
+ },
+ ]);
+
+ render(
+
+
+ } />
+
+ ,
+ );
+
+ const togglePicked = screen.getByLabelText(/show picked/i);
+ expect(togglePicked).toBeDisabled();
+ expect(togglePicked).toBeChecked();
+ });
});
diff --git a/src/screens/ActivePickListScreen.tsx b/src/screens/ActivePickListScreen.tsx
index b1cd0d5..69bacd8 100644
--- a/src/screens/ActivePickListScreen.tsx
+++ b/src/screens/ActivePickListScreen.tsx
@@ -38,6 +38,11 @@ export const ActivePickListScreen = () => {
const [itemFilter, setItemFilter] = useState<'all' | 'cartons' | 'units'>('all');
const [showPicked, setShowPicked] = useState(true);
+ const allItemsPicked = useMemo(
+ () => items.length > 0 && items.every((item) => item.status === 'picked'),
+ [items],
+ );
+
const areaName = useMemo(
() => areas.find((area) => area.id === pickList?.area_id)?.name ?? 'Area',
[areas, pickList?.area_id],
@@ -60,6 +65,12 @@ export const ActivePickListScreen = () => {
}
}, [filteredProducts, selectedProduct]);
+ useEffect(() => {
+ if (allItemsPicked && !showPicked) {
+ setShowPicked(true);
+ }
+ }, [allItemsPicked, showPicked]);
+
const visibleItems = useMemo(() => {
let filteredItems = showPicked ? items : items.filter((item) => item.status !== 'picked');
@@ -257,6 +268,7 @@ export const ActivePickListScreen = () => {
setShowPicked(event.target.checked)}
+ disabled={allItemsPicked}
/>
}
label="Show picked"