From fa6b6820f711a4755a378b6f1c86f949c9e92258 Mon Sep 17 00:00:00 2001 From: Jim O'Donnell Date: Wed, 2 Oct 2024 21:25:44 +0100 Subject: [PATCH] Set default token dynamically in the browser --- .../src/hooks/usePanoptesAuthToken.js | 36 ++++++++++++------- .../src/hooks/usePanoptesMemberships.js | 7 ---- .../lib-user/src/hooks/usePanoptesProjects.js | 7 ---- .../lib-user/src/hooks/usePanoptesUser.js | 6 ---- .../src/hooks/usePanoptesUserGroup.js | 7 ---- packages/lib-user/src/hooks/useStats.js | 7 ---- 6 files changed, 24 insertions(+), 46 deletions(-) diff --git a/packages/lib-user/src/hooks/usePanoptesAuthToken.js b/packages/lib-user/src/hooks/usePanoptesAuthToken.js index 4d1b91acec..3af7e720f8 100644 --- a/packages/lib-user/src/hooks/usePanoptesAuthToken.js +++ b/packages/lib-user/src/hooks/usePanoptesAuthToken.js @@ -1,23 +1,35 @@ -import auth from "panoptes-client/lib/auth"; -import { useState } from "react"; +import auth from "panoptes-client/lib/auth" +import { useState } from "react" -const isBrowser = typeof window !== "undefined"; +const isBrowser = typeof window !== "undefined" -if (isBrowser) { - auth.checkCurrent(); -} +let defaultToken +/* + Top-level await in modules has been supported in Node + and in all browsers since 2021. However, ES modules are still + not supported in the monorepo. An immediately-invoked async + function is a workaround when top-level await is not supported. + https://v8.dev/features/top-level-await +*/ +(async function getDefaultToken() { + defaultToken = null + if (isBrowser) { + await auth.checkCurrent() + defaultToken = await auth.checkBearerToken() + } +})() export default function usePanoptesAuthToken() { - const [token, setToken] = useState(null); + const [token, setToken] = useState(defaultToken) async function fetchPanoptesAuthToken() { - await auth.checkCurrent(); - const newToken = await auth.checkBearerToken(); + await auth.checkCurrent() + const newToken = await auth.checkBearerToken() if (newToken !== token) { - setToken(newToken); + setToken(newToken) } } - fetchPanoptesAuthToken(); - return token; + fetchPanoptesAuthToken() + return token } diff --git a/packages/lib-user/src/hooks/usePanoptesMemberships.js b/packages/lib-user/src/hooks/usePanoptesMemberships.js index 6752b03c86..6dabc6d523 100644 --- a/packages/lib-user/src/hooks/usePanoptesMemberships.js +++ b/packages/lib-user/src/hooks/usePanoptesMemberships.js @@ -1,11 +1,8 @@ import { panoptes } from '@zooniverse/panoptes-js' -import auth from 'panoptes-client/lib/auth' import useSWR from 'swr' import usePanoptesAuthToken from './usePanoptesAuthToken' -const isBrowser = typeof window !== 'undefined' - const SWROptions = { revalidateIfStale: true, revalidateOnMount: true, @@ -14,10 +11,6 @@ const SWROptions = { refreshInterval: 0 } -if (isBrowser) { - auth.checkCurrent() -} - async function fetchMemberships({ query, token }) { const authorization = `Bearer ${token}` if (!token) return null diff --git a/packages/lib-user/src/hooks/usePanoptesProjects.js b/packages/lib-user/src/hooks/usePanoptesProjects.js index e7b6e39edd..a966ab757b 100644 --- a/packages/lib-user/src/hooks/usePanoptesProjects.js +++ b/packages/lib-user/src/hooks/usePanoptesProjects.js @@ -1,11 +1,8 @@ import { projects as panoptesProjects } from '@zooniverse/panoptes-js' -import auth from 'panoptes-client/lib/auth' import useSWR from 'swr' import usePanoptesAuthToken from './usePanoptesAuthToken' -const isBrowser = typeof window !== 'undefined' - const SWROptions = { revalidateIfStale: true, revalidateOnMount: true, @@ -14,10 +11,6 @@ const SWROptions = { refreshInterval: 0 } -if (isBrowser) { - auth.checkCurrent() -} - async function fetchProjects({ query, token }) { const authorization = token ? `Bearer ${token}` : undefined diff --git a/packages/lib-user/src/hooks/usePanoptesUser.js b/packages/lib-user/src/hooks/usePanoptesUser.js index 1cfbc82486..eeefac31e9 100644 --- a/packages/lib-user/src/hooks/usePanoptesUser.js +++ b/packages/lib-user/src/hooks/usePanoptesUser.js @@ -4,8 +4,6 @@ import useSWR from 'swr' import usePanoptesAuthToken from './usePanoptesAuthToken' -const isBrowser = typeof window !== 'undefined' - const SWROptions = { revalidateIfStale: true, revalidateOnMount: true, @@ -14,10 +12,6 @@ const SWROptions = { refreshInterval: 0 } -if (isBrowser) { - auth.checkCurrent() -} - async function getUser({ query, token }) { const authorization = `Bearer ${token}` diff --git a/packages/lib-user/src/hooks/usePanoptesUserGroup.js b/packages/lib-user/src/hooks/usePanoptesUserGroup.js index 7bed7f54ee..1dabb9fddd 100644 --- a/packages/lib-user/src/hooks/usePanoptesUserGroup.js +++ b/packages/lib-user/src/hooks/usePanoptesUserGroup.js @@ -1,11 +1,8 @@ import { panoptes } from '@zooniverse/panoptes-js' -import auth from 'panoptes-client/lib/auth' import useSWR from 'swr' import usePanoptesAuthToken from './usePanoptesAuthToken' -const isBrowser = typeof window !== 'undefined' - const SWROptions = { revalidateIfStale: true, revalidateOnMount: true, @@ -14,10 +11,6 @@ const SWROptions = { refreshInterval: 0 } -if (isBrowser) { - auth.checkCurrent() -} - async function fetchPanoptesUserGroup({ groupId, token }) { const authorization = token ? `Bearer ${token}` : undefined diff --git a/packages/lib-user/src/hooks/useStats.js b/packages/lib-user/src/hooks/useStats.js index 7310dcd17d..dadfbd4f54 100644 --- a/packages/lib-user/src/hooks/useStats.js +++ b/packages/lib-user/src/hooks/useStats.js @@ -1,12 +1,9 @@ import { env } from '@zooniverse/panoptes-js' -import auth from 'panoptes-client/lib/auth' import useSWR from 'swr' import usePanoptesAuthToken from './usePanoptesAuthToken' const defaultEndpoint = '/classifications/users' -const isBrowser = typeof window !== 'undefined' - const SWROptions = { revalidateIfStale: true, revalidateOnMount: true, @@ -15,10 +12,6 @@ const SWROptions = { refreshInterval: 0 } -if (isBrowser) { - auth.checkCurrent() -} - function statsHost(env) { switch (env) { case 'production':