feat(app): show SSH password in VS Code CF tunnel panel

When clicking VS Code, the panel now:
- enables password auth on the container (via chpasswd)
- returns sshPassword from POST /ssh-tunnel
- displays the password with a copy button

Fixes: user was prompted for password without knowing it

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: skulidropek

packages/api/src/http.ts

@@ -1261,12 +1261,18 @@ export const makeRouter = () => {
       Effect.gen(function*(_) {
         const { projectKey } = yield* _(projectKeyParams)
         const project = yield* _(getProjectItemByKey(projectKey))
+        const sshPassword = generateSshPassword()
+        yield* _(
+          enableContainerPasswordAuth(project.containerName, sshPassword).pipe(
+            Effect.orElse(() => Effect.void)
+          )
+        )
         const hostname = yield* _(
           startSshProjectTunnel(projectKey, project.sshPort).pipe(
             Effect.orElse(() => Effect.succeed(null))
           )
         )
-        return yield* _(jsonResponse({ hostname }, 200))
+        return yield* _(jsonResponse({ hostname, sshPassword }, 200))
       }).pipe(Effect.catchAll(errorResponse))
     )
   )

packages/app/src/web/api-share-links.ts

@@ -72,11 +72,14 @@ export const deleteProjectShareLink = (
     OkResponseSchema
   ).pipe(Effect.asVoid)
 
-const SshTunnelResponseSchema = Schema.Struct({ hostname: Schema.NullOr(Schema.String) })
+const SshTunnelResponseSchema = Schema.Struct({
+  hostname: Schema.NullOr(Schema.String),
+  sshPassword: Schema.String
+})
 
 export const startProjectSshTunnel = (
   projectKey: string
-): Effect.Effect<{ readonly hostname: string | null }, string> =>
+): Effect.Effect<{ readonly hostname: string | null; readonly sshPassword: string }, string> =>
   requestJson(
     "POST",
     `/projects/by-key/${encodeURIComponent(projectKey)}/ssh-tunnel`,

packages/app/src/web/app-ready-terminal-pane.tsx

@@ -164,7 +164,7 @@ const buildVsCodeAccessInfo = (project: TerminalPaneProps["project"]): VsCodeAcc
 type CfTunnelState =
   | { readonly tag: "idle" }
   | { readonly tag: "loading" }
-  | { readonly tag: "ready"; readonly hostname: string }
+  | { readonly tag: "ready"; readonly hostname: string; readonly sshPassword: string }
   | { readonly tag: "failed" }
 
 const WILDCARD_SSH_CONFIG = `Host *.trycloudflare.com
@@ -263,6 +263,10 @@ const VsCodeAccessPanel = (
           <code style={vsCodePanelCodeStyle}>{cfSshCommand}</code>
           <button onClick={() => { copyText(cfSshCommand as string) }} style={vsCodePanelCopyBtnStyle} type="button">copy</button>
 
+          <div style={{ color: "#8be9fd", fontSize: "0.9em", fontWeight: "bold", marginTop: "10px" }}>SSH password</div>
+          <code style={vsCodePanelCodeStyle}>{cfState.sshPassword}</code>
+          <button onClick={() => { copyText(cfState.sshPassword) }} style={vsCodePanelCopyBtnStyle} type="button">copy</button>
+
           {cfVscodeUri !== null && (
             <>
               <div style={{ color: "#8be9fd", fontSize: "0.9em", fontWeight: "bold", marginTop: "10px" }}>Open in VS Code</div>
@@ -371,10 +375,10 @@ const startTunnel = (
     startProjectSshTunnel(projectKey).pipe(
       Effect.match({
         onFailure: () => { setCfState({ tag: "failed" }) },
-        onSuccess: ({ hostname }) => {
+        onSuccess: ({ hostname, sshPassword }) => {
           setCfState(
             hostname !== null
-              ? { tag: "ready", hostname }
+              ? { tag: "ready", hostname, sshPassword }
               : { tag: "failed" }
           )
         }