diff --git a/src/home/sections/ProjectCard.tsx b/src/home/sections/ProjectCard.tsx index 055fdaf..40b2903 100644 --- a/src/home/sections/ProjectCard.tsx +++ b/src/home/sections/ProjectCard.tsx @@ -19,6 +19,7 @@ export function ProjectCard({ project, index = 0 }: Props) { const onContext = (e: React.MouseEvent) => { e.preventDefault(); + e.stopPropagation(); setMenu({ x: e.clientX, y: e.clientY }); }; diff --git a/src/home/sections/RecentProjectsSection.tsx b/src/home/sections/RecentProjectsSection.tsx index 9b89e84..c77697b 100644 --- a/src/home/sections/RecentProjectsSection.tsx +++ b/src/home/sections/RecentProjectsSection.tsx @@ -1,4 +1,9 @@ +import { useState } from "react"; + +import { ContextMenu } from "../../ide/tree/ContextMenu"; import { useProjectStore } from "../../projects/projectStore"; +import { useProjectModalStore } from "../../projects/ui/modalStore"; +import { usePaletteStore } from "../../palette/paletteStore"; import { IconSparkle } from "../icons"; import { EmptyState } from "./EmptyState"; import { ProjectCard } from "./ProjectCard"; @@ -6,9 +11,17 @@ import { ProjectCard } from "./ProjectCard"; export function RecentProjectsSection() { const rawProjects = useProjectStore((s) => s.projects); const projects = [...rawProjects].sort((a, b) => b.lastOpenedAt - a.lastOpenedAt); + const openCreate = useProjectModalStore((s) => s.openCreate); + const openPalette = usePaletteStore((s) => s.openPalette); + const [menu, setMenu] = useState<{ x: number; y: number } | null>(null); + + const onSectionContext = (e: React.MouseEvent) => { + e.preventDefault(); + setMenu({ x: e.clientX, y: e.clientY }); + }; return ( -
+

Projets récents

{projects.length > 0 && {projects.length}} @@ -26,6 +39,23 @@ export function RecentProjectsSection() { subtitle="La liste de tes projets récents arrivera avec le système de projets." /> )} + {menu && ( + setMenu(null)} + items={[ + { + label: "Nouveau projet", + onSelect: () => openCreate({ templateId: "html-css" }), + }, + { + label: "Rechercher…", + onSelect: () => openPalette(), + }, + ]} + /> + )}
); } diff --git a/src/main.tsx b/src/main.tsx index 6efac82..f3ecc9d 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -11,6 +11,10 @@ import { bootstrapIdeStore } from "./state/ideStore"; import { attachVfsBridge } from "./tauri/bridge"; import { vfs } from "./vfs/VirtualFS"; +// Block the Chromium/WebView native context menu everywhere. Individual React +// components provide their own right-click menus where it makes sense. +document.addEventListener("contextmenu", (e) => e.preventDefault()); + async function bootstrap() { const disposers: Array<() => void> = [];