feat: add built-in file viewer and Monaco editor to registry

feat: add F2 keybinding for saving in the editor

Author: aesopov

packages/ui/lib/features/commands/registerKeybindings.ts

@@ -115,6 +115,7 @@ const appBuiltInKeybindings: Keybinding[] = [
   // Close viewer/editor commands
   { command: CLOSE_VIEWER, key: "escape", when: "focusViewer" },
   { command: CLOSE_EDITOR, key: "escape", when: "focusEditor" },
+  { command: DOTDIR_EDITOR_SAVE, key: "f2", when: "focusEditor" },
   { command: DOTDIR_EDITOR_SAVE, key: "ctrl+s", mac: "cmd+s", when: "focusEditor" },
   { command: CURSOR_UP, key: "up", when: "focusEditor" },
   { command: CURSOR_DOWN, key: "down", when: "focusEditor" },

packages/ui/lib/features/extensions/builtins/MonacoEditorSurface.tsx

@@ -217,6 +217,7 @@ function createMonacoEditorExtensionApi(hostApi: DotDirGlobalApi, runtime?: Mona
   let unmountFn: (() => void) | null = null;
   const grammarJsonCache = new Map<string, object | null>();
   const activatedTokenProviders = new Set<string>();
+  const reservedDotdirEditorKeys = new Set(["f1", "ctrl+f1", "cmd+f1", "f2", "ctrl+s", "cmd+s"]);
 
   function publishEditorCommands(editor: Monaco.editor.IStandaloneCodeEditor | null): void {
     if (!runtime?.onCommandContributionsChange) return;
@@ -236,18 +237,22 @@ function createMonacoEditorExtensionApi(hostApi: DotDirGlobalApi, runtime?: Mona
         action.id === MONACO_QUICK_COMMAND_ACTION
           ? undefined
           : toDotdirMonacoKeybinding(keybindingService?.lookupKeybinding(action.id));
+      const sanitizedKeybinding =
+        keybinding && !reservedDotdirEditorKeys.has(keybinding.key) && !(keybinding.mac && reservedDotdirEditorKeys.has(keybinding.mac))
+          ? keybinding
+          : undefined;
       const displaySignature = [
         title.toLowerCase(),
-        keybinding?.key ?? "",
-        keybinding?.mac ?? "",
+        sanitizedKeybinding?.key ?? "",
+        sanitizedKeybinding?.mac ?? "",
       ].join("\u0000");
       if (seenDisplaySignatures.has(displaySignature)) continue;
       seenDisplaySignatures.add(displaySignature);
       commands.push({
         command: action.id,
         title,
         palette: action.id !== MONACO_QUICK_COMMAND_ACTION,
-        keybinding,
+        keybinding: sanitizedKeybinding,
       });
     }
 

packages/ui/lib/viewerEditorRegistry.ts

@@ -17,6 +17,24 @@ import {
 } from "@/features/extensions/types";
 import { createContext, createElement, useContext, useRef, useSyncExternalStore, type ReactNode } from "react";
 
+const BUILTIN_EXTENSION_DIR_PATH = "__dotdir_builtin__";
+
+const BUILTIN_FILE_VIEWER: ExtensionViewerContribution = {
+  id: "file-viewer",
+  label: "File Viewer",
+  patterns: ["*"],
+  entry: "builtins/file-viewer",
+  priority: -10_000,
+};
+
+const BUILTIN_MONACO_EDITOR: ExtensionEditorContribution = {
+  id: "monaco",
+  label: "Monaco Editor",
+  patterns: ["*"],
+  entry: "builtins/monaco",
+  priority: -10_000,
+};
+
 export interface ResolvedViewer {
   contribution: ExtensionViewerContribution;
   extensionDirPath: string;
@@ -152,6 +170,10 @@ export class ViewerEditorRegistryManager {
   private version = 0;
   private listeners = new Set<RegistryListener>();
 
+  constructor() {
+    this.registerBuiltIns();
+  }
+
   subscribe(listener: RegistryListener): () => void {
     this.listeners.add(listener);
     return () => {
@@ -163,10 +185,16 @@ export class ViewerEditorRegistryManager {
     return this.version;
   }
 
+  private registerBuiltIns(): void {
+    this.viewerRegistry.register(BUILTIN_FILE_VIEWER, BUILTIN_EXTENSION_DIR_PATH);
+    this.editorRegistry.register(BUILTIN_MONACO_EDITOR, BUILTIN_EXTENSION_DIR_PATH);
+  }
+
   replaceExtensions(extensions: LoadedExtension[]): void {
     this.viewerRegistry.clear();
     this.editorRegistry.clear();
     this.fsProviderRegistry.clear();
+    this.registerBuiltIns();
 
     for (const ext of extensions) {
       for (const viewer of extensionViewers(ext)) {