npm - @stackable-labs/cli-app-extension - Versions diffs - 1.91.2 → 1.92.0 - Mend

@stackable-labs/cli-app-extension 1.91.2 → 1.92.0

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 (2) hide show

package/dist/index.js +154 -67
package/package.json +1 -1

package/dist/index.js CHANGED Viewed

@@ -9,7 +9,7 @@ import { useState, useCallback, useEffect, useRef, useMemo } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import TextInput from 'ink-text-input';
 import { SURFACE_TARGET } from '@stackable-labs/sdk-extension-contracts';
-import { clearAuthState, readAuthState, getToken, STANDALONE_CLIENT, writeAuthState } from '@stackable-labs/utils-auth';
+import { clearAuthState, readAuthState, getToken, STANDALONE_CLIENT, deriveClientId, writeAuthState } from '@stackable-labs/utils-auth';
 import { execFile, spawn } from 'child_process';
 import { promisify } from 'util';
 import { installDependencies } from 'nypm';
@@ -22,6 +22,45 @@ import { createServer } from 'http';
 import open from 'open';
 import https from 'https';
+// ../../lib/utils-js/src/crypto.ts
+var getCrypto = () => {
+  if (typeof globalThis !== "undefined" && globalThis.crypto) {
+    return globalThis.crypto;
+  }
+  throw new Error("Web Crypto API not available \u2014 requires Node.js 22+ or a modern browser");
+};
+var getSubtle = () => {
+  const crypto = getCrypto();
+  if (crypto.subtle) {
+    return crypto.subtle;
+  }
+  throw new Error("SubtleCrypto not available \u2014 requires a secure context (HTTPS) or Node.js 22+");
+};
+var encodeBytes = (bytes, encoding) => {
+  if (encoding === "hex") {
+    return [...bytes].map((b) => b.toString(16).padStart(2, "0")).join("");
+  }
+  const base64 = btoa(String.fromCharCode(...bytes));
+  if (encoding === "base64url") {
+    return base64.replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
+  }
+  return base64;
+};
+var getRandomBytes = (length, encoding = "base64") => {
+  const bytes = new Uint8Array(length);
+  getCrypto().getRandomValues(bytes);
+  return encodeBytes(bytes, encoding);
+};
+var getDigest = async (input, encoding = "hex") => {
+  const digest = await getSubtle().digest(
+    "SHA-256",
+    new TextEncoder().encode(input)
+  );
+  return encodeBytes(new Uint8Array(digest), encoding);
+};
+var getNonce = () => getRandomBytes(16, "base64url");
+var getVerifier = () => getRandomBytes(32, "base64url");
 // ../../lib/utils-js/src/format.ts
 var toKebabCase = (value) => value.trim().toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");
@@ -1526,13 +1565,15 @@ export const appStore = createStore<AppState>({
   {
     path: "surfaces/Content.tsx",
     title: "Content Surface with Loading State",
-    code: `import { ui, useStore, useContextData, useSettings, Surface } from '@stackable-labs/sdk-extension-react'
+    code: `import { ui, useStore, useContextData, Surface } from '@stackable-labs/sdk-extension-react'
 import { appStore } from '../store'
 export function Content() {
   const viewState = useStore(appStore, (s) => s.viewState)
   const { loading } = useContextData()
-  const settings = useSettings() // Non-secret settings from settingsSchema
+  // Non-secret settings from settingsSchema (add settingsSchema to manifest.json to use). Ex:
+  // const settings = useSettings()
+  // const apiEndpoint = settings.apiEndpoint as string
   if (loading) {
     return (
@@ -3381,7 +3422,102 @@ var callbackPage = (heading, sub, redirectUrl) => `<!DOCTYPE html>
 </head><body><div class="card"><h2>${heading}</h2><p>${sub}</p><p class="hint" id="h"></p></div>
 ${redirectUrl ? `<script>(function(){var s=3,el=document.getElementById('h');function t(){if(s<=0){location.href='${redirectUrl}';return}el.textContent='Redirecting in '+s+'s\u2026';s--;setTimeout(t,1000)}t()})()</script>` : ""}
 </body></html>`;
-var AuthLogin = ({ dashboardUrl }) => {
+var performCLIOAuthFlow = async ({ dashboardUrl, adminApiBaseUrl }) => {
+  const clientId = await deriveClientId(STANDALONE_CLIENT.CLI);
+  const codeVerifier = getVerifier();
+  const codeChallenge = await getDigest(codeVerifier, "base64url");
+  const state = getNonce();
+  let resolveCode;
+  let rejectCode;
+  const codePromise = new Promise((resolve, reject) => {
+    resolveCode = resolve;
+    rejectCode = reject;
+  });
+  let server;
+  server = createServer((req, res) => {
+    const url = new URL(req.url, "http://localhost");
+    if (url.pathname === "/callback") {
+      const error = url.searchParams.get("error");
+      if (error) {
+        res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+        res.end(callbackPage("Authentication failed", "You can close this tab."));
+        rejectCode(new Error(url.searchParams.get("error_description") ?? error));
+        return;
+      }
+      const code2 = url.searchParams.get("code");
+      const returnedState = url.searchParams.get("state");
+      if (!code2) {
+        res.writeHead(400, { "content-type": "text/plain" });
+        res.end("Missing authorization code");
+        return;
+      }
+      if (returnedState !== state) {
+        res.writeHead(400, { "content-type": "text/plain" });
+        res.end("State mismatch");
+        rejectCode(new Error("OAuth state mismatch \u2014 possible CSRF attack"));
+        return;
+      }
+      res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+      res.end(callbackPage("CLI authenticated", "You can return to your terminal.", dashboardUrl));
+      resolveCode(code2);
+    } else {
+      res.writeHead(404);
+      res.end();
+    }
+  });
+  await new Promise((r) => server.listen(0, "127.0.0.1", r));
+  const port = server.address().port;
+  const redirectUri = `http://127.0.0.1:${port}/callback`;
+  const authUrl = new URL(`${dashboardUrl}/oauth/authorize`);
+  authUrl.searchParams.set("client_id", clientId);
+  authUrl.searchParams.set("redirect_uri", redirectUri);
+  authUrl.searchParams.set("code_challenge", codeChallenge);
+  authUrl.searchParams.set("code_challenge_method", "S256");
+  authUrl.searchParams.set("state", state);
+  authUrl.searchParams.set("response_type", "code");
+  const loginUrl = authUrl.toString();
+  await open(loginUrl);
+  const timeout = setTimeout(() => {
+    server.close();
+    rejectCode(new Error("Authentication timed out. Please try again."));
+  }, LOGIN_TIMEOUT_MS);
+  let code;
+  try {
+    code = await codePromise;
+  } catch (err) {
+    clearTimeout(timeout);
+    server.close();
+    throw err;
+  }
+  clearTimeout(timeout);
+  server.close();
+  const tokenRes = await fetch(`${adminApiBaseUrl}/oauth/token`, {
+    method: "POST",
+    headers: { "content-type": "application/x-www-form-urlencoded" },
+    body: new URLSearchParams({
+      grant_type: "authorization_code",
+      code,
+      code_verifier: codeVerifier,
+      client_id: clientId,
+      redirect_uri: redirectUri
+    }).toString()
+  });
+  if (!tokenRes.ok) {
+    const error = await tokenRes.json().catch(() => ({}));
+    throw new Error(error.error_description ?? error.error ?? `Token exchange failed: ${tokenRes.status}`);
+  }
+  const tokenData = await tokenRes.json();
+  const [, payloadB64] = tokenData.access_token.split(".");
+  const payload = JSON.parse(Buffer.from(payloadB64, "base64url").toString());
+  const authState = {
+    token: tokenData.access_token,
+    userId: asClerkUserId(payload.sub),
+    orgId: asClerkOrgId(payload.orgId)
+  };
+  await writeAuthState(authState);
+  return { authState, loginUrl };
+};
+var AuthLogin = ({ dashboardUrl, adminApiBaseUrl }) => {
   const { exit } = useApp();
   const [state, setState] = useState("waiting");
   const [loginUrl, setLoginUrl] = useState("");
@@ -3389,78 +3525,29 @@ var AuthLogin = ({ dashboardUrl }) => {
   const [orgIdLabel, setOrgIdLabel] = useState("");
   const [errorMessage, setErrorMessage] = useState("");
   useEffect(() => {
-    let server;
-    let timeout;
+    let cancelled = false;
     const run = async () => {
-      let resolveToken;
-      let rejectToken;
-      const tokenPromise = new Promise((resolve, reject) => {
-        resolveToken = resolve;
-        rejectToken = reject;
-      });
-      server = createServer((req, res) => {
-        const url2 = new URL(req.url, "http://localhost");
-        if (url2.pathname === "/callback") {
-          const error = url2.searchParams.get("error");
-          if (error) {
-            res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
-            res.end(callbackPage("Authentication failed", "You can close this tab."));
-            rejectToken(new Error(error));
-            return;
-          }
-          const token2 = url2.searchParams.get("token");
-          if (token2) {
-            res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
-            res.end(callbackPage("CLI authenticated", "You can return to your terminal.", dashboardUrl));
-            resolveToken(token2);
-          } else {
-            res.writeHead(400, { "content-type": "text/plain; charset=utf-8" });
-            res.end("Missing token");
-          }
-        } else {
-          res.writeHead(404);
-          res.end();
-        }
-      });
-      await new Promise((r) => server.listen(0, "127.0.0.1", r));
-      const port = server.address().port;
-      const callbackUrl = `http://localhost:${port}/callback`;
-      const url = `${dashboardUrl}/cli-auth?callback=${encodeURIComponent(callbackUrl)}`;
-      setLoginUrl(url);
-      await open(url);
-      timeout = setTimeout(() => {
-        server.close();
-        rejectToken(new Error("Login timed out. Please try again."));
-      }, LOGIN_TIMEOUT_MS);
-      let token;
       try {
-        token = await tokenPromise;
+        const result = await performCLIOAuthFlow({ dashboardUrl, adminApiBaseUrl });
+        if (cancelled) {
+          return;
+        }
+        setLoginUrl(result.loginUrl);
+        setUserIdLabel(result.authState.userId);
+        setOrgIdLabel(result.authState.orgId);
+        setState("success");
       } catch (err) {
-        clearTimeout(timeout);
-        server.close();
+        if (cancelled) {
+          return;
+        }
         setErrorMessage(err instanceof Error ? err.message : String(err));
         setState("error");
-        exit();
-        return;
       }
-      clearTimeout(timeout);
-      server.close();
-      const [, payloadB64] = token.split(".");
-      const payload = JSON.parse(Buffer.from(payloadB64, "base64url").toString());
-      await writeAuthState({
-        token,
-        userId: asClerkUserId(payload.sub),
-        orgId: asClerkOrgId(payload.orgId)
-      });
-      setUserIdLabel(payload.sub);
-      setOrgIdLabel(payload.orgId);
-      setState("success");
       exit();
     };
     run();
     return () => {
-      clearTimeout(timeout);
-      server?.close();
+      cancelled = true;
     };
   }, []);
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
@@ -3708,7 +3795,7 @@ program.command("dev" /* DEV */).description("Start dev servers with a public tu
 var DASHBOARD_URL = process.env.ADMIN_DASHBOARD_URL ?? "https://admin.stackablelabs.com";
 var auth = program.command("auth").description("Manage CLI authentication");
 auth.command("login").description("Authenticate with Stackable via browser").action(async () => {
-  render(/* @__PURE__ */ jsx(AuthLogin, { dashboardUrl: DASHBOARD_URL }));
+  render(/* @__PURE__ */ jsx(AuthLogin, { dashboardUrl: DASHBOARD_URL, adminApiBaseUrl: getAdminApiBaseUrl() }));
 });
 auth.command("logout").description("Clear stored CLI credentials").action(async () => {
   await clearAuthState();

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@stackable-labs/cli-app-extension",
-  "version": "1.91.2",
+  "version": "1.92.0",
   "type": "module",
   "private": false,
   "bin": {