From ef38989a829b7c50afcd7cb70537a88bf78d119a Mon Sep 17 00:00:00 2001 From: wobsoriano Date: Thu, 11 Jul 2024 15:58:02 -0700 Subject: [PATCH 1/2] chore(astro): Move safe id generation to a shared function --- .../interactive/InternalUIComponentRenderer.astro | 4 ++-- .../src/astro-components/unstyled/SignInButton.astro | 4 ++-- .../src/astro-components/unstyled/SignOutButton.astro | 4 ++-- .../src/astro-components/unstyled/SignUpButton.astro | 4 ++-- packages/astro/src/internal/index.ts | 2 ++ packages/astro/src/internal/utils/generateSafeId.ts | 10 ++++++++++ 6 files changed, 20 insertions(+), 8 deletions(-) create mode 100644 packages/astro/src/internal/utils/generateSafeId.ts diff --git a/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro b/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro index 0f217aa156e..32482beaea1 100644 --- a/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro +++ b/packages/astro/src/astro-components/interactive/InternalUIComponentRenderer.astro @@ -4,9 +4,9 @@ interface Props { component: 'sign-in' | 'sign-up' | 'organization-list' | 'organization-profile' | 'organization-switcher' | 'user-button' | 'user-profile' | 'google-one-tap' } -import { customAlphabet, urlAlphabet } from "nanoid"; +import { generateSafeId } from '@clerk/astro/internal'; -const safeId = customAlphabet(urlAlphabet, 10)(); +const safeId = generateSafeId(); const { component, ...props } = Astro.props --- diff --git a/packages/astro/src/astro-components/unstyled/SignInButton.astro b/packages/astro/src/astro-components/unstyled/SignInButton.astro index df78768bede..9b6ae3e8d48 100644 --- a/packages/astro/src/astro-components/unstyled/SignInButton.astro +++ b/packages/astro/src/astro-components/unstyled/SignInButton.astro @@ -3,9 +3,9 @@ import type { HTMLTag, Polymorphic } from 'astro/types' import type { SignInProps } from "@clerk/types"; type Props = Polymorphic -import { customAlphabet, urlAlphabet } from "nanoid"; +import { generateSafeId } from '@clerk/astro/internal'; -const safeId = customAlphabet(urlAlphabet, 10)(); +const safeId = generateSafeId(); const { as: Tag = 'button', diff --git a/packages/astro/src/astro-components/unstyled/SignOutButton.astro b/packages/astro/src/astro-components/unstyled/SignOutButton.astro index 13242cb0ee2..b82749d7395 100644 --- a/packages/astro/src/astro-components/unstyled/SignOutButton.astro +++ b/packages/astro/src/astro-components/unstyled/SignOutButton.astro @@ -3,9 +3,9 @@ import type { HTMLTag, Polymorphic } from 'astro/types' import type { SignOutOptions } from '@clerk/types'; type Props = Polymorphic<{ as: Tag; } & SignOutOptions> -import { customAlphabet, urlAlphabet } from "nanoid"; +import { generateSafeId } from '@clerk/astro/internal'; -const safeId = customAlphabet(urlAlphabet, 10)(); +const safeId = generateSafeId(); const { as: Tag = 'button', diff --git a/packages/astro/src/astro-components/unstyled/SignUpButton.astro b/packages/astro/src/astro-components/unstyled/SignUpButton.astro index a32b074c806..2cb2e3f7056 100644 --- a/packages/astro/src/astro-components/unstyled/SignUpButton.astro +++ b/packages/astro/src/astro-components/unstyled/SignUpButton.astro @@ -3,9 +3,9 @@ import type { HTMLTag, Polymorphic } from 'astro/types' import type { SignUpProps } from "@clerk/types"; type Props = Polymorphic -import { customAlphabet, urlAlphabet } from "nanoid"; +import { generateSafeId } from '@clerk/astro/internal'; -const safeId = customAlphabet(urlAlphabet, 10)(); +const safeId = generateSafeId(); const { as: Tag = 'button', diff --git a/packages/astro/src/internal/index.ts b/packages/astro/src/internal/index.ts index e2fa5cfccac..72e6d8e25e6 100644 --- a/packages/astro/src/internal/index.ts +++ b/packages/astro/src/internal/index.ts @@ -11,3 +11,5 @@ import { createInjectionScriptRunner } from './create-injection-script-runner'; const runInjectionScript = createInjectionScriptRunner(createClerkInstance); export { runInjectionScript }; + +export { generateSafeId } from './utils/generateSafeId'; diff --git a/packages/astro/src/internal/utils/generateSafeId.ts b/packages/astro/src/internal/utils/generateSafeId.ts new file mode 100644 index 00000000000..9f05f603f60 --- /dev/null +++ b/packages/astro/src/internal/utils/generateSafeId.ts @@ -0,0 +1,10 @@ +import { customAlphabet, urlAlphabet } from 'nanoid'; + +/** + * Generates a safe, URL-friendly unique identifier. + * + * @example + * const id = generateSafeId(); + * console.log(id); // Outputs something like: "f3x2P9Xn1K" + */ +export const generateSafeId = (defaultSize = 10) => customAlphabet(urlAlphabet, defaultSize)(); From 83ae70e1292d03805a21c7f0427fdf5f0edfe220 Mon Sep 17 00:00:00 2001 From: Robert Soriano Date: Thu, 11 Jul 2024 16:02:24 -0700 Subject: [PATCH 2/2] chore(astro): Add changeset --- .changeset/lovely-parents-swim.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/lovely-parents-swim.md diff --git a/.changeset/lovely-parents-swim.md b/.changeset/lovely-parents-swim.md new file mode 100644 index 00000000000..51b7b8888bc --- /dev/null +++ b/.changeset/lovely-parents-swim.md @@ -0,0 +1,5 @@ +--- +"@clerk/astro": patch +--- + +Add a reusable ID generation function