npm - viagen - Versions diffs - 0.0.13 → 0.0.17 - Mend

viagen 0.0.13 → 0.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/README.md CHANGED Viewed

@@ -30,7 +30,7 @@ export default defineConfig({
 npx viagen setup
 ```
-The setup wizard authenticates with Claude then uses GitHub and Vercel to write your local `.env`.
+The setup wizard authenticates with Claude, detects your GitHub and Vercel credentials, and captures your git remote info — all written to your local `.env`. This ensures sandboxes clone the correct repo instead of inferring it at runtime.
 You can now run `npm run dev` to start the local dev server. At this point you can launch viagen and chat with Claude to make changes to your app.
@@ -62,23 +62,47 @@ viagen({
   panelWidth: 420,           // chat panel width in px
   overlay: true,             // fix button on error overlay
   ui: true,                  // inject chat panel into pages
+  sandboxFiles: [...],       // copy files manually into sandbox
   systemPrompt: '...',       // custom system prompt (see below)
+  editable: ['src','conf'],  // files/dirs editable in the UI
 })
 ```
-### Sandbox Files
+### SSR Frameworks (React Router, Remix, SvelteKit, etc.)
-Gitignored files (credentials, service accounts, etc.) aren't included when cloning from remote. To forward them into the sandbox, add a `viagen.sandboxFiles` array to your `package.json`:
+For plain Vite apps, the chat panel is injected automatically. SSR frameworks render their own HTML, so you need to add one script tag to your root layout:
-```json
-{
-  "viagen": {
-    "sandboxFiles": ["creds.json", "service-account.json"]
-  }
+```html
+<script src="/via/client.js" defer></script>
+```
+For React Router, add it to `app/root.tsx`:
+```tsx
+export default function Root() {
+  return (
+    <html>
+      <head>
+        <script src="/via/client.js" defer />
+        {/* ... */}
+      </head>
+      {/* ... */}
+    </html>
+  )
 }
 ```
-These files are always overlaid into the sandbox regardless of deploy mode.
+### Editable Files
+Add a file editor panel to the chat UI:
+```ts
+viagen({
+  editable: ['src/components', '.env', 'vite.config.ts']
+})
+```
+Paths can be files or directories (directories include all files within). The editor appears as a "Files" tab in the chat panel.
 The default system prompt:
@@ -126,6 +150,9 @@ GET  /via/health      — check API key status
 GET  /via/error       — latest build error (if any)
 GET  /via/ui          — standalone chat interface
 GET  /via/iframe      — split view (app + chat side by side)
+GET  /via/files       — list editable files (when configured)
+GET  /via/file?path=  — read file content
+POST /via/file        — write file content { path, content }
 ```
 When `VIAGEN_AUTH_TOKEN` is set (always on in sandboxes), pass the token as a `Bearer` header or `?token=` query param.

package/dist/cli.js CHANGED Viewed

@@ -335,6 +335,13 @@ async function refreshAccessToken(refresh) {
 }
 // src/cli.ts
+import {
+  createViagen,
+  saveCredentials,
+  loadCredentials,
+  clearCredentials
+} from "viagen-sdk";
+import { spawn as spawnChild } from "child_process";
 function loadDotenv(dir) {
   const envPath = join2(dir, ".env");
   if (!existsSync(envPath)) return {};
@@ -515,9 +522,34 @@ async function setup() {
   const newVars = {};
   console.log("viagen setup");
   console.log("");
-  if (existing["ANTHROPIC_API_KEY"] || existing["CLAUDE_ACCESS_TOKEN"]) {
+  let claudeExpired = false;
+  if (existing["CLAUDE_ACCESS_TOKEN"] && existing["CLAUDE_TOKEN_EXPIRES"]) {
+    const expires = parseInt(existing["CLAUDE_TOKEN_EXPIRES"], 10);
+    const nowSec = Math.floor(Date.now() / 1e3);
+    if (nowSec > expires) {
+      if (existing["CLAUDE_REFRESH_TOKEN"]) {
+        console.log("Claude auth ... token expired, attempting refresh...");
+        try {
+          const tokens = await refreshAccessToken(existing["CLAUDE_REFRESH_TOKEN"]);
+          newVars["CLAUDE_ACCESS_TOKEN"] = tokens.access_token;
+          newVars["CLAUDE_REFRESH_TOKEN"] = tokens.refresh_token;
+          newVars["CLAUDE_TOKEN_EXPIRES"] = String(nowSec + tokens.expires_in);
+          console.log("Claude auth ... refreshed");
+        } catch {
+          console.log("Claude auth ... refresh failed, need to re-authenticate");
+          claudeExpired = true;
+        }
+      } else {
+        console.log("Claude auth ... token expired, need to re-authenticate");
+        claudeExpired = true;
+      }
+    } else {
+      console.log("Claude auth ... already configured");
+    }
+  } else if (existing["ANTHROPIC_API_KEY"]) {
     console.log("Claude auth ... already configured");
-  } else {
+  }
+  if (claudeExpired || !existing["ANTHROPIC_API_KEY"] && !existing["CLAUDE_ACCESS_TOKEN"]) {
     console.log("How do you want to authenticate with Claude?");
     console.log("");
     console.log("  1) Log in with Claude Max/Pro (recommended)");
@@ -584,8 +616,8 @@ async function setup() {
     console.log("gh CLI is installed but not logged in.");
     console.log("Without it, sandboxes can't commit or push changes.");
     console.log("");
-    const login = await promptUser("Run gh auth login now? [y/n]: ");
-    if (login === "y" || login === "yes") {
+    const login2 = await promptUser("Run gh auth login now? [y/n]: ");
+    if (login2 === "y" || login2 === "yes") {
       try {
         execSync2("gh auth login", { stdio: "inherit" });
         const token = shellOutput("gh auth token");
@@ -601,6 +633,46 @@ async function setup() {
     }
   }
   console.log("");
+  {
+    const detectedGit = getGitInfo(cwd);
+    const savedUrl = existing["GIT_REMOTE_URL"];
+    if (savedUrl && detectedGit && savedUrl !== detectedGit.remoteUrl) {
+      console.log(`Git repo     ... mismatch!`);
+      console.log(`  .env:   ${savedUrl}`);
+      console.log(`  local:  ${detectedGit.remoteUrl}`);
+      console.log("");
+      const fix = await promptUser("Update .env to match local remote? [y/n]: ");
+      if (fix === "y" || fix === "yes" || !fix) {
+        newVars["GIT_REMOTE_URL"] = detectedGit.remoteUrl;
+        newVars["GIT_BRANCH"] = detectedGit.branch;
+        newVars["GIT_USER_NAME"] = detectedGit.userName;
+        newVars["GIT_USER_EMAIL"] = detectedGit.userEmail;
+        console.log("Git repo     ... updated");
+      } else {
+        console.log("Git repo     ... keeping .env value");
+      }
+    } else if (savedUrl) {
+      console.log(`Git repo     ... ${savedUrl}`);
+    } else if (detectedGit) {
+      console.log(`Detected git remote: ${detectedGit.remoteUrl}`);
+      console.log(`  Branch: ${detectedGit.branch}`);
+      console.log(`  User:   ${detectedGit.userName} <${detectedGit.userEmail}>`);
+      console.log("");
+      const useIt = await promptUser("Save this to .env? [y/n]: ");
+      if (useIt === "y" || useIt === "yes" || !useIt) {
+        newVars["GIT_REMOTE_URL"] = detectedGit.remoteUrl;
+        newVars["GIT_BRANCH"] = detectedGit.branch;
+        newVars["GIT_USER_NAME"] = detectedGit.userName;
+        newVars["GIT_USER_EMAIL"] = detectedGit.userEmail;
+        console.log("Git repo     ... saved");
+      } else {
+        console.log("Git repo     ... skipped");
+      }
+    } else {
+      console.log("Git repo     ... not detected (not a git repo or no remote)");
+    }
+  }
+  console.log("");
   const hasVercel = existing["VERCEL_TOKEN"] && existing["VERCEL_TEAM_ID"] && existing["VERCEL_PROJECT_ID"];
   if (hasVercel) {
     console.log("Vercel       ... already configured");
@@ -652,8 +724,8 @@ async function setup() {
     console.log("Vercel CLI is installed but not logged in.");
     console.log("Sandbox deployment requires Vercel auth.");
     console.log("");
-    const login = await promptUser("Run vercel login now? [y/n]: ");
-    if (login === "y" || login === "yes") {
+    const login2 = await promptUser("Run vercel login now? [y/n]: ");
+    if (login2 === "y" || login2 === "yes") {
       try {
         execSync2("vercel login", { stdio: "inherit" });
       } catch {
@@ -685,7 +757,17 @@ async function setup() {
   }
   console.log("");
   if (Object.keys(newVars).length > 0) {
-    writeEnvVars(cwd, newVars);
+    const toUpdate = {};
+    const toAdd = {};
+    for (const [key, val] of Object.entries(newVars)) {
+      if (existing[key]) {
+        toUpdate[key] = val;
+      } else {
+        toAdd[key] = val;
+      }
+    }
+    if (Object.keys(toAdd).length > 0) writeEnvVars(cwd, toAdd);
+    if (Object.keys(toUpdate).length > 0) updateEnvVars(cwd, toUpdate);
     console.log("Wrote to .env:");
     for (const key of Object.keys(newVars)) {
       const display = key.includes("TOKEN") || key.includes("KEY") || key.includes("SECRET") ? newVars[key].slice(0, 8) + "..." : newVars[key];
@@ -699,6 +781,32 @@ async function setup() {
   console.log("  npm run dev          Start the dev server");
   console.log("  npx viagen sandbox   Deploy to a sandbox");
 }
+function dev() {
+  const child = spawnChild("npx", ["vite"], {
+    cwd: process.cwd(),
+    stdio: ["inherit", "pipe", "inherit"],
+    shell: true
+  });
+  let opened = false;
+  child.stdout?.on("data", (chunk) => {
+    const text = chunk.toString();
+    process.stdout.write(text);
+    if (!opened) {
+      const match = text.match(/Local:\s+(https?:\/\/[^\s]+)/);
+      if (match) {
+        opened = true;
+        const baseUrl = match[1].replace(/\/$/, "");
+        const iframeUrl = `${baseUrl}/via/iframe`;
+        setTimeout(() => openBrowser2(iframeUrl), 500);
+      }
+    }
+  });
+  child.on("close", (code) => {
+    process.exit(code ?? 0);
+  });
+  process.on("SIGINT", () => child.kill("SIGINT"));
+  process.on("SIGTERM", () => child.kill("SIGTERM"));
+}
 function parseFlag(args, flag) {
   const idx = args.indexOf(flag);
   if (idx !== -1 && idx + 1 < args.length) return args[idx + 1];
@@ -768,7 +876,21 @@ async function sandbox(args) {
     process.exit(1);
   }
   const githubToken = env["GITHUB_TOKEN"];
-  const gitInfo = getGitInfo(cwd);
+  const envRemoteUrl = env["GIT_REMOTE_URL"];
+  const envBranch = env["GIT_BRANCH"];
+  const envUserName = env["GIT_USER_NAME"];
+  const envUserEmail = env["GIT_USER_EMAIL"];
+  const gitInfo = envRemoteUrl ? {
+    remoteUrl: envRemoteUrl,
+    branch: envBranch || "main",
+    userName: envUserName || "viagen",
+    userEmail: envUserEmail || "noreply@viagen.dev",
+    isDirty: false
+    // can't know from env, assume clean
+  } : getGitInfo(cwd);
+  if (envRemoteUrl) {
+    console.log("Using git info from .env");
+  }
   let deployGit;
   let overlayFiles;
   const branch = branchOverride || (gitInfo ? gitInfo.branch : "main");
@@ -804,7 +926,7 @@ async function sandbox(args) {
       userEmail: gitInfo.userEmail,
       token: githubToken
     });
-    if (gitInfo.isDirty && !branchOverride) {
+    if (!envRemoteUrl && gitInfo.isDirty && !branchOverride) {
       console.log("");
       console.log("Your working tree has uncommitted changes.");
       console.log("");
@@ -835,11 +957,11 @@ async function sandbox(args) {
       "Note: Not a git repo \u2014 sandbox will use file upload (ephemeral)."
     );
   }
-  const pkgPath = join2(cwd, "package.json");
-  if (existsSync(pkgPath)) {
+  const configPath = join2(cwd, ".viagen", "config.json");
+  if (existsSync(configPath)) {
     try {
-      const pkg = JSON.parse(readFileSync2(pkgPath, "utf-8"));
-      const sandboxFiles = pkg.viagen?.sandboxFiles ?? [];
+      const config = JSON.parse(readFileSync2(configPath, "utf-8"));
+      const sandboxFiles = config.sandboxFiles ?? [];
       if (sandboxFiles.length > 0) {
         const extra = [];
         for (const file of sandboxFiles) {
@@ -852,7 +974,7 @@ async function sandbox(args) {
         }
         if (extra.length > 0) {
           overlayFiles = [...overlayFiles ?? [], ...extra];
-          console.log(`  Including ${extra.length} extra file(s) from sandboxFiles config.`);
+          console.log(`  Including ${extra.length} extra file(s) from sandboxFiles.`);
         }
       }
     } catch {
@@ -882,19 +1004,196 @@ async function sandbox(args) {
     } : void 0,
     timeoutMinutes
   });
+  const iframeUrl = result.url.replace("?token=", "/via/iframe?token=");
+  const chatUrl = result.url.replace("?token=", "/via/ui?token=");
   console.log("");
   console.log("Sandbox deployed!");
   console.log("");
-  console.log(`  URL:        ${result.url}`);
+  console.log(`  App:        ${result.url}`);
+  console.log(`  Split view: ${iframeUrl}`);
+  console.log(`  Chat only:  ${chatUrl}`);
+  console.log("");
   console.log(`  Sandbox ID: ${result.sandboxId}`);
   console.log(
     `  Mode:       ${result.mode === "git" ? "git clone (can push)" : "file upload (ephemeral)"}`
   );
-  console.log(`  Token:      ${result.token}`);
   console.log(`  Timeout:    ${timeoutMinutes ?? 30} minutes`);
   console.log("");
   console.log(`Stop with: npx viagen sandbox stop ${result.sandboxId}`);
-  openBrowser2(result.url);
+  openBrowser2(iframeUrl);
+}
+var PLATFORM_URL = "http://localhost:5175";
+async function login() {
+  const existing = await loadCredentials();
+  if (existing) {
+    const client2 = createViagen({
+      baseUrl: existing.baseUrl,
+      token: existing.token
+    });
+    try {
+      const user2 = await client2.auth.me();
+      if (user2) {
+        console.log(`Already logged in as ${user2.email}`);
+        const answer = await promptUser("Log in again? [y/n]: ");
+        if (answer !== "y" && answer !== "yes") return;
+      }
+    } catch {
+    }
+  }
+  console.log("viagen login");
+  console.log("");
+  const client = createViagen({ baseUrl: PLATFORM_URL });
+  console.log("Opening browser to authorize...");
+  const { token, expiresAt } = await client.auth.loginCli({
+    onOpenUrl: (url) => {
+      openBrowser2(url);
+      console.log("");
+      console.log("If the browser didn't open, visit:");
+      console.log(`  ${url}`);
+      console.log("");
+      console.log("Waiting for authorization...");
+    }
+  });
+  await saveCredentials({ token, baseUrl: PLATFORM_URL, expiresAt });
+  const authed = createViagen({ baseUrl: PLATFORM_URL, token });
+  const user = await authed.auth.me();
+  console.log("");
+  if (user) {
+    console.log(`Logged in as ${user.email}`);
+  } else {
+    console.log("Logged in.");
+  }
+  console.log("Credentials saved to ~/.config/viagen/credentials.json");
+}
+async function logout() {
+  const existing = await loadCredentials();
+  if (!existing) {
+    console.log("Not logged in.");
+    return;
+  }
+  await clearCredentials();
+  console.log("Logged out. Credentials removed.");
+}
+async function whoami() {
+  const existing = await loadCredentials();
+  if (!existing) {
+    console.log("Not logged in. Run `viagen login` to authenticate.");
+    return;
+  }
+  const client = createViagen({
+    baseUrl: existing.baseUrl,
+    token: existing.token
+  });
+  try {
+    const user = await client.auth.me();
+    if (user) {
+      console.log(`${user.email}${user.name ? ` (${user.name})` : ""}`);
+      if (user.organizations.length > 0) {
+        console.log(
+          `Orgs: ${user.organizations.map((o) => o.name).join(", ")}`
+        );
+      }
+    } else {
+      console.log("Session expired. Run `viagen login` to re-authenticate.");
+    }
+  } catch {
+    console.log("Session expired. Run `viagen login` to re-authenticate.");
+  }
+}
+async function requireClient() {
+  const creds = await loadCredentials();
+  if (!creds) {
+    console.error("Not logged in. Run `viagen login` first.");
+    process.exit(1);
+  }
+  return createViagen({ baseUrl: creds.baseUrl, token: creds.token });
+}
+async function orgs(args) {
+  const sub = args[0];
+  if (sub === "create") {
+    const name = args.slice(1).join(" ");
+    if (!name) {
+      console.error("Usage: viagen orgs create <name>");
+      process.exit(1);
+    }
+    const client2 = await requireClient();
+    const org = await client2.orgs.create({ name });
+    console.log(`Created org "${org.name}" (${org.id})`);
+    return;
+  }
+  if (sub === "invite") {
+    const email = args[1];
+    if (!email) {
+      console.error("Usage: viagen orgs invite <email>");
+      process.exit(1);
+    }
+    const client2 = await requireClient();
+    await client2.orgs.addMember({ email });
+    console.log(`Invited ${email}`);
+    return;
+  }
+  const client = await requireClient();
+  const memberships = await client.orgs.list() ?? [];
+  if (memberships.length === 0) {
+    console.log("No organizations. Create one with `viagen orgs create <name>`.");
+    return;
+  }
+  for (const m of memberships) {
+    const role = m.role ? ` (${m.role})` : "";
+    console.log(`  ${m.organizationName}${role}`);
+  }
+}
+async function projects(args) {
+  const sub = args[0];
+  if (sub === "create") {
+    const name = args.slice(1).join(" ");
+    if (!name) {
+      console.error("Usage: viagen projects create <name>");
+      process.exit(1);
+    }
+    const client2 = await requireClient();
+    const project = await client2.projects.create({ name });
+    console.log(`Created project "${project.name}" (${project.id})`);
+    return;
+  }
+  if (sub === "get") {
+    const id = args[1];
+    if (!id) {
+      console.error("Usage: viagen projects get <id>");
+      process.exit(1);
+    }
+    const client2 = await requireClient();
+    const project = await client2.projects.get(id);
+    console.log(`  Name:     ${project.name}`);
+    console.log(`  ID:       ${project.id}`);
+    if (project.githubRepo) console.log(`  GitHub:   ${project.githubRepo}`);
+    if (project.templateId) console.log(`  Template: ${project.templateId}`);
+    console.log(`  Created:  ${project.createdAt}`);
+    return;
+  }
+  if (sub === "delete") {
+    const id = args[1];
+    if (!id) {
+      console.error("Usage: viagen projects delete <id>");
+      process.exit(1);
+    }
+    const answer = await promptUser(`Delete project ${id}? [y/n]: `);
+    if (answer !== "y" && answer !== "yes") return;
+    const client2 = await requireClient();
+    await client2.projects.delete(id);
+    console.log("Project deleted.");
+    return;
+  }
+  const client = await requireClient();
+  const list = await client.projects.list() ?? [];
+  if (list.length === 0) {
+    console.log("No projects. Create one with `viagen projects create <name>`.");
+    return;
+  }
+  for (const p of list) {
+    const repo = p.githubRepo ? ` (${p.githubRepo})` : "";
+    console.log(`  ${p.name}${repo}  ${p.id}`);
+  }
 }
 function help() {
   console.log("viagen \u2014 Claude Code in your Vite dev server");
@@ -903,6 +1202,17 @@ function help() {
   console.log("  viagen <command>");
   console.log("");
   console.log("Commands:");
+  console.log("  login                          Log in to the viagen platform");
+  console.log("  logout                         Log out and remove credentials");
+  console.log("  whoami                         Show current user");
+  console.log("  orgs                           List your organizations");
+  console.log("  orgs create <name>             Create a new organization");
+  console.log("  orgs invite <email>            Invite a member to the org");
+  console.log("  projects                       List projects in current org");
+  console.log("  projects create <name>         Create a new project");
+  console.log("  projects get <id>              Show project details");
+  console.log("  projects delete <id>           Delete a project");
+  console.log("  dev                            Start Vite and open the split view");
   console.log("  setup                          Set up .env with API keys and tokens");
   console.log("  sandbox [-b branch] [-t min]   Deploy your project to a Vercel Sandbox");
   console.log("  sandbox stop <id>              Stop a running sandbox");
@@ -928,6 +1238,18 @@ function help() {
   console.log(
     "  GITHUB_TOKEN           Enables git commit+push from sandbox."
   );
+  console.log(
+    "  GIT_REMOTE_URL         Git remote (from setup, overrides runtime detection)."
+  );
+  console.log(
+    "  GIT_BRANCH             Git branch for sandbox."
+  );
+  console.log(
+    "  GIT_USER_NAME          Git user name for sandbox commits."
+  );
+  console.log(
+    "  GIT_USER_EMAIL         Git user email for sandbox commits."
+  );
   console.log(
     "  VIAGEN_AUTH_TOKEN      Protects all endpoints with token auth."
   );
@@ -946,7 +1268,20 @@ function help() {
 async function main() {
   const args = process.argv.slice(2);
   const command = args[0];
-  if (command === "setup") {
+  if (command === "login") {
+    await login();
+  } else if (command === "logout") {
+    await logout();
+  } else if (command === "whoami") {
+    await whoami();
+  } else if (command === "orgs") {
+    await orgs(args.slice(1));
+  } else if (command === "projects") {
+    await projects(args.slice(1));
+  } else if (command === "dev") {
+    dev();
+    return;
+  } else if (command === "setup") {
     await setup();
   } else if (command === "sandbox") {
     await sandbox(args.slice(1));

package/dist/index.d.ts CHANGED Viewed

@@ -76,6 +76,12 @@ interface ViagenOptions {
      * @example ["config.json"]
      */
     sandboxFiles?: string[];
+    /**
+     * Files and directories editable through the UI file panel.
+     * Paths are relative to the project root. Directories include all files within.
+     * @example ['src/components', '.env', 'vite.config.ts']
+     */
+    editable?: string[];
 }
 declare function viagen(options?: ViagenOptions): Plugin;