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}
/>