@omercnet/paseo-gas-city 0.1.0

package/client/contribute.tsx

@@ -0,0 +1,96 @@
+import type { PluginClientContext } from "@getpaseo/plugin/client";
+import { queueSlingIntent } from "./dispatch-intent";
+import { FactoryPanel } from "./factory-panel";
+import { GasCitySurface } from "./gas-city-surface";
+import { GasCitySettingsScreen } from "./settings-screen";
+
+export function registerGasCityClient(client: PluginClientContext) {
+  const cleanups = [
+    client.addSettingsScreen({
+      id: "gas-city",
+      title: "Gas City settings",
+      icon: "Settings",
+      Component: GasCitySettingsScreen,
+    }),
+    client.addSurface("gas-city", GasCitySurface),
+    client.addSidebarItem({
+      id: "gas-city",
+      title: "Gas City",
+      icon: "Factory",
+      surface: "gas-city",
+    }),
+    client.addWorkspacePanel({
+      id: "gas-city-factory",
+      title: "Factory",
+      icon: "Factory",
+      context: "workspace",
+      locations: ["workspace", "explorer"],
+      Component: FactoryPanel,
+    }),
+    client.addCommandCenterItem({
+      id: "open-gas-city",
+      title: "Open Gas City",
+      icon: "Factory",
+      keywords: ["gas city", "supervisor", "sessions", "convoys", "operator"],
+      context: "global",
+      onSelect({ openSurface }) {
+        openSurface("gas-city");
+      },
+    }),
+    client.addCommandCenterItem({
+      id: "configure-gas-city",
+      title: "Configure Gas City",
+      icon: "Settings",
+      keywords: ["gas city", "endpoint", "observe only", "mutations"],
+      context: "global",
+      onSelect({ openSettings }) {
+        openSettings("gas-city");
+      },
+    }),
+    client.addCommandCenterItem({
+      id: "open-gas-city-factory",
+      title: "Open Gas City Factory",
+      icon: "Factory",
+      keywords: ["gas city", "workspace", "rig", "sessions", "convoys"],
+      context: "workspace",
+      onSelect({ openPanel }) {
+        openPanel("gas-city-factory");
+      },
+    }),
+    client.addCommandCenterItem({
+      id: "sling-gas-city-work",
+      title: "Sling work in Gas City",
+      icon: "Send",
+      keywords: ["gas city", "dispatch", "bead", "agent role"],
+      context: "workspace",
+      onSelect({ workspace, openPanel }) {
+        queueSlingIntent(workspace.id, "");
+        openPanel("gas-city-factory");
+      },
+    }),
+    client.addCommandCenterItem({
+      id: "open-agent-gas-city-factory",
+      title: "Open Gas City Factory",
+      icon: "Factory",
+      keywords: ["gas city", "workspace", "agent", "session"],
+      context: "agent",
+      onSelect({ openPanel }) {
+        openPanel("gas-city-factory");
+      },
+    }),
+    client.addSlashCommand({
+      name: "sling",
+      description: "Confirm and dispatch a Gas City bead to an agent role",
+      argumentHint: "<bead-id> [agent-role]",
+      context: "workspace",
+      onSubmit({ workspace, args, openPanel }) {
+        queueSlingIntent(workspace.id, args);
+        openPanel("gas-city-factory");
+      },
+    }),
+  ];
+
+  return () => {
+    for (const cleanup of cleanups.reverse()) cleanup();
+  };
+}

package/client/dispatch-intent.ts

@@ -0,0 +1,53 @@
+import { useSyncExternalStore } from "react";
+import { parseSlingArguments, type SlingArguments } from "./view-model";
+
+export interface SlingIntent extends SlingArguments {
+  id: number;
+  parseError: string | null;
+}
+
+const intents = new Map<string, SlingIntent>();
+const listeners = new Set<() => void>();
+let nextId = 1;
+
+function emit() {
+  for (const listener of listeners) listener();
+}
+
+export function queueSlingIntent(workspaceId: string, args: string): SlingIntent {
+  const parsed = parseSlingArguments(args);
+  const intent: SlingIntent = {
+    id: nextId++,
+    beadId: parsed?.beadId ?? "",
+    agent: parsed?.agent ?? "",
+    parseError: parsed
+      ? null
+      : "Use /sling <bead-id> [agent-role]. Quote roles that contain spaces.",
+  };
+  intents.set(workspaceId, intent);
+  emit();
+  return intent;
+}
+
+export function getSlingIntent(workspaceId: string): SlingIntent | null {
+  return intents.get(workspaceId) ?? null;
+}
+
+export function dismissSlingIntent(workspaceId: string, id: number): void {
+  if (intents.get(workspaceId)?.id !== id) return;
+  intents.delete(workspaceId);
+  emit();
+}
+
+export function subscribeSlingIntent(listener: () => void): () => void {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+
+export function useSlingIntent(workspaceId: string): SlingIntent | null {
+  return useSyncExternalStore(
+    subscribeSlingIntent,
+    () => getSlingIntent(workspaceId),
+    () => null,
+  );
+}

package/client/factory-panel.tsx

@@ -0,0 +1,373 @@
+import {
+  type PluginWorkspacePanelProps,
+  useRpc,
+  useSettings,
+  useWorkspace,
+} from "@getpaseo/plugin/client";
+import { Icon } from "@getpaseo/plugin/client/react-native";
+import { useQuery } from "@tanstack/react-query";
+import { useCallback, useMemo } from "react";
+import { ActivityIndicator, Pressable, ScrollView, StyleSheet, Text, View } from "react-native";
+import {
+  type GasCitySettings,
+  gasCitySettings,
+  resolveWorkspaceRig,
+  toGasCityRpcSettings,
+  type WorkspaceRigMapping,
+} from "../shared";
+import { CityOperations } from "./city-operations";
+import { dismissSlingIntent, useSlingIntent } from "./dispatch-intent";
+
+function errorMessage(error: unknown): string {
+  return error instanceof Error ? error.message : "An unexpected error occurred.";
+}
+
+export function FactoryPanel(props: PluginWorkspacePanelProps) {
+  const settings = useSettings(gasCitySettings);
+  if (settings.status === "loading") {
+    return (
+      <FactoryState
+        {...props}
+        title="Loading Factory"
+        body="Reading persisted Gas City settings."
+        loading
+      />
+    );
+  }
+  if (settings.status !== "ready") {
+    return (
+      <FactoryState
+        {...props}
+        title="Factory settings unavailable"
+        body={settings.error}
+        onRetry={() => void settings.reload()}
+      />
+    );
+  }
+  return (
+    <ReadyFactoryPanel
+      key={`${props.workspaceId}:${settings.revision}`}
+      {...props}
+      settings={settings.values}
+    />
+  );
+}
+
+function ReadyFactoryPanel({
+  theme,
+  layout,
+  host,
+  navigation,
+  workspaceId,
+  settings,
+}: PluginWorkspacePanelProps & { settings: GasCitySettings }) {
+  const styles = useMemo(() => createStyles(theme, layout.compact), [layout.compact, theme]);
+  const rpcSettings = useMemo(() => toGasCityRpcSettings(settings), [settings]);
+  const workspace = useWorkspace(workspaceId, ({ directory, name, title }) => ({
+    directory,
+    name,
+    title,
+  }));
+  const loadMapping = useRpc(resolveWorkspaceRig);
+  const mapping = useQuery({
+    queryKey: ["gas-city", host.id, settings.endpointUrl, "workspace-mapping", workspaceId],
+    queryFn: () => loadMapping({ settings: rpcSettings, workspaceId }),
+    refetchInterval: settings.refreshIntervalMs,
+  });
+  const retryMapping = () => void mapping.refetch();
+  const slingIntent = useSlingIntent(workspaceId);
+  const dismissIntent = useCallback(
+    (id: number) => dismissSlingIntent(workspaceId, id),
+    [workspaceId],
+  );
+
+  if (mapping.isPending && !mapping.data) {
+    return (
+      <FactoryState
+        theme={theme}
+        layout={layout}
+        host={host}
+        navigation={navigation}
+        context="workspace"
+        workspaceId={workspaceId}
+        title="Mapping workspace"
+        body="Resolving this workspace to a Gas City rig."
+        loading
+      />
+    );
+  }
+  if (mapping.error && !mapping.data) {
+    return (
+      <FactoryState
+        theme={theme}
+        layout={layout}
+        host={host}
+        navigation={navigation}
+        context="workspace"
+        workspaceId={workspaceId}
+        title="Could not map workspace"
+        body={errorMessage(mapping.error)}
+        onRetry={retryMapping}
+      />
+    );
+  }
+  if (!mapping.data) {
+    return (
+      <FactoryState
+        theme={theme}
+        layout={layout}
+        host={host}
+        navigation={navigation}
+        context="workspace"
+        workspaceId={workspaceId}
+        title="No workspace mapping"
+        body="The supervisor returned no usable mapping result."
+        onRetry={retryMapping}
+      />
+    );
+  }
+
+  const resolved = mapping.data;
+  if (resolved.state !== "mapped" || !resolved.cityName || !resolved.rigName) {
+    return (
+      <MappingState
+        theme={theme}
+        layout={layout}
+        host={host}
+        navigation={navigation}
+        context="workspace"
+        workspaceId={workspaceId}
+        mapping={resolved}
+        onRetry={retryMapping}
+      />
+    );
+  }
+
+  return (
+    <View style={styles.screen}>
+      <View style={styles.mappingBar}>
+        <View style={styles.mappingIcon}>
+          <Icon name="Factory" size={15} color={theme.colors.accent} />
+        </View>
+        <View style={styles.mappingText}>
+          <Text style={styles.mappingTitle} numberOfLines={1}>
+            {workspace?.title?.trim() || workspace?.name || "Workspace Factory"}
+          </Text>
+          <Text style={styles.mappingMeta} numberOfLines={1}>
+            {resolved.cityName} / {resolved.rigName} ·{" "}
+            {resolved.source === "explicit" ? "explicit mapping" : "path mapping"}
+          </Text>
+        </View>
+        {mapping.isFetching ? <ActivityIndicator size="small" color={theme.colors.accent} /> : null}
+      </View>
+      {resolved.diagnostics.length > 0 ? (
+        <View accessibilityRole="alert" style={styles.diagnostics}>
+          <Icon name="TriangleAlert" size={14} color={theme.colors.statusWarning} />
+          <Text style={styles.diagnosticText} numberOfLines={2}>
+            {resolved.diagnostics.map((diagnostic) => diagnostic.message).join(" · ")}
+          </Text>
+        </View>
+      ) : null}
+      <View style={styles.body}>
+        <CityOperations
+          key={`${settings.endpointUrl}:${resolved.cityName}:${resolved.rigName}`}
+          theme={theme}
+          layout={layout}
+          host={host}
+          cityName={resolved.cityName}
+          rigName={resolved.rigName}
+          settings={settings}
+          slingIntent={slingIntent}
+          onDismissSlingIntent={dismissIntent}
+        />
+      </View>
+    </View>
+  );
+}
+
+function MappingState({
+  theme,
+  layout,
+  host,
+  navigation,
+  workspaceId,
+  mapping,
+  onRetry,
+}: PluginWorkspacePanelProps & { mapping: WorkspaceRigMapping; onRetry: () => void }) {
+  const styles = useMemo(() => createStyles(theme, layout.compact), [layout.compact, theme]);
+  const title =
+    mapping.state === "ambiguous"
+      ? "Choose an explicit mapping"
+      : mapping.state === "unavailable"
+        ? "Supervisor mapping unavailable"
+        : "Workspace is not mapped";
+  const body =
+    mapping.diagnostics.map((diagnostic) => diagnostic.message).join(" ") ||
+    (mapping.state === "ambiguous"
+      ? "Multiple Gas City rigs contain this workspace. Add an explicit override in Gas City settings."
+      : "No Gas City rig contains this workspace path. Add an explicit override in Gas City settings.");
+  return (
+    <View style={styles.mappingStateScreen}>
+      <FactoryState
+        theme={theme}
+        layout={layout}
+        host={host}
+        navigation={navigation}
+        context="workspace"
+        workspaceId={workspaceId}
+        title={title}
+        body={body}
+        onRetry={onRetry}
+      />
+      {mapping.candidates.length > 0 ? (
+        <ScrollView style={styles.candidates} contentContainerStyle={styles.candidatesContent}>
+          <Text accessibilityRole="header" style={styles.candidatesTitle}>
+            Mapping candidates
+          </Text>
+          {mapping.candidates.map((candidate) => (
+            <View key={`${candidate.cityName}:${candidate.rigPath}`} style={styles.candidateRow}>
+              <Icon name="GitBranch" size={14} color={theme.colors.foregroundMuted} />
+              <View style={styles.mappingText}>
+                <Text style={styles.mappingTitle}>
+                  {candidate.cityName} / {candidate.rigName}
+                </Text>
+                <Text style={styles.mappingMeta} numberOfLines={1}>
+                  {candidate.rigPath}
+                </Text>
+              </View>
+            </View>
+          ))}
+        </ScrollView>
+      ) : null}
+    </View>
+  );
+}
+
+function FactoryState({
+  theme,
+  title,
+  body,
+  loading,
+  onRetry,
+}: PluginWorkspacePanelProps & {
+  title: string;
+  body: string;
+  loading?: boolean;
+  onRetry?: () => void;
+}) {
+  const styles = useMemo(() => createStyles(theme, true), [theme]);
+  return (
+    <View style={styles.stateCard}>
+      {loading ? (
+        <ActivityIndicator color={theme.colors.accent} />
+      ) : (
+        <Icon name="Factory" size={28} color={theme.colors.foregroundMuted} />
+      )}
+      <Text accessibilityRole="header" style={styles.stateTitle}>
+        {title}
+      </Text>
+      <Text style={styles.stateBody}>{body}</Text>
+      {onRetry ? (
+        <Pressable
+          accessibilityRole="button"
+          accessibilityLabel="Retry Gas City workspace mapping"
+          onPress={onRetry}
+          style={({ pressed }) => [styles.retryButton, pressed && styles.pressed]}
+        >
+          <Text style={styles.retryText}>Retry</Text>
+        </Pressable>
+      ) : null}
+    </View>
+  );
+}
+
+function createStyles(theme: PluginWorkspacePanelProps["theme"], compact: boolean) {
+  return StyleSheet.create({
+    screen: { flex: 1, backgroundColor: theme.colors.surface0 },
+    body: { flex: 1 },
+    mappingBar: {
+      minHeight: 54,
+      flexDirection: "row",
+      alignItems: "center",
+      gap: 9,
+      paddingHorizontal: compact ? 12 : 18,
+      borderBottomWidth: StyleSheet.hairlineWidth,
+      borderBottomColor: theme.colors.border,
+      backgroundColor: theme.colors.surface0,
+    },
+    mappingIcon: {
+      width: 30,
+      height: 30,
+      alignItems: "center",
+      justifyContent: "center",
+      borderRadius: 6,
+      backgroundColor: theme.colors.surface0,
+    },
+    mappingText: { flex: 1, minWidth: 0, gap: 2 },
+    mappingTitle: { color: theme.colors.foreground, fontSize: 12, fontWeight: "700" },
+    mappingMeta: { color: theme.colors.foregroundMuted, fontSize: 10 },
+    diagnostics: {
+      flexDirection: "row",
+      alignItems: "center",
+      gap: 7,
+      paddingHorizontal: compact ? 12 : 18,
+      paddingVertical: 8,
+      borderBottomWidth: StyleSheet.hairlineWidth,
+      borderBottomColor: theme.colors.border,
+    },
+    diagnosticText: { flex: 1, color: theme.colors.statusWarning, fontSize: 10 },
+    mappingStateScreen: { flex: 1, backgroundColor: theme.colors.surface0 },
+    stateCard: {
+      alignItems: "center",
+      justifyContent: "center",
+      gap: 9,
+      padding: 24,
+      backgroundColor: theme.colors.surface0,
+    },
+    stateTitle: {
+      color: theme.colors.foreground,
+      fontSize: 17,
+      fontWeight: "800",
+      textAlign: "center",
+    },
+    stateBody: {
+      maxWidth: 480,
+      color: theme.colors.foregroundMuted,
+      fontSize: 12,
+      lineHeight: 18,
+      textAlign: "center",
+    },
+    retryButton: {
+      minHeight: 36,
+      justifyContent: "center",
+      paddingHorizontal: 13,
+      borderRadius: 6,
+      backgroundColor: theme.colors.accent,
+    },
+    retryText: { color: theme.colors.accentForeground, fontSize: 12, fontWeight: "700" },
+    candidates: {
+      flex: 1,
+      borderTopWidth: StyleSheet.hairlineWidth,
+      borderTopColor: theme.colors.border,
+    },
+    candidatesContent: { gap: 7, padding: compact ? 12 : 18 },
+    candidatesTitle: {
+      color: theme.colors.foreground,
+      fontSize: 10,
+      fontWeight: "700",
+      letterSpacing: 0.9,
+      textTransform: "uppercase",
+      marginBottom: 4,
+    },
+    candidateRow: {
+      flexDirection: "row",
+      alignItems: "center",
+      gap: 8,
+      paddingVertical: 12,
+      paddingHorizontal: 10,
+      borderBottomWidth: StyleSheet.hairlineWidth,
+      borderColor: theme.colors.border,
+    },
+    pressed: { opacity: 0.72 },
+  });
+}