create-interview-cockpit 0.4.0 → 0.6.0

package/template/client/src/store.ts

@@ -1,8 +1,36 @@
 import { create } from "zustand";
-import type { Topic, Question, CodeSnippet, WorkspaceMeta } from "./types";
+import type {
+  Topic,
+  Question,
+  CodeSnippet,
+  WorkspaceMeta,
+  InfraLabWorkspace,
+  FrontendLabWorkspace,
+} from "./types";
 import type { AiSettings } from "./api";
 import * as api from "./api";
 
+// Default Express server used when opening a React/Next.js sandbox with no prior server code
+const DEFAULT_SERVER_CODE = `import express from 'express';
+const app = express();
+app.use(express.json());
+// Allow requests from the React preview iframe
+app.use((_req, res, next) => {
+  res.setHeader('Access-Control-Allow-Origin', '*');
+  res.setHeader('Access-Control-Allow-Methods', 'GET,POST,PUT,DELETE,OPTIONS');
+  res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
+  if (_req.method === 'OPTIONS') { res.sendStatus(204); return; }
+  next();
+});
+
+app.get('/api/hello', (_req, res) => {
+  res.json({ message: 'Hello from Express!', time: Date.now() });
+});
+
+const port = Number(process.env.PORT);
+app.listen(port, () => console.log('Server on :' + port));
+`;
+
 const DEFAULT_AI_SETTINGS: AiSettings = {
   systemPrompt: "",
   responseProfiles: {
@@ -11,6 +39,9 @@ const DEFAULT_AI_SETTINGS: AiSettings = {
     normal: { maxOutputTokens: 3000, maxSteps: 5 },
   },
   vizGuide: "",
+  plotGuide: "",
+  alwaysSendPrefsDefault: false,
+  thinkingBudget: 0,
   promptGroups: {
     length: {
       label: "Response Length",
@@ -50,6 +81,19 @@ const DEFAULT_AI_SETTINGS: AiSettings = {
           "When using technical terms or abbreviations, immediately expand their meaning in square brackets right after the term — e.g. 'TCP [Transmission Control Protocol — a connection-oriented transport protocol]' or 'idempotent [an operation that produces the same result no matter how many times it is applied]'. Do this throughout your response so I never need to look anything up.",
       },
     },
+    "diagram-use": {
+      label: "Diagram Usage",
+      description: "Which visual formats to use and how often.",
+      default: "none",
+      options: {
+        none: "",
+        vizcraft:
+          "Prioritize using vizcraft (viz) diagrams as much as possible. *NB:* Character limits do not apply to these diagrams",
+        mermaid:
+          "Prioritize using mermaid diagrams as much as possible. *NB:* Character limits do not apply to these diagrams",
+        plot: "Prioritize using plot blocks for graphs, curves, distributions, and data charts when they would make the explanation clearer. *NB:* Character limits do not apply to these plots",
+      },
+    },
   },
 };
 
@@ -64,6 +108,7 @@ interface Store {
   showCodePanel: boolean;
   showSidebar: boolean;
   viewingFile: string | null;
+  viewingDoc: { fileId: string; quote: string; fileName: string } | null;
 
   // ── Workspaces ───────────────────────────────────────────────
   workspaces: WorkspaceMeta[];
@@ -105,19 +150,30 @@ interface Store {
   createDriveSubfolder: (
     id: string,
     name: string,
-  ) => Promise<import("./api").DriveFolder>;
+  ) => Promise<
+    import("./api").DriveFolder | { needsAuth: true; authUrl: string }
+  >;
 
   fetchTopics: () => Promise<void>;
   fetchQuestions: (topicId: string) => Promise<void>;
   addTopic: (name: string) => Promise<void>;
   removeTopic: (id: string) => Promise<void>;
   renameTopic: (id: string, name: string) => Promise<void>;
+  updateTopicSystemContext: (
+    id: string,
+    systemContext: string,
+  ) => Promise<void>;
   addQuestion: (topicId: string, title: string) => Promise<void>;
   addChildQuestion: (
     topicId: string,
     parentQuestionId: string,
     title: string,
   ) => Promise<void>;
+  moveQuestion: (
+    questionId: string,
+    topicId: string,
+    parentQuestionId: string | null,
+  ) => Promise<void>;
   removeQuestion: (questionId: string, topicId: string) => Promise<void>;
   renameQuestion: (
     questionId: string,
@@ -136,18 +192,57 @@ interface Store {
     files: FileList | File[],
   ) => Promise<void>;
   removeTopicFile: (topicId: string, fileId: string) => Promise<void>;
+  linkFileToTopic: (
+    topicId: string,
+    fileId: string,
+    originalName: string,
+  ) => Promise<void>;
   uploadQuestionFiles: (
     questionId: string,
     files: FileList | File[],
   ) => Promise<void>;
   removeQuestionFile: (questionId: string, fileId: string) => Promise<void>;
+  linkFileToQuestion: (
+    questionId: string,
+    fileId: string,
+    originalName: string,
+  ) => Promise<void>;
+  saveCodeSnippetToQuestion: (
+    questionId: string,
+    code: string,
+    language: string,
+    label: string,
+    origin: "user" | "ai" | "sandbox" | "infra" | "react" | "nextjs",
+  ) => Promise<import("./types").ContextFile>;
   clearMessages: (questionId: string) => Promise<void>;
+
+  // ── Linked Conversations ─────────────────────────────────────
+  linkConversation: (questionId: string, linkedId: string) => Promise<void>;
+  unlinkConversation: (questionId: string, linkedId: string) => Promise<void>;
+
+  // ── Workspace Context Files ──────────────────────────────────
+  workspaceFiles: import("./types").ContextFile[];
+  fetchWorkspaceFiles: () => Promise<void>;
+  uploadWorkspaceFiles: (files: FileList | File[]) => Promise<void>;
+  removeWorkspaceFile: (fileId: string) => Promise<void>;
+
   updateQuestionSystemContext: (
     questionId: string,
     systemContext: string,
   ) => Promise<void>;
   openFileViewer: (path: string) => void;
   closeFileViewer: () => void;
+  openDocViewer: (fileId: string, quote: string, fileName: string) => void;
+  closeDocViewer: () => void;
+  /** Inline code blocks written by the AI, keyed by `inline:<id>` */
+  inlineCodeSnippets: Record<
+    string,
+    { content: string; language: string; label: string }
+  >;
+  registerInlineCode: (
+    id: string,
+    entry: { content: string; language: string; label: string },
+  ) => void;
   codeSnippets: CodeSnippet[];
   addSnippet: (snippet: CodeSnippet) => void;
   removeSnippet: (id: string) => void;
@@ -157,13 +252,83 @@ interface Store {
   aiSettings: AiSettings;
   fetchAiSettings: () => Promise<void>;
   saveAiSettings: (patch: Partial<AiSettings>) => Promise<void>;
+  /** The currently active preference suffix (LENGTH/STYLE/AUDIENCE/etc) built by ChatView. */
+  livePreferenceSuffix: string;
+  setLivePreferenceSuffix: (suffix: string) => void;
   showSettings: boolean;
   openSettings: () => void;
   closeSettings: () => void;
+
+  // ── Code Runner ──────────────────────────────────────────────
+  showCodeRunner: boolean;
+  /** Code pre-filled into the runner when opened */
+  runnerInitialCode: string;
+  /** Language hint — 'typescript' or 'javascript' */
+  runnerInitialLanguage: string;
+  /** When set, opens the runner in sandbox mode with these values pre-filled */
+  runnerInitialSandbox: {
+    serverCode: string;
+    serverLang: string;
+    clientCode: string;
+    clientLang: string;
+    fileId?: string;
+    /** If set, the client panel opens in React or Next.js preview mode instead of script mode */
+    clientType?: "script" | "react" | "nextjs";
+    reactFiles?: Record<string, string> | null;
+    reactActiveFile?: string | null;
+  } | null;
+  /** When set, the script runner opens with this file pre-loaded — Save will overwrite it */
+  runnerInitialFileId: string | null;
+  openCodeRunner: (code?: string, language?: string, fileId?: string) => void;
+  openSandbox: (
+    serverCode: string,
+    serverLang: string,
+    clientCode: string,
+    clientLang: string,
+    fileId?: string,
+    opts?: {
+      clientType?: "script" | "react" | "nextjs";
+      reactFiles?: Record<string, string>;
+      reactActiveFile?: string;
+    },
+  ) => void;
+  overwriteContextFileContent: (
+    questionId: string,
+    fileId: string,
+    content: string,
+  ) => Promise<void>;
+  renameContextFile: (
+    questionId: string,
+    fileId: string,
+    label: string,
+  ) => Promise<void>;
+  closeCodeRunner: () => void;
+
+  // ── Infra Lab ────────────────────────────────────────────────
+  showInfraLab: boolean;
+  runnerInitialInfra: InfraLabWorkspace | null;
+  runnerInitialInfraFileId: string | null;
+  openInfraLab: (workspace?: InfraLabWorkspace, fileId?: string) => void;
+  closeInfraLab: () => void;
+
+  // ── Frontend Labs (React / Next.js) — open inside the sandbox ──
+  openReactLab: (
+    workspace?: FrontendLabWorkspace,
+    fileId?: string,
+    serverCode?: string,
+    serverLang?: string,
+  ) => void;
+  openNextLab: (
+    workspace?: FrontendLabWorkspace,
+    fileId?: string,
+    serverCode?: string,
+    serverLang?: string,
+  ) => void;
 }
 
 export const useStore = create<Store>((set, get) => ({
   topics: [],
+  workspaceFiles: [],
   questionsByTopic: {},
   selectedTopicId: null,
   selectedQuestionId: null,
@@ -173,9 +338,20 @@ export const useStore = create<Store>((set, get) => ({
   showCodePanel: false,
   showSidebar: true,
   viewingFile: null,
+  viewingDoc: null,
+  inlineCodeSnippets: {},
   codeSnippets: [],
   aiSettings: DEFAULT_AI_SETTINGS,
+  livePreferenceSuffix: "",
   showSettings: false,
+  showCodeRunner: false,
+  runnerInitialCode: "",
+  runnerInitialLanguage: "typescript",
+  runnerInitialSandbox: null,
+  runnerInitialFileId: null,
+  showInfraLab: false,
+  runnerInitialInfra: null,
+  runnerInitialInfraFileId: null,
 
   // ── Workspaces ───────────────────────────────────────────────
   workspaces: [],
@@ -215,6 +391,8 @@ export const useStore = create<Store>((set, get) => ({
     });
     const topics = await api.fetchTopics();
     set({ topics });
+    const workspaceFiles = await api.fetchWorkspaceFiles();
+    set({ workspaceFiles });
   },
 
   deleteWorkspace: async (id) => {
@@ -363,6 +541,13 @@ export const useStore = create<Store>((set, get) => ({
     }));
   },
 
+  updateTopicSystemContext: async (id, systemContext) => {
+    await api.updateTopic(id, { systemContext });
+    set((s) => ({
+      topics: s.topics.map((t) => (t.id === id ? { ...t, systemContext } : t)),
+    }));
+  },
+
   addQuestion: async (topicId, title) => {
     const question = await api.createQuestion(topicId, title);
     set((s) => ({
@@ -383,6 +568,29 @@ export const useStore = create<Store>((set, get) => ({
     }));
   },
 
+  moveQuestion: async (questionId, topicId, parentQuestionId) => {
+    await api.updateQuestion(questionId, {
+      parentQuestionId,
+    });
+    set((s) => ({
+      questionsByTopic: {
+        ...s.questionsByTopic,
+        [topicId]: (s.questionsByTopic[topicId] || []).map((q) =>
+          q.id === questionId
+            ? { ...q, parentQuestionId: parentQuestionId ?? undefined }
+            : q,
+        ),
+      },
+      currentQuestion:
+        s.currentQuestion?.id === questionId
+          ? {
+              ...s.currentQuestion,
+              parentQuestionId: parentQuestionId ?? undefined,
+            }
+          : s.currentQuestion,
+    }));
+  },
+
   removeQuestion: async (questionId, topicId) => {
     await api.deleteQuestion(questionId);
     set((s) => ({
@@ -506,6 +714,17 @@ export const useStore = create<Store>((set, get) => ({
     }));
   },
 
+  linkFileToTopic: async (topicId, fileId, originalName) => {
+    const cf = await api.linkFileToTopic(topicId, fileId, originalName);
+    set((s) => ({
+      topics: s.topics.map((t) =>
+        t.id === topicId
+          ? { ...t, contextFiles: [...(t.contextFiles || []), cf] }
+          : t,
+      ),
+    }));
+  },
+
   uploadQuestionFiles: async (questionId, files) => {
     const uploaded = await api.uploadQuestionFiles(questionId, files);
     set((s) => ({
@@ -537,6 +756,45 @@ export const useStore = create<Store>((set, get) => ({
     }));
   },
 
+  linkFileToQuestion: async (questionId, fileId, originalName) => {
+    const cf = await api.linkFileToQuestion(questionId, fileId, originalName);
+    set((s) => ({
+      currentQuestion:
+        s.currentQuestion?.id === questionId
+          ? {
+              ...s.currentQuestion,
+              contextFiles: [...(s.currentQuestion.contextFiles || []), cf],
+            }
+          : s.currentQuestion,
+    }));
+  },
+
+  saveCodeSnippetToQuestion: async (
+    questionId,
+    code,
+    language,
+    label,
+    origin,
+  ) => {
+    const cf = await api.saveCodeSnippet(
+      questionId,
+      code,
+      language,
+      label,
+      origin,
+    );
+    set((s) => ({
+      currentQuestion:
+        s.currentQuestion?.id === questionId
+          ? {
+              ...s.currentQuestion,
+              contextFiles: [...(s.currentQuestion.contextFiles || []), cf],
+            }
+          : s.currentQuestion,
+    }));
+    return cf;
+  },
+
   clearMessages: async (questionId) => {
     await api.updateQuestion(questionId, { messages: [] });
     set((s) => ({
@@ -547,6 +805,55 @@ export const useStore = create<Store>((set, get) => ({
     }));
   },
 
+  linkConversation: async (questionId, linkedId) => {
+    const q = get().currentQuestion;
+    const current =
+      q?.id === questionId ? q : await api.fetchQuestion(questionId);
+    const existing = current.linkedConversationIds ?? [];
+    if (existing.includes(linkedId)) return;
+    const updated = [...existing, linkedId];
+    await api.updateQuestion(questionId, { linkedConversationIds: updated });
+    set((s) => ({
+      currentQuestion:
+        s.currentQuestion?.id === questionId
+          ? { ...s.currentQuestion, linkedConversationIds: updated }
+          : s.currentQuestion,
+    }));
+  },
+
+  unlinkConversation: async (questionId, linkedId) => {
+    const q = get().currentQuestion;
+    const current =
+      q?.id === questionId ? q : await api.fetchQuestion(questionId);
+    const updated = (current.linkedConversationIds ?? []).filter(
+      (id) => id !== linkedId,
+    );
+    await api.updateQuestion(questionId, { linkedConversationIds: updated });
+    set((s) => ({
+      currentQuestion:
+        s.currentQuestion?.id === questionId
+          ? { ...s.currentQuestion, linkedConversationIds: updated }
+          : s.currentQuestion,
+    }));
+  },
+
+  fetchWorkspaceFiles: async () => {
+    const files = await api.fetchWorkspaceFiles();
+    set({ workspaceFiles: files });
+  },
+
+  uploadWorkspaceFiles: async (files) => {
+    const uploaded = await api.uploadWorkspaceFiles(files);
+    set((s) => ({ workspaceFiles: [...s.workspaceFiles, ...uploaded] }));
+  },
+
+  removeWorkspaceFile: async (fileId) => {
+    await api.deleteWorkspaceFile(fileId);
+    set((s) => ({
+      workspaceFiles: s.workspaceFiles.filter((f) => f.id !== fileId),
+    }));
+  },
+
   updateQuestionSystemContext: async (questionId, systemContext) => {
     const updated = await api.updateQuestion(questionId, { systemContext });
     set((s) => ({
@@ -568,6 +875,111 @@ export const useStore = create<Store>((set, get) => ({
 
   openFileViewer: (path) => set({ viewingFile: path }),
   closeFileViewer: () => set({ viewingFile: null }),
+  registerInlineCode: (id, entry) =>
+    set((s) => ({
+      inlineCodeSnippets: { ...s.inlineCodeSnippets, [id]: entry },
+    })),
+  openDocViewer: (fileId, quote, fileName) =>
+    set({ viewingDoc: { fileId, quote, fileName } }),
+  closeDocViewer: () => set({ viewingDoc: null }),
+  openCodeRunner: (code = "", language = "typescript", fileId?) =>
+    set({
+      showCodeRunner: true,
+      showInfraLab: false,
+      runnerInitialCode: code,
+      runnerInitialLanguage: language,
+      runnerInitialSandbox: null,
+      runnerInitialFileId: fileId ?? null,
+    }),
+  openSandbox: (
+    serverCode,
+    serverLang,
+    clientCode,
+    clientLang,
+    fileId?,
+    opts?,
+  ) =>
+    set({
+      showCodeRunner: true,
+      showInfraLab: false,
+      runnerInitialCode: "",
+      runnerInitialLanguage: "typescript",
+      runnerInitialSandbox: {
+        serverCode,
+        serverLang,
+        clientCode,
+        clientLang,
+        fileId,
+        clientType: opts?.clientType,
+        reactFiles: opts?.reactFiles,
+        reactActiveFile: opts?.reactActiveFile,
+      },
+      runnerInitialFileId: null,
+    }),
+  openInfraLab: (workspace, fileId?) =>
+    set({
+      showInfraLab: true,
+      showCodeRunner: false,
+      runnerInitialInfra: workspace ?? null,
+      runnerInitialInfraFileId: fileId ?? null,
+    }),
+  openReactLab: (workspace?, fileId?, serverCode?, serverLang?) =>
+    set({
+      showCodeRunner: true,
+      showInfraLab: false,
+      runnerInitialCode: "",
+      runnerInitialLanguage: "typescript",
+      runnerInitialSandbox: {
+        serverCode: serverCode ?? DEFAULT_SERVER_CODE,
+        serverLang: serverLang ?? "typescript",
+        clientCode: "",
+        clientLang: "javascript",
+        fileId,
+        clientType: "react",
+        reactFiles: workspace?.files ?? null,
+        reactActiveFile: workspace?.activeFile ?? null,
+      },
+      runnerInitialFileId: null,
+    }),
+  openNextLab: (workspace?, fileId?, serverCode?, serverLang?) =>
+    set({
+      showCodeRunner: true,
+      showInfraLab: false,
+      runnerInitialCode: "",
+      runnerInitialLanguage: "typescript",
+      runnerInitialSandbox: {
+        serverCode: serverCode ?? DEFAULT_SERVER_CODE,
+        serverLang: serverLang ?? "typescript",
+        clientCode: "",
+        clientLang: "javascript",
+        fileId,
+        clientType: "nextjs",
+        reactFiles: workspace?.files ?? null,
+        reactActiveFile: workspace?.activeFile ?? null,
+      },
+      runnerInitialFileId: null,
+    }),
+
+  overwriteContextFileContent: async (questionId, fileId, content) => {
+    await api.overwriteContextFileContent(questionId, fileId, content);
+  },
+
+  renameContextFile: async (questionId, fileId, label) => {
+    const cf = await api.renameContextFile(questionId, fileId, label);
+    set((s) => ({
+      currentQuestion:
+        s.currentQuestion?.id === questionId
+          ? {
+              ...s.currentQuestion,
+              contextFiles: (s.currentQuestion.contextFiles || []).map((f) =>
+                f.id === fileId ? { ...f, label: cf.label, name: cf.name } : f,
+              ),
+            }
+          : s.currentQuestion,
+    }));
+  },
+  closeCodeRunner: () => set({ showCodeRunner: false }),
+  closeInfraLab: () => set({ showInfraLab: false }),
 
   fetchAiSettings: async () => {
     const settings = await api.fetchAiSettings();
@@ -579,6 +991,8 @@ export const useStore = create<Store>((set, get) => ({
     set({ aiSettings: updated });
   },
 
+  setLivePreferenceSuffix: (suffix) => set({ livePreferenceSuffix: suffix }),
+
   openSettings: () => set({ showSettings: true }),
   closeSettings: () => set({ showSettings: false }),
 }));

package/template/client/src/types.ts

@@ -1,9 +1,45 @@
+export type ContextFileOrigin =
+  | "user"
+  | "ai"
+  | "upload"
+  | "sandbox"
+  | "infra"
+  | "react"
+  | "nextjs";
+
 export interface ContextFile {
   id: string;
   name: string;
   originalName: string;
   driveFileId?: string;
   createdAt: string;
+  /** Distinguishes how this file was added. 'upload' = user-uploaded doc,
+   *  'user' = code saved from Code Runner, 'ai' = AI-generated code block,
+   *  'sandbox' = paired server+client sandbox saved as JSON,
+   *  'infra' = Terraform-style infra lab workspace saved as JSON. */
+  origin?: ContextFileOrigin;
+  /** Language hint for code snippets (e.g. 'typescript', 'javascript'). */
+  language?: string;
+  /** Short display label for code snippets. */
+  label?: string;
+}
+
+export interface FrontendLabWorkspace {
+  version: 1;
+  label: string;
+  /** Determines defaults, entry file, and file-tree conventions. */
+  type: "react" | "nextjs";
+  activeFile: string;
+  files: Record<string, string>;
+}
+
+export interface InfraLabWorkspace {
+  version: 1;
+  label: string;
+  provider: "aws";
+  executionMode: "plan-only" | "localstack";
+  activeFile: string;
+  files: Record<string, string>;
 }
 
 export interface WorkspaceMeta {
@@ -29,6 +65,8 @@ export interface Topic {
   id: string;
   name: string;
   contextFiles: ContextFile[];
+  /** Topic-wide system prompt prepended to every question's context in this topic. */
+  systemContext?: string;
   createdAt: string;
 }
 
@@ -74,7 +112,7 @@ export interface ReadingBookmark {
 export interface Question {
   id: string;
   topicId: string;
-  parentQuestionId?: string;
+  parentQuestionId?: string | null;
   title: string;
   systemContext: string;
   codeContextFiles: string[];
@@ -82,5 +120,7 @@ export interface Question {
   messages: Message[];
   annotations?: Annotation[];
   readingBookmark?: ReadingBookmark;
+  /** IDs of other questions in the same topic whose conversation history is injected as context. */
+  linkedConversationIds?: string[];
   createdAt: string;
 }

package/template/client/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["./src/app.tsx","./src/api.ts","./src/main.tsx","./src/store.ts","./src/types.ts","./src/vite-env.d.ts","./src/components/chatmessage.tsx","./src/components/chatview.tsx","./src/components/codecontextpanel.tsx","./src/components/fileattachments.tsx","./src/components/fileviewermodal.tsx","./src/components/markdownrenderer.tsx","./src/components/mermaiddiagram.tsx","./src/components/sidebar.tsx","./src/components/textannotator.tsx"],"version":"5.9.3"}
+{"root":["./src/app.tsx","./src/api.ts","./src/main.tsx","./src/store.ts","./src/types.ts","./src/vite-env.d.ts","./src/components/aisettingsmodal.tsx","./src/components/annotationdialog.tsx","./src/components/chatmessage.tsx","./src/components/chatview.tsx","./src/components/codecontextpanel.tsx","./src/components/codelineannotationpopup.tsx","./src/components/coderunnermodal.tsx","./src/components/docrefmodal.tsx","./src/components/fileattachments.tsx","./src/components/filepickermodal.tsx","./src/components/fileviewermodal.tsx","./src/components/linkedconvospicker.tsx","./src/components/markdownrenderer.tsx","./src/components/mermaiddiagram.tsx","./src/components/plotembed.tsx","./src/components/sidebar.tsx","./src/components/textannotator.tsx","./src/components/vizcraftembed.tsx","./src/components/workspaceswitcher.tsx"],"version":"5.9.3"}

package/template/cockpit.json

@@ -1,3 +1,3 @@
 {
-  "version": "0.3.0"
+  "version": "0.4.0"
 }

package/template/package.json

@@ -6,7 +6,7 @@
     "dev": "concurrently -n server,client -c blue,green \"npm run dev --prefix server\" \"npm run dev --prefix client\"",
     "build": "npm run build --prefix client",
     "start": "npm run start --prefix server",
-    "sync:template": "npx create-interview-cockpit upgrade"
+    "sync:template": "node scripts/sync-template.js"
   },
   "devDependencies": {
     "concurrently": "^9.1.0"