feat: always-optimistic write pattern across all repos

All create/update/delete repo methods now write to IndexedDB optimistically
and fire mutationQueue.flush() as fire-and-forget, returning immediately
without waiting for the network. This eliminates the 8-second UX freeze
previously seen when the API was unreachable but navigator.onLine was true.

- Repos rewritten: trip, day, place, packing, todo, budget, accommodation,
  reservation, file — write methods never throw, always return optimistic data
- mutationQueue.flush() changed to iterative (one item per loop iteration)
  so mutations enqueued mid-flush (e.g. bulk check-all) are picked up
- fileRepo.toggleStar skips the IDB put when the file is not cached locally
- DayDetailPanel passes place_name into accommodationRepo.create so the
  optimistic accommodation renders the correct hotel label immediately
- Test suite updated throughout to reflect optimistic-first semantics:
  no more rollback assertions, IDB cleared in component test beforeEach hooks,
  FileManager tests switched from filesApi spy to MSW endpoint assertions

client/tests/unit/slices/budgetSlice.test.ts

@@ -2,8 +2,9 @@ import { describe, it, expect, beforeEach, vi } from 'vitest';
 import { http, HttpResponse } from 'msw';
 import { useTripStore } from '../../../src/store/tripStore';
 import { resetAllStores, seedStore } from '../../helpers/store';
-import { buildBudgetItem, buildReservation } from '../../helpers/factories';
+import { buildBudgetItem } from '../../helpers/factories';
 import { server } from '../../helpers/msw/server';
+import { offlineDb } from '../../../src/db/offlineDb';
 
 vi.mock('../../../src/api/websocket', () => ({
   connect: vi.fn(),
@@ -17,7 +18,9 @@ vi.mock('../../../src/api/websocket', () => ({
   setPreReconnectHook: vi.fn(),
 }));
 
-beforeEach(() => {
+beforeEach(async () => {
+  await new Promise<void>(resolve => setTimeout(resolve, 0));
+  await Promise.all(offlineDb.tables.map(t => t.clear()));
   resetAllStores();
 });
 
@@ -49,16 +52,18 @@ describe('budgetSlice', () => {
       expect(useTripStore.getState().budgetItems).toHaveLength(2);
     });
 
-    it('FE-BUDGET-003: addBudgetItem on failure throws', async () => {
+    it('FE-BUDGET-003: addBudgetItem always adds item optimistically (no throw on API error)', async () => {
       server.use(
         http.post('/api/trips/1/budget', () =>
           HttpResponse.json({ message: 'Error' }, { status: 500 })
         ),
       );
 
-      await expect(
-        useTripStore.getState().addBudgetItem(1, { name: 'Fail' })
-      ).rejects.toThrow();
+      const result = await useTripStore.getState().addBudgetItem(1, { name: 'Fail' });
+
+      expect(result.name).toBe('Fail');
+      expect(useTripStore.getState().budgetItems).toHaveLength(1);
+      expect(useTripStore.getState().budgetItems[0].name).toBe('Fail');
     });
   });
 
@@ -80,38 +85,26 @@ describe('budgetSlice', () => {
       expect(useTripStore.getState().budgetItems[0].name).toBe('Updated');
     });
 
-    it('FE-BUDGET-005: updateBudgetItem with total_price triggers loadReservations when reservation_id present', async () => {
-      const item = buildBudgetItem({ id: 10, trip_id: 1, amount: 100 });
-      const initialReservation = buildReservation({ trip_id: 1 });
-      const newReservation = buildReservation({ trip_id: 1, name: 'Refreshed Reservation' });
-      seedStore(useTripStore, {
-        budgetItems: [item],
-        reservations: [initialReservation],
-      });
+    it('FE-BUDGET-005: updateBudgetItem resolves and updates store optimistically', async () => {
+      const item = buildBudgetItem({ id: 10, trip_id: 1, name: 'Old', amount: 100 });
+      seedStore(useTripStore, { budgetItems: [item] });
 
       server.use(
         http.put('/api/trips/1/budget/10', async ({ request }) => {
           const body = await request.json() as Record<string, unknown>;
-          // Return item with reservation_id to trigger loadReservations
           return HttpResponse.json({ item: { ...item, ...body, reservation_id: 42 } });
         }),
-        http.get('/api/trips/1/reservations', () =>
-          HttpResponse.json({ reservations: [newReservation] })
-        ),
       );
 
-      await useTripStore.getState().updateBudgetItem(1, 10, { total_price: 200 } as Record<string, unknown>);
+      const result = await useTripStore.getState().updateBudgetItem(1, 10, { amount: 200 } as Record<string, unknown>);
 
-      // Wait for the async loadReservations to complete
-      await new Promise(resolve => setTimeout(resolve, 50));
-
-      expect(useTripStore.getState().reservations).toHaveLength(1);
-      expect(useTripStore.getState().reservations[0].name).toBe('Refreshed Reservation');
+      expect(result.amount).toBe(200);
+      expect(useTripStore.getState().budgetItems[0].amount).toBe(200);
     });
   });
 
   describe('deleteBudgetItem', () => {
-    it('FE-BUDGET-006: deleteBudgetItem optimistically removes item, rolls back on failure', async () => {
+    it('FE-BUDGET-006: deleteBudgetItem removes item permanently even on API error', async () => {
       const item = buildBudgetItem({ id: 10, trip_id: 1 });
       seedStore(useTripStore, { budgetItems: [item] });
 
@@ -121,10 +114,10 @@ describe('budgetSlice', () => {
         ),
       );
 
-      await expect(useTripStore.getState().deleteBudgetItem(1, 10)).rejects.toThrow();
+      await useTripStore.getState().deleteBudgetItem(1, 10);
 
-      expect(useTripStore.getState().budgetItems).toHaveLength(1);
-      expect(useTripStore.getState().budgetItems[0].id).toBe(10);
+      // Permanently removed (queued for sync, no rollback)
+      expect(useTripStore.getState().budgetItems).toHaveLength(0);
     });
 
     it('FE-BUDGET-006b: deleteBudgetItem success removes item', async () => {

client/tests/unit/slices/filesSlice.test.ts

@@ -100,7 +100,7 @@ describe('filesSlice', () => {
       expect(files[0].id).toBe(20);
     });
 
-    it('FE-FILES-006: deleteFile on failure throws', async () => {
+    it('FE-FILES-006: deleteFile removes file permanently even on API error', async () => {
       const file = buildTripFile({ id: 10, trip_id: 1 });
       seedStore(useTripStore, { files: [file] });
 
@@ -110,10 +110,10 @@ describe('filesSlice', () => {
         ),
       );
 
-      await expect(useTripStore.getState().deleteFile(1, 10)).rejects.toThrow();
+      await useTripStore.getState().deleteFile(1, 10);
 
-      // File remains since server-first (only removes after success)
-      expect(useTripStore.getState().files).toHaveLength(1);
+      // Permanently removed (queued for sync, no rollback)
+      expect(useTripStore.getState().files).toHaveLength(0);
     });
   });
 });

client/tests/unit/slices/packingSlice.test.ts

@@ -4,6 +4,7 @@ import { useTripStore } from '../../../src/store/tripStore';
 import { resetAllStores, seedStore } from '../../helpers/store';
 import { buildPackingItem } from '../../helpers/factories';
 import { server } from '../../helpers/msw/server';
+import { offlineDb } from '../../../src/db/offlineDb';
 
 vi.mock('../../../src/api/websocket', () => ({
   connect: vi.fn(),
@@ -17,7 +18,9 @@ vi.mock('../../../src/api/websocket', () => ({
   setPreReconnectHook: vi.fn(),
 }));
 
-beforeEach(() => {
+beforeEach(async () => {
+  await new Promise<void>(resolve => setTimeout(resolve, 0));
+  await Promise.all(offlineDb.tables.map(t => t.clear()));
   resetAllStores();
 });
 
@@ -36,16 +39,18 @@ describe('packingSlice', () => {
       expect(items[items.length - 1].name).toBe('Toothbrush');
     });
 
-    it('FE-PACKING-002: addPackingItem on failure throws', async () => {
+    it('FE-PACKING-002: addPackingItem always adds item optimistically (no throw on API error)', async () => {
       server.use(
         http.post('/api/trips/1/packing', () =>
           HttpResponse.json({ message: 'Error' }, { status: 500 })
         ),
       );
 
-      await expect(
-        useTripStore.getState().addPackingItem(1, { name: 'Fail item' })
-      ).rejects.toThrow();
+      const result = await useTripStore.getState().addPackingItem(1, { name: 'Fail item' });
+
+      expect(result.name).toBe('Fail item');
+      expect(useTripStore.getState().packingItems).toHaveLength(1);
+      expect(useTripStore.getState().packingItems[0].name).toBe('Fail item');
     });
   });
 
@@ -69,7 +74,7 @@ describe('packingSlice', () => {
   });
 
   describe('deletePackingItem', () => {
-    it('FE-PACKING-004: deletePackingItem optimistically removes item, rollback on failure', async () => {
+    it('FE-PACKING-004: deletePackingItem removes item permanently even on API error', async () => {
       const item = buildPackingItem({ id: 10, trip_id: 1 });
       seedStore(useTripStore, { packingItems: [item] });
 
@@ -79,10 +84,9 @@ describe('packingSlice', () => {
         ),
       );
 
-      await expect(useTripStore.getState().deletePackingItem(1, 10)).rejects.toThrow();
+      await useTripStore.getState().deletePackingItem(1, 10);
 
-      expect(useTripStore.getState().packingItems).toHaveLength(1);
-      expect(useTripStore.getState().packingItems[0].id).toBe(10);
+      expect(useTripStore.getState().packingItems).toHaveLength(0);
     });
 
     it('FE-PACKING-004b: deletePackingItem success removes item', async () => {
@@ -115,7 +119,7 @@ describe('packingSlice', () => {
       expect(useTripStore.getState().packingItems[0].checked).toBe(1);
     });
 
-    it('FE-PACKING-006: togglePackingItem rolls back checked on API failure', async () => {
+    it('FE-PACKING-006: togglePackingItem preserves optimistic checked state even on API failure', async () => {
       const item = buildPackingItem({ id: 10, trip_id: 1, checked: 0 });
       seedStore(useTripStore, { packingItems: [item] });
 
@@ -125,11 +129,10 @@ describe('packingSlice', () => {
         ),
       );
 
-      // toggle does NOT throw on error (silent rollback)
       await useTripStore.getState().togglePackingItem(1, 10, true);
 
-      // Should be rolled back to original value
-      expect(useTripStore.getState().packingItems[0].checked).toBe(0);
+      // Optimistic state preserved — no rollback (queued for sync)
+      expect(useTripStore.getState().packingItems[0].checked).toBe(1);
     });
   });
 });

client/tests/unit/slices/placesSlice.test.ts

@@ -38,7 +38,7 @@ describe('placesSlice', () => {
       expect(places[0].name).toBe('New Place'); // prepended
     });
 
-    it('FE-PLACES-002: addPlace on failure throws and places remain unchanged', async () => {
+    it('FE-PLACES-002: addPlace always adds place optimistically (no throw on API error)', async () => {
       const existing = buildPlace({ trip_id: 1 });
       seedStore(useTripStore, { places: [existing] });
 
@@ -48,8 +48,11 @@ describe('placesSlice', () => {
         ),
       );
 
-      await expect(useTripStore.getState().addPlace(1, { name: 'Fail' })).rejects.toThrow();
-      expect(useTripStore.getState().places).toEqual([existing]);
+      const result = await useTripStore.getState().addPlace(1, { name: 'Fail' });
+
+      expect(result.name).toBe('Fail');
+      expect(useTripStore.getState().places).toHaveLength(2);
+      expect(useTripStore.getState().places[0].name).toBe('Fail');
     });
   });
 

client/tests/unit/slices/reservationsSlice.test.ts

@@ -4,6 +4,7 @@ import { useTripStore } from '../../../src/store/tripStore';
 import { resetAllStores, seedStore } from '../../helpers/store';
 import { buildReservation } from '../../helpers/factories';
 import { server } from '../../helpers/msw/server';
+import { offlineDb } from '../../../src/db/offlineDb';
 
 vi.mock('../../../src/api/websocket', () => ({
   connect: vi.fn(),
@@ -17,7 +18,9 @@ vi.mock('../../../src/api/websocket', () => ({
   setPreReconnectHook: vi.fn(),
 }));
 
-beforeEach(() => {
+beforeEach(async () => {
+  await new Promise<void>(resolve => setTimeout(resolve, 0));
+  await Promise.all(offlineDb.tables.map(t => t.clear()));
   resetAllStores();
 });
 
@@ -58,16 +61,18 @@ describe('reservationsSlice', () => {
       expect(reservations[0].name).toBe('New Hotel');
     });
 
-    it('FE-RESERV-003: addReservation on failure throws', async () => {
+    it('FE-RESERV-003: addReservation always adds optimistically (no throw on API error)', async () => {
       server.use(
         http.post('/api/trips/1/reservations', () =>
           HttpResponse.json({ message: 'Error' }, { status: 500 })
         ),
       );
 
-      await expect(
-        useTripStore.getState().addReservation(1, { name: 'Fail' })
-      ).rejects.toThrow();
+      const result = await useTripStore.getState().addReservation(1, { name: 'Fail' });
+
+      expect(result.name).toBe('Fail');
+      expect(useTripStore.getState().reservations).toHaveLength(1);
+      expect(useTripStore.getState().reservations[0].name).toBe('Fail');
     });
   });
 
@@ -123,7 +128,7 @@ describe('reservationsSlice', () => {
       expect(useTripStore.getState().reservations[0].status).toBe('confirmed');
     });
 
-    it('FE-RESERV-007: toggleReservationStatus rolls back on API failure (silent)', async () => {
+    it('FE-RESERV-007: toggleReservationStatus preserves optimistic status even on API failure', async () => {
       const reservation = buildReservation({ id: 10, trip_id: 1, status: 'confirmed' });
       seedStore(useTripStore, { reservations: [reservation] });
 
@@ -133,10 +138,10 @@ describe('reservationsSlice', () => {
         ),
       );
 
-      // Does NOT throw (silent rollback)
       await useTripStore.getState().toggleReservationStatus(1, 10);
 
-      expect(useTripStore.getState().reservations[0].status).toBe('confirmed');
+      // Optimistic state preserved — no rollback (queued for sync)
+      expect(useTripStore.getState().reservations[0].status).toBe('pending');
     });
 
     it('FE-RESERV-008: toggleReservationStatus does nothing if reservation not found', async () => {
@@ -162,7 +167,7 @@ describe('reservationsSlice', () => {
       expect(reservations[0].id).toBe(20);
     });
 
-    it('FE-RESERV-010: deleteReservation on failure throws (no optimistic, server-first)', async () => {
+    it('FE-RESERV-010: deleteReservation removes permanently even on API error', async () => {
       const reservation = buildReservation({ id: 10, trip_id: 1 });
       seedStore(useTripStore, { reservations: [reservation] });
 
@@ -172,10 +177,10 @@ describe('reservationsSlice', () => {
         ),
       );
 
-      await expect(useTripStore.getState().deleteReservation(1, 10)).rejects.toThrow();
+      await useTripStore.getState().deleteReservation(1, 10);
 
-      // Still in state since server-first (only removes after success)
-      expect(useTripStore.getState().reservations).toHaveLength(1);
+      // Permanently removed (queued for sync, no rollback)
+      expect(useTripStore.getState().reservations).toHaveLength(0);
     });
   });
 });

client/tests/unit/slices/todoSlice.test.ts

@@ -4,6 +4,7 @@ import { useTripStore } from '../../../src/store/tripStore';
 import { resetAllStores, seedStore } from '../../helpers/store';
 import { buildTodoItem } from '../../helpers/factories';
 import { server } from '../../helpers/msw/server';
+import { offlineDb } from '../../../src/db/offlineDb';
 
 vi.mock('../../../src/api/websocket', () => ({
   connect: vi.fn(),
@@ -17,7 +18,9 @@ vi.mock('../../../src/api/websocket', () => ({
   setPreReconnectHook: vi.fn(),
 }));
 
-beforeEach(() => {
+beforeEach(async () => {
+  await new Promise<void>(resolve => setTimeout(resolve, 0));
+  await Promise.all(offlineDb.tables.map(t => t.clear()));
   resetAllStores();
 });
 
@@ -34,16 +37,18 @@ describe('todoSlice', () => {
       expect(items).toHaveLength(2);
     });
 
-    it('FE-TODO-002: addTodoItem on failure throws', async () => {
+    it('FE-TODO-002: addTodoItem always adds item optimistically (no throw on API error)', async () => {
       server.use(
         http.post('/api/trips/1/todo', () =>
           HttpResponse.json({ message: 'Error' }, { status: 500 })
         ),
       );
 
-      await expect(
-        useTripStore.getState().addTodoItem(1, { name: 'Fail' })
-      ).rejects.toThrow();
+      const result = await useTripStore.getState().addTodoItem(1, { name: 'Fail' });
+
+      expect(result.name).toBe('Fail');
+      expect(useTripStore.getState().todoItems).toHaveLength(1);
+      expect(useTripStore.getState().todoItems[0].name).toBe('Fail');
     });
   });
 
@@ -69,7 +74,7 @@ describe('todoSlice', () => {
   });
 
   describe('deleteTodoItem', () => {
-    it('FE-TODO-004: deleteTodoItem optimistically removes item, rollback on failure', async () => {
+    it('FE-TODO-004: deleteTodoItem removes item permanently even on API error', async () => {
       const item = buildTodoItem({ id: 10, trip_id: 1 });
       seedStore(useTripStore, { todoItems: [item] });
 
@@ -79,10 +84,9 @@ describe('todoSlice', () => {
         ),
       );
 
-      await expect(useTripStore.getState().deleteTodoItem(1, 10)).rejects.toThrow();
+      await useTripStore.getState().deleteTodoItem(1, 10);
 
-      expect(useTripStore.getState().todoItems).toHaveLength(1);
-      expect(useTripStore.getState().todoItems[0].id).toBe(10);
+      expect(useTripStore.getState().todoItems).toHaveLength(0);
     });
 
     it('FE-TODO-004b: deleteTodoItem success removes item from array', async () => {
@@ -115,7 +119,7 @@ describe('todoSlice', () => {
       expect(useTripStore.getState().todoItems[0].checked).toBe(1);
     });
 
-    it('FE-TODO-006: toggleTodoItem rolls back checked on API failure (silent)', async () => {
+    it('FE-TODO-006: toggleTodoItem preserves optimistic checked state even on API failure', async () => {
       const item = buildTodoItem({ id: 10, trip_id: 1, checked: 0 });
       seedStore(useTripStore, { todoItems: [item] });
 
@@ -125,10 +129,10 @@ describe('todoSlice', () => {
         ),
       );
 
-      // Does NOT throw
       await useTripStore.getState().toggleTodoItem(1, 10, true);
 
-      expect(useTripStore.getState().todoItems[0].checked).toBe(0);
+      // Optimistic state preserved — no rollback (queued for sync)
+      expect(useTripStore.getState().todoItems[0].checked).toBe(1);
     });
 
     it('FE-TODO-007: toggleTodoItem preserves sort_order field', async () => {