From 7bf0984698e43b9aa2dd879f65951318ed410390 Mon Sep 17 00:00:00 2001 From: Maze <167211895+mazeincoding@users.noreply.github.com> Date: Sat, 31 Jan 2026 00:20:04 +0100 Subject: codebase overhaul (#697) --- apps/web/src/components/editor/editor-header.tsx | 279 ++++++++++++++--------- 1 file changed, 168 insertions(+), 111 deletions(-) (limited to 'apps/web/src/components/editor/editor-header.tsx') diff --git a/apps/web/src/components/editor/editor-header.tsx b/apps/web/src/components/editor/editor-header.tsx index 5363d0c7..d74d78d7 100644 --- a/apps/web/src/components/editor/editor-header.tsx +++ b/apps/web/src/components/editor/editor-header.tsx @@ -1,130 +1,187 @@ "use client"; import { Button } from "../ui/button"; -import { ChevronDown, ArrowLeft, SquarePen, Trash } from "lucide-react"; -import { HeaderBase } from "../header-base"; -import { useProjectStore } from "@/stores/project-store"; -import { KeyboardShortcutsHelp } from "../keyboard-shortcuts-help"; +import { ChevronDown } from "lucide-react"; import { useState } from "react"; import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuSeparator, - DropdownMenuTrigger, + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuSeparator, + DropdownMenuTrigger, } from "../ui/dropdown-menu"; import Link from "next/link"; -import { RenameProjectDialog } from "../rename-project-dialog"; -import { DeleteProjectDialog } from "../delete-project-dialog"; +import { RenameProjectDialog } from "./dialogs/rename-project-dialog"; +import { DeleteProjectDialog } from "./dialogs/delete-project-dialog"; import { useRouter } from "next/navigation"; import { FaDiscord } from "react-icons/fa6"; -import { PanelPresetSelector } from "./panel-preset-selector"; import { ExportButton } from "./export-button"; import { ThemeToggle } from "../theme-toggle"; +import { SOCIAL_LINKS } from "@/constants/site-constants"; +import { toast } from "sonner"; +import { useEditor } from "@/hooks/use-editor"; +import { + ArrowLeft02Icon, + Edit03Icon, + Delete02Icon, + CommandIcon, +} from "@hugeicons/core-free-icons"; +import { HugeiconsIcon } from "@hugeicons/react"; +import { ShortcutsDialog } from "./dialogs/shortcuts-dialog"; export function EditorHeader() { - const { activeProject, renameProject, deleteProject } = useProjectStore(); - const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false); - const [isRenameDialogOpen, setIsRenameDialogOpen] = useState(false); - const router = useRouter(); + return ( +
+
+ +
+ +
+ ); +} + +function ProjectDropdown() { + const [openDialog, setOpenDialog] = useState< + "delete" | "rename" | "shortcuts" | null + >(null); + const [isExiting, setIsExiting] = useState(false); + const router = useRouter(); + const editor = useEditor(); + const activeProject = editor.project.getActive(); - const handleNameSave = async (newName: string) => { - console.log("handleNameSave", newName); - if (activeProject && newName.trim() && newName !== activeProject.name) { - try { - await renameProject(activeProject.id, newName.trim()); - setIsRenameDialogOpen(false); - } catch (error) { - console.error("Failed to rename project:", error); - } - } - }; + const handleExit = async () => { + if (isExiting) return; + setIsExiting(true); - const handleDelete = () => { - if (activeProject) { - deleteProject(activeProject.id); - setIsDeleteDialogOpen(false); - router.push("/projects"); - } - }; + try { + await editor.project.prepareExit(); + editor.project.closeProject(); + } catch (error) { + console.error("Failed to prepare project exit:", error); + } finally { + editor.project.closeProject(); + router.push("/projects"); + } + }; - const leftContent = ( -
- - - - - - - - - Projects - - - setIsRenameDialogOpen(true)} - > - - Rename project - - setIsDeleteDialogOpen(true)} - > - - Delete Project - - - - - - Discord - - - - - - -
- ); + const handleSaveProjectName = async (newName: string) => { + if ( + activeProject && + newName.trim() && + newName !== activeProject.metadata.name + ) { + try { + await editor.project.renameProject({ + id: activeProject.metadata.id, + name: newName.trim(), + }); + } catch (error) { + toast.error("Failed to rename project", { + description: + error instanceof Error ? error.message : "Please try again", + }); + } finally { + setOpenDialog(null); + } + } + }; - const rightContent = ( - - ); + const handleDeleteProject = async () => { + if (activeProject) { + try { + await editor.project.deleteProjects({ + ids: [activeProject.metadata.id], + }); + router.push("/projects"); + } catch (error) { + toast.error("Failed to delete project", { + description: + error instanceof Error ? error.message : "Please try again", + }); + } finally { + setOpenDialog(null); + } + } + }; - return ( - - ); + return ( + <> + + + + + + + + Exit project + + setOpenDialog("rename")} + > + + Rename project + + setOpenDialog("delete")} + > + + Delete project + + + setOpenDialog("shortcuts")} + > + + Keyboard shortcuts + + + + + Discord + + + + + setOpenDialog(isOpen ? "rename" : null)} + onConfirm={(newName) => handleSaveProjectName(newName)} + projectName={activeProject?.metadata.name || ""} + /> + setOpenDialog(isOpen ? "delete" : null)} + onConfirm={handleDeleteProject} + projectNames={[activeProject?.metadata.name || ""]} + /> + setOpenDialog(isOpen ? "shortcuts" : null)} + /> + + ); } -- cgit v1.3.1