gloomberb 0.13.2 → 0.14.0

package/src/layout-marketplace/gallery-desktop.tsx

@@ -84,7 +84,7 @@ function EntryRow({
   const panes = summarizeLayoutPanes(entry.layout, controller.panes);
   const missing = panes.filter((pane) => pane.missing).length;
   const select = () => controller.select(entry.id);
-  const activate = () => (entry.kind === "community" ? controller.install(entry) : controller.activate(entry));
+  const activate = () => (entry.kind === "owned" ? controller.activate(entry) : controller.install(entry));
 
   return (
     <PaneSidebarRow
@@ -197,9 +197,20 @@ function PreviewEmpty({ controller }: { controller: LayoutGalleryController }) {
 function PreviewPane({ controller, entry }: { controller: LayoutGalleryController; entry: GalleryEntry }) {
   const colors = useThemeColors();
   const community = entry.kind === "community";
+  const teamEntry = entry.kind === "team";
+  const linked = entry.kind === "owned" ? entry.linked ?? null : null;
   const metadata = [
+    entry.team ? `${entry.team.shortName}· ${entry.team.name}` : null,
+    entry.revision ? `r${entry.revision}` : null,
     entry.author,
     entry.publishedAt ? formatPublishedAt(entry.publishedAt) : null,
+    linked
+      ? linked.updateAvailable
+        ? tf("team has r{revision}", { revision: String(linked.updateAvailable) })
+        : linked.dirty
+          ? t("edited since the last publish")
+          : t("in sync with the team")
+      : null,
     describeArrangement(entry.layout),
   ].filter(Boolean).join(" · ");
 
@@ -254,9 +265,9 @@ function PreviewPane({ controller, entry }: { controller: LayoutGalleryControlle
         style={{ borderTop: `1px solid ${colors.border}` }}
       >
         <Button
-          label={community ? "Add Layout" : "Use Layout"}
+          label={community ? "Add Layout" : teamEntry ? (entry.index !== null ? "Open Tab" : "Open as Linked Tab") : "Use Layout"}
           variant="primary"
-          onPress={() => (community ? controller.install(entry) : controller.activate(entry))}
+          onPress={() => (entry.kind === "owned" ? controller.activate(entry) : controller.install(entry))}
         />
         {community && (
           <>
@@ -277,6 +288,30 @@ function PreviewPane({ controller, entry }: { controller: LayoutGalleryControlle
               disabled={!controller.canDelete}
               onPress={() => controller.deleteLayout(entry)}
             />
+            {controller.teams.length > 0 && (
+              <>
+                <Box width={1} />
+                <Button
+                  label={linked ? "Publish to Team" : "Publish to Team…"}
+                  variant="secondary"
+                  disabled={controller.publishing}
+                  onPress={() => controller.publishToTeam(entry)}
+                />
+              </>
+            )}
+            {linked && (
+              <>
+                <Box width={1} />
+                <Button
+                  label={linked.updateAvailable ? `Pull r${linked.updateAvailable}` : "Pull"}
+                  variant="secondary"
+                  disabled={controller.publishing || !linked.updateAvailable}
+                  onPress={() => controller.pullTeamUpdates(entry)}
+                />
+                <Box width={1} />
+                <Button label="Unlink" variant="secondary" onPress={() => controller.unlink(entry)} />
+              </>
+            )}
           </>
         )}
         <Box flexGrow={1} minWidth={0} />
@@ -285,6 +320,11 @@ function PreviewPane({ controller, entry }: { controller: LayoutGalleryControlle
             {t("Adds an editable copy")}
           </Text>
         )}
+        {teamEntry && entry.index === null && (
+          <Text fg={colors.textMuted} style={{ ...ELLIPSIS, minWidth: 0 }}>
+            {t("Opens a tab that follows the team layout")}
+          </Text>
+        )}
       </Box>
     </Box>
   );
@@ -350,6 +390,28 @@ export function LayoutGalleryDesktop({
                 />
               ))}
 
+              {controller.teamSections.map(({ team, entries }) => (
+                <Box key={team.id} flexDirection="column">
+                  <SidebarSection title={`${team.shortName}· ${team.name}`} count={entries.length} />
+                  {entries.length === 0 ? (
+                    <SidebarNote>
+                      {controller.teamLayouts.state.status === "loading"
+                        ? t("Loading team layouts…")
+                        : controller.teamLayouts.state.status === "error"
+                          ? controller.teamLayouts.state.error
+                          : t("No team layouts yet.")}
+                    </SidebarNote>
+                  ) : entries.map((entry) => (
+                    <EntryRow
+                      key={entry.id}
+                      entry={entry}
+                      controller={controller}
+                      selected={entry.id === selected?.id}
+                    />
+                  ))}
+                </Box>
+              ))}
+
               <SidebarSection title="Discover" count={controller.community.length} />
               <DiscoverStatus controller={controller} />
               {controller.community.map((entry) => (

package/src/layout-marketplace/gallery-terminal.tsx

@@ -14,6 +14,7 @@ import {
   summarizeLayoutPanes,
   type GalleryEntry,
 } from "./model";
+import { linkedLayoutMarker } from "./linked";
 
 const DETAILS_WIDTH = 42;
 
@@ -84,9 +85,14 @@ export function LayoutGalleryTerminal({
     newLayout,
     owned,
     publishCurrent,
+    publishToTeam,
+    pullTeamUpdates,
     publishing,
     renameLayout,
     select,
+    teamSections,
+    teamLayouts,
+    unlink,
   } = controller;
   const discoverStatus = discoverStatusRow(controller);
 
@@ -100,11 +106,34 @@ export function LayoutGalleryTerminal({
       },
       ...owned.map((entry): GalleryRow => ({
         id: entry.id,
-        label: entry.active ? `${entry.name} ●` : entry.name,
-        right: describeArrangement(entry.layout),
+        label: `${entry.team ? `${entry.team.shortName}· ` : ""}${entry.name}${linkedLayoutMarker(entry.linked ?? null)}${entry.active ? " ●" : ""}`,
+        right: entry.linked
+          ? `r${entry.revision ?? "?"}${entry.linked.updateAvailable ? ` → r${entry.linked.updateAvailable}` : ""}`
+          : describeArrangement(entry.layout),
         current: entry.active,
         entry,
       })),
+      ...teamSections.flatMap(({ team, entries }): GalleryRow[] => [
+        {
+          id: `heading:team:${team.id}`,
+          label: tf("{team} ({count})", { team: `${team.shortName}· ${team.name.toUpperCase()}`, count: String(entries.length) }),
+          disabled: true,
+          entry: null,
+        },
+        ...(teamLayouts.state.status === "error" && entries.length === 0
+          ? [{ id: `team:${team.id}:retry`, label: "Retry", detail: teamLayouts.state.error, entry: null, action: teamLayouts.refresh }]
+          : teamLayouts.state.status === "loading" && entries.length === 0
+            ? [{ id: `team:${team.id}:loading`, label: "Loading team layouts…", disabled: true, entry: null }]
+            : entries.length === 0
+              ? [{ id: `team:${team.id}:empty`, label: "No team layouts yet. Publish one with t.", disabled: true, entry: null }]
+              : entries.map((entry): GalleryRow => ({
+                  id: entry.id,
+                  label: `${entry.name}${entry.index !== null ? " (open)" : ""}`,
+                  detail: entry.author ?? "",
+                  right: `r${entry.revision ?? 1} · ${formatPublishedAt(entry.publishedAt ?? "")}`,
+                  entry,
+                }))),
+      ]),
       {
         id: "heading:discover",
         label: tf("DISCOVER ({count})", { count: String(community.length) }),
@@ -123,7 +152,7 @@ export function LayoutGalleryTerminal({
       });
     }
     return built;
-  }, [community, discoverStatus, owned]);
+  }, [community, discoverStatus, owned, teamLayouts.refresh, teamLayouts.state, teamSections]);
 
   const selectableIndexes = useMemo(
     () => rows.map((row, index) => (row.entry || row.action ? index : -1)).filter((index) => index >= 0),
@@ -167,7 +196,7 @@ export function LayoutGalleryTerminal({
       return;
     }
     if (!row.entry) return;
-    if (row.entry.kind === "community") installLayout(row.entry);
+    if (row.entry.kind === "community" || row.entry.kind === "team") installLayout(row.entry);
     else activateLayout(row.entry);
   }, [activateLayout, installLayout]);
 
@@ -187,6 +216,19 @@ export function LayoutGalleryTerminal({
     const entry = selectedRowRef.current?.entry;
     if (entry?.kind === "owned") deleteLayout(entry);
   }, [deleteLayout]);
+  const publishTeamSelected = useCallback(() => {
+    const entry = selectedRowRef.current?.entry;
+    if (entry?.kind === "owned") publishToTeam(entry);
+  }, [publishToTeam]);
+  const pullSelected = useCallback(() => {
+    const entry = selectedRowRef.current?.entry;
+    if (entry?.kind === "owned" && entry.linked) pullTeamUpdates(entry);
+  }, [pullTeamUpdates]);
+  const unlinkSelected = useCallback(() => {
+    const entry = selectedRowRef.current?.entry;
+    if (entry?.kind === "owned" && entry.linked) unlink(entry);
+  }, [unlink]);
+  const teamsAvailable = teamSections.length > 0;
 
   usePaneFooter("layout-marketplace", () => ({
     info: publishing
@@ -201,7 +243,20 @@ export function LayoutGalleryTerminal({
             { id: "rename", key: "r", label: "ename", onPress: renameSelected },
             { id: "copy", key: "c", label: "opy", onPress: copySelected },
             { id: "delete", key: "d", label: "elete", onPress: deleteSelected, disabled: !canDelete },
+            ...(teamsAvailable
+              ? [{ id: "team", key: "t", label: selectedEntry.linked ? "eam publish" : "eam", onPress: publishTeamSelected, disabled: publishing }]
+              : []),
+            ...(selectedEntry.linked
+              ? [
+                  { id: "pull", key: "u", label: "pdate", onPress: pullSelected, disabled: publishing || !selectedEntry.linked.updateAvailable },
+                  { id: "unlink", key: "x", label: " unlink", onPress: unlinkSelected },
+                ]
+              : []),
           ]
+        : selectedEntry?.kind === "team"
+          ? [
+              { id: "open-team", key: "a", label: selectedEntry.index !== null ? " open" : "dd linked tab", onPress: activateSelected },
+            ]
         : selectedEntry?.kind === "community"
           ? [
               { id: "add", key: "a", label: "dd layout", onPress: activateSelected },
@@ -222,11 +277,17 @@ export function LayoutGalleryTerminal({
     focusSearch,
     newLayout,
     publishCurrent,
+    publishTeamSelected,
     publishing,
+    pullSelected,
     renameSelected,
+    selectedEntry?.index,
     selectedEntry?.kind,
+    selectedEntry?.linked,
     selectedRow?.action,
     selectedRow?.id,
+    teamsAvailable,
+    unlinkSelected,
   ]);
 
   useShortcut((event) => {
@@ -256,7 +317,10 @@ export function LayoutGalleryTerminal({
     else if (isPlainKey(event, "n")) run(newLayout);
     else if (isPlainKey(event, "p")) run(publishCurrent);
     else if (isPlainKey(event, "o") && (selectedEntry?.kind === "owned" || selectedRow?.action)) run(activateSelected);
-    else if (isPlainKey(event, "a") && selectedEntry?.kind === "community") run(activateSelected);
+    else if (isPlainKey(event, "a") && (selectedEntry?.kind === "community" || selectedEntry?.kind === "team")) run(activateSelected);
+    else if (isPlainKey(event, "t") && selectedEntry?.kind === "owned" && teamsAvailable && !publishing) run(publishTeamSelected);
+    else if (isPlainKey(event, "u") && selectedEntry?.kind === "owned" && selectedEntry.linked?.updateAvailable && !publishing) run(pullSelected);
+    else if (isPlainKey(event, "x") && selectedEntry?.kind === "owned" && selectedEntry.linked) run(unlinkSelected);
     else if (isPlainKey(event, "r") && selectedRow?.id === "discover:retry") run(activateSelected);
     else if (isPlainKey(event, "r") && selectedEntry?.kind === "owned") run(renameSelected);
     else if (isPlainKey(event, "c") && selectedEntry) run(copySelected);
@@ -365,6 +429,11 @@ function LayoutDetails({
   return (
     <Box flexDirection="column">
       <Text fg={colors.textBright} attributes={TextAttributes.BOLD}>{entry.name}</Text>
+      {entry.team && (
+        <Text fg={colors.textMuted}>
+          {`${entry.team.shortName}· ${entry.team.name}${entry.revision ? ` · r${entry.revision}` : ""}`}
+        </Text>
+      )}
       {entry.author && (
         <Text fg={colors.textMuted}>
           {entry.publishedAt
@@ -372,6 +441,15 @@ function LayoutDetails({
             : entry.author}
         </Text>
       )}
+      {entry.linked && (
+        <Text fg={entry.linked.updateAvailable ? colors.warning : entry.linked.dirty ? colors.text : colors.textDim}>
+          {entry.linked.updateAvailable
+            ? tf("Team has r{revision}. u to pull.", { revision: String(entry.linked.updateAvailable) })
+            : entry.linked.dirty
+              ? t("Edited since the last publish. t to publish.")
+              : t("In sync with the team.")}
+        </Text>
+      )}
       <Text fg={colors.textDim}>{describeArrangement(entry.layout)}</Text>
       <Box height={1} />
       {panes.map((pane) => {

package/src/layout-marketplace/gallery.tsx

@@ -1,12 +1,17 @@
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useMemo, useState, useSyncExternalStore } from "react";
+import { ChoiceDialog } from "../components/ui/choice-dialog";
 import { ConfirmDialog } from "../components/ui/confirm-dialog";
 import { useShortcut } from "../react/input";
 import { useAppDispatch, useAppSelector } from "../state/app/context";
 import { selectActiveLayoutIndex, selectSavedLayouts } from "../state/selectors-ui";
 import { useDialog, useDialogState, type PromptContext } from "../ui/dialog";
 import { useRendererHost, useUiHost } from "../ui";
+import { apiClient, type TeamSummary } from "../api-client";
 import { requestAuthDialog } from "../plugins/builtin/cloud/auth-dialog";
+import { teamStore } from "../plugins/builtin/cloud/team/store";
 import { usePlanAccess } from "../plugins/builtin/shared/plan-access";
+import { getMarketplaceHost } from "../plugins/builtin/plugin-marketplace/store";
+import { rememberLayoutRequirements } from "../components/layout/missing-pane";
 import type { PluginRegistry } from "../plugins/registry";
 import type { LayoutConfig } from "../types/config";
 import { LayoutGalleryDesktop } from "./gallery-desktop";
@@ -15,24 +20,35 @@ import { LayoutNameDialog } from "./name-dialog";
 import {
   buildCommunityEntries,
   buildOwnedEntries,
+  buildTeamEntries,
   filterGalleryEntries,
   missingPaneIds,
   type GalleryEntry,
 } from "./model";
+import { computeLayoutRequirements, LayoutRevisionConflictError, type CloudLayoutEntry } from "./cloud";
+import { linkedLayoutUpdates, originFromEntry } from "./linked";
 import { publicMarketplaceLayoutUrl } from "./api";
 import {
   materializeMarketplaceLayout,
   publishableMarketplaceLayout,
 } from "./payload";
-import { useLayoutMarketplace } from "./use-marketplace";
+import { useLayoutMarketplace, useTeamLayouts } from "./use-marketplace";
 
 export interface LayoutGalleryController {
   query: string;
   setQuery: (query: string) => void;
   owned: GalleryEntry[];
   community: GalleryEntry[];
-  /** Owned entries first, then community, in the order the destination renders them. */
+  /** One section per team the account is in, in team name order. */
+  teamSections: Array<{ team: TeamSummary; entries: GalleryEntry[] }>;
+  teamLayouts: ReturnType<typeof useTeamLayouts>;
+  /** Owned entries first, then team, then community, in the order the destination renders them. */
   entries: GalleryEntry[];
+  /** Publish the current tab to a team (new layout), or push a revision when it is linked. */
+  publishToTeam: (entry: GalleryEntry) => void;
+  pullTeamUpdates: (entry: GalleryEntry) => void;
+  unlink: (entry: GalleryEntry) => void;
+  teams: TeamSummary[];
   selectedId: string | null;
   select: (id: string | null) => void;
   detail: GalleryEntry | null;
@@ -79,6 +95,16 @@ export function LayoutMarketplaceGallery({
   const currentPaneState = useAppSelector((state) => state.paneState);
   const { signedIn } = usePlanAccess();
   const discover = useLayoutMarketplace(true, signedIn);
+  const teamSnapshot = useSyncExternalStore(
+    (onChange) => teamStore.subscribe(onChange),
+    () => teamStore.getSnapshot(),
+  );
+  const teams = teamSnapshot.teams;
+  const teamLayouts = useTeamLayouts(signedIn, teams);
+  const remoteRevisions = useSyncExternalStore(
+    (onChange) => linkedLayoutUpdates.subscribe(onChange),
+    () => linkedLayoutUpdates.snapshot(),
+  );
   const [query, setQuery] = useState("");
   const [selectedId, setSelectedId] = useState<string | null>(null);
   const [detailId, setDetailId] = useState<string | null>(null);
@@ -86,14 +112,22 @@ export function LayoutMarketplaceGallery({
 
   const panes = pluginRegistry.panes;
   const owned = useMemo(
-    () => filterGalleryEntries(buildOwnedEntries(layouts, activeIndex), query, panes),
-    [activeIndex, layouts, panes, query],
+    () => filterGalleryEntries(buildOwnedEntries(layouts, activeIndex, { panes, teams, remoteRevisions }), query, panes),
+    [activeIndex, layouts, panes, query, remoteRevisions, teams],
   );
   const community = useMemo(
     () => filterGalleryEntries(buildCommunityEntries(discover.state.items), query, panes),
     [discover.state.items, panes, query],
   );
-  const entries = useMemo(() => [...owned, ...community], [community, owned]);
+  const teamEntries = useMemo(
+    () => filterGalleryEntries(buildTeamEntries(teamLayouts.state.items, teams, layouts), query, panes),
+    [layouts, panes, query, teamLayouts.state.items, teams],
+  );
+  const teamSections = useMemo(
+    () => teams.map((team) => ({ team, entries: teamEntries.filter((entry) => entry.team?.id === team.id) })),
+    [teamEntries, teams],
+  );
+  const entries = useMemo(() => [...owned, ...teamEntries, ...community], [community, owned, teamEntries]);
   const detail = useMemo(
     () => entries.find((entry) => entry.id === detailId) ?? null,
     [detailId, entries],
@@ -105,7 +139,7 @@ export function LayoutMarketplaceGallery({
   }, [onClose, pluginRegistry]);
 
   const activate = useCallback((entry: GalleryEntry) => {
-    if (entry.kind === "community") {
+    if (entry.kind === "community" || (entry.kind === "team" && entry.index === null)) {
       setDetailId(entry.id);
       setSelectedId(entry.id);
       return;
@@ -116,17 +150,6 @@ export function LayoutMarketplaceGallery({
     }
   }, [activeIndex, close, dispatch]);
 
-  const install = useCallback((entry: GalleryEntry) => {
-    const installed = materializeMarketplaceLayout(entry);
-    close();
-    dispatch({
-      type: "INSTALL_LAYOUT_COPY",
-      name: entry.name,
-      layout: installed.layout,
-      paneState: installed.paneState,
-    });
-    pluginRegistry.notify({ body: `Layout "${entry.name}" added`, type: "success" });
-  }, [close, dispatch, pluginRegistry]);
 
   const requestSignIn = useCallback(() => {
     if (!requestAuthDialog({ mode: "login" })) {
@@ -155,6 +178,213 @@ export function LayoutMarketplaceGallery({
     return typeof name === "string" ? name.trim() : "";
   }, [dialog]);
 
+  const teamEntryFor = useCallback((entry: GalleryEntry): CloudLayoutEntry | null => (
+    entry.marketplaceId
+      ? teamLayouts.state.items.find((item) => item.id === entry.marketplaceId) ?? null
+      : null
+  ), [teamLayouts.state.items]);
+
+
+  const install = useCallback((entry: GalleryEntry) => {
+    // A team layout that is already open as a tab: go there instead of a copy.
+    if (entry.kind === "team" && entry.index !== null) {
+      activate(entry);
+      return;
+    }
+    const cloud = entry.kind === "team" ? teamEntryFor(entry) : null;
+    const origin = cloud ? originFromEntry(cloud) : null;
+    if (cloud) rememberLayoutRequirements(cloud.id, cloud.requires);
+    const installed = materializeMarketplaceLayout(entry);
+    close();
+    dispatch({
+      type: "INSTALL_LAYOUT_COPY",
+      name: entry.name,
+      layout: installed.layout,
+      paneState: installed.paneState,
+      ...(origin ? { origin } : {}),
+    });
+    pluginRegistry.notify({
+      body: origin ? `Opened "${entry.name}" from ${entry.team?.name ?? "the team"}` : `Layout "${entry.name}" added`,
+      type: "success",
+    });
+  }, [activate, close, dispatch, pluginRegistry, teamEntryFor]);
+
+  const requirementsFor = useCallback((layout: LayoutConfig) => {
+    const installed = new Map((getMarketplaceHost()?.listInstalled() ?? []).map((plugin) => [plugin.id, plugin]));
+    return computeLayoutRequirements(layout, {
+      panePluginId: (paneId) => pluginRegistry.getPanePluginId(paneId),
+      pluginInfo: (pluginId) => {
+        const plugin = pluginRegistry.allPlugins.get(pluginId);
+        const meta = installed.get(pluginId);
+        if (!plugin) return null;
+        const homepage = plugin.homepage ?? "";
+        const github = /github\.com\/([^/]+\/[^/#?]+)/.exec(homepage);
+        return {
+          builtin: meta ? meta.source === "builtin" : true,
+          version: plugin.version,
+          ...(github?.[1] ? { repo: github[1].replace(/\.git$/, "") } : {}),
+        };
+      },
+    });
+  }, [pluginRegistry]);
+
+  const chooseTeam = useCallback(async (): Promise<TeamSummary | null> => {
+    if (teams.length === 0) {
+      pluginRegistry.notify({ body: "Join or create a team first with TEAM.", type: "info" });
+      return null;
+    }
+    if (teams.length === 1) return teams[0]!;
+    const defaultId = teamStore.getDefaultTeamId();
+    const id = await dialog.prompt<string>({
+      closeOnClickOutside: true,
+      content: (context: unknown) => (
+        <ChoiceDialog
+          {...(context as PromptContext<string>)}
+          title="Publish to which team?"
+          choices={teams.map((team) => ({ id: team.id, label: `${team.shortName}· ${team.name}` }))}
+          selectedChoiceId={defaultId ?? undefined}
+        />
+      ),
+    }).catch(() => undefined);
+    return teams.find((team) => team.id === id) ?? null;
+  }, [dialog, pluginRegistry, teams]);
+
+  const savedFor = useCallback((entry: GalleryEntry) => (entry.index !== null ? layouts[entry.index] ?? null : null), [layouts]);
+
+  const contentFor = useCallback((entry: GalleryEntry) => {
+    // The active tab's live state is the freshest copy of it.
+    if (entry.index === activeIndex) return { layout: currentLayout, paneState: currentPaneState };
+    const saved = savedFor(entry);
+    return saved
+      ? { layout: saved.layout, paneState: (saved.paneState ?? {}) as typeof currentPaneState }
+      : { layout: entry.layout, paneState: entry.paneState };
+  }, [activeIndex, currentLayout, currentPaneState, savedFor]);
+
+  const pullTeamUpdates = useCallback(async (entry: GalleryEntry) => {
+    const saved = savedFor(entry);
+    const origin = saved?.origin;
+    if (entry.index === null || !origin) return;
+    setPublishing(true);
+    try {
+      const cloud = await apiClient.getCloudLayout(origin.layoutId);
+      if (!cloud) {
+        pluginRegistry.notify({ body: "This team layout no longer exists. The tab stays as a personal copy.", type: "info" });
+        dispatch({ type: "SET_LAYOUT_ORIGIN", index: entry.index, origin: null });
+        return;
+      }
+      const nextOrigin = originFromEntry(cloud);
+      if (!nextOrigin) return;
+      rememberLayoutRequirements(cloud.id, cloud.requires);
+      const installed = materializeMarketplaceLayout(cloud);
+      dispatch({
+        type: "REPLACE_LAYOUT_CONTENT",
+        index: entry.index,
+        layout: installed.layout,
+        paneState: installed.paneState,
+        origin: nextOrigin,
+        name: cloud.name,
+      });
+      teamLayouts.upsert(cloud);
+      pluginRegistry.notify({ body: `Pulled "${cloud.name}" r${cloud.revision}`, type: "success" });
+    } catch (error) {
+      pluginRegistry.notify({ body: error instanceof Error ? error.message : "Could not pull the team layout.", type: "error" });
+    } finally {
+      setPublishing(false);
+    }
+  }, [dispatch, pluginRegistry, savedFor, teamLayouts]);
+
+  const resolveConflict = useCallback(async (entry: GalleryEntry, remoteRevision: number): Promise<"copy" | "overwrite" | "discard" | null> => {
+    const choice = await dialog.prompt<string>({
+      closeOnClickOutside: false,
+      content: (context: unknown) => (
+        <ChoiceDialog
+          {...(context as PromptContext<string>)}
+          title={`${entry.team?.name ?? "The team"} published r${remoteRevision} since you pulled`}
+          choices={[
+            { id: "copy", label: "Save mine as a personal copy, then pull", description: "Keeps both. Your version becomes an unlinked tab." },
+            { id: "overwrite", label: "Overwrite with mine", description: `Publishes your content as r${remoteRevision + 1}.` },
+            { id: "discard", label: "Discard mine and pull", description: "Your local changes are lost." },
+          ]}
+          selectedChoiceId="copy"
+        />
+      ),
+    }).catch(() => undefined);
+    return choice === "copy" || choice === "overwrite" || choice === "discard" ? choice : null;
+  }, [dialog]);
+
+  const publishToTeam = useCallback(async (entry: GalleryEntry) => {
+    if (!signedIn) {
+      requestSignIn();
+      return;
+    }
+    if (entry.index === null) return;
+    const saved = savedFor(entry);
+    const content = contentFor(entry);
+    const payload = publishableMarketplaceLayout(content.layout, content.paneState, panes);
+    const requires = requirementsFor(content.layout);
+    const origin = saved?.origin;
+
+    setPublishing(true);
+    try {
+      if (origin) {
+        const publish = async (expectedRevision: number | undefined) => apiClient.publishLayoutRevision(origin.layoutId, payload, {
+          expectedRevision,
+          requires,
+          name: entry.name,
+        });
+        let published: CloudLayoutEntry;
+        try {
+          published = await publish(origin.revision);
+        } catch (error) {
+          if (!(error instanceof LayoutRevisionConflictError)) throw error;
+          const choice = await resolveConflict(entry, error.currentRevision);
+          if (!choice) return;
+          if (choice === "overwrite") {
+            published = await publish(error.currentRevision);
+          } else {
+            if (choice === "copy") {
+              dispatch({ type: "DUPLICATE_LAYOUT", index: entry.index });
+              dispatch({ type: "SET_LAYOUT_ORIGIN", index: layouts.length, origin: null });
+            }
+            await pullTeamUpdates(entry);
+            return;
+          }
+        }
+        const nextOrigin = originFromEntry(published);
+        if (nextOrigin) dispatch({ type: "SET_LAYOUT_ORIGIN", index: entry.index, origin: nextOrigin });
+        teamLayouts.upsert(published);
+        pluginRegistry.notify({ body: `Published "${published.name}" r${published.revision} to ${entry.team?.name ?? "the team"}`, type: "success" });
+        return;
+      }
+
+      const team = await chooseTeam();
+      if (!team) return;
+      const name = await promptName({
+        title: `Publish to ${team.name}`,
+        label: "Layout name",
+        confirmLabel: "Publish to team",
+        initialValue: entry.name,
+      });
+      if (!name) return;
+      const published = await apiClient.publishTeamLayout(team.id, name, payload, { requires });
+      const nextOrigin = originFromEntry(published);
+      if (nextOrigin) dispatch({ type: "SET_LAYOUT_ORIGIN", index: entry.index, origin: nextOrigin });
+      if (name !== entry.name) dispatch({ type: "RENAME_LAYOUT", index: entry.index, name });
+      teamLayouts.upsert(published);
+      pluginRegistry.notify({ body: `Published "${name}" to ${team.name}. This tab is now linked.`, type: "success" });
+    } catch (error) {
+      pluginRegistry.notify({ body: error instanceof Error ? error.message : "Could not publish to the team.", type: "error" });
+    } finally {
+      setPublishing(false);
+    }
+  }, [chooseTeam, contentFor, dispatch, layouts.length, panes, pluginRegistry, promptName, pullTeamUpdates, requestSignIn, requirementsFor, resolveConflict, savedFor, signedIn, teamLayouts]);
+
+  const unlink = useCallback((entry: GalleryEntry) => {
+    if (entry.index === null || !savedFor(entry)?.origin) return;
+    dispatch({ type: "SET_LAYOUT_ORIGIN", index: entry.index, origin: null });
+    pluginRegistry.notify({ body: `"${entry.name}" is a personal layout now.`, type: "success" });
+  }, [dispatch, pluginRegistry, savedFor]);
+
   const newLayout = useCallback(async () => {
     const name = await promptName({
       title: "New Layout",
@@ -287,6 +517,12 @@ export function LayoutMarketplaceGallery({
     activate,
     install,
     discover,
+    teamSections,
+    teamLayouts,
+    publishToTeam,
+    pullTeamUpdates,
+    unlink,
+    teams,
     signedIn,
     requestSignIn,
     publishCurrent,