fix: recaptcha v3

layouts/shortcodes/form.html

@@ -9,7 +9,10 @@
   {{ end }}
 {{ end }}
 
-<form action="{{ $action }}" method="{{ $method }}" class="space-y-4 dark:bg-gray-800 dark:text-gray-100 p-4">
+{{ $seed := now.Unix }}
+{{ $random := delimit (shuffle (split (md5 $seed) "" )) "" }}
+
+<form action="{{ $action }}" method="{{ $method }}" id="form-{{ $random }}" class="space-y-4 dark:bg-gray-800 dark:text-gray-100 p-4">
   {{ $fieldCount := 0 }}
   {{ range $key, $value := .Params }}
     {{ if hasPrefix $key "field" }}
@@ -59,13 +62,23 @@
   
   <input type="text" name="honey_pot" style="display: none" class="hidden">
 
-  {{ with .Get "recaptcha_site_key" }}
-    <div class="g-recaptcha" data-sitekey="{{ . }}"></div>
-  {{ end }}
-  
   <div>
-    <button type="submit" class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:bg-indigo-500 dark:hover:bg-indigo-600 dark:focus:ring-offset-gray-800">
+    <button
+      {{ if (.Get "recaptcha_site_key") }}
+      {{ with .Get "recaptcha_site_key" }}data-sitekey="{{ . }}"{{ end }}
+      data-callback="submitForm{{ $random }}"
+      data-action="submit"
+      {{ else }}
+      type="submit"
+      {{ end }}
+      class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 dark:bg-indigo-500 dark:hover:bg-indigo-600 dark:focus:ring-offset-gray-800" >
       {{ .Get "submit_text" | default "Send" }}
     </button>
   </div>
 </form>
+
+<script type="text/javascript">
+  function submitForm{{ $random }} (token) {
+    document.getElementById("form-{{ $random }}").submit();
+  }
+</script>