From 52900721820d951164ef5e2016aa07617328bd65 Mon Sep 17 00:00:00 2001
From: Tom Milewski <me@tm.codes>
Date: Wed, 9 Oct 2024 16:38:56 -0400
Subject: [PATCH] feat(chrome-extension): Add env constants

---
 .../chrome-extension/src/internal/clerk.ts    |  8 ++--
 .../src/internal/constants.ts                 | 39 +++++++++++++++++--
 .../src/internal/utils/response-handler.ts    |  6 +--
 turbo.json                                    |  1 +
 4 files changed, 43 insertions(+), 11 deletions(-)

diff --git a/packages/chrome-extension/src/internal/clerk.ts b/packages/chrome-extension/src/internal/clerk.ts
index 0e90c7a564..6cac935d17 100644
--- a/packages/chrome-extension/src/internal/clerk.ts
+++ b/packages/chrome-extension/src/internal/clerk.ts
@@ -4,7 +4,7 @@ import { parsePublishableKey } from '@clerk/shared/keys';
 import browser from 'webextension-polyfill';
 
 import { SCOPE, type Scope } from '../types';
-import { CLIENT_JWT_KEY, DEFAULT_LOCAL_HOST_PERMISSION } from './constants';
+import { CLIENT_JWT_KEY, DEFAULT_LOCAL_HOST_PERMISSION, PUBLISHABLE_KEY, SYNC_HOST } from './constants';
 import { assertPublishableKey } from './utils/errors';
 import { JWTHandler } from './utils/jwt-handler';
 import { validateManifest } from './utils/manifest';
@@ -20,17 +20,17 @@ Clerk.sdkMetadata = {
 };
 
 export type CreateClerkClientOptions = {
-  publishableKey: string;
+  publishableKey?: string;
   scope?: Scope;
   storageCache?: StorageCache;
   syncHost?: string;
 };
 
 export async function createClerkClient({
-  publishableKey,
+  publishableKey = PUBLISHABLE_KEY,
   scope,
   storageCache = BrowserStorageCache,
-  syncHost = process.env.CLERK_SYNC_HOST,
+  syncHost = SYNC_HOST,
 }: CreateClerkClientOptions): Promise<Clerk> {
   if (clerk) {
     return clerk;
diff --git a/packages/chrome-extension/src/internal/constants.ts b/packages/chrome-extension/src/internal/constants.ts
index 4b8eb1ba9a..91c7628818 100644
--- a/packages/chrome-extension/src/internal/constants.ts
+++ b/packages/chrome-extension/src/internal/constants.ts
@@ -1,6 +1,37 @@
+// export const AUTH_HEADER = 'Authorization';
+// export const AUTH_HEADER_DEV = '__clerk_db_jwt';
+
+export const AUTH_HEADER = {
+  PRODUCTION: 'Authorization',
+  DEVELOPMENT: '__clerk_db_jwt',
+};
+
 export const CLIENT_JWT_KEY = '__client';
-export const STORAGE_KEY_CLIENT_JWT = '__clerk_client_jwt';
 export const DEFAULT_LOCAL_HOST_PERMISSION = 'http://localhost';
-export const AUTH_HEADER = 'Authorization';
-export const AUTH_HEADER_DEV = '__clerk_db_jwt';
-export const SESSION_ID_HEADER_DEV = '_clerk_session_id';
+export const STORAGE_KEY_CLIENT_JWT = '__clerk_client_jwt';
+
+// Environment Variables
+
+function getViteEnvVariable(name: string): string | undefined {
+  const viteEnvName = `VITE_${name}`;
+
+  // @ts-expect-error - Vite specific
+  if (typeof import.meta !== 'undefined' && import.meta.env && typeof import.meta.env[viteEnvName] === 'string') {
+    // @ts-expect-error - Vite specific
+    return import.meta.env[viteEnvName];
+  }
+
+  return undefined;
+}
+
+export const PUBLISHABLE_KEY =
+  process.env.PLASMO_PUBLIC_CLERK_PUBLISHABLE_KEY ||
+  getViteEnvVariable('CLERK_PUBLISHABLE_KEY') ||
+  process.env.CLERK_PUBLISHABLE_KEY ||
+  '';
+
+export const SYNC_HOST =
+  process.env.PLASMO_PUBLIC_CLERK_SYNC_HOST ||
+  getViteEnvVariable('CLERK_SYNC_HOST') ||
+  process.env.CLERK_SYNC_HOST ||
+  undefined;
diff --git a/packages/chrome-extension/src/internal/utils/response-handler.ts b/packages/chrome-extension/src/internal/utils/response-handler.ts
index 921b7f794e..7e872d054b 100644
--- a/packages/chrome-extension/src/internal/utils/response-handler.ts
+++ b/packages/chrome-extension/src/internal/utils/response-handler.ts
@@ -1,6 +1,6 @@
 import type { Clerk } from '@clerk/clerk-js';
 
-import { AUTH_HEADER, AUTH_HEADER_DEV } from '../constants';
+import { AUTH_HEADER } from '../constants';
 import type { JWTHandler } from './jwt-handler';
 
 type Handler = Parameters<Clerk['__unstable__onAfterResponse']>[0];
@@ -20,7 +20,7 @@ export function responseHandler(jwtHandler: JWTHandler, { isProd }: { isProd: bo
 
 /** Retrieve the JWT to the FAPI response, per development instances */
 async function devHandler(response: Res, jwtHandler: JWTHandler) {
-  const header = response?.headers.get(AUTH_HEADER_DEV);
+  const header = response?.headers.get(AUTH_HEADER.DEVELOPMENT);
 
   if (header) {
     await jwtHandler.set(header);
@@ -31,7 +31,7 @@ async function devHandler(response: Res, jwtHandler: JWTHandler) {
 
 /** Retrieve the JWT to the FAPI response, per production instances */
 async function prodHandler(response: Res, jwtHandler: JWTHandler) {
-  const header = response?.headers.get(AUTH_HEADER);
+  const header = response?.headers.get(AUTH_HEADER.PRODUCTION);
 
   if (header?.startsWith('Bearer')) {
     const jwt = header.split(' ')[1] || undefined;
diff --git a/turbo.json b/turbo.json
index d86965d760..ab7a80c74a 100644
--- a/turbo.json
+++ b/turbo.json
@@ -16,6 +16,7 @@
   "globalEnv": [
     "CLERK_*",
     "NEXT_PUBLIC_CLERK_*",
+    "PLASMO_PUBLIC_CLERK_*",
     "PUBLIC_CLERK_*",
     "NODE_ENV",
     "NODE_VERSION",