@backmatter/studio 0.0.12 → 0.0.14

package/src/chrome/ContentExplorerSidebar.tsx

@@ -3,7 +3,13 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 import { Link, useLocation, useNavigate, useSearchParams } from "react-router";
 import * as stylex from "@stylexjs/stylex";
-import { notifyTreeChanged, saveDoc, type DocListItem, type DocStatus } from "../api";
+import {
+  notifyTreeChanged,
+  saveDoc,
+  type DocListItem,
+  type DocStatus,
+  type TreeChangeDetail,
+} from "../api";
 import { useReplicaRevision, useReplicaState } from "../replica/useReplica";
 import { colors, radius, space, type } from "../styles/tokens.stylex";
 import { Tooltip } from "../ui/Tooltip";
@@ -121,10 +127,7 @@ function ContentExplorerSidebar({
     return map;
   }, [replica, replicaRevision, workspace.workspaceId]);
 
-  const route = useMemo(
-    () => parseContentRoute(location.pathname, searchParams.get("locale") ?? ""),
-    [location.pathname, searchParams],
-  );
+  const route = useMemo(() => parseContentRoute(location.pathname), [location.pathname]);
   const git = replica.git(workspace.workspaceId);
   const pendingCount =
     git?.changes.filter((c) => c.status !== "deleted").length ?? 0;
@@ -162,6 +165,28 @@ function ContentExplorerSidebar({
     });
   }, [workspace, route, models, docsByType]);
 
+  useEffect(() => {
+    function onTree(event: Event) {
+      const detail = (event as CustomEvent<TreeChangeDetail>).detail;
+      if (!detail?.type || !detail.slug || detail.remove) return;
+      if (
+        detail.workspaceId &&
+        detail.workspaceId !== workspace.workspaceId &&
+        detail.workspaceId !== workspace.workspaceSlug
+      ) {
+        return;
+      }
+      const model = models.find((item) => item.type === detail.type);
+      if (!model) return;
+      const repoPath = docRepoPath(model, { slug: detail.slug });
+      const parents = folderKeysOnPathTo(treePathFromRepo(repoPath));
+      const folder = parents[parents.length - 1];
+      if (folder) expandFolderPath(folder);
+    }
+    window.addEventListener("backmatter:tree-changed", onTree);
+    return () => window.removeEventListener("backmatter:tree-changed", onTree);
+  }, [models, workspace, expandFolderPath]);
+
   const empty = workspace.contentTypes.length === 0;
   const settingsActive = isWorkspaceSettingsPath(location.pathname);
   const treeOpen = useContentTreeOpen();
@@ -374,31 +399,21 @@ function ExplorerSection({
     const leaves: PathTreeFile[] = [];
     for (const model of models) {
       for (const doc of docsByType.get(model.type) ?? []) {
-        const repoPath = docRepoPath(model, doc, workspace.defaultLocale);
+        if (doc.status === "deleted") continue;
+        const repoPath = docRepoPath(model, doc);
         const treePath = treePathFromRepo(repoPath);
         leaves.push({
           kind: "file",
           name: treePath.split("/").pop() ?? treePath,
           repoPath: treePath,
-          href: contentDocPath(
-            workspace.workspaceSlug,
-            doc.type,
-            doc.slug,
-            doc.locale ?? "",
-            workspace.defaultLocale,
-          ),
-          active: docMatchesRoute(route, doc, workspace.defaultLocale),
+          href: contentDocPath(workspace.workspaceSlug, doc.type, doc.slug),
+          active: docMatchesRoute(route, doc),
           dirty: isDirtyStatus(doc.status),
         });
       }
     }
     const built = buildPathTree(leaves);
-    return withModelFolderPlaceholders(
-      built,
-      models,
-      workspace.locales,
-      workspace.defaultLocale,
-    );
+    return withModelFolderPlaceholders(built, models);
   }, [models, docsByType, workspace, route]);
 
   const startNewFile = useCallback(
@@ -422,12 +437,7 @@ function ExplorerSection({
         return;
       }
       const list = docsByType.get(ctx.type) ?? [];
-      const localeForDoc = ctx.locale || workspace.defaultLocale;
-      const exists = list.some(
-        (d) =>
-          d.slug === slug &&
-          (d.locale || workspace.defaultLocale) === localeForDoc,
-      );
+      const exists = list.some((d) => d.slug === slug);
       if (exists) {
         setNewFileError("A file with that name already exists.");
         return;
@@ -436,30 +446,18 @@ function ExplorerSection({
       setNewFileError(null);
       try {
         const frontmatter = ctx.pageFormat ? { blocks: [] } : {};
-        const { doc } = await saveDoc(
-          workspace.workspaceId,
-          ctx.locale,
-          ctx.type,
-          slug,
-          { frontmatter, body: "" },
-        );
+        const { doc } = await saveDoc(workspace.workspaceId, ctx.type, slug, {
+          frontmatter,
+          body: "",
+        });
         notifyTreeChanged({
           workspaceId: workspace.workspaceId,
-          locale: doc.locale,
           type: doc.type,
           slug: doc.slug,
           status: doc.status,
         });
         setNewFileFolder(null);
-        navigate(
-          contentDocPath(
-            workspace.workspaceSlug,
-            doc.type,
-            doc.slug,
-            doc.locale ?? "",
-            workspace.defaultLocale,
-          ),
-        );
+        navigate(contentDocPath(workspace.workspaceSlug, doc.type, doc.slug));
       } catch (err) {
         setNewFileError(err instanceof Error ? err.message : "Could not create file.");
       } finally {
@@ -483,8 +481,6 @@ function ExplorerSection({
           expanded={expanded}
           onToggleFolder={onToggleFolder}
           models={models}
-          locales={workspace.locales}
-          defaultLocale={workspace.defaultLocale}
           canWrite={canWrite}
           newFileFolder={newFileFolder}
           newFileError={newFileError}
@@ -507,8 +503,6 @@ function PathTree({
   expanded,
   onToggleFolder,
   models,
-  locales,
-  defaultLocale,
   canWrite,
   newFileFolder,
   newFileError,
@@ -522,8 +516,6 @@ function PathTree({
   expanded: Set<string>;
   onToggleFolder: (pathKey: string) => void;
   models: ContentTypeNav[];
-  locales: string[];
-  defaultLocale: string;
   canWrite: boolean;
   newFileFolder: string | null;
   newFileError: string | null;
@@ -548,12 +540,7 @@ function PathTree({
               onToggle={() => onToggleFolder(node.pathKey)}
               createContext={
                 canWrite
-                  ? resolveFolderCreateContext(
-                      node.pathKey,
-                      models,
-                      locales,
-                      defaultLocale,
-                    )
+                  ? resolveFolderCreateContext(node.pathKey, models)
                   : null
               }
               onNewFile={
@@ -566,23 +553,13 @@ function PathTree({
               <NewFileTreeRow
                 depth={depth + 1}
                 ext={
-                  resolveFolderCreateContext(
-                    node.pathKey,
-                    models,
-                    locales,
-                    defaultLocale,
-                  )?.ext ?? "mdx"
+                  resolveFolderCreateContext(node.pathKey, models)?.ext ?? "mdx"
                 }
                 error={newFileError}
                 disabled={creating}
                 onCancel={onCancelNewFile}
                 onSubmit={(name) => {
-                  const ctx = resolveFolderCreateContext(
-                    node.pathKey,
-                    models,
-                    locales,
-                    defaultLocale,
-                  );
+                  const ctx = resolveFolderCreateContext(node.pathKey, models);
                   if (ctx) onSubmitNewFile(node.pathKey, ctx, name);
                 }}
               />
@@ -594,8 +571,6 @@ function PathTree({
                 expanded={expanded}
                 onToggleFolder={onToggleFolder}
                 models={models}
-                locales={locales}
-                defaultLocale={defaultLocale}
                 canWrite={canWrite}
                 newFileFolder={newFileFolder}
                 newFileError={newFileError}
@@ -807,11 +782,9 @@ function findActiveRepoPath(
   if (!route.type || !route.docSlug) return null;
   const model = models.find((m) => m.type === route.type);
   if (!model) return null;
-  const doc = (docsByType.get(route.type) ?? []).find((d) =>
-    docMatchesRoute(route, d, workspace.defaultLocale),
-  );
+  const doc = (docsByType.get(route.type) ?? []).find((d) => docMatchesRoute(route, d));
   if (!doc) return null;
-  return docRepoPath(model, doc, workspace.defaultLocale);
+  return docRepoPath(model, doc);
 }
 
 function IconButton({
@@ -840,28 +813,18 @@ function IconButton({
 type ContentRoute = {
   type: string | null;
   docSlug: string | null;
-  locale: string;
 };
 
-function parseContentRoute(pathname: string, localeParam: string): ContentRoute {
+function parseContentRoute(pathname: string): ContentRoute {
   const match = pathname.match(/\/content\/([^/]+)(?:\/([^/?]+))?/);
-  if (!match) return { type: null, docSlug: null, locale: "" };
+  if (!match) return { type: null, docSlug: null };
   const type = decodeURIComponent(match[1]!);
   const docSlug = match[2] ? decodeURIComponent(match[2]) : null;
-  return { type, docSlug, locale: localeParam };
+  return { type, docSlug };
 }
 
-function docMatchesRoute(
-  route: ContentRoute,
-  doc: DocListItem,
-  defaultLocale: string,
-) {
-  if (!route.type || route.docSlug !== doc.slug || route.type !== doc.type) {
-    return false;
-  }
-  const docLocale = doc.locale || defaultLocale;
-  const urlLocale = route.locale || defaultLocale;
-  return docLocale === urlLocale;
+function docMatchesRoute(route: ContentRoute, doc: DocListItem) {
+  return Boolean(route.type && route.docSlug === doc.slug && route.type === doc.type);
 }
 
 function isDirtyStatus(status: DocStatus) {

package/src/chrome/EditorFocusContext.tsx

@@ -11,7 +11,7 @@ import {
   useState,
 } from "react";
 
-export type DocRef = { locale: string; type: string; slug: string };
+export type DocRef = { type: string; slug: string };
 
 export type EditorSelection = { start: number; end: number };
 
@@ -23,12 +23,12 @@ export type EditorFocus = {
 };
 
 export function docKey(ref: DocRef): string {
-  return `${ref.locale}/${ref.type}/${ref.slug}`;
+  return `${ref.type}/${ref.slug}`;
 }
 
 export function sameDocRef(a: DocRef | null | undefined, b: DocRef | null | undefined) {
   if (!a || !b) return false;
-  return a.locale === b.locale && a.type === b.type && a.slug === b.slug;
+  return a.type === b.type && a.slug === b.slug;
 }
 
 type EditorFocusContextValue = {

package/src/chrome/EditorStatusContext.tsx

@@ -8,7 +8,6 @@ import {
 } from "react";
 
 export type EditorStatus = {
-  locale: string | null;
   /** committed | uncommitted | conflict */
   status: string | null;
   saveLabel: string | null;
@@ -16,7 +15,6 @@ export type EditorStatus = {
 };
 
 const EMPTY: EditorStatus = {
-  locale: null,
   status: null,
   saveLabel: null,
   saveTone: "muted",
@@ -38,7 +36,6 @@ const EditorStatusContext = createContext<EditorStatusContextValue | null>(
 
 function sameStatus(a: EditorStatus, b: EditorStatus) {
   return (
-    a.locale === b.locale &&
     a.status === b.status &&
     a.saveLabel === b.saveLabel &&
     a.saveTone === b.saveTone

package/src/chrome/WorkspaceNavContext.tsx

@@ -13,8 +13,6 @@ export type WorkspaceNav = {
   workspaceSlug: string;
   workspaceName: string;
   role: string;
-  defaultLocale: string;
-  locales: string[];
   contentTypes: string[];
   contentModels: ContentTypeNav[];
   siteUrls: string[];

package/src/chrome/content-api-url.ts

@@ -1,7 +1,7 @@
 // packages/studio/src/chrome/content-api-url.ts
 // Public content GET the host reads — same URLs as @backmatter/core api-loader.
 
-export type ContentApiDoc = { locale: string; type: string; slug: string };
+export type ContentApiDoc = { type: string; slug: string };
 
 export type ContentApiContext = {
   doc: ContentApiDoc | null;
@@ -10,16 +10,12 @@ export type ContentApiContext = {
 
 export function contentApiContextFromPath(
   pathname: string,
-  search = "",
+  _search = "",
 ): ContentApiContext {
-  const localeFromQuery = new URLSearchParams(
-    search.startsWith("?") ? search.slice(1) : search,
-  ).get("locale");
   const doc = pathname.match(/\/content\/([^/]+)\/([^/]+)\/?$/);
   if (doc) {
     return {
       doc: {
-        locale: localeFromQuery || "en",
         type: decodeURIComponent(doc[1]!),
         slug: decodeURIComponent(doc[2]!),
       },
@@ -34,7 +30,6 @@ export function contentApiContextFromPath(
   if (legacyDoc) {
     return {
       doc: {
-        locale: decodeURIComponent(legacyDoc[1]!),
         type: decodeURIComponent(legacyDoc[2]!),
         slug: decodeURIComponent(legacyDoc[3]!),
       },
@@ -53,15 +48,12 @@ export function publicContentApiUrl(input: {
   workspaceId: string;
   branch?: string | null;
   defaultBranch?: string | null;
-  locale?: string;
   type?: string;
   slug?: string;
 }): string {
   const origin = input.apiUrl.replace(/\/$/, "");
   const path =
-    input.locale && input.type && input.slug
-      ? `/${input.locale}/${input.type}/${input.slug}`
-      : "";
+    input.type && input.slug ? `/${input.type}/${input.slug}` : "";
   if (!input.workspaceId.startsWith("ws_")) {
     throw new Error("public content URLs must use the workspace id (ws_…), not the slug");
   }
@@ -94,7 +86,6 @@ export function contentApiLinks(input: {
       label: "This document",
       href: publicContentApiUrl({
         ...base,
-        locale: ctx.doc.locale,
         type: ctx.doc.type,
         slug: ctx.doc.slug,
       }),

package/src/chrome/content-repo-path.ts

@@ -1,28 +1,17 @@
 // packages/studio/src/chrome/content-repo-path.ts
 import { IMPLICIT_SINGLETON_SLUG, repoPathFromModel } from "@backmatter/core";
 import type { DocListItem } from "../api";
-import { modelHasLocale, type ContentTypeNav } from "./content-type-groups";
+import type { ContentTypeNav } from "./content-type-groups";
 
 export function docRepoPath(
   model: ContentTypeNav,
-  doc: Pick<DocListItem, "locale" | "slug">,
-  defaultLocale: string,
+  doc: Pick<DocListItem, "slug">,
 ): string {
-  const locale = modelHasLocale(model.path)
-    ? doc.locale || defaultLocale
-    : undefined;
-  return repoPathFromModel(model, locale, doc.slug);
+  return repoPathFromModel(model, doc.slug);
 }
 
-export function singletonRepoPath(
-  model: ContentTypeNav,
-  defaultLocale: string,
-): string {
-  return docRepoPath(
-    model,
-    { slug: IMPLICIT_SINGLETON_SLUG, locale: defaultLocale },
-    defaultLocale,
-  );
+export function singletonRepoPath(model: ContentTypeNav): string {
+  return docRepoPath(model, { slug: IMPLICIT_SINGLETON_SLUG });
 }
 
 export function repoPathBasename(repoPath: string): string {
@@ -39,14 +28,8 @@ export function fileExtFromRepoPath(repoPath: string): string {
 /** Label for a row in the content tree (repo-relative filename). */
 export function docTreeLabel(
   model: ContentTypeNav,
-  doc: Pick<DocListItem, "locale" | "slug">,
-  defaultLocale: string,
+  doc: Pick<DocListItem, "slug">,
 ): string {
-  const repoPath = docRepoPath(model, doc, defaultLocale);
-  const name = repoPathBasename(repoPath);
-  const locale = doc.locale || defaultLocale;
-  if (modelHasLocale(model.path) && locale !== defaultLocale) {
-    return `${locale}/${name}`;
-  }
-  return name;
+  const repoPath = docRepoPath(model, doc);
+  return repoPathBasename(repoPath);
 }

package/src/chrome/content-type-groups.ts

@@ -27,6 +27,3 @@ export function groupContentTypes(models: ContentTypeNav[]) {
   return { pages, data, globals };
 }
 
-export function modelHasLocale(path: string) {
-  return path.includes("{locale}");
-}

package/src/chrome/folder-create-context.ts

@@ -1,7 +1,6 @@
 // packages/studio/src/chrome/folder-create-context.ts
 import { contentExtFromPath } from "@backmatter/core";
 import type { ContentTypeNav } from "./content-type-groups";
-import { modelHasLocale } from "./content-type-groups";
 import { treePathFromRepo } from "./content-path-tree";
 import type { PathTreeFolder, PathTreeNode } from "./content-path-tree";
 import { docRepoPath, repoPathBasename } from "./content-repo-path";
@@ -10,7 +9,6 @@ const SLUG_RE = /^[a-z0-9]+(?:-[a-z0-9]+)*$/;
 
 export type FolderCreateContext = {
   type: string;
-  locale: string;
   ext: string;
   /** JSON landing pages need `blocks: []` in frontmatter on create. */
   pageFormat: boolean;
@@ -35,19 +33,8 @@ export function slugFromNewFileName(name: string, expectedExt: string): string {
   return base;
 }
 
-export function folderPathKeyForModel(
-  model: ContentTypeNav,
-  locale: string | undefined,
-  defaultLocale: string,
-): string {
-  const loc = modelHasLocale(model.path)
-    ? locale || defaultLocale
-    : undefined;
-  const repo = docRepoPath(
-    model,
-    { slug: "new", locale: loc ?? "" },
-    defaultLocale,
-  );
+export function folderPathKeyForModel(model: ContentTypeNav): string {
+  const repo = docRepoPath(model, { slug: "new" });
   const tree = treePathFromRepo(repo);
   const parts = tree.split("/").filter(Boolean);
   parts.pop();
@@ -57,26 +44,15 @@ export function folderPathKeyForModel(
 export function resolveFolderCreateContext(
   pathKey: string,
   models: ContentTypeNav[],
-  locales: string[],
-  defaultLocale: string,
 ): FolderCreateContext | null {
   const matches: FolderCreateContext[] = [];
   for (const model of models) {
     if (model.singleton) continue;
     const ext = contentExtFromPath(model.path);
     const pageFormat = ext === "json";
-    if (modelHasLocale(model.path)) {
-      for (const locale of locales) {
-        const key = folderPathKeyForModel(model, locale, defaultLocale);
-        if (key === pathKey) {
-          matches.push({ type: model.type, locale, ext, pageFormat });
-        }
-      }
-    } else {
-      const key = folderPathKeyForModel(model, undefined, defaultLocale);
-      if (key === pathKey) {
-        matches.push({ type: model.type, locale: "", ext, pageFormat });
-      }
+    const key = folderPathKeyForModel(model);
+    if (key === pathKey) {
+      matches.push({ type: model.type, ext, pageFormat });
     }
   }
   if (matches.length !== 1) return null;
@@ -119,23 +95,23 @@ function insertFolderPath(nodes: PathTreeNode[], segments: string[], pathKey: st
   return next;
 }
 
-/** Ensure each model's content directory exists as a folder (even with no files yet). */
+function treeHasFile(nodes: PathTreeNode[]): boolean {
+  for (const node of nodes) {
+    if (node.kind === "file") return true;
+    if (treeHasFile(node.children)) return true;
+  }
+  return false;
+}
+
+/** Empty type folders so the first file in a model still has a folder row. */
 export function withModelFolderPlaceholders(
   tree: PathTreeNode[],
   models: ContentTypeNav[],
-  locales: string[],
-  defaultLocale: string,
 ): PathTreeNode[] {
   const keys = new Set<string>();
   for (const model of models) {
     if (model.singleton) continue;
-    if (modelHasLocale(model.path)) {
-      for (const locale of locales) {
-        keys.add(folderPathKeyForModel(model, locale, defaultLocale));
-      }
-    } else {
-      keys.add(folderPathKeyForModel(model, undefined, defaultLocale));
-    }
+    keys.add(folderPathKeyForModel(model));
   }
   let out = tree;
   for (const key of [...keys].sort(compareName)) {