From 5f4f3cc6c420d5fe37bf8f8dffa9368e75b9b60e Mon Sep 17 00:00:00 2001 From: Maze Winther Date: Thu, 31 Jul 2025 13:10:37 +0200 Subject: [PATCH] Merge pull request [#499](https://github.com/mazeincoding/AppCut/issues/499) --- apps/web/src/app/editor/[project_id]/page.tsx | 100 ++++++++++++++++-- apps/web/src/stores/project-store.ts | 26 +++++ 2 files changed, 117 insertions(+), 9 deletions(-) diff --git a/apps/web/src/app/editor/[project_id]/page.tsx b/apps/web/src/app/editor/[project_id]/page.tsx index 26fdcf8a..5e294fe7 100644 --- a/apps/web/src/app/editor/[project_id]/page.tsx +++ b/apps/web/src/app/editor/[project_id]/page.tsx @@ -32,39 +32,121 @@ export default function Editor() { setPropertiesPanel, } = usePanelStore(); - const { activeProject, loadProject, createNewProject } = useProjectStore(); + const { + activeProject, + loadProject, + createNewProject, + isInvalidProjectId, + markProjectIdAsInvalid, + } = useProjectStore(); const params = useParams(); const router = useRouter(); const projectId = params.project_id as string; const handledProjectIds = useRef>(new Set()); + const isInitializingRef = useRef(false); usePlaybackControls(); useEffect(() => { - const initProject = async () => { - if (!projectId) return; + let isCancelled = false; + const initProject = async () => { + if (!projectId) { + return; + } + + // Prevent duplicate initialization + if (isInitializingRef.current) { + return; + } + + // Check if project is already loaded if (activeProject?.id === projectId) { return; } + // Check global invalid tracking first (most important for preventing duplicates) + if (isInvalidProjectId(projectId)) { + return; + } + + // Check if we've already handled this project ID locally if (handledProjectIds.current.has(projectId)) { return; } + // Mark as initializing to prevent race conditions + isInitializingRef.current = true; + handledProjectIds.current.add(projectId); + try { await loadProject(projectId); - } catch (error) { - handledProjectIds.current.add(projectId); - const newProjectId = await createNewProject("Untitled Project"); - router.replace(`/editor/${newProjectId}`); - return; + // Check if component was unmounted during async operation + if (isCancelled) { + return; + } + + // Project loaded successfully + isInitializingRef.current = false; + } catch (error) { + // Check if component was unmounted during async operation + if (isCancelled) { + return; + } + + // More specific error handling - only create new project for actual "not found" errors + const isProjectNotFound = + error instanceof Error && + (error.message.includes("not found") || + error.message.includes("does not exist") || + error.message.includes("Project not found")); + + if (isProjectNotFound) { + // Mark this project ID as invalid globally BEFORE creating project + markProjectIdAsInvalid(projectId); + + try { + const newProjectId = await createNewProject("Untitled Project"); + + // Check again if component was unmounted + if (isCancelled) { + return; + } + + router.replace(`/editor/${newProjectId}`); + } catch (createError) { + console.error("Failed to create new project:", createError); + } + } else { + // For other errors (storage issues, corruption, etc.), don't create new project + console.error( + "Project loading failed with recoverable error:", + error + ); + // Remove from handled set so user can retry + handledProjectIds.current.delete(projectId); + } + + isInitializingRef.current = false; } }; initProject(); - }, [projectId, activeProject?.id, loadProject, createNewProject, router]); + + // Cleanup function to cancel async operations + return () => { + isCancelled = true; + isInitializingRef.current = false; + }; + }, [ + projectId, + loadProject, + createNewProject, + router, + isInvalidProjectId, + markProjectIdAsInvalid, + ]); return ( diff --git a/apps/web/src/stores/project-store.ts b/apps/web/src/stores/project-store.ts index 7bb38039..6744bdec 100644 --- a/apps/web/src/stores/project-store.ts +++ b/apps/web/src/stores/project-store.ts @@ -11,6 +11,7 @@ interface ProjectStore { savedProjects: TProject[]; isLoading: boolean; isInitialized: boolean; + invalidProjectIds?: Set; // Actions createNewProject: (name: string) => Promise; @@ -32,6 +33,11 @@ interface ProjectStore { searchQuery: string, sortOption: string ) => TProject[]; + + // Global invalid project ID tracking + isInvalidProjectId: (id: string) => boolean; + markProjectIdAsInvalid: (id: string) => void; + clearInvalidProjectIds: () => void; } export const useProjectStore = create((set, get) => ({ @@ -39,6 +45,7 @@ export const useProjectStore = create((set, get) => ({ savedProjects: [], isLoading: true, isInitialized: false, + invalidProjectIds: new Set(), createNewProject: async (name: string) => { const newProject: TProject = { @@ -357,4 +364,23 @@ export const useProjectStore = create((set, get) => ({ return sortedProjects; }, + + // Global invalid project ID tracking implementation + isInvalidProjectId: (id: string) => { + const invalidIds = get().invalidProjectIds || new Set(); + return invalidIds.has(id); + }, + + markProjectIdAsInvalid: (id: string) => { + set((state) => ({ + invalidProjectIds: new Set([ + ...(state.invalidProjectIds || new Set()), + id, + ]), + })); + }, + + clearInvalidProjectIds: () => { + set({ invalidProjectIds: new Set() }); + }, }));