feat(home): block native context menu and add right-click on recent projects

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 });
   };
 

src/home/sections/RecentProjectsSection.tsx

@@ -1,14 +1,27 @@
+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";
 
 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 (
-    <section className="home-section">
+    <section className="home-section" onContextMenu={onSectionContext}>
       <div className="home-sec-head">
         <h3>Projets récents</h3>
         {projects.length > 0 && <span className="home-sec-count">{projects.length}</span>}
@@ -26,6 +39,23 @@ export function RecentProjectsSection() {
           subtitle="La liste de tes projets récents arrivera avec le système de projets."
         />
       )}
+      {menu && (
+        <ContextMenu
+          x={menu.x}
+          y={menu.y}
+          onClose={() => setMenu(null)}
+          items={[
+            {
+              label: "Nouveau projet",
+              onSelect: () => openCreate({ templateId: "html-css" }),
+            },
+            {
+              label: "Rechercher…",
+              onSelect: () => openPalette(),
+            },
+          ]}
+        />
+      )}
     </section>
   );
 }

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> = [];