diff --git a/.changeset/lucky-starfishes-occur.md b/.changeset/lucky-starfishes-occur.md new file mode 100644 index 000000000..007705869 --- /dev/null +++ b/.changeset/lucky-starfishes-occur.md @@ -0,0 +1,5 @@ +--- +'@blockchain-lab-um/dapp': patch +--- + +Improves SIWE session handling. diff --git a/.changeset/smart-poems-yawn.md b/.changeset/smart-poems-yawn.md new file mode 100644 index 000000000..67063067d --- /dev/null +++ b/.changeset/smart-poems-yawn.md @@ -0,0 +1,5 @@ +--- +'@blockchain-lab-um/dapp': patch +--- + +Add loading skeleton on shared presentations page. diff --git a/packages/dapp/src/app/[locale]/app/(public)/share-presentation/[id]/credentialPanel.tsx b/packages/dapp/src/app/[locale]/app/(public)/share-presentation/[id]/credentialPanel.tsx index 0230ccd64..6b2ec767b 100644 --- a/packages/dapp/src/app/[locale]/app/(public)/share-presentation/[id]/credentialPanel.tsx +++ b/packages/dapp/src/app/[locale]/app/(public)/share-presentation/[id]/credentialPanel.tsx @@ -78,9 +78,6 @@ const CredentialSubject = ({ return ( <>
-

- DID: -

@@ -204,9 +201,6 @@ const CredentialPanel = ({ credential }: FormatedPanelProps) => { {t('issuer')}
-

- DID: -

; +} diff --git a/packages/dapp/src/app/[locale]/app/layout.tsx b/packages/dapp/src/app/[locale]/app/layout.tsx index 99e7c25f3..9b439cfbe 100644 --- a/packages/dapp/src/app/[locale]/app/layout.tsx +++ b/packages/dapp/src/app/[locale]/app/layout.tsx @@ -32,9 +32,9 @@ export default async function AppLayout({ + - ); } diff --git a/packages/dapp/src/components/CookiesProvider/index.tsx b/packages/dapp/src/components/CookiesProvider/index.tsx index 1f7174d96..cb805c396 100644 --- a/packages/dapp/src/components/CookiesProvider/index.tsx +++ b/packages/dapp/src/components/CookiesProvider/index.tsx @@ -2,48 +2,47 @@ import { useEffect } from 'react'; import Cookies from 'js-cookie'; +import { useAccount } from 'wagmi'; +import { verifyToken } from '@/utils/verifyToken'; import { useAuthStore } from '@/stores/authStore'; export const CookiesProvider = () => { - const { isSignedIn, changeToken, changeIsSignedIn } = useAuthStore( - (state) => ({ - isSignedIn: state.isSignedIn, - changeToken: state.changeToken, - changeIsSignedIn: state.changeIsSignedIn, - }) - ); - - const verifyToken = async (token: string) => { - const response = await fetch('/api/supabase/verify', { - method: 'GET', - headers: { - 'Content-Type': 'application/json', - Authorization: `Bearer ${token}`, - }, - }); - - if (response.status !== 204) { - Cookies.remove('token'); - changeToken(''); - changeIsSignedIn(false); - } + const { changeToken, changeIsSignedIn } = useAuthStore((state) => ({ + changeToken: state.changeToken, + changeIsSignedIn: state.changeIsSignedIn, + })); - changeToken(token); - changeIsSignedIn(true); - }; + const { address } = useAccount(); useEffect(() => { - if (isSignedIn) return; + // Return if user is not connected + if (!address) return; - const token = Cookies.get('token'); - if (!token) return; + const token = Cookies.get(`token-${address}`); + if (!token) { + changeToken(''); + changeIsSignedIn(false); + return; + } - verifyToken(token).catch((error) => { - Cookies.remove('token'); - console.error(error); - }); - }, []); + verifyToken(token) + .then((isVerified) => { + if (!isVerified) { + Cookies.remove(`token-${address}`); + changeToken(''); + changeIsSignedIn(false); + return; + } + + changeToken(token); + changeIsSignedIn(true); + }) + .catch((error) => { + Cookies.remove(`token-${address}`); + console.error(error); + }); + }, [address]); return null; }; diff --git a/packages/dapp/src/components/MetaMaskProvider/index.tsx b/packages/dapp/src/components/MetaMaskProvider/index.tsx index bcdfe6599..3101c5ab0 100644 --- a/packages/dapp/src/components/MetaMaskProvider/index.tsx +++ b/packages/dapp/src/components/MetaMaskProvider/index.tsx @@ -12,9 +12,13 @@ interface MetaMaskProviderProps { const MetaMaskProvider = ({ children }: MetaMaskProviderProps) => { const t = useTranslations('MetaMaskProvider'); + + // Local state + const [hasMetamask, setHasMetamask] = useState(false); + + // Global state const { connectors } = useConnect(); const { isConnected } = useAccount(); - const [hasMetamask, setHasMetamask] = useState(false); useEffect(() => { const provider = diff --git a/packages/dapp/src/components/SharedPresentationsSkeleton/index.tsx b/packages/dapp/src/components/SharedPresentationsSkeleton/index.tsx new file mode 100644 index 000000000..bdbd83026 --- /dev/null +++ b/packages/dapp/src/components/SharedPresentationsSkeleton/index.tsx @@ -0,0 +1,111 @@ +import { Pagination } from '@nextui-org/react'; + +import { TextSkeleton } from '../Skeletons/TextSkeleton'; + +export default function SharedPresentationsSkeleton() { + return ( +
+
+
+
+
+
+
+ +

+
+ +
+

+
+
+ + +
+
+ +
+
+
+
+
+ + +
+
+
+
+
+ +
+
+
+
+ + +
+
+
+ + +
+
+
+
+
+ +
+ +
+ +
+

+ +

+
+ +
+
+
+
+
+
+ +
+
+ + +
+
+
+
+ +
+ + +
+
+
+
+
+
+ +
+
+
+
+
+
+ ); +} diff --git a/packages/dapp/src/components/SignInModal/index.tsx b/packages/dapp/src/components/SignInModal/index.tsx index be3ba4e93..cbee82101 100644 --- a/packages/dapp/src/components/SignInModal/index.tsx +++ b/packages/dapp/src/components/SignInModal/index.tsx @@ -93,7 +93,7 @@ export const SignInModal = () => { // Set data changeToken(data.jwt); changeIsSignedIn(true); - Cookies.set('token', data.jwt); + Cookies.set(`token-${address}`, data.jwt); // Close modal and show toast changeIsSignInModalOpen(false); diff --git a/packages/dapp/src/utils/verifyToken.ts b/packages/dapp/src/utils/verifyToken.ts new file mode 100644 index 000000000..1934a699b --- /dev/null +++ b/packages/dapp/src/utils/verifyToken.ts @@ -0,0 +1,15 @@ +export const verifyToken = async (token: string) => { + const response = await fetch('/api/supabase/verify', { + method: 'GET', + headers: { + 'Content-Type': 'application/json', + Authorization: `Bearer ${token}`, + }, + }); + + if (response.status !== 204) { + return false; + } + + return true; +};