Import package scripts when creating projects (#322)

BunsDev · web-flow · commit 2581044c29c0 · 2026-04-06T22:07:42.000-05:00
- Extract shared project import resolution into `projectImport`
- Auto-fill project actions from package scripts in sidebar and home
- Show a warning when lockfiles make package manager selection ambiguous
diff --git a/apps/web/src/components/CodeViewerPanel.tsx b/apps/web/src/components/CodeViewerPanel.tsx
@@ -498,8 +498,7 @@ export const CodeViewerFileContent = memo(function CodeViewerFileContent(
                   "border-primary/40 text-primary hover:bg-primary/10 dark:border-primary/30 dark:text-primary",
                 saveButtonState === "saved" &&
                   "border-emerald-500/30 text-emerald-600 hover:bg-emerald-500/10 dark:border-emerald-500/20 dark:text-emerald-400",
-                saveButtonState === "clean" &&
-                  "text-muted-foreground",
+                saveButtonState === "clean" && "text-muted-foreground",
               )}
               title={
                 saveButtonState === "dirty"
@@ -603,8 +602,6 @@ export default function CodeViewerPanel() {
     [setPendingContext],
   );
 
-
-
   return (
     <div className="flex h-full w-full flex-col bg-background">
       <div
diff --git a/apps/web/src/components/DiffPanel.tsx b/apps/web/src/components/DiffPanel.tsx
@@ -319,9 +319,7 @@ export default function DiffPanel({ mode = "inline" }: DiffPanelProps) {
     if (!selectedFilePath || !patchViewportRef.current) {
       return;
     }
-    const selectedFile = renderableFiles.find(
-      (f) => resolveFileDiffPath(f) === selectedFilePath,
-    );
+    const selectedFile = renderableFiles.find((f) => resolveFileDiffPath(f) === selectedFilePath);
     if (selectedFile) {
       const key = buildFileDiffRenderKey(selectedFile);
       setCollapsedFileKeys((current) => {
@@ -546,9 +544,7 @@ export default function DiffPanel({ mode = "inline" }: DiffPanelProps) {
                   const filePath = resolveFileDiffPath(fileDiff);
                   const fileKey = buildFileDiffRenderKey(fileDiff);
                   const themedFileKey = `${fileKey}:${resolvedTheme}`;
-                  const isAccepted = acceptedFileKeys.has(
-                    buildAcceptedDiffFileKey(fileDiff),
-                  );
+                  const isAccepted = acceptedFileKeys.has(buildAcceptedDiffFileKey(fileDiff));
                   const isCollapsed = collapsedFileKeys.has(fileKey);
                   const changeType = categorizeFileDiff(fileDiff);
                   return (
@@ -642,8 +638,7 @@ export default function DiffPanel({ mode = "inline" }: DiffPanelProps) {
                           <FileDiff
                             fileDiff={fileDiff}
                             options={{
-                              diffStyle:
-                                diffRenderMode === "split" ? "split" : "unified",
+                              diffStyle: diffRenderMode === "split" ? "split" : "unified",
                               lineDiffType: "none",
                               overflow: diffWordWrap ? "wrap" : "scroll",
                               theme: resolveDiffThemeName(resolvedTheme),
diff --git a/apps/web/src/components/Sidebar.tsx b/apps/web/src/components/Sidebar.tsx
@@ -123,12 +123,7 @@ import { WorkspaceFileTree } from "~/components/WorkspaceFileTree";
 import { EditableThreadTitle } from "~/components/EditableThreadTitle";
 import { useProjectTitleEditor } from "~/hooks/useProjectTitleEditor";
 import { useThreadTitleEditor } from "~/hooks/useThreadTitleEditor";
-import {
-  buildProjectScriptDraftsFromPackageScripts,
-  materializeProjectScripts,
-  readPackageScriptInventory,
-  resolvePackageManagerResolution,
-} from "~/projectScriptDefaults";
+import { resolveImportedProjectScripts } from "~/lib/projectImport";
 import { useClientMode } from "~/hooks/useClientMode";
 import { CloneRepositoryDialog } from "~/components/CloneRepositoryDialog";
 import { getProjectColor } from "~/projectColors";
@@ -769,28 +764,8 @@ export default function Sidebar() {
       const createdAt = new Date().toISOString();
       const title = cwd.split(/[/\\]/).findLast(isNonEmptyString) ?? cwd;
       try {
-        let projectScripts;
-        let packageScriptWarning: string | null = null;
-        try {
-          const inventory = await readPackageScriptInventory(api, cwd);
-          const packageManagerResolution = resolvePackageManagerResolution(inventory);
-          packageScriptWarning =
-            inventory.scriptNames.length > 0 ? packageManagerResolution.warning : null;
-          if (
-            inventory.scriptNames.length > 0 &&
-            packageManagerResolution.preferredPackageManager &&
-            !packageManagerResolution.requiresManualSelection
-          ) {
-            projectScripts = materializeProjectScripts(
-              buildProjectScriptDraftsFromPackageScripts({
-                scriptNames: inventory.scriptNames,
-                packageManager: packageManagerResolution.preferredPackageManager,
-              }),
-            );
-          }
-        } catch {
-          projectScripts = undefined;
-        }
+        const { scripts: projectScripts, warning: packageScriptWarning } =
+          await resolveImportedProjectScripts(api, cwd);
 
         await api.orchestration.dispatchCommand({
           type: "project.create",
diff --git a/apps/web/src/components/file-view/FileViewShell.tsx b/apps/web/src/components/file-view/FileViewShell.tsx
@@ -84,8 +84,6 @@ export function FileViewShell(props: { initialCwd: string; initialPath: string |
     [setPendingContext],
   );
 
-
-
   return (
     <div className="flex h-full w-full flex-col">
       {/* Tab bar */}
diff --git a/apps/web/src/components/home/ChatHomeEmptyState.tsx b/apps/web/src/components/home/ChatHomeEmptyState.tsx
@@ -7,6 +7,7 @@ import { useAppSettings } from "../../appSettings";
 import { APP_DISPLAY_NAME } from "../../branding";
 import { isElectron } from "../../env";
 import { useHandleNewThread } from "../../hooks/useHandleNewThread";
+import { resolveImportedProjectScripts } from "../../lib/projectImport";
 import { serverConfigQueryOptions } from "../../lib/serverReactQuery";
 import { newCommandId, newProjectId } from "../../lib/utils";
 import { readNativeApi } from "../../nativeApi";
@@ -105,15 +106,25 @@ export function ChatHomeEmptyState() {
     const title = pickedPath.split(/[/\\]/).findLast((segment) => segment.length > 0) ?? pickedPath;
     try {
       const projectId = newProjectId();
+      const { scripts: projectScripts, warning: packageScriptWarning } =
+        await resolveImportedProjectScripts(api, pickedPath);
       await api.orchestration.dispatchCommand({
         type: "project.create",
         commandId: newCommandId(),
         projectId,
         title,
         workspaceRoot: pickedPath,
         defaultModel: DEFAULT_MODEL_BY_PROVIDER.codex,
+        ...(projectScripts ? { scripts: projectScripts } : {}),
         createdAt: new Date().toISOString(),
       });
+      if (packageScriptWarning) {
+        toastManager.add({
+          type: "warning",
+          title: "Project actions need a package manager choice",
+          description: packageScriptWarning,
+        });
+      }
       await handleNewThread(projectId, {
         envMode: appSettings.defaultThreadEnvMode,
       }).catch(() => undefined);
@@ -146,15 +157,25 @@ export function ChatHomeEmptyState() {
 
       const projectId = newProjectId();
       try {
+        const { scripts: projectScripts, warning: packageScriptWarning } =
+          await resolveImportedProjectScripts(api, result.path);
         await api.orchestration.dispatchCommand({
           type: "project.create",
           commandId: newCommandId(),
           projectId,
           title: result.repoName,
           workspaceRoot: result.path,
           defaultModel: DEFAULT_MODEL_BY_PROVIDER.codex,
+          ...(projectScripts ? { scripts: projectScripts } : {}),
           createdAt: new Date().toISOString(),
         });
+        if (packageScriptWarning) {
+          toastManager.add({
+            type: "warning",
+            title: "Project actions need a package manager choice",
+            description: packageScriptWarning,
+          });
+        }
         await handleNewThread(projectId, {
           envMode: appSettings.defaultThreadEnvMode,
         }).catch(() => undefined);
diff --git a/apps/web/src/lib/projectImport.test.ts b/apps/web/src/lib/projectImport.test.ts
@@ -0,0 +1,77 @@
+import { describe, expect, it, vi } from "vitest";
+
+import { resolveImportedProjectScripts } from "./projectImport";
+
+describe("resolveImportedProjectScripts", () => {
+  it("imports scripts when the package manager can be resolved automatically", async () => {
+    const api = {
+      projects: {
+        readFile: vi.fn().mockResolvedValue({
+          relativePath: "package.json",
+          contents: JSON.stringify({
+            scripts: {
+              lint: "eslint .",
+              build: "vite build",
+            },
+          }),
+          sizeBytes: 64,
+          truncated: false,
+        }),
+        listDirectory: vi.fn().mockResolvedValue({
+          entries: [{ path: "bun.lock", kind: "file" }],
+          truncated: false,
+        }),
+      },
+    } as const;
+
+    await expect(resolveImportedProjectScripts(api as never, "/tmp/repo")).resolves.toEqual({
+      scripts: [
+        {
+          id: "lint",
+          name: "Lint",
+          command: "bun run lint",
+          icon: "lint",
+          runOnWorktreeCreate: false,
+        },
+        {
+          id: "build",
+          name: "Build",
+          command: "bun run build",
+          icon: "build",
+          runOnWorktreeCreate: false,
+        },
+      ],
+      warning: null,
+    });
+  });
+
+  it("returns a warning without importing scripts when package manager choice is ambiguous", async () => {
+    const api = {
+      projects: {
+        readFile: vi.fn().mockResolvedValue({
+          relativePath: "package.json",
+          contents: JSON.stringify({
+            scripts: {
+              dev: "vite",
+            },
+          }),
+          sizeBytes: 32,
+          truncated: false,
+        }),
+        listDirectory: vi.fn().mockResolvedValue({
+          entries: [
+            { path: "bun.lock", kind: "file" },
+            { path: "pnpm-lock.yaml", kind: "file" },
+          ],
+          truncated: false,
+        }),
+      },
+    } as const;
+
+    await expect(resolveImportedProjectScripts(api as never, "/tmp/repo")).resolves.toEqual({
+      scripts: undefined,
+      warning:
+        "Multiple package manager lockfiles were detected (bun, pnpm). Select the package manager to use for imported actions.",
+    });
+  });
+});
diff --git a/apps/web/src/lib/projectImport.ts b/apps/web/src/lib/projectImport.ts
@@ -0,0 +1,44 @@
+import type { NativeApi, ProjectScript } from "@okcode/contracts";
+
+import {
+  buildProjectScriptDraftsFromPackageScripts,
+  materializeProjectScripts,
+  readPackageScriptInventory,
+  resolvePackageManagerResolution,
+} from "../projectScriptDefaults";
+
+export interface ImportedProjectScriptsResolution {
+  scripts: ProjectScript[] | undefined;
+  warning: string | null;
+}
+
+export async function resolveImportedProjectScripts(
+  api: NativeApi,
+  cwd: string,
+): Promise<ImportedProjectScriptsResolution> {
+  try {
+    const inventory = await readPackageScriptInventory(api, cwd);
+    const packageManagerResolution = resolvePackageManagerResolution(inventory);
+    const warning = inventory.scriptNames.length > 0 ? packageManagerResolution.warning : null;
+
+    if (
+      inventory.scriptNames.length === 0 ||
+      !packageManagerResolution.preferredPackageManager ||
+      packageManagerResolution.requiresManualSelection
+    ) {
+      return { scripts: undefined, warning };
+    }
+
+    return {
+      scripts: materializeProjectScripts(
+        buildProjectScriptDraftsFromPackageScripts({
+          scriptNames: inventory.scriptNames,
+          packageManager: packageManagerResolution.preferredPackageManager,
+        }),
+      ),
+      warning,
+    };
+  } catch {
+    return { scripts: undefined, warning: null };
+  }
+}
