GitHub workflows (#428)

drizzle/0007_dapper_overlord.sql

+ALTER TABLE `apps` ADD `github_branch` text;
\ No newline at end of file

drizzle/meta/_journal.json

@@ -50,6 +50,13 @@
       "when": 1749515724373,
       "tag": "0006_mushy_squirrel_girl",
       "breakpoints": true
+    },
+    {
+      "idx": 7,
+      "version": "6",
+      "when": 1750186036000,
+      "tag": "0007_dapper_overlord",
+      "breakpoints": true
     }
   ]
 }
\ No newline at end of file

e2e-tests/github.spec.ts

+import { expect } from "@playwright/test";
+import { test } from "./helpers/test_helper";
+
+test("should connect to GitHub using device flow", async ({ po }) => {
+  await po.setUp();
+  await po.sendPrompt("tc=basic");
+
+  await po.getTitleBarAppNameButton().click();
+  await po.githubConnector.connect();
+
+  // Wait for device flow to start and show the code
+  await expect(po.page.locator("text=FAKE-CODE")).toBeVisible();
+
+  // Verify the verification URI is displayed
+  await expect(
+    po.page.locator("text=https://github.com/login/device"),
+  ).toBeVisible();
+
+  // Verify the "Set up your GitHub repo" section appears
+  await expect(po.githubConnector.getSetupYourGitHubRepoButton()).toBeVisible();
+});
+
+test("create and sync to new repo", async ({ po }) => {
+  await po.setUp();
+  await po.sendPrompt("tc=basic");
+
+  await po.getTitleBarAppNameButton().click();
+  await po.githubConnector.connect();
+
+  // Verify "Create new repo" is selected by default
+  await expect(po.githubConnector.getCreateNewRepoModeButton()).toHaveClass(
+    /bg-primary/,
+  );
+
+  await po.githubConnector.fillCreateRepoName("test-new-repo");
+
+  // Wait for availability check
+  await po.page.waitForSelector("text=Repository name is available!", {
+    timeout: 5000,
+  });
+
+  // Click create repo button
+  await po.githubConnector.clickCreateRepoButton();
+
+  // Snapshot post-creation state
+  await po.githubConnector.snapshotConnectedRepo();
+
+  // Sync: capture success message
+  await po.githubConnector.clickSyncToGithubButton();
+
+  await po.githubConnector.snapshotConnectedRepo();
+  // Verify the push was received for the default branch (main)
+  await po.githubConnector.verifyPushEvent({
+    repo: "test-new-repo",
+    branch: "main",
+    operation: "create",
+  });
+});
+
+test("create and sync to new repo - custom branch", async ({ po }) => {
+  await po.setUp();
+  await po.sendPrompt("tc=basic");
+
+  await po.getTitleBarAppNameButton().click();
+  await po.githubConnector.connect();
+
+  await po.githubConnector.fillCreateRepoName("test-new-repo");
+  await po.githubConnector.fillNewRepoBranchName("new-branch");
+
+  // Click create repo button
+  await po.githubConnector.clickCreateRepoButton();
+
+  // Sync to GitHub
+  await po.githubConnector.clickSyncToGithubButton();
+
+  // Snapshot post-creation state
+  await po.githubConnector.snapshotConnectedRepo();
+
+  // Verify the push was received for the correct custom branch
+  await po.githubConnector.verifyPushEvent({
+    repo: "test-new-repo",
+    branch: "new-branch",
+    operation: "create",
+  });
+});
+
+test("disconnect from repo", async ({ po }) => {
+  await po.setUp();
+  await po.sendPrompt("tc=basic");
+
+  await po.getTitleBarAppNameButton().click();
+  await po.githubConnector.connect();
+
+  await po.githubConnector.fillCreateRepoName("test-new-repo");
+  await po.githubConnector.clickCreateRepoButton();
+
+  await po.githubConnector.clickDisconnectRepoButton();
+  await po.githubConnector.getSetupYourGitHubRepoButton().click();
+  // Make this deterministic
+  await po.githubConnector.fillCreateRepoName("[scrubbed]");
+  await po.githubConnector.snapshotSetupRepo();
+});
+
+test("create and sync to existing repo", async ({ po }) => {
+  await po.setUp();
+  await po.sendPrompt("tc=basic");
+
+  await po.getTitleBarAppNameButton().click();
+  await po.githubConnector.connect();
+
+  await po.githubConnector.getConnectToExistingRepoModeButton().click();
+
+  await po.githubConnector.selectRepo("testuser/existing-app");
+  await po.githubConnector.selectBranch("main");
+  await po.githubConnector.clickConnectToRepoButton();
+
+  await po.githubConnector.snapshotConnectedRepo();
+});
+
+test("create and sync to existing repo - custom branch", async ({ po }) => {
+  // Clear any previous push events
+  await po.githubConnector.clearPushEvents();
+
+  await po.setUp();
+  await po.sendPrompt("tc=basic");
+
+  await po.getTitleBarAppNameButton().click();
+  await po.githubConnector.connect();
+
+  await po.githubConnector.getConnectToExistingRepoModeButton().click();
+
+  await po.githubConnector.selectRepo("testuser/existing-app");
+  await po.githubConnector.selectCustomBranch("new-branch");
+  await po.githubConnector.clickConnectToRepoButton();
+
+  // Sync to GitHub to trigger a push
+  await po.githubConnector.clickSyncToGithubButton();
+  await po.githubConnector.snapshotConnectedRepo();
+  // Verify the push was received for the correct custom branch
+  await po.githubConnector.verifyPushEvent({
+    repo: "existing-app",
+    branch: "new-branch",
+    operation: "create",
+  });
+});

e2e-tests/helpers/test_helper.ts

@@ -64,21 +64,149 @@ class ProModesDialog {
   }
 }
 
+class GitHubConnector {
+  constructor(public page: Page) {}
+
+  async connect() {
+    await this.page.getByRole("button", { name: "Connect to GitHub" }).click();
+  }
+
+  getSetupYourGitHubRepoButton() {
+    return this.page.getByText("Set up your GitHub repo");
+  }
+
+  getCreateNewRepoModeButton() {
+    return this.page.getByRole("button", { name: "Create new repo" });
+  }
+
+  getConnectToExistingRepoModeButton() {
+    return this.page.getByRole("button", { name: "Connect to existing repo" });
+  }
+
+  async clickCreateRepoButton() {
+    await this.page.getByRole("button", { name: "Create Repo" }).click();
+  }
+
+  async fillCreateRepoName(name: string) {
+    await this.page.getByTestId("github-create-repo-name-input").fill(name);
+  }
+
+  async fillNewRepoBranchName(name: string) {
+    await this.page.getByTestId("github-new-repo-branch-input").fill(name);
+  }
+
+  async selectRepo(repo: string) {
+    await this.page.getByTestId("github-repo-select").click();
+    await this.page.getByRole("option", { name: repo }).click();
+  }
+
+  async selectBranch(branch: string) {
+    await this.page.getByTestId("github-branch-select").click();
+    await this.page.getByRole("option", { name: branch }).click();
+  }
+
+  async selectCustomBranch(branch: string) {
+    await this.page.getByTestId("github-branch-select").click();
+    await this.page
+      .getByRole("option", { name: "✏️ Type custom branch name" })
+      .click();
+    await this.page.getByTestId("github-custom-branch-input").click();
+    await this.page.getByTestId("github-custom-branch-input").fill(branch);
+  }
+
+  async clickConnectToRepoButton() {
+    await this.page.getByRole("button", { name: "Connect to repo" }).click();
+  }
+
+  async snapshotConnectedRepo() {
+    await expect(
+      this.page.getByTestId("github-connected-repo"),
+    ).toMatchAriaSnapshot();
+  }
+
+  async snapshotSetupRepo() {
+    await expect(
+      this.page.getByTestId("github-setup-repo"),
+    ).toMatchAriaSnapshot();
+  }
+
+  async snapshotUnconnectedRepo() {
+    await expect(
+      this.page.getByTestId("github-unconnected-repo"),
+    ).toMatchAriaSnapshot();
+  }
+
+  async clickSyncToGithubButton() {
+    await this.page.getByRole("button", { name: "Sync to GitHub" }).click();
+  }
+
+  async clickDisconnectRepoButton() {
+    await this.page
+      .getByRole("button", { name: "Disconnect from repo" })
+      .click();
+  }
+
+  async clearPushEvents() {
+    const response = await this.page.request.post(
+      "http://localhost:3500/github/api/test/clear-push-events",
+    );
+    return await response.json();
+  }
+
+  async getPushEvents(repo?: string) {
+    const url = repo
+      ? `http://localhost:3500/github/api/test/push-events?repo=${repo}`
+      : "http://localhost:3500/github/api/test/push-events";
+    const response = await this.page.request.get(url);
+    return await response.json();
+  }
+
+  async verifyPushEvent(expectedEvent: {
+    repo: string;
+    branch: string;
+    operation?: "push" | "create" | "delete";
+  }) {
+    const pushEvents = await this.getPushEvents(expectedEvent.repo);
+    const matchingEvent = pushEvents.find(
+      (event: any) =>
+        event.repo === expectedEvent.repo &&
+        event.branch === expectedEvent.branch &&
+        (!expectedEvent.operation ||
+          event.operation === expectedEvent.operation),
+    );
+
+    if (!matchingEvent) {
+      throw new Error(
+        `Expected push event not found. Expected: ${JSON.stringify(expectedEvent)}. ` +
+          `Actual events: ${JSON.stringify(pushEvents)}`,
+      );
+    }
+
+    return matchingEvent;
+  }
+}
+
 export class PageObject {
   private userDataDir: string;
-
+  public githubConnector: GitHubConnector;
   constructor(
     public electronApp: ElectronApplication,
     public page: Page,
     { userDataDir }: { userDataDir: string },
   ) {
     this.userDataDir = userDataDir;
+    this.githubConnector = new GitHubConnector(this.page);
+  }
+
+  private async baseSetup() {
+    await this.githubConnector.clearPushEvents();
   }
 
   async setUp({
     autoApprove = false,
     nativeGit = false,
   }: { autoApprove?: boolean; nativeGit?: boolean } = {}) {
+    await this.baseSetup();
     await this.goToSettingsTab();
     if (autoApprove) {
       await this.toggleAutoApprove();
@@ -93,16 +221,8 @@ export class PageObject {
     await this.selectTestModel();
   }
 
-  async importApp(appDir: string) {
-    await this.page.getByRole("button", { name: "Import App" }).click();
-    await eph.stubDialog(this.electronApp, "showOpenDialog", {
-      filePaths: [path.join(__dirname, "..", "fixtures", "import-app", appDir)],
-    });
-    await this.page.getByRole("button", { name: "Select Folder" }).click();
-    await this.page.getByRole("button", { name: "Import" }).click();
-  }
-
   async setUpDyadPro({ autoApprove = false }: { autoApprove?: boolean } = {}) {
+    await this.baseSetup();
     await this.goToSettingsTab();
     if (autoApprove) {
       await this.toggleAutoApprove();
@@ -112,7 +232,6 @@ export class PageObject {
   }
 
   async setUpDyadProvider() {
-    // await page.getByRole('link', { name: 'Settings' }).click();
     await this.page
       .locator("div")
       .filter({ hasText: /^DyadNeeds Setup$/ })
@@ -123,12 +242,15 @@ export class PageObject {
       .getByRole("textbox", { name: "Set Dyad API Key" })
       .fill("testdyadkey");
     await this.page.getByRole("button", { name: "Save Key" }).click();
-    // await page.getByRole('link', { name: 'Apps' }).click();
-    // await page.getByTestId('home-chat-input-container').getByRole('button', { name: 'Pro' }).click();
-    // await page.getByRole('switch', { name: 'Turbo Edits' }).click();
-    // await page.getByRole('switch', { name: 'Turbo Edits' }).click();
-    // await page.locator('div').filter({ hasText: /^Import App$/ }).click();
-    // await page.getByRole('button', { name: 'Select Folder' }).press('Escape');
+  }
+
+  async importApp(appDir: string) {
+    await this.page.getByRole("button", { name: "Import App" }).click();
+    await eph.stubDialog(this.electronApp, "showOpenDialog", {
+      filePaths: [path.join(__dirname, "..", "fixtures", "import-app", appDir)],
+    });
+    await this.page.getByRole("button", { name: "Select Folder" }).click();
+    await this.page.getByRole("button", { name: "Import" }).click();
   }
 
   async openContextFilesPicker() {

e2e-tests/snapshots/github.spec.ts_create-and-sync-to-existing-repo---custom-branch-1.aria.yml

+- paragraph: "Connected to GitHub Repo:"
+- text: testuser/existing-app
+- paragraph: "Branch: new-branch"
+- button "Sync to GitHub"
+- button "Disconnect from repo"
\ No newline at end of file

e2e-tests/snapshots/github.spec.ts_create-and-sync-to-existing-repo-1.aria.yml

+- paragraph: "Connected to GitHub Repo:"
+- text: testuser/existing-app
+- paragraph: "Branch: main"
+- button "Sync to GitHub"
+- button "Disconnect from repo"
\ No newline at end of file

e2e-tests/snapshots/github.spec.ts_create-and-sync-to-new-repo---custom-branch-1.aria.yml

+- paragraph: "Connected to GitHub Repo:"
+- text: testuser/test-new-repo
+- paragraph: "Branch: new-branch"
+- button "Sync to GitHub"
+- button "Disconnect from repo"
\ No newline at end of file

e2e-tests/snapshots/github.spec.ts_create-and-sync-to-new-repo-1.aria.yml

+- paragraph: "Connected to GitHub Repo:"
+- text: testuser/test-new-repo
+- paragraph: "Branch: main"
+- button "Sync to GitHub"
+- button "Disconnect from repo"
\ No newline at end of file

e2e-tests/snapshots/github.spec.ts_create-and-sync-to-new-repo-2.aria.yml

+- paragraph: "Connected to GitHub Repo:"
+- text: testuser/test-new-repo
+- paragraph: "Branch: main"
+- button "Sync to GitHub"
+- button "Disconnect from repo"
+- paragraph: Successfully pushed to GitHub!
\ No newline at end of file

e2e-tests/snapshots/github.spec.ts_disconnect-from-repo-1.aria.yml

+- button "Set up your GitHub repo":
+  - img
+- button "Create new repo"
+- button "Connect to existing repo"
+- text: Repository Name
+- textbox: "[scrubbed]"
+- paragraph: Repository name is available!
+- text: Branch
+- textbox "main"
+- button "Create Repo"
\ No newline at end of file

e2e-tests/snapshots/github.spec.ts_should-create-a-new-GitHub-repository-1.aria.yml

+- paragraph: "Connected to GitHub Repo:"
+- text: testuser/test-new-repo
+- paragraph: "Branch: main"
+- button "Sync to GitHub"
+- button "Disconnect from repo"
\ No newline at end of file

e2e-tests/snapshots/github.spec.ts_should-create-a-new-GitHub-repository-2.aria.yml

+- paragraph: "Connected to GitHub Repo:"
+- text: testuser/test-new-repo
+- paragraph: "Branch: main"
+- button "Sync to GitHub"
+- button "Disconnect from repo"
+- paragraph: Successfully pushed to GitHub!
\ No newline at end of file

src/db/index.ts

@@ -8,7 +8,7 @@ import { migrate } from "drizzle-orm/better-sqlite3/migrator";
 import path from "node:path";
 import fs from "node:fs";
 import { getDyadAppPath, getUserDataPath } from "../paths/paths";
-import { eq } from "drizzle-orm";
+
 import log from "electron-log";
 
 const logger = log.scope("db");
@@ -87,14 +87,3 @@ try {
 export const db = _db as any as BetterSQLite3Database<typeof schema> & {
   $client: Database.Database;
 };
-
-export async function updateAppGithubRepo(
-  appId: number,
-  org: string,
-  repo: string,
-): Promise<void> {
-  await db
-    .update(schema.apps)
-    .set({ githubOrg: org, githubRepo: repo })
-    .where(eq(schema.apps.id, appId));
-}

src/db/schema.ts

@@ -14,6 +14,7 @@ export const apps = sqliteTable("apps", {
     .default(sql`(unixepoch())`),
   githubOrg: text("github_org"),
   githubRepo: text("github_repo"),
+  githubBranch: text("github_branch"),
   supabaseProjectId: text("supabase_project_id"),
   chatContext: text("chat_context", { mode: "json" }),
 });

src/ipc/ipc_client.ts

@@ -554,6 +554,36 @@ export class IpcClient {
   // --- End GitHub Device Flow ---
 
   // --- GitHub Repo Management ---
+  public async listGithubRepos(): Promise<
+    { name: string; full_name: string; private: boolean }[]
+  > {
+    return this.ipcRenderer.invoke("github:list-repos");
+  }
+
+  public async getGithubRepoBranches(
+    owner: string,
+    repo: string,
+  ): Promise<{ name: string; commit: { sha: string } }[]> {
+    return this.ipcRenderer.invoke("github:get-repo-branches", {
+      owner,
+      repo,
+    });
+  }
+
+  public async connectToExistingGithubRepo(
+    owner: string,
+    repo: string,
+    branch: string,
+    appId: number,
+  ): Promise<void> {
+    await this.ipcRenderer.invoke("github:connect-existing-repo", {
+      owner,
+      repo,
+      branch,
+      appId,
+    });
+  }
+
   public async checkGithubRepoAvailable(
     org: string,
     repo: string,
@@ -568,25 +598,25 @@ export class IpcClient {
     org: string,
     repo: string,
     appId: number,
+    branch?: string,
   ): Promise<void> {
     await this.ipcRenderer.invoke("github:create-repo", {
       org,
       repo,
       appId,
+      branch,
     });
   }
 
   // Sync (push) local repo to GitHub
   public async syncGithubRepo(
     appId: number,
+    force?: boolean,
   ): Promise<{ success: boolean; error?: string }> {
-    try {
-      const result = await this.ipcRenderer.invoke("github:push", { appId });
-      return result as { success: boolean; error?: string };
-    } catch (error) {
-      showError(error);
-      throw error;
-    }
+    return this.ipcRenderer.invoke("github:push", {
+      appId,
+      force,
+    });
   }
 
   public async disconnectGithubRepo(appId: number): Promise<void> {

src/ipc/ipc_types.ts

@@ -70,6 +70,7 @@ export interface App {
   updatedAt: Date;
   githubOrg: string | null;
   githubRepo: string | null;
+  githubBranch: string | null;
   supabaseProjectId: string | null;
   supabaseProjectName: string | null;
 }

src/preload.ts

@@ -46,8 +46,11 @@ const validInvokeChannels = [
   "nodejs-status",
   "install-node",
   "github:start-flow",
+  "github:list-repos",
+  "github:get-repo-branches",
   "github:is-repo-available",
   "github:create-repo",
+  "github:connect-existing-repo",
   "github:push",
   "github:disconnect",
   "get-app-version",

testing/fake-llm-server/index.ts

@@ -2,6 +2,19 @@ import express from "express";
 import { createServer } from "http";
 import cors from "cors";
 import { createChatCompletionHandler } from "./chatCompletionHandler";
+import {
+  handleDeviceCode,
+  handleAccessToken,
+  handleUser,
+  handleUserEmails,
+  handleUserRepos,
+  handleRepo,
+  handleRepoBranches,
+  handleOrgRepos,
+  handleGitPush,
+  handleGetPushEvents,
+  handleClearPushEvents,
+} from "./githubHandler";
 
 // Create Express app
 const app = express();
@@ -179,6 +192,29 @@ app.get("/lmstudio/api/v0/models", (req, res) => {
 // Default test provider handler:
 app.post("/v1/chat/completions", createChatCompletionHandler("."));
 
+// GitHub API Mock Endpoints
+console.log("Setting up GitHub mock endpoints");
+
+// GitHub OAuth Device Flow
+app.post("/github/login/device/code", handleDeviceCode);
+app.post("/github/login/oauth/access_token", handleAccessToken);
+
+// GitHub API endpoints
+app.get("/github/api/user", handleUser);
+app.get("/github/api/user/emails", handleUserEmails);
+app.get("/github/api/user/repos", handleUserRepos);
+app.post("/github/api/user/repos", handleUserRepos);
+app.get("/github/api/repos/:owner/:repo", handleRepo);
+app.get("/github/api/repos/:owner/:repo/branches", handleRepoBranches);
+app.post("/github/api/orgs/:org/repos", handleOrgRepos);
+
+// GitHub test endpoints for verifying push operations
+app.get("/github/api/test/push-events", handleGetPushEvents);
+app.post("/github/api/test/clear-push-events", handleClearPushEvents);
+
+// GitHub Git endpoints - intercept all paths with /github/git prefix
+app.all("/github/git/*", handleGitPush);
+
 // Start the server
 const server = createServer(app);
 server.listen(PORT, () => {

testing/fake-llm-server/package.json

@@ -21,6 +21,7 @@
     "@types/cors": "^2.8.18",
     "@types/express": "^4.17.21",
     "@types/node": "^20.17.46",
+    "git-http-mock-server": "^2.0.0",
     "ts-node": "^10.9.2",
     "typescript": "^5.8.3"
   }