🐛 Fix failed deployment UX (#41)

Author: savannahostrowski

src/cloud/commands/deploy.ts

@@ -147,7 +147,12 @@ export async function deploy(context: DeployContext): Promise<boolean> {
       updateStatus,
     )
 
-    if (result) {
+    const isSuccess =
+      result !== null &&
+      (result.status === DeploymentStatus.success ||
+        result.status === DeploymentStatus.verifying_skipped)
+
+    if (isSuccess) {
       statusBarItem.text = `$(cloud) ${config.app_slug ?? "Deployed"}`
 
       const action = await ui.showInformationMessage(
@@ -165,15 +170,15 @@ export async function deploy(context: DeployContext): Promise<boolean> {
       }
       return true
     }
-    if (statusBarItem) {
-      statusBarItem.text = "$(cloud) Deploy failed"
-    }
+
+    statusBarItem.text = "$(cloud) Deploy failed"
     const action = await vscode.window.showErrorMessage(
       "Deployment failed.",
-      "View Logs",
+      "View Dashboard",
     )
-    if (action === "View Logs") {
-      vscode.commands.executeCommand("fastapi-vscode.viewLogs") //TODO: Wire this up
+    if (action === "View Dashboard" && result?.dashboard_url) {
+      vscode.env.openExternal(vscode.Uri.parse(result.dashboard_url))
+      trackCloudDashboardOpened(config.app_id)
     }
     return false
   } catch (error) {
@@ -254,7 +259,7 @@ async function pollDeploymentStatus(
     }
 
     if (failedStatuses.includes(deployment.status)) {
-      return null
+      return deployment
     }
 
     const message =

src/test/cloud/commands/deploy.test.ts

@@ -213,4 +213,197 @@ suite("cloud/commands/deploy", () => {
     )
     assert.ok(fetchStub.calledOnce)
   })
+
+  test("shows dashboard link on deployment failure", async () => {
+    sinon.stub(vscode.authentication, "getSession").resolves({
+      accessToken: "test-token",
+      account: { id: "test-id", label: "test-user" },
+      id: "session-id",
+      scopes: [],
+    })
+    const statusBarItem = { text: "" } as vscode.StatusBarItem
+    const workspaceRoot = vscode.Uri.file("/test/workspace")
+
+    const configService = mockConfigService()
+    configService.getConfig.resolves({ app_id: "app123", team_id: "team123" })
+
+    const mockDeployment: Deployment = {
+      id: "deploy123",
+      slug: "deploy-slug",
+      status: DeploymentStatus.waiting_upload,
+      url: "https://app.example.com",
+      dashboard_url:
+        "https://dashboard.fastapicloud.com/team-slug/apps/my-app/deployments",
+    }
+    const mockFailedDeployment: Deployment = {
+      ...mockDeployment,
+      status: DeploymentStatus.building_image_failed,
+    }
+
+    const apiService = mockApiService()
+    apiService.createDeployment.resolves(mockDeployment)
+    apiService.getUploadUrl.resolves({
+      url: "https://s3.example.com",
+      fields: {},
+    })
+    apiService.completeUpload.resolves()
+    apiService.getDeployment.resolves(mockFailedDeployment)
+
+    sinon
+      .stub(vscode.workspace, "findFiles")
+      .resolves([vscode.Uri.file("/test/workspace/main.py")])
+    const fs = stubFs()
+    fs.fake.readFile.resolves(new Uint8Array([1, 2, 3]))
+    sinon.stub(global, "fetch").resolves({ ok: true, status: 200 } as Response)
+
+    const openExternalStub = sinon
+      .stub(vscode.env, "openExternal")
+      .resolves(true)
+    const errorMessageStub = sinon
+      .stub(vscode.window, "showErrorMessage")
+      .resolves("View Dashboard" as any)
+
+    const result = await deploy({
+      workspaceRoot,
+      configService,
+      apiService,
+      statusBarItem,
+    })
+
+    assert.strictEqual(result, false)
+    assert.strictEqual(statusBarItem.text, "$(cloud) Deploy failed")
+    assert.ok(errorMessageStub.calledOnce)
+    assert.strictEqual(errorMessageStub.firstCall.args[0], "Deployment failed.")
+    assert.ok(openExternalStub.calledOnce)
+    assert.strictEqual(
+      openExternalStub.firstCall.args[0].toString(),
+      "https://dashboard.fastapicloud.com/team-slug/apps/my-app/deployments",
+    )
+  })
+
+  test("does not open dashboard when user dismisses failure dialog", async () => {
+    sinon.stub(vscode.authentication, "getSession").resolves({
+      accessToken: "test-token",
+      account: { id: "test-id", label: "test-user" },
+      id: "session-id",
+      scopes: [],
+    })
+    const statusBarItem = { text: "" } as vscode.StatusBarItem
+    const workspaceRoot = vscode.Uri.file("/test/workspace")
+
+    const configService = mockConfigService()
+    configService.getConfig.resolves({ app_id: "app123", team_id: "team123" })
+
+    const mockDeployment: Deployment = {
+      id: "deploy123",
+      slug: "deploy-slug",
+      status: DeploymentStatus.waiting_upload,
+      url: "https://app.example.com",
+      dashboard_url:
+        "https://dashboard.fastapicloud.com/team-slug/apps/my-app/deployments",
+    }
+
+    const apiService = mockApiService()
+    apiService.createDeployment.resolves(mockDeployment)
+    apiService.getUploadUrl.resolves({
+      url: "https://s3.example.com",
+      fields: {},
+    })
+    apiService.completeUpload.resolves()
+    apiService.getDeployment.resolves({
+      ...mockDeployment,
+      status: DeploymentStatus.building_image_failed,
+    })
+
+    sinon
+      .stub(vscode.workspace, "findFiles")
+      .resolves([vscode.Uri.file("/test/workspace/main.py")])
+    const fs = stubFs()
+    fs.fake.readFile.resolves(new Uint8Array([1, 2, 3]))
+    sinon.stub(global, "fetch").resolves({ ok: true, status: 200 } as Response)
+
+    const openExternalStub = sinon
+      .stub(vscode.env, "openExternal")
+      .resolves(true)
+    sinon.stub(vscode.window, "showErrorMessage").resolves(undefined as any)
+
+    const result = await deploy({
+      workspaceRoot,
+      configService,
+      apiService,
+      statusBarItem,
+    })
+
+    assert.strictEqual(result, false)
+    assert.ok(openExternalStub.notCalled)
+  })
+
+  test("does not open dashboard on poll timeout", async () => {
+    const clock = sinon.useFakeTimers({ shouldClearNativeTimers: true })
+
+    sinon.stub(vscode.authentication, "getSession").resolves({
+      accessToken: "test-token",
+      account: { id: "test-id", label: "test-user" },
+      id: "session-id",
+      scopes: [],
+    })
+    const statusBarItem = { text: "" } as vscode.StatusBarItem
+    const workspaceRoot = vscode.Uri.file("/test/workspace")
+
+    const configService = mockConfigService()
+    configService.getConfig.resolves({ app_id: "app123", team_id: "team123" })
+
+    const mockDeployment: Deployment = {
+      id: "deploy123",
+      slug: "deploy-slug",
+      status: DeploymentStatus.waiting_upload,
+      url: "https://app.example.com",
+      dashboard_url:
+        "https://dashboard.fastapicloud.com/team-slug/apps/my-app/deployments",
+    }
+
+    const apiService = mockApiService()
+    apiService.createDeployment.resolves(mockDeployment)
+    apiService.getUploadUrl.resolves({
+      url: "https://s3.example.com",
+      fields: {},
+    })
+    apiService.completeUpload.resolves()
+    apiService.getDeployment.resolves({
+      ...mockDeployment,
+      status: DeploymentStatus.building,
+    })
+
+    sinon
+      .stub(vscode.workspace, "findFiles")
+      .resolves([vscode.Uri.file("/test/workspace/main.py")])
+    const fs = stubFs()
+    fs.fake.readFile.resolves(new Uint8Array([1, 2, 3]))
+    sinon.stub(global, "fetch").resolves({ ok: true, status: 200 } as Response)
+
+    const openExternalStub = sinon
+      .stub(vscode.env, "openExternal")
+      .resolves(true)
+    sinon
+      .stub(vscode.window, "showErrorMessage")
+      .resolves("View Dashboard" as any)
+
+    const resultPromise = deploy({
+      workspaceRoot,
+      configService,
+      apiService,
+      statusBarItem,
+    })
+
+    // 300 polls x 2000ms = 600000ms
+    await clock.tickAsync(600_000)
+
+    const result = await resultPromise
+
+    assert.strictEqual(result, false)
+    assert.strictEqual(statusBarItem.text, "$(cloud) Deploy failed")
+    assert.ok(openExternalStub.notCalled)
+
+    clock.restore()
+  })
 })