WIP

expose/client/src/component/App.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import {getAuthRedirect, unsetAuthRedirect} from "../lib/oauth";
+import {UserInfoResponse, AuthEventHandler} from "@alchemy/auth";
 import {DashboardMenu} from "@alchemy/react-ps";
 import {oauthClient} from "../lib/api-client";
 import config from "../lib/config";
@@ -18,32 +19,25 @@ type Props = {};
 
 export default function App({}: Props) {
     const { pushInstruction } = useMatomo();
-    const [user, setUser] = React.useState<UserInfoResponse | null>(null);
+    const [user, setUser] = React.useState<UserInfoResponse | undefined>();
 
     const authenticate = React.useCallback(async () => {
-        if (user) {
-            return;
-        }
-
-        const res = await oauthClient.authenticate();
-        setUser(res);
+        setUser(oauthClient.isAuthenticated() ? oauthClient.getDecodedToken()! : undefined);
     }, [user]);
 
     React.useEffect(() => {
-        pushInstruction('setUserId', user?.user_id || null);
+        pushInstruction('setUserId', user?.sub || null);
     }, [user]);
 
     const onLogin = React.useCallback<AuthEventHandler>(async (event) => {
         await authenticate();
     }, [authenticate]);
     const onLogout = React.useCallback<AuthEventHandler>(async (event) => {
-        setUser(null);
+        setUser(undefined);
     }, []);
 
     React.useEffect(() => {
-        if (oauthClient.getAccessToken()) {
-            authenticate();
-        }
+        authenticate();
         oauthClient.registerListener('login', onLogin);
         oauthClient.registerListener('logout', onLogout);
 
@@ -53,7 +47,7 @@ export default function App({}: Props) {
         }
     }, [onLogin, onLogout, authenticate]);
 
-    const css = config.get('globalCSS');
+    const css = config.globalCSS;
 
     return <Router>
         <AnalyticsRouterProvider>
@@ -71,11 +65,11 @@ export default function App({}: Props) {
                 />}/>
                 <Route path="/:publication" exact render={props => <PublicationRoute
                     {...props}
-                    username={this.state.username}
+                    username={user?.preferred_username}
                 />}/>
                 <Route path="/:publication/:asset" exact render={props => <AssetRoute
                     {...props}
-                    username={this.state.username}
+                    username={user?.preferred_username}
                 />}/>
                 <Route path="/" exact render={() => <ErrorPage
                     title={'Not found'}
@@ -86,9 +80,9 @@ export default function App({}: Props) {
     </Router>
 }
 
-const OAuthR = props => {
+const OAuthR = (props: {}) => {
     return <OAuthRedirect
-        {...props}
+        {...props as any}
         oauthClient={oauthClient}
         successHandler={(history) => {
             const redirectUri = getAuthRedirect() || '/';

lib/js/auth/src/client/OAuthClient.ts

@@ -17,7 +17,7 @@ interface ValidationError {
     error_description: string;
 }
 
-type UserInfoResponse = {
+export type UserInfoResponse = {
     preferred_username: string;
     groups: string[];
     roles: string[];

lib/js/auth/src/index.ts

@@ -7,6 +7,7 @@ import OAuthClient, {
     configureClientAuthentication,
     configureClientCredentialsGrantType,
     RefreshTokenEvent,
+    UserInfoResponse,
     AuthEventHandler,
     LoginEvent,
     AuthEvent,
@@ -36,6 +37,7 @@ export {
     RefreshTokenEvent,
     AuthEventHandler,
     LoginEvent,
+    UserInfoResponse,
     AuthEvent,
     LogoutEvent,
     MemoryStorage,

lib/js/react-ps/src/index.ts

@@ -5,13 +5,3 @@ export {
     DashboardMenu,
     useEffectOnce,
 };
-
-export type {
-    TokenResponse,
-    UserInfoResponse,
-    AuthEvent,
-    LoginEvent,
-    AuthenticationEvent,
-    LogoutEvent,
-    AuthEventHandler,
-} from  "./lib/oauth-client";