Use Zustand store; modularize API & routes

Introduce a centralized Zustand store and refactor app state out of App.tsx into src/store/appStore.ts. Modularize API surface by moving media/cast/settings/converters/types into src/lib/api/* and re-exporting from src/api.ts for backward compatibility. Replace inline route helpers with dedicated route components (MediaDetailRoute, CastDetailRoute, CategoryBrowseRoute) and wire CATEGORY_PATHS/PATH_TO_CATEGORY constants. Update AddMediaView UI (icons, layout) and adjust settings/category handling to use DEFAULT_SETTINGS and the store. Add zustand to package.json/package-lock.json and include a new React SKILL.md. Overall changes improve state management, API organization, and route/component separation for better maintainability and code-splitting.
This commit is contained in:
Lars Behrends
2026-04-16 14:53:46 +02:00
parent a407b57006
commit 432416cfc5
22 changed files with 1843 additions and 1342 deletions
+4 -4
View File
@@ -1,7 +1,7 @@
const BASE_URL = import.meta.env.VITE_API_URL;
// Import the source mapping
import { SOURCE_CATEGORY_MAPPING } from '@/types';
// Import the source mapping and types
import { SOURCE_CATEGORY_MAPPING, Media, Staff } from '@/types';
export interface XBVRConfig {
url: string;
@@ -83,7 +83,7 @@ export async function importFromXBVR(
const existingMediaResponse = await fetch(`${BASE_URL}/api/media?limit=1000`);
const existingMediaData = await existingMediaResponse.json();
const existingTitles = new Set(
existingMediaData.data?.items?.map((m: any) => m.title) || []
existingMediaData.data?.items?.map((m: Media) => m.title) || []
);
logCallback(`Found ${existingTitles.size} existing videos in database`);
@@ -91,7 +91,7 @@ export async function importFromXBVR(
const existingCastResponse = await fetch(`${BASE_URL}/api/cast?limit=1000`);
const existingCastData = await existingCastResponse.json();
const existingActors = new Map(
(existingCastData.data?.items || []).map((c: any) => [c.name, c])
(existingCastData.data?.items || []).map((c: Staff) => [c.name, c])
);
logCallback(`Found ${existingActors.size} existing actors in database`);