diff --git a/docs/stremio/addons/stremio-gdrive/callback.mdx b/docs/stremio/addons/stremio-gdrive/callback.mdx index f9ecb20..970fc85 100644 --- a/docs/stremio/addons/stremio-gdrive/callback.mdx +++ b/docs/stremio/addons/stremio-gdrive/callback.mdx @@ -1,7 +1,8 @@ import Callback from '@site/src/components/GoogleOAuth/Callback'; - # Google Drive Callback -You will automatically be redirected back to the addon guide after you have authenticated with Google. \ No newline at end of file +This tool was created to assist in the Google OAuth flow for the [Stremio GDrive OAuth Tool](/stremio/addons/stremio-gdrive#oauth-tool). + + \ No newline at end of file diff --git a/src/components/GoogleOAuth/Callback.tsx b/src/components/GoogleOAuth/Callback.tsx index 86be878..c2bf31f 100644 --- a/src/components/GoogleOAuth/Callback.tsx +++ b/src/components/GoogleOAuth/Callback.tsx @@ -4,22 +4,60 @@ import { sessionKeys } from "."; export default function Catcher(): JSX.Element { const redirectUrl = useBaseUrl('/stremio/addons/stremio-gdrive#oauth-tool'); + const [message, setMessage] = useState(""); + const [sessionStorageAvailable, setSessionStorageAvailable] = useState(false); + React.useEffect(() => { const url = new URL(window.location.href); const code = url.searchParams.get("code"); - if (code) { - sessionStorage.setItem(sessionKeys.authorisationCode, code); - window.location.href = redirectUrl; - } const error = url.searchParams.get("error"); + + try { + sessionStorage.setItem("test", "test"); + sessionStorage.removeItem("test"); + setSessionStorageAvailable(true); + } catch (e) { + console.error("Session storage is not available: ", e); + setSessionStorageAvailable(false); + } + + if (code) { + if (sessionStorageAvailable) { + sessionStorage.setItem(sessionKeys.authorisationCode, code); + window.location.href = redirectUrl; + } else { + // prompt the user to copy the code + try { + window.prompt("Copy the authorisation code and paste it into the OAuth tool", code); + window.location.href = redirectUrl; + } catch (e) { + console.error("Failed to prompt the user to copy the authorisation code: ", e); + setMessage(`Copy the authorisation code below and paste it into the OAuth Tool: ${code}`); + } + } + } if (error) { console.error("Google OAuth Error: ", error); - sessionStorage.setItem(sessionKeys.oauthError, error); - window.location.href = redirectUrl; + if (sessionStorageAvailable) { + sessionStorage.setItem(sessionKeys.oauthError, error); + window.location.href = redirectUrl; + } else { + try { + window.alert(`The OAuth flow could not be completed due to an error: ${error}`); + window.location.href = redirectUrl; + } catch (e) { + console.error("Failed to alert the user of the OAuth error: ", e); + } + setMessage(`The OAuth flow could not be completed due to an error: ${error}`); + } } - }, []); + }, [sessionStorageAvailable, redirectUrl]); - return <>; + return ( +
+ {message} +
+ ); } export function CallBackUrl(): JSX.Element { diff --git a/src/components/GoogleOAuth/index.tsx b/src/components/GoogleOAuth/index.tsx index 441afe0..3c49549 100644 --- a/src/components/GoogleOAuth/index.tsx +++ b/src/components/GoogleOAuth/index.tsx @@ -45,6 +45,7 @@ export default function CodeGenerator(): JSX.Element { const [authorisationCode, setAuthorisationCode] = useState(""); const [refreshToken, setRefreshToken] = useState(""); const [redirectUrl, setRedirectUrl] = useState(""); + const [sessionStorageAvailable, setSessionStorageAvailable] = useState(false); const callbackPath = useBaseUrl('/stremio/addons/stremio-gdrive/callback'); React.useEffect(() => { @@ -53,6 +54,19 @@ export default function CodeGenerator(): JSX.Element { console.log("Redirect URL: ", redirectUrl); // load the stored values from session storage if they exist + try { + sessionStorage.setItem("test", "test"); + sessionStorage.removeItem("test"); + setSessionStorageAvailable(true); + } catch (e) { + console.error("Session storage is not available: ", e); + setSessionStorageAvailable(false); + } + + if (!sessionStorageAvailable) { + return; + } + const storedClientId = sessionStorage.getItem(sessionKeys.clientId); const storedClientSecret = sessionStorage.getItem(sessionKeys.clientSecret); const storedAuthorisationCode = sessionStorage.getItem(sessionKeys.authorisationCode); @@ -72,24 +86,32 @@ export default function CodeGenerator(): JSX.Element { sessionStorage.removeItem(sessionKeys.authorisationCode); showToast("Authorisation code obtained successfully. Click `Get Credentials` to complete the process", "success"); } - }, []); + }, [sessionStorageAvailable, redirectUrl, callbackPath]); const handleClientIdChange = (e: React.ChangeEvent) => { const value = e.target.value; setClientId(value); - sessionStorage.setItem(sessionKeys.clientId, value); // reset the authorisation code since its no longer valid with different client id setAuthorisationCode(""); - sessionStorage.removeItem(sessionKeys.authorisationCode); + try { + sessionStorage.setItem(sessionKeys.clientId, value); + sessionStorage.removeItem(sessionKeys.authorisationCode); + } catch (e) { + console.error("Error accessing session storage: ", e); + } }; const handleClientSecretChange = (e: React.ChangeEvent) => { const value = e.target.value; setClientSecret(value); - sessionStorage.setItem(sessionKeys.clientSecret, value); // reset the authorisation code since its no longer valid with different client secret setAuthorisationCode(""); - sessionStorage.removeItem(sessionKeys.authorisationCode); + try { + sessionStorage.setItem(sessionKeys.clientSecret, value); + sessionStorage.removeItem(sessionKeys.authorisationCode); + } catch (e) { + console.error("Error accessing session storage: ", e); + } }; const getRefreshCode = () => { @@ -142,8 +164,12 @@ export default function CodeGenerator(): JSX.Element { showToast("Refresh token obtained successfully. Copy the code and paste it into your script.", "success"); // reset the authorisation code as it can no longer be used setAuthorisationCode(""); - sessionStorage.removeItem(sessionKeys.authorisationCode); setRefreshToken(data.refresh_token); + try { + sessionStorage.removeItem(sessionKeys.authorisationCode); + } catch (e) { + console.error("Error accessing session storage: ", e); + } }); } else { let text = res.text();