mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-06-22 14:51:45 +00:00
Merge branch 'dev' into search-auto-complete
This commit is contained in:
Ben Haas
@@ -22,6 +22,8 @@ interface AuthState {
|
||||
error: string | null
|
||||
demoMode: boolean
|
||||
devMode: boolean
|
||||
isPrerelease: boolean
|
||||
appVersion: string
|
||||
hasMapsKey: boolean
|
||||
serverTimezone: string
|
||||
/** Server policy: all users must enable MFA */
|
||||
@@ -41,6 +43,8 @@ interface AuthState {
|
||||
deleteAvatar: () => Promise<void>
|
||||
setDemoMode: (val: boolean) => void
|
||||
setDevMode: (val: boolean) => void
|
||||
setIsPrerelease: (val: boolean) => void
|
||||
setAppVersion: (val: string) => void
|
||||
setHasMapsKey: (val: boolean) => void
|
||||
setServerTimezone: (tz: string) => void
|
||||
setAppRequireMfa: (val: boolean) => void
|
||||
@@ -58,6 +62,8 @@ export const useAuthStore = create<AuthState>((set, get) => ({
|
||||
error: null,
|
||||
demoMode: localStorage.getItem('demo_mode') === 'true',
|
||||
devMode: false,
|
||||
isPrerelease: false,
|
||||
appVersion: '',
|
||||
hasMapsKey: false,
|
||||
serverTimezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||||
appRequireMfa: false,
|
||||
@@ -226,6 +232,8 @@ export const useAuthStore = create<AuthState>((set, get) => ({
|
||||
},
|
||||
|
||||
setDevMode: (val: boolean) => set({ devMode: val }),
|
||||
setIsPrerelease: (val: boolean) => set({ isPrerelease: val }),
|
||||
setAppVersion: (val: string) => set({ appVersion: val }),
|
||||
setHasMapsKey: (val: boolean) => set({ hasMapsKey: val }),
|
||||
setServerTimezone: (tz: string) => set({ serverTimezone: tz }),
|
||||
setAppRequireMfa: (val: boolean) => set({ appRequireMfa: val }),
|
||||
|
||||
@@ -0,0 +1,329 @@
|
||||
// FE-STORE-JOURNEY-001 to FE-STORE-JOURNEY-015
|
||||
import { http, HttpResponse } from 'msw';
|
||||
import { server } from '../../tests/helpers/msw/server';
|
||||
import { useJourneyStore } from './journeyStore';
|
||||
import type { JourneyDetail, JourneyEntry, JourneyPhoto } from './journeyStore';
|
||||
|
||||
const initialState = useJourneyStore.getState();
|
||||
|
||||
// ── Helpers ──────────────────────────────────────────────────────────────────
|
||||
|
||||
let _seq = 100;
|
||||
function nextId(): number {
|
||||
return ++_seq;
|
||||
}
|
||||
|
||||
function buildJourney(overrides: Record<string, unknown> = {}) {
|
||||
const id = (overrides.id as number) ?? nextId();
|
||||
return {
|
||||
id,
|
||||
user_id: 1,
|
||||
title: `Journey ${id}`,
|
||||
subtitle: null,
|
||||
cover_gradient: null,
|
||||
cover_image: null,
|
||||
status: 'draft' as const,
|
||||
created_at: Date.now(),
|
||||
updated_at: Date.now(),
|
||||
...overrides,
|
||||
};
|
||||
}
|
||||
|
||||
function buildJourneyDetail(overrides: Record<string, unknown> = {}): JourneyDetail {
|
||||
const base = buildJourney(overrides);
|
||||
return {
|
||||
...base,
|
||||
entries: [],
|
||||
trips: [],
|
||||
contributors: [],
|
||||
stats: { entries: 0, photos: 0, cities: 0 },
|
||||
...(overrides as any),
|
||||
};
|
||||
}
|
||||
|
||||
function buildEntry(overrides: Record<string, unknown> = {}): JourneyEntry {
|
||||
const id = (overrides.id as number) ?? nextId();
|
||||
return {
|
||||
id,
|
||||
journey_id: 1,
|
||||
source_trip_id: null,
|
||||
source_place_id: null,
|
||||
source_trip_name: null,
|
||||
author_id: 1,
|
||||
type: 'entry',
|
||||
title: `Entry ${id}`,
|
||||
story: null,
|
||||
entry_date: '2026-04-01',
|
||||
entry_time: null,
|
||||
location_name: null,
|
||||
location_lat: null,
|
||||
location_lng: null,
|
||||
mood: null,
|
||||
weather: null,
|
||||
tags: [],
|
||||
pros_cons: null,
|
||||
visibility: 'private',
|
||||
sort_order: 0,
|
||||
photos: [],
|
||||
created_at: Date.now(),
|
||||
updated_at: Date.now(),
|
||||
...overrides,
|
||||
} as JourneyEntry;
|
||||
}
|
||||
|
||||
function buildPhoto(overrides: Record<string, unknown> = {}): JourneyPhoto {
|
||||
const id = (overrides.id as number) ?? nextId();
|
||||
return {
|
||||
id,
|
||||
entry_id: 1,
|
||||
provider: 'local',
|
||||
asset_id: null,
|
||||
owner_id: null,
|
||||
file_path: `/uploads/photo_${id}.jpg`,
|
||||
thumbnail_path: null,
|
||||
caption: null,
|
||||
sort_order: 0,
|
||||
width: null,
|
||||
height: null,
|
||||
shared: 0,
|
||||
created_at: Date.now(),
|
||||
...overrides,
|
||||
} as JourneyPhoto;
|
||||
}
|
||||
|
||||
// ── Setup ────────────────────────────────────────────────────────────────────
|
||||
|
||||
beforeEach(() => {
|
||||
useJourneyStore.setState(initialState, true);
|
||||
server.resetHandlers();
|
||||
});
|
||||
|
||||
// ── Tests ────────────────────────────────────────────────────────────────────
|
||||
|
||||
describe('journeyStore', () => {
|
||||
// ── loadJourneys ─────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-001: loadJourneys populates store', async () => {
|
||||
const j1 = buildJourney({ id: 1 });
|
||||
const j2 = buildJourney({ id: 2 });
|
||||
server.use(
|
||||
http.get('/api/journeys', () =>
|
||||
HttpResponse.json({ journeys: [j1, j2] })
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().loadJourneys();
|
||||
expect(useJourneyStore.getState().journeys).toHaveLength(2);
|
||||
expect(useJourneyStore.getState().journeys[0].id).toBe(1);
|
||||
});
|
||||
|
||||
it('FE-STORE-JOURNEY-002: loadJourneys sets loading false on error', async () => {
|
||||
server.use(
|
||||
http.get('/api/journeys', () =>
|
||||
HttpResponse.json({ error: 'server error' }, { status: 500 })
|
||||
)
|
||||
);
|
||||
await expect(useJourneyStore.getState().loadJourneys()).rejects.toThrow();
|
||||
expect(useJourneyStore.getState().loading).toBe(false);
|
||||
});
|
||||
|
||||
// ── loadJourney ──────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-003: loadJourney sets current journey', async () => {
|
||||
const detail = buildJourneyDetail({ id: 5 });
|
||||
server.use(
|
||||
http.get('/api/journeys/5', () =>
|
||||
HttpResponse.json(detail)
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().loadJourney(5);
|
||||
expect(useJourneyStore.getState().current?.id).toBe(5);
|
||||
expect(useJourneyStore.getState().loading).toBe(false);
|
||||
});
|
||||
|
||||
it('FE-STORE-JOURNEY-004: loadJourney sets loading false on error', async () => {
|
||||
server.use(
|
||||
http.get('/api/journeys/999', () =>
|
||||
HttpResponse.json({ error: 'not found' }, { status: 404 })
|
||||
)
|
||||
);
|
||||
await expect(useJourneyStore.getState().loadJourney(999)).rejects.toThrow();
|
||||
expect(useJourneyStore.getState().loading).toBe(false);
|
||||
});
|
||||
|
||||
// ── createJourney ────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-005: createJourney adds to store and returns journey', async () => {
|
||||
const created = buildJourney({ id: 10, title: 'My Trip' });
|
||||
server.use(
|
||||
http.post('/api/journeys', () =>
|
||||
HttpResponse.json(created)
|
||||
)
|
||||
);
|
||||
const result = await useJourneyStore.getState().createJourney({ title: 'My Trip' });
|
||||
expect(result.id).toBe(10);
|
||||
expect(useJourneyStore.getState().journeys).toContainEqual(created);
|
||||
});
|
||||
|
||||
it('FE-STORE-JOURNEY-006: createJourney throws on API error', async () => {
|
||||
server.use(
|
||||
http.post('/api/journeys', () =>
|
||||
HttpResponse.json({ error: 'Validation failed' }, { status: 422 })
|
||||
)
|
||||
);
|
||||
await expect(useJourneyStore.getState().createJourney({ title: '' })).rejects.toThrow();
|
||||
});
|
||||
|
||||
// ── updateJourney ────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-007: updateJourney updates in list and current', async () => {
|
||||
const existing = buildJourney({ id: 20, title: 'Old' });
|
||||
const detail = buildJourneyDetail({ id: 20, title: 'Old' });
|
||||
useJourneyStore.setState({ journeys: [existing], current: detail });
|
||||
|
||||
server.use(
|
||||
http.patch('/api/journeys/20', () =>
|
||||
HttpResponse.json({ title: 'New' })
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().updateJourney(20, { title: 'New' });
|
||||
expect(useJourneyStore.getState().journeys[0].title).toBe('New');
|
||||
expect(useJourneyStore.getState().current?.title).toBe('New');
|
||||
});
|
||||
|
||||
// ── deleteJourney ────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-008: deleteJourney removes from list', async () => {
|
||||
const j1 = buildJourney({ id: 30 });
|
||||
const j2 = buildJourney({ id: 31 });
|
||||
useJourneyStore.setState({ journeys: [j1, j2] });
|
||||
|
||||
server.use(
|
||||
http.delete('/api/journeys/30', () =>
|
||||
HttpResponse.json({})
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().deleteJourney(30);
|
||||
expect(useJourneyStore.getState().journeys).toHaveLength(1);
|
||||
expect(useJourneyStore.getState().journeys[0].id).toBe(31);
|
||||
});
|
||||
|
||||
it('FE-STORE-JOURNEY-009: deleteJourney clears current if matching', async () => {
|
||||
const detail = buildJourneyDetail({ id: 40 });
|
||||
useJourneyStore.setState({ journeys: [buildJourney({ id: 40 })], current: detail });
|
||||
|
||||
server.use(
|
||||
http.delete('/api/journeys/40', () =>
|
||||
HttpResponse.json({})
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().deleteJourney(40);
|
||||
expect(useJourneyStore.getState().current).toBeNull();
|
||||
});
|
||||
|
||||
// ── createEntry ──────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-010: createEntry adds entry to current', async () => {
|
||||
const detail = buildJourneyDetail({ id: 50 });
|
||||
useJourneyStore.setState({ current: detail });
|
||||
|
||||
const newEntry = buildEntry({ id: 60, journey_id: 50 });
|
||||
server.use(
|
||||
http.post('/api/journeys/50/entries', () =>
|
||||
HttpResponse.json(newEntry)
|
||||
)
|
||||
);
|
||||
const result = await useJourneyStore.getState().createEntry(50, { title: 'Day 1' });
|
||||
expect(result.id).toBe(60);
|
||||
expect(useJourneyStore.getState().current?.entries).toHaveLength(1);
|
||||
expect(useJourneyStore.getState().current?.entries[0].id).toBe(60);
|
||||
});
|
||||
|
||||
// ── updateEntry ──────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-011: updateEntry updates entry in current', async () => {
|
||||
const entry = buildEntry({ id: 70, title: 'Old Title' });
|
||||
const detail = buildJourneyDetail({ id: 50, entries: [entry] });
|
||||
useJourneyStore.setState({ current: detail });
|
||||
|
||||
server.use(
|
||||
http.patch('/api/journeys/entries/70', () =>
|
||||
HttpResponse.json({ title: 'New Title' })
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().updateEntry(70, { title: 'New Title' });
|
||||
expect(useJourneyStore.getState().current?.entries[0].title).toBe('New Title');
|
||||
});
|
||||
|
||||
// ── deleteEntry ──────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-012: deleteEntry removes entry from current', async () => {
|
||||
const entry1 = buildEntry({ id: 80 });
|
||||
const entry2 = buildEntry({ id: 81 });
|
||||
const detail = buildJourneyDetail({ id: 50, entries: [entry1, entry2] });
|
||||
useJourneyStore.setState({ current: detail });
|
||||
|
||||
server.use(
|
||||
http.delete('/api/journeys/entries/80', () =>
|
||||
HttpResponse.json({})
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().deleteEntry(80);
|
||||
expect(useJourneyStore.getState().current?.entries).toHaveLength(1);
|
||||
expect(useJourneyStore.getState().current?.entries[0].id).toBe(81);
|
||||
});
|
||||
|
||||
// ── uploadPhotos ─────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-013: uploadPhotos appends photos to entry', async () => {
|
||||
const existingPhoto = buildPhoto({ id: 90, entry_id: 100 });
|
||||
const entry = buildEntry({ id: 100, photos: [existingPhoto] });
|
||||
const detail = buildJourneyDetail({ id: 50, entries: [entry] });
|
||||
useJourneyStore.setState({ current: detail });
|
||||
|
||||
const newPhoto = buildPhoto({ id: 91, entry_id: 100 });
|
||||
server.use(
|
||||
http.post('/api/journeys/entries/100/photos', () =>
|
||||
HttpResponse.json({ photos: [newPhoto] })
|
||||
)
|
||||
);
|
||||
const result = await useJourneyStore.getState().uploadPhotos(100, new FormData());
|
||||
expect(result).toHaveLength(1);
|
||||
expect(result[0].id).toBe(91);
|
||||
const storedEntry = useJourneyStore.getState().current?.entries.find(e => e.id === 100);
|
||||
expect(storedEntry?.photos).toHaveLength(2);
|
||||
});
|
||||
|
||||
// ── deletePhoto ──────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-014: deletePhoto removes photo from entry', async () => {
|
||||
const photo1 = buildPhoto({ id: 200, entry_id: 100 });
|
||||
const photo2 = buildPhoto({ id: 201, entry_id: 100 });
|
||||
const entry = buildEntry({ id: 100, photos: [photo1, photo2] });
|
||||
const detail = buildJourneyDetail({ id: 50, entries: [entry] });
|
||||
useJourneyStore.setState({ current: detail });
|
||||
|
||||
server.use(
|
||||
http.delete('/api/journeys/photos/200', () =>
|
||||
HttpResponse.json({})
|
||||
)
|
||||
);
|
||||
await useJourneyStore.getState().deletePhoto(200);
|
||||
const storedEntry = useJourneyStore.getState().current?.entries.find(e => e.id === 100);
|
||||
expect(storedEntry?.photos).toHaveLength(1);
|
||||
expect(storedEntry?.photos[0].id).toBe(201);
|
||||
});
|
||||
|
||||
// ── clear ────────────────────────────────────────────────────────────────
|
||||
|
||||
it('FE-STORE-JOURNEY-015: clear resets state', () => {
|
||||
useJourneyStore.setState({
|
||||
journeys: [buildJourney()],
|
||||
current: buildJourneyDetail(),
|
||||
loading: true,
|
||||
});
|
||||
useJourneyStore.getState().clear();
|
||||
expect(useJourneyStore.getState().journeys).toEqual([]);
|
||||
expect(useJourneyStore.getState().current).toBeNull();
|
||||
expect(useJourneyStore.getState().loading).toBe(false);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,213 @@
|
||||
import { create } from 'zustand'
|
||||
import { journeyApi } from '../api/client'
|
||||
|
||||
export interface Journey {
|
||||
id: number
|
||||
user_id: number
|
||||
title: string
|
||||
subtitle?: string | null
|
||||
cover_gradient?: string | null
|
||||
cover_image?: string | null
|
||||
status: 'draft' | 'active' | 'completed'
|
||||
created_at: number
|
||||
updated_at: number
|
||||
}
|
||||
|
||||
export interface JourneyEntry {
|
||||
id: number
|
||||
journey_id: number
|
||||
source_trip_id?: number | null
|
||||
source_place_id?: number | null
|
||||
source_trip_name?: string | null
|
||||
author_id: number
|
||||
type: 'entry' | 'checkin' | 'skeleton'
|
||||
title?: string | null
|
||||
story?: string | null
|
||||
entry_date: string
|
||||
entry_time?: string | null
|
||||
location_name?: string | null
|
||||
location_lat?: number | null
|
||||
location_lng?: number | null
|
||||
mood?: string | null
|
||||
weather?: string | null
|
||||
tags?: string[]
|
||||
pros_cons?: { pros: string[]; cons: string[] } | null
|
||||
visibility: string
|
||||
sort_order: number
|
||||
photos: JourneyPhoto[]
|
||||
created_at: number
|
||||
updated_at: number
|
||||
}
|
||||
|
||||
export interface JourneyPhoto {
|
||||
id: number
|
||||
entry_id: number
|
||||
provider: 'local' | 'immich' | 'synologyphotos'
|
||||
asset_id?: string | null
|
||||
owner_id?: number | null
|
||||
file_path?: string | null
|
||||
thumbnail_path?: string | null
|
||||
caption?: string | null
|
||||
sort_order: number
|
||||
width?: number | null
|
||||
height?: number | null
|
||||
shared: number
|
||||
created_at: number
|
||||
}
|
||||
|
||||
export interface JourneyTrip {
|
||||
trip_id: number
|
||||
added_at: number
|
||||
title: string
|
||||
start_date?: string | null
|
||||
end_date?: string | null
|
||||
cover_image?: string | null
|
||||
currency?: string
|
||||
place_count: number
|
||||
}
|
||||
|
||||
export interface JourneyContributor {
|
||||
journey_id: number
|
||||
user_id: number
|
||||
role: 'owner' | 'editor' | 'viewer'
|
||||
added_at: number
|
||||
username: string
|
||||
avatar?: string | null
|
||||
}
|
||||
|
||||
export interface JourneyDetail extends Journey {
|
||||
entries: JourneyEntry[]
|
||||
trips: JourneyTrip[]
|
||||
contributors: JourneyContributor[]
|
||||
stats: { entries: number; photos: number; cities: number }
|
||||
}
|
||||
|
||||
interface JourneyState {
|
||||
journeys: Journey[]
|
||||
current: JourneyDetail | null
|
||||
loading: boolean
|
||||
|
||||
loadJourneys: () => Promise<void>
|
||||
loadJourney: (id: number) => Promise<void>
|
||||
createJourney: (data: { title: string; subtitle?: string; trip_ids?: number[] }) => Promise<Journey>
|
||||
updateJourney: (id: number, data: Record<string, unknown>) => Promise<void>
|
||||
deleteJourney: (id: number) => Promise<void>
|
||||
|
||||
createEntry: (journeyId: number, data: Record<string, unknown>) => Promise<JourneyEntry>
|
||||
updateEntry: (entryId: number, data: Record<string, unknown>) => Promise<void>
|
||||
deleteEntry: (entryId: number) => Promise<void>
|
||||
|
||||
uploadPhotos: (entryId: number, formData: FormData) => Promise<JourneyPhoto[]>
|
||||
deletePhoto: (photoId: number) => Promise<void>
|
||||
|
||||
clear: () => void
|
||||
}
|
||||
|
||||
export const useJourneyStore = create<JourneyState>((set, get) => ({
|
||||
journeys: [],
|
||||
current: null,
|
||||
loading: false,
|
||||
|
||||
loadJourneys: async () => {
|
||||
set({ loading: true })
|
||||
try {
|
||||
const data = await journeyApi.list()
|
||||
set({ journeys: data.journeys || [] })
|
||||
} finally {
|
||||
set({ loading: false })
|
||||
}
|
||||
},
|
||||
|
||||
loadJourney: async (id) => {
|
||||
set({ loading: true })
|
||||
try {
|
||||
const data = await journeyApi.get(id)
|
||||
set({ current: data })
|
||||
} finally {
|
||||
set({ loading: false })
|
||||
}
|
||||
},
|
||||
|
||||
createJourney: async (data) => {
|
||||
const journey = await journeyApi.create(data)
|
||||
set(s => ({ journeys: [journey, ...s.journeys] }))
|
||||
return journey
|
||||
},
|
||||
|
||||
updateJourney: async (id, data) => {
|
||||
const updated = await journeyApi.update(id, data)
|
||||
set(s => ({
|
||||
journeys: s.journeys.map(j => j.id === id ? { ...j, ...updated } : j),
|
||||
current: s.current?.id === id ? { ...s.current, ...updated } : s.current,
|
||||
}))
|
||||
},
|
||||
|
||||
deleteJourney: async (id) => {
|
||||
await journeyApi.delete(id)
|
||||
set(s => ({
|
||||
journeys: s.journeys.filter(j => j.id !== id),
|
||||
current: s.current?.id === id ? null : s.current,
|
||||
}))
|
||||
},
|
||||
|
||||
createEntry: async (journeyId, data) => {
|
||||
const entry = await journeyApi.createEntry(journeyId, data)
|
||||
entry.photos = entry.photos || []
|
||||
set(s => {
|
||||
if (s.current?.id !== journeyId) return s
|
||||
return { current: { ...s.current, entries: [...s.current.entries, entry] } }
|
||||
})
|
||||
return entry
|
||||
},
|
||||
|
||||
updateEntry: async (entryId, data) => {
|
||||
const updated = await journeyApi.updateEntry(entryId, data)
|
||||
set(s => {
|
||||
if (!s.current) return s
|
||||
return { current: { ...s.current, entries: s.current.entries.map(e => e.id === entryId ? { ...e, ...updated } : e) } }
|
||||
})
|
||||
},
|
||||
|
||||
deleteEntry: async (entryId) => {
|
||||
await journeyApi.deleteEntry(entryId)
|
||||
set(s => {
|
||||
if (!s.current) return s
|
||||
return { current: { ...s.current, entries: s.current.entries.filter(e => e.id !== entryId) } }
|
||||
})
|
||||
},
|
||||
|
||||
uploadPhotos: async (entryId, formData) => {
|
||||
const data = await journeyApi.uploadPhotos(entryId, formData)
|
||||
const photos = data.photos || []
|
||||
set(s => {
|
||||
if (!s.current) return s
|
||||
return {
|
||||
current: {
|
||||
...s.current,
|
||||
entries: s.current.entries.map(e =>
|
||||
e.id === entryId ? { ...e, photos: [...(e.photos || []), ...photos] } : e
|
||||
),
|
||||
},
|
||||
}
|
||||
})
|
||||
return photos
|
||||
},
|
||||
|
||||
deletePhoto: async (photoId) => {
|
||||
await journeyApi.deletePhoto(photoId)
|
||||
set(s => {
|
||||
if (!s.current) return s
|
||||
return {
|
||||
current: {
|
||||
...s.current,
|
||||
entries: s.current.entries.map(e => ({
|
||||
...e,
|
||||
photos: (e.photos || []).filter(p => p.id !== photoId),
|
||||
})),
|
||||
},
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
clear: () => set({ journeys: [], current: null, loading: false }),
|
||||
}))
|
||||
@@ -0,0 +1,177 @@
|
||||
// FE-STORE-BUDGET-001 to FE-STORE-BUDGET-011
|
||||
import { http, HttpResponse } from 'msw';
|
||||
import { server } from '../../../tests/helpers/msw/server';
|
||||
import { resetAllStores, seedStore } from '../../../tests/helpers/store';
|
||||
import { buildBudgetItem } from '../../../tests/helpers/factories';
|
||||
import { useTripStore } from '../tripStore';
|
||||
|
||||
beforeEach(() => {
|
||||
resetAllStores();
|
||||
server.resetHandlers();
|
||||
});
|
||||
|
||||
describe('budgetSlice', () => {
|
||||
it('FE-STORE-BUDGET-001: loadBudgetItems populates store', async () => {
|
||||
const item = buildBudgetItem({ trip_id: 1 });
|
||||
server.use(
|
||||
http.get('/api/trips/1/budget', () =>
|
||||
HttpResponse.json({ items: [item] })
|
||||
)
|
||||
);
|
||||
await useTripStore.getState().loadBudgetItems(1);
|
||||
expect(useTripStore.getState().budgetItems).toHaveLength(1);
|
||||
expect(useTripStore.getState().budgetItems[0].id).toBe(item.id);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-002: loadBudgetItems swallows errors silently', async () => {
|
||||
server.use(
|
||||
http.get('/api/trips/1/budget', () =>
|
||||
HttpResponse.json({ error: 'server error' }, { status: 500 })
|
||||
)
|
||||
);
|
||||
// Should NOT throw
|
||||
await expect(useTripStore.getState().loadBudgetItems(1)).resolves.toBeUndefined();
|
||||
expect(useTripStore.getState().budgetItems).toEqual([]);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-003: addBudgetItem appends to store and returns item', async () => {
|
||||
const newItem = buildBudgetItem({ name: 'Hotel', trip_id: 1 });
|
||||
server.use(
|
||||
http.post('/api/trips/1/budget', () =>
|
||||
HttpResponse.json({ item: newItem })
|
||||
)
|
||||
);
|
||||
const result = await useTripStore.getState().addBudgetItem(1, { name: 'Hotel' });
|
||||
expect(result.id).toBe(newItem.id);
|
||||
expect(useTripStore.getState().budgetItems).toContainEqual(newItem);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-004: addBudgetItem throws on API error', async () => {
|
||||
server.use(
|
||||
http.post('/api/trips/1/budget', () =>
|
||||
HttpResponse.json({ error: 'Validation failed' }, { status: 422 })
|
||||
)
|
||||
);
|
||||
await expect(useTripStore.getState().addBudgetItem(1, {})).rejects.toThrow();
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-005: updateBudgetItem replaces item in store', async () => {
|
||||
const existing = buildBudgetItem({ id: 10, trip_id: 1, name: 'Old' });
|
||||
seedStore(useTripStore, { budgetItems: [existing] });
|
||||
|
||||
const updated = { ...existing, name: 'New' };
|
||||
server.use(
|
||||
http.put('/api/trips/1/budget/10', () =>
|
||||
HttpResponse.json({ item: updated })
|
||||
)
|
||||
);
|
||||
await useTripStore.getState().updateBudgetItem(1, 10, { name: 'New' });
|
||||
const items = useTripStore.getState().budgetItems;
|
||||
expect(items).toHaveLength(1);
|
||||
expect(items[0].name).toBe('New');
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-006: updateBudgetItem calls loadReservations when reservation_id + total_price provided', async () => {
|
||||
const existing = buildBudgetItem({ id: 20, trip_id: 1 });
|
||||
seedStore(useTripStore, { budgetItems: [existing] });
|
||||
|
||||
const loadReservations = vi.fn().mockResolvedValue(undefined);
|
||||
seedStore(useTripStore, { loadReservations });
|
||||
|
||||
const itemWithReservation = { ...existing, reservation_id: 99 };
|
||||
server.use(
|
||||
http.put('/api/trips/1/budget/20', () =>
|
||||
HttpResponse.json({ item: itemWithReservation })
|
||||
)
|
||||
);
|
||||
await useTripStore.getState().updateBudgetItem(1, 20, { total_price: 50 });
|
||||
expect(loadReservations).toHaveBeenCalledWith(1);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-007: deleteBudgetItem optimistically removes and rolls back on error', async () => {
|
||||
const item = buildBudgetItem({ id: 5, trip_id: 1 });
|
||||
seedStore(useTripStore, { budgetItems: [item] });
|
||||
|
||||
server.use(
|
||||
http.delete('/api/trips/1/budget/5', () =>
|
||||
HttpResponse.json({ error: 'forbidden' }, { status: 403 })
|
||||
)
|
||||
);
|
||||
// The item is removed immediately (optimistic), then restored on error
|
||||
const deletePromise = useTripStore.getState().deleteBudgetItem(1, 5);
|
||||
await expect(deletePromise).rejects.toThrow();
|
||||
// After rollback, item is back
|
||||
expect(useTripStore.getState().budgetItems).toContainEqual(item);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-008: setBudgetItemMembers updates members on matching item', async () => {
|
||||
const item = buildBudgetItem({ id: 7, trip_id: 1, members: [] });
|
||||
seedStore(useTripStore, { budgetItems: [item] });
|
||||
|
||||
const members = [{ user_id: 1, paid: false }, { user_id: 2, paid: false }];
|
||||
const updatedItem = { ...item, persons: 2, members };
|
||||
server.use(
|
||||
http.put('/api/trips/1/budget/7/members', () =>
|
||||
HttpResponse.json({ members, item: updatedItem })
|
||||
)
|
||||
);
|
||||
await useTripStore.getState().setBudgetItemMembers(1, 7, [1, 2]);
|
||||
const stored = useTripStore.getState().budgetItems.find(i => i.id === 7);
|
||||
expect(stored?.members).toHaveLength(2);
|
||||
expect(stored?.persons).toBe(2);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-009: toggleBudgetMemberPaid updates paid flag on matching member', async () => {
|
||||
const item = buildBudgetItem({
|
||||
id: 8,
|
||||
trip_id: 1,
|
||||
members: [{ user_id: 3, paid: false }],
|
||||
});
|
||||
seedStore(useTripStore, { budgetItems: [item] });
|
||||
|
||||
server.use(
|
||||
http.put('/api/trips/1/budget/8/members/3/paid', () =>
|
||||
HttpResponse.json({ success: true, paid: true })
|
||||
)
|
||||
);
|
||||
await useTripStore.getState().toggleBudgetMemberPaid(1, 8, 3, true);
|
||||
const stored = useTripStore.getState().budgetItems.find(i => i.id === 8);
|
||||
expect(stored?.members?.[0]?.paid).toBe(true);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-010: reorderBudgetItems reorders optimistically and reloads on error', async () => {
|
||||
const a = buildBudgetItem({ id: 1, trip_id: 1 });
|
||||
const b = buildBudgetItem({ id: 2, trip_id: 1 });
|
||||
seedStore(useTripStore, { budgetItems: [a, b] });
|
||||
|
||||
// Reorder succeeds
|
||||
server.use(
|
||||
http.put('/api/trips/1/budget/reorder/items', () =>
|
||||
HttpResponse.json({ success: true })
|
||||
)
|
||||
);
|
||||
await useTripStore.getState().reorderBudgetItems(1, [2, 1]);
|
||||
const items = useTripStore.getState().budgetItems;
|
||||
expect(items[0].id).toBe(2);
|
||||
expect(items[1].id).toBe(1);
|
||||
});
|
||||
|
||||
it('FE-STORE-BUDGET-011: reorderBudgetItems reloads list on API error', async () => {
|
||||
const a = buildBudgetItem({ id: 1, trip_id: 1 });
|
||||
const b = buildBudgetItem({ id: 2, trip_id: 1 });
|
||||
seedStore(useTripStore, { budgetItems: [a, b] });
|
||||
|
||||
const freshItem = buildBudgetItem({ id: 99, trip_id: 1 });
|
||||
server.use(
|
||||
http.put('/api/trips/1/budget/reorder/items', () =>
|
||||
HttpResponse.json({ error: 'error' }, { status: 500 })
|
||||
),
|
||||
http.get('/api/trips/1/budget', () =>
|
||||
HttpResponse.json({ items: [freshItem] })
|
||||
)
|
||||
);
|
||||
await useTripStore.getState().reorderBudgetItems(1, [2, 1]);
|
||||
// After failure, fresh list from server
|
||||
expect(useTripStore.getState().budgetItems[0].id).toBe(freshItem.id);
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user