Merge pull request #40 from vikas5914/turnstile

Trying to fix turnstile

package.json

@@ -67,7 +67,6 @@
     "react-lazy-with-preload": "^2.2.1",
     "react-router-dom": "^6.23.0",
     "react-sticky-el": "^2.1.0",
-    "react-turnstile": "^1.1.3",
     "react-use": "^17.5.0",
     "semver": "^7.6.0",
     "slugify": "^1.6.6",

src/index.tsx

@@ -176,7 +176,6 @@ const root = createRoot(container!);
 root.render(
   <StrictMode>
     <ErrorBoundary>
-      <TurnstileProvider />
       <HelmetProvider>
         <Suspense fallback={<LoadingScreen type="lazy" />}>
           <ExtensionStatus />

src/stores/turnstile/index.tsx

@@ -76,11 +76,6 @@ export function isTurnstileInitialized() {
 export async function getTurnstileToken() {
   const turnstile = getTurnstile();
   try {
-    // I hate turnstile
-    (window as any).turnstile.execute(
-      document.querySelector(`#${turnstile.id}`),
-      {},
-    );
     const token = await useTurnstileStore.getState().getToken();
     reportCaptchaSolve(true);
     return token;
@@ -99,7 +94,6 @@ export function TurnstileProvider(props: {
   const setTurnstile = useTurnstileStore((s) => s.setTurnstile);
   const processToken = useTurnstileStore((s) => s.processToken);
   if (!siteKey) return null;
-  const widgetId = idRef.current || "sudo-turnstile";
   return (
     <div
       className={classNames({
@@ -109,19 +103,20 @@ export function TurnstileProvider(props: {
       <Turnstile
         siteKey={siteKey}
         options={{
-          refreshExpired: "never",
+          refreshExpired: "auto",
           theme: "light",
         }}
-        onLoadScript={() => {
+        onWidgetLoad={(widgetId) => {
+          idRef.current = widgetId;
           setTurnstile(widgetId, "sudo", !!props.isInPopout);
         }}
         onError={() => {
-          const id = "sudo-turnstile";
+          const id = idRef.current;
           if (!id) return;
           processToken(null, id);
         }}
         onSuccess={(token) => {
-          const id = "sudo-turnstile";
+          const id = idRef.current;
           if (!id) return;
           processToken(token, id);
           props.onUpdateShow?.(false);