From a0e29c11931052c2e475c0cf9040a3cf7e69f561 Mon Sep 17 00:00:00 2001
From: Giancarlo Buomprisco <giancarlopsk@gmail.com>
Date: Sun, 2 Nov 2025 16:58:02 +0700
Subject: [PATCH] chore: bump version to 2.20.2 in package.json and update
 captcha integration across auth components (#405)

- Incremented application version from 2.20.1 to 2.20.2 in package.json.
- Added captchaSiteKey prop to SignUpPage for enhanced security.
- Refactored captcha field rendering in various authentication components to ensure consistent placement and functionality.
---
 apps/web/app/auth/sign-up/page.tsx               |  1 +
 package.json                                     |  2 +-
 .../src/components/otp-sign-in-container.tsx     |  4 ++--
 .../password-reset-request-container.tsx         |  3 +--
 .../components/password-sign-in-container.tsx    | 14 ++++++++------
 .../components/password-sign-up-container.tsx    | 16 +++++++++-------
 .../src/components/resend-auth-link-form.tsx     |  4 ++--
 packages/ui/src/makerkit/version-updater.tsx     | 13 +++++++------
 8 files changed, 31 insertions(+), 26 deletions(-)

diff --git a/apps/web/app/auth/sign-up/page.tsx b/apps/web/app/auth/sign-up/page.tsx
index 5aa8e61bd..7e47c883b 100644
--- a/apps/web/app/auth/sign-up/page.tsx
+++ b/apps/web/app/auth/sign-up/page.tsx
@@ -40,6 +40,7 @@ async function SignUpPage() {
         providers={authConfig.providers}
         displayTermsCheckbox={authConfig.displayTermsCheckbox}
         paths={paths}
+        captchaSiteKey={authConfig.captchaTokenSiteKey}
       />
 
       <div className={'flex justify-center'}>
diff --git a/package.json b/package.json
index a231f182b..f48095fac 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "next-supabase-saas-kit-turbo",
-  "version": "2.20.1",
+  "version": "2.20.2",
   "private": true,
   "sideEffects": false,
   "engines": {
diff --git a/packages/features/auth/src/components/otp-sign-in-container.tsx b/packages/features/auth/src/components/otp-sign-in-container.tsx
index 1e747d34d..ea9de3a3f 100644
--- a/packages/features/auth/src/components/otp-sign-in-container.tsx
+++ b/packages/features/auth/src/components/otp-sign-in-container.tsx
@@ -209,8 +209,6 @@ function OtpEmailForm({
       >
         <AuthErrorAlert error={signInMutation.error} />
 
-        {captcha.field}
-
         <FormField
           name="email"
           render={({ field }) => (
@@ -239,6 +237,8 @@ function OtpEmailForm({
           )}
         </Button>
       </form>
+
+      {captcha.field}
     </Form>
   );
 }
diff --git a/packages/features/auth/src/components/password-reset-request-container.tsx b/packages/features/auth/src/components/password-reset-request-container.tsx
index 6065c40de..0708adc71 100644
--- a/packages/features/auth/src/components/password-reset-request-container.tsx
+++ b/packages/features/auth/src/components/password-reset-request-container.tsx
@@ -79,8 +79,6 @@ export function PasswordResetRequestContainer(params: {
             <div className={'flex flex-col gap-y-4'}>
               <AuthErrorAlert error={error} />
 
-              {captcha.field}
-
               <FormField
                 name={'email'}
                 render={({ field }) => (
@@ -107,6 +105,7 @@ export function PasswordResetRequestContainer(params: {
                 <Trans i18nKey={'auth:passwordResetLabel'} />
               </Button>
             </div>
+            {captcha.field}
           </form>
         </Form>
       </If>
diff --git a/packages/features/auth/src/components/password-sign-in-container.tsx b/packages/features/auth/src/components/password-sign-in-container.tsx
index 4bf095ce8..d13676ec7 100644
--- a/packages/features/auth/src/components/password-sign-in-container.tsx
+++ b/packages/features/auth/src/components/password-sign-in-container.tsx
@@ -54,13 +54,15 @@ export function PasswordSignInContainer({
     <>
       <AuthErrorAlert error={signInMutation.error} />
 
-      {captcha.field}
+      <div>
+        <PasswordSignInForm
+          onSubmit={onSubmit}
+          loading={isLoading}
+          redirecting={isRedirecting}
+        />
 
-      <PasswordSignInForm
-        onSubmit={onSubmit}
-        loading={isLoading}
-        redirecting={isRedirecting}
-      />
+        {captcha.field}
+      </div>
     </>
   );
 }
diff --git a/packages/features/auth/src/components/password-sign-up-container.tsx b/packages/features/auth/src/components/password-sign-up-container.tsx
index 456066099..3b0aecd6a 100644
--- a/packages/features/auth/src/components/password-sign-up-container.tsx
+++ b/packages/features/auth/src/components/password-sign-up-container.tsx
@@ -51,14 +51,16 @@ export function EmailPasswordSignUpContainer({
       <If condition={!showVerifyEmailAlert}>
         <AuthErrorAlert error={error} />
 
-        {captcha.field}
+        <div>
+          <PasswordSignUpForm
+            onSubmit={onSignupRequested}
+            loading={loading}
+            defaultValues={defaultValues}
+            displayTermsCheckbox={displayTermsCheckbox}
+          />
 
-        <PasswordSignUpForm
-          onSubmit={onSignupRequested}
-          loading={loading}
-          defaultValues={defaultValues}
-          displayTermsCheckbox={displayTermsCheckbox}
-        />
+          {captcha.field}
+        </div>
       </If>
     </>
   );
diff --git a/packages/features/auth/src/components/resend-auth-link-form.tsx b/packages/features/auth/src/components/resend-auth-link-form.tsx
index ae455c0b7..957d9578c 100644
--- a/packages/features/auth/src/components/resend-auth-link-form.tsx
+++ b/packages/features/auth/src/components/resend-auth-link-form.tsx
@@ -68,8 +68,6 @@ export function ResendAuthLinkForm(props: {
           return promise;
         })}
       >
-        {captcha.field}
-
         <FormField
           name={'email'}
           render={({ field }) => {
@@ -89,6 +87,8 @@ export function ResendAuthLinkForm(props: {
           <Trans i18nKey={'auth:resendLink'} defaults={'Resend Link'} />
         </Button>
       </form>
+
+      {captcha.field}
     </Form>
   );
 }
diff --git a/packages/ui/src/makerkit/version-updater.tsx b/packages/ui/src/makerkit/version-updater.tsx
index 2f5cbb3e0..cac6d5e57 100644
--- a/packages/ui/src/makerkit/version-updater.tsx
+++ b/packages/ui/src/makerkit/version-updater.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 
 import { useQuery } from '@tanstack/react-query';
 import { RocketIcon } from 'lucide-react';
@@ -38,11 +38,12 @@ export function VersionUpdater(props: { intervalTimeInSecond?: number }) {
   const [dismissed, setDismissed] = useState(false);
   const [showDialog, setShowDialog] = useState<boolean>(false);
 
-  if (!data?.didChange || dismissed) {
-    return null;
-  } else {
-    setShowDialog(data?.didChange ?? false);
-  }
+  useEffect(() => {
+    if (data?.didChange && !dismissed) {
+      // eslint-disable-next-line
+      setShowDialog(data?.didChange ?? false);
+    }
+  }, [data?.didChange, dismissed]);
 
   return (
     <AlertDialog open={showDialog} onOpenChange={setShowDialog}>