chore(shared,react-router,tanstack-start): Create shared environment variable retrieval function #4985

wobsoriano · 2025-01-23T17:31:52Z

Description

This PR introduces an isomorphic environment variable retrieval function that provides consistent config access across Node, Vite and Cloudflare Workers.

Right now it's only implemented in the React Router and TanStack Start SDKs as Next doesn't have a straightforward way of passing cloudflare context. See my comment in a related issue here.

Resolves ECO-302

Checklist

pnpm test runs as expected.
pnpm build runs as expected.
(If applicable) JSDoc comments have been added or updated for any package exports
(If applicable) Documentation has been updated

Type of change

vercel · 2025-01-23T17:31:57Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
clerk-js-sandbox	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 5, 2025 10:42pm

changeset-bot · 2025-01-23T17:31:57Z

🦋 Changeset detected

Latest commit: 71ff504

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 19 packages

Name	Type
@clerk/shared	Minor
@clerk/tanstack-start	Patch
@clerk/react-router	Patch
@clerk/astro	Patch
@clerk/backend	Patch
@clerk/chrome-extension	Patch
@clerk/clerk-js	Patch
@clerk/elements	Patch
@clerk/expo-passkeys	Patch
@clerk/clerk-expo	Patch
@clerk/express	Patch
@clerk/fastify	Patch
@clerk/nextjs	Patch
@clerk/nuxt	Patch
@clerk/clerk-react	Patch
@clerk/remix	Patch
@clerk/testing	Patch
@clerk/ui	Patch
@clerk/vue	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

…into-clerkshared

wobsoriano · 2025-02-04T00:14:33Z

packages/shared/tsup.config.ts

@@ -24,6 +24,7 @@ export default defineConfig(overrideOptions => {
    minify: false,
    sourcemap: true,
    dts: true,
+    target: 'es2020',


To support import.meta.env, esbuild needs a target of es2020 or above

wobsoriano · 2025-02-04T00:15:09Z

.changeset/eleven-cougars-film.md

@@ -0,0 +1,15 @@
+---
+"@clerk/react-router": patch
+"@clerk/shared": minor


With the introduction of es2020 target, would it make sense to publish a minor version?

Seems fine 👍

LekoArts

Can you publish a snapshot release and test it on the different platforms?

Do you intend to use this shared package in the Next.js SDK in a follow-up?

.changeset/eleven-cougars-film.md

LekoArts · 2025-02-04T11:09:37Z

.changeset/eleven-cougars-film.md

@@ -0,0 +1,15 @@
+---
+"@clerk/react-router": patch
+"@clerk/shared": minor


Seems fine 👍

…into-clerkshared

wobsoriano · 2025-02-04T16:58:10Z

Can you publish a snapshot release and test it on the different platforms?

Do you intend to use this shared package in the Next.js SDK in a follow-up?

Yes I intend to use this on other fullstack SDKs we have. I originally planned on adding Next.js SDK here but there's a blocker here regarding passing Cloudflare context that needs more research. I will do a follow up once resolved 👍🏼 For now I gave the user in that issue a solution that is actually a recommended approach

wobsoriano · 2025-02-04T16:58:20Z

!snapshot

clerk-cookie · 2025-02-04T17:00:39Z

Hey @wobsoriano - the snapshot version command generated the following package versions:

Package	Version
@clerk/astro	2.1.20-snapshot.v20250204165902
@clerk/backend	1.23.12-snapshot.v20250204165902
@clerk/chrome-extension	2.2.7-snapshot.v20250204165902
@clerk/clerk-js	5.52.1-snapshot.v20250204165902
@clerk/elements	0.22.20-snapshot.v20250204165902
@clerk/clerk-expo	2.7.5-snapshot.v20250204165902
@clerk/expo-passkeys	0.1.19-snapshot.v20250204165902
@clerk/express	1.3.47-snapshot.v20250204165902
@clerk/fastify	2.1.20-snapshot.v20250204165902
@clerk/nextjs	6.11.1-snapshot.v20250204165902
@clerk/nuxt	1.1.3-snapshot.v20250204165902
@clerk/clerk-react	5.22.11-snapshot.v20250204165902
@clerk/react-router	1.0.6-snapshot.v20250204165902
@clerk/remix	4.4.22-snapshot.v20250204165902
@clerk/shared	2.21.0-snapshot.v20250204165902
@clerk/tanstack-start	0.9.4-snapshot.v20250204165902
@clerk/testing	1.4.21-snapshot.v20250204165902
@clerk/ui	0.3.21-snapshot.v20250204165902
@clerk/vue	1.1.11-snapshot.v20250204165902

Tip: Use the snippet copy button below to quickly install the required packages.
@clerk/astro

npm i @clerk/astro@2.1.20-snapshot.v20250204165902 --save-exact

@clerk/backend

npm i @clerk/backend@1.23.12-snapshot.v20250204165902 --save-exact

@clerk/chrome-extension

npm i @clerk/chrome-extension@2.2.7-snapshot.v20250204165902 --save-exact

@clerk/clerk-js

npm i @clerk/clerk-js@5.52.1-snapshot.v20250204165902 --save-exact

@clerk/elements

npm i @clerk/elements@0.22.20-snapshot.v20250204165902 --save-exact

@clerk/clerk-expo

npm i @clerk/clerk-expo@2.7.5-snapshot.v20250204165902 --save-exact

@clerk/expo-passkeys

npm i @clerk/expo-passkeys@0.1.19-snapshot.v20250204165902 --save-exact

@clerk/express

npm i @clerk/express@1.3.47-snapshot.v20250204165902 --save-exact

@clerk/fastify

npm i @clerk/fastify@2.1.20-snapshot.v20250204165902 --save-exact

@clerk/nextjs

npm i @clerk/nextjs@6.11.1-snapshot.v20250204165902 --save-exact

@clerk/nuxt

npm i @clerk/nuxt@1.1.3-snapshot.v20250204165902 --save-exact

@clerk/clerk-react

npm i @clerk/clerk-react@5.22.11-snapshot.v20250204165902 --save-exact

@clerk/react-router

npm i @clerk/react-router@1.0.6-snapshot.v20250204165902 --save-exact

@clerk/remix

npm i @clerk/remix@4.4.22-snapshot.v20250204165902 --save-exact

@clerk/shared

npm i @clerk/shared@2.21.0-snapshot.v20250204165902 --save-exact

@clerk/tanstack-start

npm i @clerk/tanstack-start@0.9.4-snapshot.v20250204165902 --save-exact

@clerk/testing

npm i @clerk/testing@1.4.21-snapshot.v20250204165902 --save-exact

@clerk/ui

npm i @clerk/ui@0.3.21-snapshot.v20250204165902 --save-exact

@clerk/vue

npm i @clerk/vue@1.1.11-snapshot.v20250204165902 --save-exact

…into-clerkshared

wobsoriano · 2025-02-06T04:31:03Z

Can you publish a snapshot release and test it on the different platforms?

Do you intend to use this shared package in the Next.js SDK in a follow-up?

Tested in a simple app for both Next.js and a Vite Vue app in this repo. They work as expected 🫡

LekoArts

Code looks good 👍

One last thing to test would be Expo. We had problems with @clerk/shared in the past with Expo because their Metro bundler is particularly picky about what it supports and what not. Since we don't have E2E tests, just to be sure that it supports es2020 target 🙏

wobsoriano · 2025-02-06T16:59:46Z

Code looks good 👍

One last thing to test would be Expo. We had problems with @clerk/shared in the past with Expo because their Metro bundler is particularly picky about what it supports and what not. Since we don't have E2E tests, just to be sure that it supports es2020 target 🙏

Tested on Expo. Works great 👍🏼

…variable retrieval function (#4985)

clerk-cookie added react-router tanstack labels Jan 23, 2025

wobsoriano changed the title ~~chore(shared): Create shared environment variable retrieval function~~ chore(shared,react-router,tanstack-start): Create shared environment variable retrieval function Jan 23, 2025

vercel bot deployed to Preview January 23, 2025 17:56 View deployment

wobsoriano added 2 commits January 23, 2025 11:08

feat: Create shared environment variable retrieval function

23db855

reuse logic within tanstack-start

f756662

wobsoriano force-pushed the rob/eco-302-move-environment-variable-logic-into-clerkshared branch from f607dde to f756662 Compare January 23, 2025 19:09

vercel bot deployed to Preview January 23, 2025 19:11 View deployment

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

029dce0

…into-clerkshared

vercel bot deployed to Preview January 24, 2025 15:45 View deployment

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

7f808fa

…into-clerkshared

vercel bot deployed to Preview January 24, 2025 21:01 View deployment

chore: pass context directly

f1ce19b

vercel bot temporarily deployed to Preview January 24, 2025 21:12 Inactive

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

9f486ca

…into-clerkshared

vercel bot deployed to Preview January 27, 2025 17:32 View deployment

wobsoriano added 2 commits January 28, 2025 13:02

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

a876fa7

…into-clerkshared

remove unused catch var

2a1bd48

vercel bot deployed to Preview January 28, 2025 21:04 View deployment

test nextjs env vars

d85c375

clerk-cookie added the nextjs label Jan 29, 2025

vercel bot deployed to Preview January 29, 2025 19:34 View deployment

clerk deleted a comment from clerk-cookie Jan 29, 2025

wobsoriano added 2 commits January 29, 2025 13:05

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

78804b9

…into-clerkshared

revert

a7cb5a9

vercel bot temporarily deployed to Preview January 29, 2025 21:06 Inactive

clerk-cookie removed the nextjs label Jan 29, 2025

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

585ff10

…into-clerkshared

vercel bot deployed to Preview February 3, 2025 21:34 View deployment

improve types

15b7417

vercel bot deployed to Preview February 3, 2025 23:59 View deployment

chore: update changeset

8431042

vercel bot deployed to Preview February 4, 2025 00:11 View deployment

chore: update changeset

1f6bff3

clerk deleted a comment from clerk-cookie Feb 4, 2025

wobsoriano commented Feb 4, 2025

View reviewed changes

vercel bot deployed to Preview February 4, 2025 00:15 View deployment

wobsoriano commented Feb 4, 2025

View reviewed changes

wobsoriano requested a review from LekoArts February 4, 2025 00:24

wobsoriano marked this pull request as ready for review February 4, 2025 00:24

LekoArts reviewed Feb 4, 2025

View reviewed changes

wobsoriano added 2 commits February 4, 2025 08:53

chore: update changesets

db1427e

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

01ba102

…into-clerkshared

vercel bot deployed to Preview February 4, 2025 16:57 View deployment

Merge branch 'main' into rob/eco-302-move-environment-variable-logic-…

71ff504

…into-clerkshared

vercel bot deployed to Preview February 5, 2025 22:42 View deployment

wobsoriano requested a review from LekoArts February 6, 2025 04:31

LekoArts approved these changes Feb 6, 2025

View reviewed changes

wobsoriano merged commit f41081c into main Feb 6, 2025
29 checks passed

wobsoriano deleted the rob/eco-302-move-environment-variable-logic-into-clerkshared branch February 6, 2025 16:59

clerk-cookie mentioned this pull request Feb 6, 2025

ci(repo): Version packages #5086

Open

wobsoriano added a commit that referenced this pull request Feb 8, 2025

chore(shared,react-router,tanstack-start): Create shared environment …

98d3354

…variable retrieval function (#4985)

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore(shared,react-router,tanstack-start): Create shared environment variable retrieval function #4985

chore(shared,react-router,tanstack-start): Create shared environment variable retrieval function #4985

wobsoriano commented Jan 23, 2025 •

edited

Loading

vercel bot commented Jan 23, 2025 •

edited

Loading

changeset-bot bot commented Jan 23, 2025 •

edited

Loading

wobsoriano Feb 4, 2025

wobsoriano Feb 4, 2025

LekoArts Feb 4, 2025

LekoArts left a comment

LekoArts Feb 4, 2025

wobsoriano commented Feb 4, 2025 •

edited

Loading

wobsoriano commented Feb 4, 2025

clerk-cookie commented Feb 4, 2025

wobsoriano commented Feb 6, 2025

LekoArts left a comment

wobsoriano commented Feb 6, 2025

chore(shared,react-router,tanstack-start): Create shared environment variable retrieval function #4985

chore(shared,react-router,tanstack-start): Create shared environment variable retrieval function #4985

Conversation

wobsoriano commented Jan 23, 2025 • edited Loading

Description

Checklist

Type of change

vercel bot commented Jan 23, 2025 • edited Loading

changeset-bot bot commented Jan 23, 2025 • edited Loading

🦋 Changeset detected

wobsoriano Feb 4, 2025

Choose a reason for hiding this comment

wobsoriano Feb 4, 2025

Choose a reason for hiding this comment

LekoArts Feb 4, 2025

Choose a reason for hiding this comment

LekoArts left a comment

Choose a reason for hiding this comment

LekoArts Feb 4, 2025

Choose a reason for hiding this comment

wobsoriano commented Feb 4, 2025 • edited Loading

wobsoriano commented Feb 4, 2025

clerk-cookie commented Feb 4, 2025

wobsoriano commented Feb 6, 2025

LekoArts left a comment

Choose a reason for hiding this comment

wobsoriano commented Feb 6, 2025

wobsoriano commented Jan 23, 2025 •

edited

Loading

vercel bot commented Jan 23, 2025 •

edited

Loading

changeset-bot bot commented Jan 23, 2025 •

edited

Loading

wobsoriano commented Feb 4, 2025 •

edited

Loading