haaremy-auth

import { HmyAuthProvider, useAuth, HmyLoginForm } from '@haaremy/auth/react'; const ssoUrl = process.env.NEXT_PUBLIC_SSO_URL ?? 'https://sso.haaremy.de'; // Ensure SSO URL is configured // This component would typically be in your _app.tsx or layout.tsx function AppWrapper({ children }) { return ( <HmyAuthProvider config={{ ssoUrl: ssoUrl }}> {children} </HmyAuthProvider> ); } // This component demonstrates how to use the auth state within your application function MyAuthenticatedPage() { const { state, user, login, logout, getAccessToken } = useAuth(); if (state === 'loading') { return <div>Authentifizierungsstatus wird geladen...</div>; } if (state === 'unauthenticated') { return ( <div> <p>Sie sind nicht angemeldet.</p> <HmyLoginForm onSuccess={(loggedInUser) => { console.log('Login erfolgreich:', loggedInUser.display_name); }} onError={(error) => { console.error('Login fehlgeschlagen:', error.message); }} /> </div> ); } // State is 'authenticated' return ( <div> <h1>Hallo, {user?.display_name}!</h1> <p>Ihre E-Mail: {user?.email}</p> <button onClick={logout}>Abmelden</button> <button onClick={async () => { const token = await getAccessToken(); console.log('Aktueller Access Token:', token ? token.substring(0, 20) + '...' : 'Kein Token'); }}>Token anzeigen</button> </div> ); } // Example usage within a React component tree: // function Root() { // return ( // <AppWrapper> // <MyAuthenticatedPage /> // </AppWrapper> // ) // } // export default Root;