@gmickel/gno 0.34.1 → 0.35.0

package/src/serve/public/components/editor/MarkdownPreview.tsx

@@ -18,6 +18,7 @@ import {
   parseTargetParts,
   stripWikiMdExt,
 } from "../../../../core/links";
+import { slugifySectionTitle } from "../../../../core/sections";
 import {
   extractMarkdownCodeLanguage,
   resolveCodeLanguage,
@@ -126,9 +127,34 @@ const Link: FC<ComponentProps<"a"> & { node?: unknown }> = ({
   );
 };
 
+function flattenNodeText(node: ReactNode): string {
+  if (typeof node === "string" || typeof node === "number") {
+    return String(node);
+  }
+  if (!node || typeof node === "boolean") {
+    return "";
+  }
+  if (Array.isArray(node)) {
+    return node.map((child) => flattenNodeText(child)).join("");
+  }
+  if (
+    typeof node === "object" &&
+    "props" in node &&
+    node.props &&
+    typeof node.props === "object" &&
+    "children" in node.props
+  ) {
+    return flattenNodeText(node.props.children as ReactNode);
+  }
+  return "";
+}
+
 // Heading styles with proper hierarchy
 const createHeading =
-  (level: 1 | 2 | 3 | 4 | 5 | 6): FC<{ children?: ReactNode }> =>
+  (
+    level: 1 | 2 | 3 | 4 | 5 | 6,
+    anchorCounts: Map<string, number>
+  ): FC<{ children?: ReactNode }> =>
   ({ children }) => {
     const Tag = `h${level}` as const;
     const sizes = {
@@ -139,8 +165,15 @@ const createHeading =
       5: "text-base mt-3 mb-1 font-semibold",
       6: "text-sm mt-3 mb-1 font-semibold text-muted-foreground",
     };
+    const baseAnchor = slugifySectionTitle(flattenNodeText(children));
+    const seen = (anchorCounts.get(baseAnchor) ?? 0) + 1;
+    anchorCounts.set(baseAnchor, seen);
+    const anchor = seen === 1 ? baseAnchor : `${baseAnchor}-${seen}`;
     return (
-      <Tag className={cn("font-serif tracking-tight", sizes[level])}>
+      <Tag
+        className={cn("scroll-mt-24 font-serif tracking-tight", sizes[level])}
+        id={anchor}
+      >
         {children}
       </Tag>
     );
@@ -343,30 +376,6 @@ const Image: FC<ComponentProps<"img"> & { node?: unknown }> = ({
   />
 );
 
-// Component mapping for react-markdown
-const components = {
-  h1: createHeading(1),
-  h2: createHeading(2),
-  h3: createHeading(3),
-  h4: createHeading(4),
-  h5: createHeading(5),
-  h6: createHeading(6),
-  p: Paragraph,
-  a: Link,
-  code: InlineCode,
-  pre: Pre,
-  blockquote: Blockquote,
-  ul: UnorderedList,
-  ol: OrderedList,
-  table: Table,
-  thead: TableHead,
-  tr: TableRow,
-  td: TableCell,
-  th: TableHeaderCell,
-  hr: Hr,
-  img: Image,
-};
-
 /**
  * Renders markdown content with syntax highlighting and proper styling.
  * Sanitizes HTML to prevent XSS attacks.
@@ -386,6 +395,29 @@ export const MarkdownPreview = memo(
       collection,
       wikiLinks
     );
+    const anchorCounts = new Map<string, number>();
+    const components = {
+      h1: createHeading(1, anchorCounts),
+      h2: createHeading(2, anchorCounts),
+      h3: createHeading(3, anchorCounts),
+      h4: createHeading(4, anchorCounts),
+      h5: createHeading(5, anchorCounts),
+      h6: createHeading(6, anchorCounts),
+      p: Paragraph,
+      a: Link,
+      code: InlineCode,
+      pre: Pre,
+      blockquote: Blockquote,
+      ul: UnorderedList,
+      ol: OrderedList,
+      table: Table,
+      thead: TableHead,
+      tr: TableRow,
+      td: TableCell,
+      th: TableHeaderCell,
+      hr: Hr,
+      img: Image,
+    };
 
     return (
       <div

package/src/serve/public/hooks/useCaptureModal.tsx

@@ -19,9 +19,16 @@ import {
 import { CaptureModal } from "../components/CaptureModal";
 import { useKeyboardShortcuts } from "./useKeyboardShortcuts";
 
+export interface CaptureModalOpenOptions {
+  draftTitle?: string;
+  defaultCollection?: string;
+  defaultFolderPath?: string;
+  presetId?: string;
+}
+
 interface CaptureModalContextValue {
   /** Open the capture modal */
-  openCapture: (draftTitle?: string) => void;
+  openCapture: (options?: string | CaptureModalOpenOptions) => void;
   /** Whether the modal is open */
   isOpen: boolean;
 }
@@ -42,11 +49,27 @@ export function CaptureModalProvider({
 }: CaptureModalProviderProps) {
   const [open, setOpen] = useState(false);
   const [draftTitle, setDraftTitle] = useState("");
+  const [defaultCollection, setDefaultCollection] = useState("");
+  const [defaultFolderPath, setDefaultFolderPath] = useState("");
+  const [presetId, setPresetId] = useState("");
 
-  const openCapture = useCallback((nextDraftTitle?: string) => {
-    setDraftTitle(nextDraftTitle ?? "");
-    setOpen(true);
-  }, []);
+  const openCapture = useCallback(
+    (options?: string | CaptureModalOpenOptions) => {
+      if (typeof options === "string") {
+        setDraftTitle(options);
+        setDefaultCollection("");
+        setDefaultFolderPath("");
+        setPresetId("");
+      } else {
+        setDraftTitle(options?.draftTitle ?? "");
+        setDefaultCollection(options?.defaultCollection ?? "");
+        setDefaultFolderPath(options?.defaultFolderPath ?? "");
+        setPresetId(options?.presetId ?? "");
+      }
+      setOpen(true);
+    },
+    []
+  );
 
   // 'n' global shortcut (single-key, skips when in text input)
   const shortcuts = useMemo(
@@ -73,10 +96,13 @@ export function CaptureModalProvider({
     <CaptureModalContext.Provider value={value}>
       {children}
       <CaptureModal
+        defaultCollection={defaultCollection}
+        defaultFolderPath={defaultFolderPath}
         draftTitle={draftTitle}
         onOpenChange={setOpen}
         onSuccess={onSuccess}
         open={open}
+        presetId={presetId}
       />
     </CaptureModalContext.Provider>
   );

package/src/serve/public/lib/workspace-actions.ts

@@ -0,0 +1,226 @@
+import { parseBrowseLocation } from "./browse";
+import { emitWorkspaceActionRequest } from "./workspace-events";
+
+export type WorkspaceActionId =
+  | "new-note"
+  | "new-note-in-context"
+  | "create-folder-here"
+  | "rename-current-note"
+  | "move-current-note"
+  | "duplicate-current-note"
+  | "go-home"
+  | "go-search"
+  | "go-browse"
+  | "go-ask"
+  | "go-graph"
+  | "go-collections"
+  | "go-connectors";
+
+export interface WorkspaceAction {
+  id: WorkspaceActionId;
+  group: "Create" | "Go To";
+  label: string;
+  description?: string;
+  keywords: string[];
+  available: boolean;
+}
+
+export interface WorkspaceActionContext {
+  location: string;
+}
+
+export interface WorkspaceActionHandlers {
+  navigate: (to: string) => void;
+  openCapture: (options?: {
+    draftTitle?: string;
+    defaultCollection?: string;
+    defaultFolderPath?: string;
+    presetId?: string;
+  }) => void;
+  closePalette: () => void;
+}
+
+export function getWorkspaceActions(
+  context: WorkspaceActionContext
+): WorkspaceAction[] {
+  const selection = parseBrowseLocation(
+    context.location.includes("?")
+      ? `?${context.location.split("?")[1] ?? ""}`
+      : ""
+  );
+  const hasBrowseContext = Boolean(selection.collection);
+  const isDocView = context.location.startsWith("/doc?");
+
+  return [
+    {
+      id: "new-note",
+      group: "Create",
+      label: "New note",
+      description: "Open note capture",
+      keywords: ["new", "note", "capture", "create"],
+      available: true,
+    },
+    {
+      id: "new-note-in-context",
+      group: "Create",
+      label: "New note in current location",
+      description: hasBrowseContext
+        ? `Create in ${selection.collection}${
+            selection.path ? ` / ${selection.path}` : ""
+          }`
+        : "Requires a selected collection in Browse",
+      keywords: ["new", "note", "folder", "browse", "collection", "create"],
+      available: hasBrowseContext,
+    },
+    {
+      id: "create-folder-here",
+      group: "Create",
+      label: "Create folder here",
+      description: hasBrowseContext
+        ? "Create a folder in the current Browse location"
+        : "Requires a selected collection in Browse",
+      keywords: ["folder", "browse", "create", "directory"],
+      available: hasBrowseContext,
+    },
+    {
+      id: "rename-current-note",
+      group: "Create",
+      label: "Rename current note",
+      description: "Open rename dialog for the active note",
+      keywords: ["rename", "current", "note", "document"],
+      available: isDocView,
+    },
+    {
+      id: "move-current-note",
+      group: "Create",
+      label: "Move current note",
+      description: "Open move dialog for the active note",
+      keywords: ["move", "current", "note", "document"],
+      available: isDocView,
+    },
+    {
+      id: "duplicate-current-note",
+      group: "Create",
+      label: "Duplicate current note",
+      description: "Open duplicate dialog for the active note",
+      keywords: ["duplicate", "copy", "current", "note", "document"],
+      available: isDocView,
+    },
+    {
+      id: "go-home",
+      group: "Go To",
+      label: "Home",
+      keywords: ["home", "dashboard"],
+      available: true,
+    },
+    {
+      id: "go-search",
+      group: "Go To",
+      label: "Search",
+      keywords: ["search", "find", "query"],
+      available: true,
+    },
+    {
+      id: "go-browse",
+      group: "Go To",
+      label: "Browse",
+      keywords: ["browse", "tree", "folders"],
+      available: true,
+    },
+    {
+      id: "go-ask",
+      group: "Go To",
+      label: "Ask",
+      keywords: ["ask", "answer", "rag"],
+      available: true,
+    },
+    {
+      id: "go-graph",
+      group: "Go To",
+      label: "Graph",
+      keywords: ["graph", "links", "relationships"],
+      available: true,
+    },
+    {
+      id: "go-collections",
+      group: "Go To",
+      label: "Collections",
+      keywords: ["collections", "sources", "folders"],
+      available: true,
+    },
+    {
+      id: "go-connectors",
+      group: "Go To",
+      label: "Connectors",
+      keywords: ["connectors", "mcp", "skills", "agents"],
+      available: true,
+    },
+  ];
+}
+
+export function runWorkspaceAction(
+  action: WorkspaceAction,
+  context: WorkspaceActionContext,
+  handlers: WorkspaceActionHandlers,
+  query?: string
+): void {
+  const selection = parseBrowseLocation(
+    context.location.includes("?")
+      ? `?${context.location.split("?")[1] ?? ""}`
+      : ""
+  );
+
+  switch (action.id) {
+    case "new-note":
+      handlers.openCapture({ draftTitle: query?.trim() || undefined });
+      handlers.closePalette();
+      return;
+    case "new-note-in-context":
+      handlers.openCapture({
+        draftTitle: query?.trim() || undefined,
+        defaultCollection: selection.collection || undefined,
+        defaultFolderPath: selection.path || undefined,
+      });
+      handlers.closePalette();
+      return;
+    case "create-folder-here":
+      emitWorkspaceActionRequest("create-folder-here");
+      handlers.closePalette();
+      return;
+    case "rename-current-note":
+      emitWorkspaceActionRequest("rename-current-note");
+      handlers.closePalette();
+      return;
+    case "move-current-note":
+      emitWorkspaceActionRequest("move-current-note");
+      handlers.closePalette();
+      return;
+    case "duplicate-current-note":
+      emitWorkspaceActionRequest("duplicate-current-note");
+      handlers.closePalette();
+      return;
+    case "go-home":
+      handlers.navigate("/");
+      break;
+    case "go-search":
+      handlers.navigate("/search");
+      break;
+    case "go-browse":
+      handlers.navigate("/browse");
+      break;
+    case "go-ask":
+      handlers.navigate("/ask");
+      break;
+    case "go-graph":
+      handlers.navigate("/graph");
+      break;
+    case "go-collections":
+      handlers.navigate("/collections");
+      break;
+    case "go-connectors":
+      handlers.navigate("/connectors");
+      break;
+  }
+
+  handlers.closePalette();
+}

package/src/serve/public/lib/workspace-events.ts

@@ -0,0 +1,39 @@
+export type WorkspaceActionRequestType =
+  | "create-folder-here"
+  | "rename-current-note"
+  | "move-current-note"
+  | "duplicate-current-note";
+
+const WORKSPACE_ACTION_EVENT = "gno:workspace-action";
+
+export function emitWorkspaceActionRequest(
+  type: WorkspaceActionRequestType
+): void {
+  window.dispatchEvent(
+    new CustomEvent(WORKSPACE_ACTION_EVENT, {
+      detail: { type },
+    })
+  );
+}
+
+export function subscribeWorkspaceActionRequest(
+  type: WorkspaceActionRequestType,
+  handler: () => void
+): () => void {
+  const listener = (event: Event) => {
+    if (!(event instanceof CustomEvent)) {
+      return;
+    }
+    if (
+      typeof event.detail === "object" &&
+      event.detail &&
+      "type" in event.detail &&
+      event.detail.type === type
+    ) {
+      handler();
+    }
+  };
+
+  window.addEventListener(WORKSPACE_ACTION_EVENT, listener);
+  return () => window.removeEventListener(WORKSPACE_ACTION_EVENT, listener);
+}

package/src/serve/public/pages/Browse.tsx

@@ -1,7 +1,9 @@
 import {
   ArrowLeft,
+  FilePlus2,
   FolderOpen,
   HomeIcon,
+  FolderPlus,
   RefreshCw,
   StarIcon,
 } from "lucide-react";
@@ -26,6 +28,7 @@ import {
   DialogHeader,
   DialogTitle,
 } from "../components/ui/dialog";
+import { Input } from "../components/ui/input";
 import {
   Select,
   SelectContent,
@@ -35,6 +38,7 @@ import {
 } from "../components/ui/select";
 import { apiFetch } from "../hooks/use-api";
 import { useDocEvents } from "../hooks/use-doc-events";
+import { useCaptureModal } from "../hooks/useCaptureModal";
 import { useWorkspace } from "../hooks/useWorkspace";
 import {
   buildBrowseCrumbs,
@@ -51,6 +55,7 @@ import {
   toggleFavoriteCollection,
   toggleFavoriteDocument,
 } from "../lib/navigation-state";
+import { subscribeWorkspaceActionRequest } from "../lib/workspace-events";
 
 interface PageProps {
   navigate: (to: string | number) => void;
@@ -61,10 +66,18 @@ interface SyncResponse {
   jobId: string;
 }
 
+interface CreateFolderResponse {
+  success: boolean;
+  collection: string;
+  folderPath: string;
+  path: string;
+}
+
 type SyncTarget = { kind: "all" } | { kind: "collection"; name: string } | null;
 
 export default function Browse({ navigate, location }: PageProps) {
   const { activeTab, updateActiveTabBrowseState } = useWorkspace();
+  const { openCapture } = useCaptureModal();
   const latestDocEvent = useDocEvents();
   const resolvedLocation =
     location ?? `${window.location.pathname}${window.location.search}`;
@@ -93,6 +106,12 @@ export default function Browse({ navigate, location }: PageProps) {
   const [favoriteDocHrefs, setFavoriteDocHrefs] = useState<string[]>([]);
   const [favoriteCollections, setFavoriteCollections] = useState<string[]>([]);
   const [mobileTreeOpen, setMobileTreeOpen] = useState(false);
+  const [createFolderOpen, setCreateFolderOpen] = useState(false);
+  const [createFolderName, setCreateFolderName] = useState("");
+  const [createFolderError, setCreateFolderError] = useState<string | null>(
+    null
+  );
+  const [creatingFolder, setCreatingFolder] = useState(false);
   const limit = 25;
 
   const selectedCollection = selection.collection;
@@ -100,9 +119,28 @@ export default function Browse({ navigate, location }: PageProps) {
   const selectedNodeId = selectedCollection
     ? createBrowseNodeId(selectedCollection, selectedPath)
     : null;
-  const selectedNode = tree
+  const resolvedSelectedNode = tree
     ? findBrowseNode(tree.collections, selectedCollection, selectedPath)
     : null;
+  const selectedNode =
+    resolvedSelectedNode ??
+    (selectedCollection
+      ? {
+          id:
+            selectedNodeId ??
+            createBrowseNodeId(selectedCollection, selectedPath),
+          kind: selectedPath ? "folder" : "collection",
+          collection: selectedCollection,
+          path: selectedPath,
+          name: selectedPath.split("/").at(-1) ?? selectedCollection,
+          depth: selectedPath
+            ? selectedPath.split("/").filter(Boolean).length
+            : 0,
+          documentCount: docs.length,
+          directDocumentCount: docs.length,
+          children: [],
+        }
+      : null);
 
   const expandedNodeIds = useMemo(() => {
     const persisted = activeTab?.browseState?.expandedNodeIds ?? [];
@@ -176,13 +214,14 @@ export default function Browse({ navigate, location }: PageProps) {
     if (node) {
       return;
     }
-
+    if (selectedPath) {
+      return;
+    }
     const collectionRoot = findBrowseNode(tree.collections, selectedCollection);
     if (collectionRoot) {
       navigate(buildBrowseLocation(selectedCollection));
       return;
     }
-
     navigate("/browse");
   }, [navigate, selectedCollection, selectedPath, tree]);
 
@@ -241,6 +280,16 @@ export default function Browse({ navigate, location }: PageProps) {
     setRefreshToken((current) => current + 1);
   }, [latestDocEvent?.changedAt]);
 
+  useEffect(() => {
+    return subscribeWorkspaceActionRequest("create-folder-here", () => {
+      if (!selectedCollection) {
+        return;
+      }
+      setCreateFolderError(null);
+      setCreateFolderOpen(true);
+    });
+  }, [selectedCollection]);
+
   useEffect(() => {
     const persisted = activeTab?.browseState?.expandedNodeIds ?? [];
     const ancestors = selectedPath
@@ -328,6 +377,38 @@ export default function Browse({ navigate, location }: PageProps) {
     }
   };
 
+  const handleCreateFolder = async () => {
+    if (!selectedCollection || !createFolderName.trim()) {
+      return;
+    }
+
+    setCreatingFolder(true);
+    setCreateFolderError(null);
+    const { data, error } = await apiFetch<CreateFolderResponse>(
+      "/api/folders",
+      {
+        method: "POST",
+        body: JSON.stringify({
+          collection: selectedCollection,
+          parentPath: selectedPath || undefined,
+          name: createFolderName.trim(),
+        }),
+      }
+    );
+    setCreatingFolder(false);
+
+    if (error) {
+      setCreateFolderError(error);
+      return;
+    }
+    if (data?.folderPath) {
+      setCreateFolderOpen(false);
+      setCreateFolderName("");
+      navigate(buildBrowseLocation(selectedCollection, data.folderPath));
+      setRefreshToken((current) => current + 1);
+    }
+  };
+
   const renderSidebar = () => (
     <BrowseTreeSidebar
       collections={tree?.collections ?? []}
@@ -412,6 +493,37 @@ export default function Browse({ navigate, location }: PageProps) {
               <FolderOpen className="size-4" />
               Collections
             </Button>
+            {selectedCollection && (
+              <Button
+                className="gap-2"
+                onClick={() =>
+                  openCapture({
+                    defaultCollection: selectedCollection,
+                    defaultFolderPath: selectedPath || undefined,
+                    draftTitle: "",
+                  })
+                }
+                size="sm"
+                variant="outline"
+              >
+                <FilePlus2 className="size-4" />
+                New Note
+              </Button>
+            )}
+            {selectedCollection && (
+              <Button
+                className="gap-2"
+                onClick={() => {
+                  setCreateFolderOpen(true);
+                  setCreateFolderError(null);
+                }}
+                size="sm"
+                variant="outline"
+              >
+                <FolderPlus className="size-4" />
+                New Folder
+              </Button>
+            )}
             {selectedCollection && (
               <Button
                 className="gap-2"
@@ -542,6 +654,45 @@ export default function Browse({ navigate, location }: PageProps) {
           </div>
         </DialogContent>
       </Dialog>
+
+      <Dialog onOpenChange={setCreateFolderOpen} open={createFolderOpen}>
+        <DialogContent className="max-w-md">
+          <DialogHeader>
+            <DialogTitle>Create folder</DialogTitle>
+          </DialogHeader>
+          <div className="space-y-3">
+            <Input
+              autoFocus
+              onChange={(event) => setCreateFolderName(event.target.value)}
+              placeholder="research"
+              value={createFolderName}
+            />
+            {selectedCollection && (
+              <p className="font-mono text-xs text-muted-foreground">
+                {selectedCollection}
+                {selectedPath ? ` / ${selectedPath}` : ""}
+              </p>
+            )}
+            {createFolderError && (
+              <p className="text-destructive text-sm">{createFolderError}</p>
+            )}
+            <div className="flex justify-end gap-2">
+              <Button
+                onClick={() => setCreateFolderOpen(false)}
+                variant="outline"
+              >
+                Cancel
+              </Button>
+              <Button
+                disabled={!createFolderName.trim() || creatingFolder}
+                onClick={() => void handleCreateFolder()}
+              >
+                {creatingFolder ? "Creating..." : "Create Folder"}
+              </Button>
+            </div>
+          </div>
+        </DialogContent>
+      </Dialog>
     </div>
   );
 }