Просмотр исходного кода

🎨 refactor: move Turnstile component to global scope in auth forms

Move the Turnstile verification component from the renderOAuthOptions method to the main render function in both LoginForm and RegisterForm components. This ensures the Turnstile verification is globally visible and accessible regardless of which authentication method the user chooses (email login/register or third-party OAuth options).

The change improves UI consistency and ensures the verification mechanism works properly across all authentication flows.
Apple\Apple 9 месяцев назад
Родитель
Сommit
01c84f9a45
2 измененных файлов с 22 добавлено и 22 удалено
  1. 11 11
      web/src/components/auth/LoginForm.js
  2. 11 11
      web/src/components/auth/RegisterForm.js

+ 11 - 11
web/src/components/auth/LoginForm.js

@@ -362,17 +362,6 @@ const LoginForm = () => {
               </div>
               </div>
             </div>
             </div>
           </Card>
           </Card>
-
-          {turnstileEnabled && (
-            <div className="flex justify-center mt-6">
-              <Turnstile
-                sitekey={turnstileSiteKey}
-                onVerify={(token) => {
-                  setTurnstileToken(token);
-                }}
-              />
-            </div>
-          )}
         </div>
         </div>
       </div>
       </div>
     );
     );
@@ -528,6 +517,17 @@ const LoginForm = () => {
           ? renderEmailLoginForm()
           ? renderEmailLoginForm()
           : renderOAuthOptions()}
           : renderOAuthOptions()}
         {renderWeChatLoginModal()}
         {renderWeChatLoginModal()}
+
+        {turnstileEnabled && (
+          <div className="flex justify-center mt-6">
+            <Turnstile
+              sitekey={turnstileSiteKey}
+              onVerify={(token) => {
+                setTurnstileToken(token);
+              }}
+            />
+          </div>
+        )}
       </div>
       </div>
     </div>
     </div>
   );
   );

+ 11 - 11
web/src/components/auth/RegisterForm.js

@@ -368,17 +368,6 @@ const RegisterForm = () => {
               </div>
               </div>
             </div>
             </div>
           </Card>
           </Card>
-
-          {turnstileEnabled && (
-            <div className="flex justify-center mt-6">
-              <Turnstile
-                sitekey={turnstileSiteKey}
-                onVerify={(token) => {
-                  setTurnstileToken(token);
-                }}
-              />
-            </div>
-          )}
         </div>
         </div>
       </div>
       </div>
     );
     );
@@ -568,6 +557,17 @@ const RegisterForm = () => {
           ? renderEmailRegisterForm()
           ? renderEmailRegisterForm()
           : renderOAuthOptions()}
           : renderOAuthOptions()}
         {renderWeChatLoginModal()}
         {renderWeChatLoginModal()}
+
+        {turnstileEnabled && (
+          <div className="flex justify-center mt-6">
+            <Turnstile
+              sitekey={turnstileSiteKey}
+              onVerify={(token) => {
+                setTurnstileToken(token);
+              }}
+            />
+          </div>
+        )}
       </div>
       </div>
     </div>
     </div>
   );
   );