Add desktop multi-window support (#6463)

frontend/editor/src/core/components/filesPage/FileGrid.tsx

@@ -32,6 +32,7 @@ import { findFolderIcon } from "@app/components/filesPage/folderIcons";
 import { FolderAppearancePicker } from "@app/components/filesPage/FolderAppearancePicker";
 import { useLazyThumbnail } from "@app/hooks/useLazyThumbnail";
 import type { FilesPageSortMode } from "@app/contexts/FilesPageContext";
+import { OpenInNewWindowMenuItem } from "@app/components/filesPage/OpenInNewWindowMenuItem";
 
 export type FilesPageViewMode = "grid" | "list";
 
@@ -758,6 +759,7 @@ function FileCard({
             >
               {t("filesPage.quickView", "Quick view")}
             </Menu.Item>
+            <OpenInNewWindowMenuItem file={file} />
             <Menu.Item
               leftSection={<DriveFileMoveIcon fontSize="small" />}
               onClick={(e) => {
@@ -1324,6 +1326,7 @@ function FileRow({
           >
             {t("filesPage.quickView", "Quick view")}
           </Menu.Item>
+          <OpenInNewWindowMenuItem file={file} />
           <Menu.Item
             leftSection={<DriveFileMoveIcon fontSize="small" />}
             onClick={(e) => {

frontend/editor/src/core/components/filesPage/OpenInNewWindowMenuItem.tsx

@@ -0,0 +1,35 @@
+import { Menu } from "@mantine/core";
+import OpenInNewIcon from "@mui/icons-material/OpenInNew";
+import { useTranslation } from "react-i18next";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { useOpenInNewWindow } from "@app/extensions/openInNewWindow";
+
+interface OpenInNewWindowMenuItemProps {
+  file: StirlingFileStub;
+}
+
+/**
+ * Kebab menu item that opens a stored file in a separate window. Desktop-only:
+ * the underlying extension is a no-op on web, so this renders nothing there
+ * (and for any file that can't be opened in a new window).
+ */
+export function OpenInNewWindowMenuItem({
+  file,
+}: OpenInNewWindowMenuItemProps) {
+  const { t } = useTranslation();
+  const { canOpenInNewWindow, openInNewWindow } = useOpenInNewWindow();
+
+  if (!canOpenInNewWindow(file)) return null;
+
+  return (
+    <Menu.Item
+      leftSection={<OpenInNewIcon fontSize="small" />}
+      onClick={(e) => {
+        e.stopPropagation();
+        openInNewWindow(file);
+      }}
+    >
+      {t("openInNewWindow", "Open in new window")}
+    </Menu.Item>
+  );
+}

frontend/editor/src/core/extensions/openInNewWindow.ts

@@ -0,0 +1,20 @@
+import { StirlingFileStub } from "@app/types/fileContext";
+
+export interface OpenInNewWindowApi {
+  /** Whether this file can be opened in a separate window. */
+  canOpenInNewWindow: (file: StirlingFileStub) => boolean;
+  /** Open the file in a separate window. */
+  openInNewWindow: (file: StirlingFileStub) => void;
+}
+
+/**
+ * Core (web) build: multiple windows aren't a thing in the browser, so this is
+ * a no-op. The desktop build overrides this file via path resolution to spawn
+ * a real Tauri window.
+ */
+export function useOpenInNewWindow(): OpenInNewWindowApi {
+  return {
+    canOpenInNewWindow: () => false,
+    openInNewWindow: () => {},
+  };
+}