undone zenith
import React, { useEffect, useState } from 'react';
import { Amplify } from 'aws-amplify';
import type { WithAuthenticatorProps } from '@aws-amplify/ui-react';
import { withAuthenticator } from '@aws-amplify/ui-react';
import '@aws-amplify/ui-react/styles.css';
import config from '../amplifyconfiguration.json';
Amplify.configure(config);
export function AuthPage({ signOut, user }: WithAuthenticatorProps) {
const [groups, setGroups] = useState([]);
const [payload, setPayload] = useState({}); // State to store the payload
useEffect(() => {
if (user && user.signInUserSession) {
const idToken = user.signInUserSession.idToken.jwtToken;
const decodedPayload = JSON.parse(Buffer.from(idToken.split('.')[1], 'base64').toString());
setPayload(decodedPayload); // Set the payload in the state
const userGroups = decodedPayload['cognito:groups'] || [];
setGroups(userGroups);
}
}, [user]);
return (
<>
<h1>Hello {user?.username}</h1>
<p>User Groups: {groups.length > 0 ? groups.join(', ') : 'No groups'}</p>
<pre>Payload: {JSON.stringify(payload, null, 2)}</pre>
<pre>User Object: {JSON.stringify(user, null, 2)}</pre>
<button onClick={signOut}>Sign out</button>
</>
);
}
export default withAuthenticator(AuthPage);