diff --git a/src/components/RecaptchaLoader.tsx b/src/components/RecaptchaLoader.tsx new file mode 100644 index 0000000..626fd07 --- /dev/null +++ b/src/components/RecaptchaLoader.tsx @@ -0,0 +1,31 @@ +import { useEffect } from "react"; +import { useLocation } from "react-router-dom"; + +declare const grecaptcha: { reset: () => void } | undefined; + +const RecaptchaLoader = () => { + const location = useLocation(); + + useEffect(() => { + if (document.querySelector('script[src="https://www.google.com/recaptcha/api.js"]')) { + if (typeof grecaptcha !== "undefined") { + grecaptcha.reset(); + } + return; + } + + const script = document.createElement("script"); + script.src = "https://www.google.com/recaptcha/api.js"; + script.async = true; + script.defer = true; + document.body.appendChild(script); + + return () => { + document.body.removeChild(script); + }; + }, [location.pathname]); + + return null; +}; + +export default RecaptchaLoader; diff --git a/src/pages/join-org/fail.mdx b/src/pages/join-org/fail.mdx index 778adde..2b52866 100644 --- a/src/pages/join-org/fail.mdx +++ b/src/pages/join-org/fail.mdx @@ -12,7 +12,8 @@ Sorry, something went wrong. Please contact a developer by [opening an issue](ht ### Error -import BrowserOnly from "@docusaurus/BrowserOnly"; import CodeBlock from "@theme/CodeBlock"; -{() => {new URLSearchParams(location.search).get("reason")}} + + {new URLSearchParams(globalThis.location?.search).get("reason")} + diff --git a/src/pages/join-org/index.mdx b/src/pages/join-org/index.mdx index 9793462..4f9af30 100644 --- a/src/pages/join-org/index.mdx +++ b/src/pages/join-org/index.mdx @@ -10,13 +10,11 @@ See the [guide on publishing packages](/docs/guides/typescript-packages) for mor Enter your npm username below and you will be added to the "@rbxts" npm organization. - +import RecaptchaLoader from "../../components/RecaptchaLoader"; -<> - {(() => { - globalThis.onSubmit = token => document.getElementById("org-form").submit(); - })()} - + + +<>{(() => globalThis.onSubmit = token => document.getElementById("org-form").submit())()}
+import RecaptchaLoader from "../../components/RecaptchaLoader"; -<> - {(() => { - globalThis.onSubmit = token => document.getElementById("org-form").submit(); - })()} - + -import BrowserOnly from "@docusaurus/BrowserOnly"; +<>{(() => globalThis.onSubmit = token => document.getElementById("org-form").submit())()} - - {() => } - +