fix: reload turnstile on SPA navigation

frontend/src/components/Captcha.jsx

@@ -37,6 +37,15 @@ export default function Captcha({ onToken }) {
 
       containerRef.current.innerHTML = ''
 
+      window.turnstile.ready(() => {
+        if (
+          cancelled ||
+          !containerRef.current ||
+          !window.turnstile
+        ) {
+          return
+        }
+
         widgetIdRef.current = window.turnstile.render(
           containerRef.current,
           {
@@ -46,18 +55,25 @@ export default function Captcha({ onToken }) {
             appearance: 'always',
 
             callback: (token) => {
+              if (!cancelled) {
                 onToken(token)
+              }
             },
 
             'expired-callback': () => {
+              if (!cancelled) {
                 onToken('')
+              }
             },
 
             'error-callback': () => {
+              if (!cancelled) {
                 onToken('')
+              }
             },
           }
         )
+      })
     }
 
     const existingScript = document.getElementById(
@@ -66,19 +82,11 @@ export default function Captcha({ onToken }) {
 
     if (window.turnstile) {
       renderWidget()
-      return
-    }
-
-    if (existingScript) {
+    } else if (existingScript) {
       existingScript.addEventListener('load', renderWidget, {
         once: true,
       })
-
-      return () => {
-        cancelled = true
-      }
-    }
-
+    } else {
       const script = document.createElement('script')
 
       script.id = TURNSTILE_SCRIPT_ID
@@ -91,6 +99,7 @@ export default function Captcha({ onToken }) {
       })
 
       document.head.appendChild(script)
+    }
 
     return () => {
       cancelled = true
@@ -107,6 +116,10 @@ export default function Captcha({ onToken }) {
       }
 
       widgetIdRef.current = null
+
+      if (containerRef.current) {
+        containerRef.current.innerHTML = ''
+      }
     }
   }, [onToken])