fix: harden unknown queue loading in owner view

Author: shadowdevcode

src/App.tsx

@@ -27,6 +27,12 @@ import {
 import { upsertMealField } from './services/mealService';
 import { HouseholdData, resolveOrCreateHousehold } from './services/householdService';
 import { getAppCopy } from './i18n/copy';
+import {
+  getUnknownQueueLoadErrorMessage,
+  isFirestoreFailedPreconditionError,
+  sortUnknownIngredientQueueItemsByCreatedAt,
+  toFirestoreListenerErrorInfo,
+} from './utils/unknownQueue';
 
 interface UiFeedback {
   kind: 'success' | 'error';
@@ -84,6 +90,7 @@ export default function App() {
     let mealsUnsub: Unsubscribe | null = null;
     let logsUnsub: Unsubscribe | null = null;
     let unknownQueueUnsub: Unsubscribe | null = null;
+    let unknownQueueFallbackUnsub: Unsubscribe | null = null;
     let hasLoadedHousehold = false;
     let hasLoadedInventory = false;
     let hasLoadedMeals = false;
@@ -187,20 +194,70 @@ export default function App() {
           },
         );
 
+        const handleUnknownQueueLoaded = (items: UnknownIngredientQueueItem[]): void => {
+          setUnknownIngredientQueue(items);
+          hasLoadedUnknownQueue = true;
+          markInitialViewReady();
+        };
+
+        const subscribeUnknownQueueFallback = (): void => {
+          if (unknownQueueFallbackUnsub !== null) {
+            return;
+          }
+
+          unknownQueueFallbackUnsub = onSnapshot(
+            collection(db, `households/${resolved.householdId}/unknownIngredientQueue`),
+            (snapshot) => {
+              const queueItems = snapshot.docs.map((queueDoc) => ({
+                id: queueDoc.id,
+                ...(queueDoc.data() as Omit<UnknownIngredientQueueItem, 'id'>),
+              }));
+              handleUnknownQueueLoaded(sortUnknownIngredientQueueItemsByCreatedAt(queueItems));
+            },
+            (error) => {
+              const parsedError = toFirestoreListenerErrorInfo(error);
+              console.error('unknown_queue_snapshot_fallback_failed', {
+                error,
+                householdId: resolved.householdId,
+                code: parsedError.code,
+                message: parsedError.message,
+              });
+              setUiFeedback({ kind: 'error', message: getUnknownQueueLoadErrorMessage(parsedError) });
+              hasLoadedUnknownQueue = true;
+              markInitialViewReady();
+            },
+          );
+        };
+
         unknownQueueUnsub = onSnapshot(
           query(collection(db, `households/${resolved.householdId}/unknownIngredientQueue`), orderBy('createdAt', 'desc')),
           (snapshot) => {
-            const queueItems: UnknownIngredientQueueItem[] = snapshot.docs.map((queueDoc) => ({
+            const queueItems = snapshot.docs.map((queueDoc) => ({
               id: queueDoc.id,
               ...(queueDoc.data() as Omit<UnknownIngredientQueueItem, 'id'>),
             }));
-            setUnknownIngredientQueue(queueItems);
-            hasLoadedUnknownQueue = true;
-            markInitialViewReady();
+            handleUnknownQueueLoaded(queueItems);
           },
           (error) => {
-            console.error('unknown_queue_snapshot_failed', { error, householdId: resolved.householdId });
-            setUiFeedback({ kind: 'error', message: 'Failed to load unknown ingredient queue.' });
+            const parsedError = toFirestoreListenerErrorInfo(error);
+            console.error('unknown_queue_snapshot_failed', {
+              error,
+              householdId: resolved.householdId,
+              code: parsedError.code,
+              message: parsedError.message,
+            });
+
+            if (isFirestoreFailedPreconditionError(parsedError)) {
+              if (unknownQueueUnsub !== null) {
+                unknownQueueUnsub();
+                unknownQueueUnsub = null;
+              }
+              setUiFeedback({ kind: 'error', message: getUnknownQueueLoadErrorMessage(parsedError) });
+              subscribeUnknownQueueFallback();
+              return;
+            }
+
+            setUiFeedback({ kind: 'error', message: getUnknownQueueLoadErrorMessage(parsedError) });
             hasLoadedUnknownQueue = true;
             markInitialViewReady();
           },
@@ -230,6 +287,9 @@ export default function App() {
       if (unknownQueueUnsub) {
         unknownQueueUnsub();
       }
+      if (unknownQueueFallbackUnsub) {
+        unknownQueueFallbackUnsub();
+      }
     };
   }, [user]);
 

src/utils/unknownQueue.ts

@@ -0,0 +1,75 @@
+import { UnknownIngredientQueueItem } from '../types';
+
+export interface FirestoreListenerErrorInfo {
+  code: string | null;
+  message: string | null;
+  name: string | null;
+}
+
+function toRecord(value: unknown): Record<string, unknown> | null {
+  if (typeof value !== 'object' || value === null) {
+    return null;
+  }
+  return value as Record<string, unknown>;
+}
+
+function toOptionalString(value: unknown): string | null {
+  return typeof value === 'string' ? value : null;
+}
+
+function toTimestampMs(value: string): number | null {
+  const parsed = Date.parse(value);
+  return Number.isNaN(parsed) ? null : parsed;
+}
+
+export function toFirestoreListenerErrorInfo(error: unknown): FirestoreListenerErrorInfo {
+  const record = toRecord(error);
+  return {
+    code: toOptionalString(record?.code),
+    message: toOptionalString(record?.message),
+    name: toOptionalString(record?.name),
+  };
+}
+
+export function isFirestoreFailedPreconditionError(error: FirestoreListenerErrorInfo): boolean {
+  return error.code === 'failed-precondition';
+}
+
+export function isFirestorePermissionDeniedError(error: FirestoreListenerErrorInfo): boolean {
+  return error.code === 'permission-denied';
+}
+
+export function getUnknownQueueLoadErrorMessage(error: FirestoreListenerErrorInfo): string {
+  if (isFirestorePermissionDeniedError(error)) {
+    return 'Unknown ingredient queue access denied. Deploy latest Firestore rules and retry.';
+  }
+
+  if (isFirestoreFailedPreconditionError(error)) {
+    return 'Unknown ingredient queue index is missing. Showing fallback order while index is provisioned.';
+  }
+
+  return 'Failed to load unknown ingredient queue.';
+}
+
+export function sortUnknownIngredientQueueItemsByCreatedAt(items: UnknownIngredientQueueItem[]): UnknownIngredientQueueItem[] {
+  return [...items].sort((leftItem, rightItem) => {
+    const rightTime = toTimestampMs(rightItem.createdAt);
+    const leftTime = toTimestampMs(leftItem.createdAt);
+
+    if (rightTime !== null && leftTime !== null) {
+      if (rightTime !== leftTime) {
+        return rightTime - leftTime;
+      }
+    } else if (rightTime !== null && leftTime === null) {
+      return 1;
+    } else if (rightTime === null && leftTime !== null) {
+      return -1;
+    }
+
+    if (rightItem.createdAt !== leftItem.createdAt) {
+      return rightItem.createdAt.localeCompare(leftItem.createdAt);
+    }
+
+    return rightItem.id.localeCompare(leftItem.id);
+  });
+}

test/rules/run.ts

@@ -228,6 +228,25 @@ async function testInvitedCookCanReadHouseholdInventoryAndLogs(testEnv: RulesTes
   await assertSucceeds(getDocs(collection(cookDb, 'households', householdId, 'logs')));
 }
 
+async function testOwnerAndCookCanReadUnknownIngredientQueue(testEnv: RulesTestEnvironment): Promise<void> {
+  await seedOwnerHousehold(testEnv, cookEmail);
+  await seedUnknownQueueItem(testEnv);
+
+  const ownerDb = getAuthenticatedDb(testEnv, ownerUid, ownerEmail);
+  const cookDb = getAuthenticatedDb(testEnv, cookUid, cookEmail);
+
+  await assertSucceeds(getDocs(collection(ownerDb, 'households', householdId, 'unknownIngredientQueue')));
+  await assertSucceeds(getDocs(collection(cookDb, 'households', householdId, 'unknownIngredientQueue')));
+}
+
+async function testNonMemberCannotReadUnknownIngredientQueue(testEnv: RulesTestEnvironment): Promise<void> {
+  await seedOwnerHousehold(testEnv, cookEmail);
+  await seedUnknownQueueItem(testEnv);
+
+  const intruderDb = getAuthenticatedDb(testEnv, intruderUid, 'intruder@example.com');
+  await assertFails(getDocs(collection(intruderDb, 'households', householdId, 'unknownIngredientQueue')));
+}
+
 async function testInvitedCookCannotWriteMealsOrDeleteInventory(testEnv: RulesTestEnvironment): Promise<void> {
   await seedOwnerHousehold(testEnv, cookEmail);
   await seedInventoryItem(testEnv);
@@ -488,6 +507,14 @@ async function runAllTests(testEnv: RulesTestEnvironment): Promise<void> {
       name: 'Invited cook can read household, inventory, and logs',
       run: testInvitedCookCanReadHouseholdInventoryAndLogs,
     },
+    {
+      name: 'Owner and invited cook can read unknown ingredient queue',
+      run: testOwnerAndCookCanReadUnknownIngredientQueue,
+    },
+    {
+      name: 'Non-member cannot read unknown ingredient queue',
+      run: testNonMemberCannotReadUnknownIngredientQueue,
+    },
     {
       name: 'Invited cook cannot write meals or delete inventory',
       run: testInvitedCookCannotWriteMealsOrDeleteInventory,

test/unit/run.ts

@@ -4,6 +4,13 @@ import { validateAiParseResult } from '../../src/services/aiValidation';
 import { buildPantryLog } from '../../src/services/logService';
 import { sanitizeFirestorePayload } from '../../src/utils/firestorePayload';
 import { getIngredientNativeContextLabel, resolveIngredientVisual } from '../../src/utils/ingredientVisuals';
+import {
+  getUnknownQueueLoadErrorMessage,
+  isFirestoreFailedPreconditionError,
+  isFirestorePermissionDeniedError,
+  sortUnknownIngredientQueueItemsByCreatedAt,
+  toFirestoreListenerErrorInfo,
+} from '../../src/utils/unknownQueue';
 import {
   getLocalizedCategoryName,
   getPantryCategoryLabel,
@@ -333,6 +340,63 @@ function testIngredientVisualCategoryFallback(): void {
   assert.equal(visual.catalogMatch, undefined);
 }
 
+function testUnknownQueueErrorParsingAndMessaging(): void {
+  const permissionDenied = toFirestoreListenerErrorInfo({
+    code: 'permission-denied',
+    message: 'Missing or insufficient permissions.',
+    name: 'FirebaseError',
+  });
+  assert.equal(isFirestorePermissionDeniedError(permissionDenied), true);
+  assert.equal(getUnknownQueueLoadErrorMessage(permissionDenied), 'Unknown ingredient queue access denied. Deploy latest Firestore rules and retry.');
+
+  const failedPrecondition = toFirestoreListenerErrorInfo({
+    code: 'failed-precondition',
+    message: 'The query requires an index.',
+    name: 'FirebaseError',
+  });
+  assert.equal(isFirestoreFailedPreconditionError(failedPrecondition), true);
+  assert.equal(getUnknownQueueLoadErrorMessage(failedPrecondition), 'Unknown ingredient queue index is missing. Showing fallback order while index is provisioned.');
+
+  const unknownError = toFirestoreListenerErrorInfo(new Error('boom'));
+  assert.equal(isFirestoreFailedPreconditionError(unknownError), false);
+  assert.equal(isFirestorePermissionDeniedError(unknownError), false);
+  assert.equal(getUnknownQueueLoadErrorMessage(unknownError), 'Failed to load unknown ingredient queue.');
+}
+
+function testUnknownQueueFallbackSortOrder(): void {
+  const sorted = sortUnknownIngredientQueueItemsByCreatedAt([
+    {
+      id: 'queue-2',
+      name: 'A',
+      category: 'spices',
+      status: 'open',
+      requestedStatus: 'low',
+      createdAt: '2026-03-25T08:00:00.000Z',
+      createdBy: 'cook',
+    },
+    {
+      id: 'queue-1',
+      name: 'B',
+      category: 'staples',
+      status: 'open',
+      requestedStatus: 'low',
+      createdAt: '2026-03-25T10:00:00.000Z',
+      createdBy: 'owner',
+    },
+    {
+      id: 'queue-3',
+      name: 'C',
+      category: 'veggies',
+      status: 'open',
+      requestedStatus: 'out',
+      createdAt: 'invalid-date',
+      createdBy: 'cook',
+    },
+  ]);
+
+  assert.deepEqual(sorted.map((item) => item.id), ['queue-1', 'queue-2', 'queue-3']);
+}
+
 function run(): void {
   testPantryCategoryNormalization();
   testPantryCategoryLabels();
@@ -353,6 +417,8 @@ function run(): void {
   testIngredientNativeContextLabel();
   testIngredientVisualExistingIconFallback();
   testIngredientVisualCategoryFallback();
+  testUnknownQueueErrorParsingAndMessaging();
+  testUnknownQueueFallbackSortOrder();
   console.log('All unit tests passed.');
 }