fix(clerk-js): Extend client cookie lifetime #4312

issuedat · 2024-10-10T15:40:03Z

Description

Redirects the user to the /v1/client/touch endpoint to extend the __client cookie's lifetime when the cookie expiration <= 8 days
Deprecates beforeEmit in favor of passing a redirectUrl to setActive

Checklist

npm test runs as expected.
npm run 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

changeset-bot · 2024-10-10T15:40:06Z

🦋 Changeset detected

Latest commit: 0b873da

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

This PR includes changesets to release 18 packages

Name	Type
@clerk/clerk-js	Minor
@clerk/types	Minor
@clerk/elements	Patch
@clerk/clerk-react	Patch
@clerk/chrome-extension	Patch
@clerk/clerk-expo	Patch
@clerk/astro	Patch
@clerk/backend	Patch
@clerk/express	Patch
@clerk/fastify	Patch
@clerk/localizations	Patch
@clerk/nextjs	Patch
@clerk/remix	Patch
@clerk/clerk-sdk-node	Patch
@clerk/shared	Patch
@clerk/tanstack-start	Patch
@clerk/testing	Patch
@clerk/themes	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

…e-exp

issuedat · 2024-10-23T10:06:45Z

!snapshot client-touch

clerk-cookie · 2024-10-23T10:11:07Z

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

Package	Version
@clerk/astro	1.4.0-client-touch.v9ff6ce8
@clerk/backend	1.15.0-client-touch.v9ff6ce8
@clerk/chrome-extension	1.3.21-client-touch.v9ff6ce8
@clerk/clerk-js	5.28.0-client-touch.v9ff6ce8
@clerk/elements	0.17.0-client-touch.v9ff6ce8
@clerk/clerk-expo	2.2.27-client-touch.v9ff6ce8
@clerk/express	1.3.2-client-touch.v9ff6ce8
@clerk/fastify	2.0.4-client-touch.v9ff6ce8
@clerk/localizations	3.3.1-client-touch.v9ff6ce8
@clerk/nextjs	5.8.0-client-touch.v9ff6ce8
@clerk/clerk-react	5.12.1-client-touch.v9ff6ce8
@clerk/remix	4.2.40-client-touch.v9ff6ce8
@clerk/clerk-sdk-node	5.0.53-client-touch.v9ff6ce8
@clerk/shared	2.10.0-client-touch.v9ff6ce8
@clerk/tanstack-start	0.4.16-client-touch.v9ff6ce8
@clerk/testing	1.3.14-client-touch.v9ff6ce8
@clerk/themes	2.1.38-client-touch.v9ff6ce8
@clerk/types	4.27.0-client-touch.v9ff6ce8

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

npm i @clerk/[email protected] --save-exact

@clerk/backend

npm i @clerk/[email protected] --save-exact

@clerk/chrome-extension

npm i @clerk/[email protected] --save-exact

@clerk/clerk-js

npm i @clerk/[email protected] --save-exact

@clerk/elements

npm i @clerk/[email protected] --save-exact

@clerk/clerk-expo

npm i @clerk/[email protected] --save-exact

@clerk/express

npm i @clerk/[email protected] --save-exact

@clerk/fastify

npm i @clerk/[email protected] --save-exact

@clerk/localizations

npm i @clerk/[email protected] --save-exact

@clerk/nextjs

npm i @clerk/[email protected] --save-exact

@clerk/clerk-react

npm i @clerk/[email protected] --save-exact

@clerk/remix

npm i @clerk/[email protected] --save-exact

@clerk/clerk-sdk-node

npm i @clerk/[email protected] --save-exact

@clerk/shared

npm i @clerk/[email protected] --save-exact

@clerk/tanstack-start

npm i @clerk/[email protected] --save-exact

@clerk/testing

npm i @clerk/[email protected] --save-exact

@clerk/themes

npm i @clerk/[email protected] --save-exact

@clerk/types

npm i @clerk/[email protected] --save-exact

…e-exp

packages/clerk-js/src/core/clerk.ts

packages/clerk-js/src/core/resources/Client.ts

nikosdouvlis · 2024-10-28T13:41:16Z

packages/elements/src/internals/machines/sign-in/router.machine.ts

-      void context.clerk.setActive({ session, beforeEmit });
+      void context.clerk.setActive({
+        session,
+        redirectUrl: context.router?.searchParams().get('redirect_url') || context.clerk.buildAfterSignInUrl(),


@brkalow would this change the behavior of the AIO components? My understanding is that Clerk#navigate will use the routerPush/routerReplace functions passed to ClerkProvider so it should be okay, just want to verify that this is true for the AIO components as well.

It should be okay for this case 👍 will test

nikosdouvlis · 2024-10-28T13:41:23Z

packages/elements/src/internals/machines/sign-up/router.machine.ts

-      void context.clerk.setActive({ session, beforeEmit });
+      void context.clerk.setActive({
+        session,
+        redirectUrl: context.router?.searchParams().get('redirect_url') || context.clerk.buildAfterSignUpUrl(),


nikosdouvlis · 2024-10-28T13:47:01Z

packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx

  }) => {
    if (typeof ctx.afterSelectPersonalUrl === 'function' && user) {
-      return navigate(ctx.afterSelectPersonalUrl(user));
+      return ctx.afterSelectPersonalUrl(user);


This does make sense to me, but before merging, I'd like to verify that the router the components use internally still updates its state after the setActive invocation.

To share a bit of context, even though the clerk-js components will use the router of the parent host for navigations (routerPush and routerReplace) they still hold an internal router state (clerk-js/src/ui/RouteContext). This state updates when navigate is called but after this change, the internal navigate invocation will be replaced by Clerk#navigate.

@issuedat apologies, I know the names are confusing here. Tagging @panteliselef as well as he's most likely interested in this as well.

packages/clerk-js/src/core/clerk.ts

brkalow

This looks good to me! I left a few minor suggestions on moving some logic into Client.

Nice work.

packages/clerk-js/src/core/clerk.ts

.changeset/eighty-guests-change.md

packages/clerk-js/src/core/resources/Client.ts

Co-authored-by: panteliselef <[email protected]>

Extend client cookie expiration

733c780

clerk-cookie added types clerk-js react elements labels Oct 10, 2024

issuedat changed the title ~~USER-810: Extend client cookie lifetime~~ fix(clerk-js): Extend client cookie lifetime Oct 10, 2024

issuedat added 10 commits October 18, 2024 12:56

Merge remote-tracking branch 'origin/main' into user-810-client-cooki…

e60242b

…e-exp

chore: replace internal beforeEmit calls with redirectUrl

37fdb7d

chore: remove console.log

8b8e460

chore: use absolute URLs in redirect param

afd7050

Merge remote-tracking branch 'origin/main' into user-810-client-cooki…

274ef0c

…e-exp

chore: changeset and remove console.log

6ade57a

chore: update unit tests

d4a0572

chore: add test cases for new redirect logic

43ce325

chore: fix package-lock

356b4fb

chore: add unload tracking

9ff6ce8

issuedat added 2 commits October 23, 2024 12:24

Merge remote-tracking branch 'origin/main' into user-810-client-cooki…

54d09f4

…e-exp

lint

60ba16c

clerk deleted a comment from clerk-cookie Oct 23, 2024

issuedat marked this pull request as ready for review October 23, 2024 10:46

panteliselef reviewed Oct 23, 2024

View reviewed changes

packages/clerk-js/src/core/clerk.ts Show resolved Hide resolved

packages/clerk-js/src/core/resources/Client.ts Show resolved Hide resolved

chore: add deprecation warning

641a004

issuedat requested a review from brkalow October 25, 2024 15:16

nikosdouvlis reviewed Oct 28, 2024

View reviewed changes

brkalow reviewed Oct 28, 2024

View reviewed changes

packages/clerk-js/src/core/clerk.ts Outdated Show resolved Hide resolved

packages/clerk-js/src/core/clerk.ts Outdated Show resolved Hide resolved

issuedat added 2 commits October 28, 2024 16:27

chore: abstract away logic for redirect decision to client method

6e894de

chore: add buildTouchUrl method to client to construct touch URL

f2d8000

panteliselef reviewed Oct 29, 2024

View reviewed changes

.changeset/eighty-guests-change.md Outdated Show resolved Hide resolved

packages/clerk-js/src/core/resources/Client.ts Show resolved Hide resolved

issuedat and others added 2 commits October 29, 2024 11:26

Update .changeset/eighty-guests-change.md

2af1ea2

Co-authored-by: panteliselef <[email protected]>

chore: format changeset

0b873da

panteliselef approved these changes Oct 29, 2024

View reviewed changes

issuedat merged commit f875463 into main Oct 29, 2024
21 checks passed

issuedat deleted the user-810-client-cookie-exp branch October 29, 2024 13:25

clerk-cookie mentioned this pull request Oct 29, 2024

ci(repo): Version packages #4417

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix(clerk-js): Extend client cookie lifetime #4312

fix(clerk-js): Extend client cookie lifetime #4312

issuedat commented Oct 10, 2024 •

edited

Loading

changeset-bot bot commented Oct 10, 2024 •

edited

Loading

issuedat commented Oct 23, 2024

clerk-cookie commented Oct 23, 2024

nikosdouvlis Oct 28, 2024

brkalow Oct 28, 2024

nikosdouvlis Oct 28, 2024

nikosdouvlis Oct 28, 2024

brkalow left a comment

fix(clerk-js): Extend client cookie lifetime #4312

fix(clerk-js): Extend client cookie lifetime #4312

Conversation

issuedat commented Oct 10, 2024 • edited Loading

Description

Checklist

Type of change

changeset-bot bot commented Oct 10, 2024 • edited Loading

🦋 Changeset detected

issuedat commented Oct 23, 2024

clerk-cookie commented Oct 23, 2024

nikosdouvlis Oct 28, 2024

Choose a reason for hiding this comment

brkalow Oct 28, 2024

Choose a reason for hiding this comment

nikosdouvlis Oct 28, 2024

Choose a reason for hiding this comment

nikosdouvlis Oct 28, 2024

Choose a reason for hiding this comment

brkalow left a comment

Choose a reason for hiding this comment

issuedat commented Oct 10, 2024 •

edited

Loading

changeset-bot bot commented Oct 10, 2024 •

edited

Loading