🐛 fix: support to disable clerk signup with feature flag (#3126)

* feat: Disable signup when env set

* feat: Disable Clerk sign-up based on feature flag

* fix: change to client

* fix: remove the logic for signup in middleware

* chore: revert the space deletion

* fix: update the url for login and signup

* fix: fix footerAction update logic

* test: update test for enableClerkSignUp

src/app/(auth)/signup/[[...signup]]/page.tsx

@@ -1,5 +1,7 @@
 import { SignUp } from '@clerk/nextjs';
+import { redirect } from 'next/navigation';
 
+import { serverFeatureFlags } from '@/config/featureFlags';
 import { metadataModule } from '@/server/metadata';
 import { translation } from '@/server/translation';
 
@@ -13,6 +15,12 @@ export const generateMetadata = async () => {
 };
 
 const Page = () => {
+  const enableClerkSignUp = serverFeatureFlags().enableClerkSignUp;
+
+  if (!enableClerkSignUp) {
+    redirect('/login');
+  }
+
   return <SignUp path="/signup" />;
 };
 

src/config/featureFlags/schema.ts

@@ -16,6 +16,8 @@ export const FeatureFlagsSchema = z.object({
 
   check_updates: z.boolean().optional(),
   welcome_suggest: z.boolean().optional(),
+
+  clerk_sign_up: z.boolean().optional(),
 });
 
 // TypeScript 类型，从 Zod schema 生成
@@ -36,6 +38,8 @@ export const DEFAULT_FEATURE_FLAGS: IFeatureFlags = {
 
   check_updates: true,
   welcome_suggest: true,
+
+  clerk_sign_up: true,
 };
 
 export const mapFeatureFlagsEnvToState = (config: IFeatureFlags) => {
@@ -53,5 +57,7 @@ export const mapFeatureFlagsEnvToState = (config: IFeatureFlags) => {
 
     enableCheckUpdates: config.check_updates,
     showWelcomeSuggest: config.welcome_suggest,
+
+    enableClerkSignUp: config.clerk_sign_up,
   };
 };

src/layout/AuthProvider/Clerk/index.tsx

@@ -4,10 +4,13 @@ import { ClerkProvider } from '@clerk/nextjs';
 import { PropsWithChildren, memo, useEffect, useMemo, useState, useTransition } from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
+
 import UserUpdater from './UserUpdater';
 import { useAppearance } from './useAppearance';
 
 const Clerk = memo(({ children }: PropsWithChildren) => {
+  const { enableClerkSignUp } = useServerConfigStore(featureFlagsSelectors);
   const appearance = useAppearance();
   const {
     i18n: { language, getResourceBundle },
@@ -27,8 +30,23 @@ const Clerk = memo(({ children }: PropsWithChildren) => {
     });
   }, [count, setCount, isPending, startTransition]);
 
+  const updatedAppearance = useMemo(
+    () => ({
+      ...appearance,
+      elements: {
+        ...appearance.elements,
+        ...(!enableClerkSignUp ? { footerAction: { display: 'none' } } : {}),
+      },
+    }),
+    [appearance, enableClerkSignUp],
+  );
+
   return (
-    <ClerkProvider appearance={appearance} localization={localization}>
+    <ClerkProvider
+      appearance={updatedAppearance}
+      localization={localization}
+      signUpUrl={!enableClerkSignUp ? '/login' : '/signup'} // Redirect sign-up to sign-in if disabled
+    >
       {children}
       <UserUpdater />
     </ClerkProvider>

src/store/serverConfig/selectors.test.ts

@@ -26,6 +26,7 @@ describe('featureFlagsSelectors', () => {
       showOpenAIProxyUrl: true,
       enableCheckUpdates: true,
       showWelcomeSuggest: true,
+      enableClerkSignUp: true,
     });
   });
 });