dashboard: use workos authkit (#39864)

Migrates the dashboard to use WorkOS authkit instead.

GitOrigin-RevId: 38772eee352184fd54c8f5d423a631559e78abb6

Author: atrakh

npm-packages/common/config/rush/pnpm-lock.yaml

@@ -1,13 +1,12 @@
 NEXT_PUBLIC_ENVIRONMENT=development
 NEXT_PUBLIC_BIG_BRAIN_URL=http://127.0.0.1:8050
 NEXT_PUBLIC_LAUNCHDARKLY_SDK_CLIENT_SIDE_ID=62bcace88926d71668815c48
-AUTH0_BASE_URL='http://localhost:6789'
-NEXT_PUBLIC_AUTH0_LOGIN="http://localhost:6789/login"
 SENTRY_IGNORE_API_RESOLUTION_ERROR=1
-NEXT_PUBLIC_VHS_LOGIN_PAGE=true
 NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_51LB1oCGmzIbonMxd1rIlziq9mgp1oB7PZr0dBClbi4gCtilM4vpgq7qfvze0RXHbHEnII7bIIixYpSYcY0C8ZDxa00GfjVTDRi
 NEXT_PUBLIC_POSTHOG_KEY=phc_JDNTRxeh2li2sQTRO0IcOYMJcp8fPs5nTK9TU751nQK
 # This is the Analytics Proxy (AP) for PostHog.
 NEXT_PUBLIC_POSTHOG_HOST=https://ap.convex.dev
 NEXT_PUBLIC_VERCEL_INTEGRATION_SLUG=convex-test
-NEXT_PUBLIC_AUTH0_ISSUER_BASE_URL="https://convexdev-test.us.auth0.com"
+WORKOS_REDIRECT_URI=http://127.0.0.1:6789
+WORKOS_LOGIN_URL=https://cheerful-lake-55-staging.authkit.app
+WORKOS_CLIENT_ID=client_01K0YV0SBXKEG7J238419105J0

npm-packages/dashboard/.env.development

@@ -4,9 +4,11 @@ SENTRY_DSN=https://[email protected]/63
 NEXT_PUBLIC_SENTRY_DSN=https://[email protected]/6348388
 NEXT_PUBLIC_LAUNCHDARKLY_SDK_CLIENT_SIDE_ID=62bcace88926d71668815c49
 NEXT_PUBLIC_ENVIRONMENT=production
-NEXT_PUBLIC_AUTH0_BASE_URL=$VERCEL_BRANCH_URL
+WORKOS_REDIRECT_URI_OVERRIDE=$VERCEL_BRANCH_URL
 NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_live_51LB1oCGmzIbonMxdgup6xlzEWt2iSA42yH5wBPGhqCwDnTgSD3PbH7y1U352IUyxTUP5BL7edcJR6PLx22x1DiAs00c7iyPHtB
 NEXT_PUBLIC_POSTHOG_KEY=phc_JDNTRxeh2li2sQTRO0IcOYMJcp8fPs5nTK9TU751nQK
 # This is the Analytics Proxy (AP) for PostHog.
 NEXT_PUBLIC_POSTHOG_HOST=https://ap.convex.dev
-NEXT_PUBLIC_VERCEL_INTEGRATION_SLUG=convex
+NEXT_PUBLIC_VERCEL_INTEGRATION_SLUG=convex
+WORKOS_LOGIN_URL=https://login.convex.dev
+WORKOS_CLIENT_ID=client_01K0YV0SNPRYJ5AV4AS0VG7T1J

npm-packages/dashboard/.env.production

@@ -41,8 +41,8 @@ npm run pullEnv
 Run `just run-dash`. It will prompt you to start big brain, in which case run
 `just run-dash` again in another terminal.
 
-Log in to the dashboard with a GitHub account (which will create an account on
-our development Auth0 instance).
+Log in to the dashboard with, which will create an account on our staging WorkOS
+instance.
 
 ### Reset big brain
 
@@ -107,6 +107,8 @@ For this, we will proxy big brain via a cors proxy. Set these values in
 `.env.local`. Some must be copied from
 [Production vercel env vars](https://vercel.com/convex-dev/dashboard/settings/environment-variables)
 
+<!--TODO: Ari update these-->
+
 ```
 NEXT_PUBLIC_BIG_BRAIN_URL=http://localhost:8080/https://api.convex.dev
 AUTH0_CLIENT_ID=nANKpAFe4scUPxW77869QHVKYAgrPwy7

npm-packages/dashboard/README.md

@@ -7,6 +7,15 @@ import dotenv from "dotenv";
 
 dotenv.config({ path: ".env.development" });
 
+if (!process.env.WORKOS_API_SECRET) {
+  console.error(
+    chalk.red(
+      "WORKOS_API_SECRET environment variable is not set.  For local development, you can set it by running `npm run pullEnv`",
+    ),
+  );
+  process.exit(1);
+}
+
 const parsedUrl = url.parse(process.env.NEXT_PUBLIC_BIG_BRAIN_URL);
 http
   .request(

npm-packages/dashboard/checkBigBrain.mjs

@@ -1,35 +1,19 @@
 const { withSentryConfig } = require("@sentry/nextjs");
 const { DefinePlugin } = require("webpack");
-const path = require("path");
 
 const ContentSecurityPolicy = `
   frame-ancestors 'self';
 `;
 
 const allowedImageDomains = [
-  {
-    protocol: "https",
-    hostname: "avatars.githubusercontent.com",
-    pathname: "**",
-  },
-  {
-    protocol: "https",
-    hostname: "s.gravatar.com",
-    pathname: "**",
-  },
   {
     protocol: "https",
     hostname: "**.convex.cloud",
     pathname: "/api/storage/**",
   },
   {
     protocol: "https",
-    hostname: "lh3.googleusercontent.com",
-    pathname: "**",
-  },
-  {
-    protocol: "https",
-    hostname: "cdn.auth0.com",
+    hostname: "workoscdn.com",
     pathname: "**",
   },
 ];
@@ -89,6 +73,16 @@ const nextConfig = {
   },
   async redirects() {
     return [
+      {
+        source: "/login",
+        destination: "/api/auth/login",
+        permanent: false,
+      },
+      {
+        source: "/signup",
+        destination: `${process.env.WORKOS_LOGIN_URL}/sign-up`,
+        permanent: false,
+      },
       {
         source: "/teams/:teamId*",
         destination: "/",
@@ -128,13 +122,7 @@ const nextConfig = {
     domains:
       process.env.VERCEL_ENV === "production"
         ? undefined
-        : [
-            "127.0.0.1",
-            "s.gravatar.com",
-            "avatars.githubusercontent.com",
-            "lh3.googleusercontent.com",
-            "cdn.auth0.com",
-          ],
+        : ["127.0.0.1", "workoscdn.com"],
     remotePatterns: allowedImageDomains,
   },
   experimental: {

npm-packages/dashboard/next.config.js

@@ -22,7 +22,6 @@
     "checkApiSpec": "openapi-typescript ./dashboard-openapi.json --output ./src/generatedApi.ts --root-types --root-types-no-schema-prefix --check || (echo 'Dashboard API spec check failed. Run `just format-js` to fix.'; false)"
   },
   "dependencies": {
-    "@auth0/nextjs-auth0": "3.7.0",
     "@convex-dev/design-system": "workspace:*",
     "@headlessui/react": "1.7.19",
     "@heroicons/react": "2.2.0",
@@ -60,7 +59,9 @@
     "posthog-js": "~1.256.0",
     "shx": "~0.3.4",
     "cmdk": "~1.1.1",
-    "react-hotkeys-hook": "~4.4.0"
+    "react-hotkeys-hook": "~4.4.0",
+    "@workos-inc/authkit-nextjs": "~2.4.6",
+    "@workos-inc/node": "~7.64.0"
   },
   "devDependencies": {
     "@babel/core": "^7.27.1",

npm-packages/dashboard/package.json

@@ -91,23 +91,6 @@ export function useListIdentities() {
   return identities;
 }
 
-export function useSetLinkIdentityCookie() {
-  return useBBMutation({
-    path: "/set_jwt_cookie",
-    pathParams: undefined,
-    includeCredentials: true,
-  });
-}
-
-export function useLinkIdentity() {
-  return useBBMutation({
-    path: "/link_identity",
-    pathParams: undefined,
-    mutateKey: "/list_identities",
-    includeCredentials: true,
-  });
-}
-
 export function useUnlinkIdentity() {
   return useBBMutation({
     path: "/unlink_identity",

npm-packages/dashboard/src/api/profile.ts

@@ -1,4 +1,4 @@
-import { useAuth0 } from "hooks/useAuth0";
+import { useWorkOS } from "hooks/useWorkOS";
 import { ChevronLeftIcon } from "@radix-ui/react-icons";
 import { BreadcrumbLink } from "components/header/BreadcrumbLink/BreadcrumbLink";
 import { Header } from "components/header/Header/Header";
@@ -47,7 +47,7 @@ const NO_TEAM_ROUTES = [
 const NO_HEADER_ROUTES = ["/oauth/authorize/project", "/oauth/authorize/team"];
 
 function DashboardHeaderWhenLoggedIn() {
-  const { user } = useAuth0();
+  const { user } = useWorkOS();
   const router = useRouter();
 
   const projectSlug = router?.query.project as string;