Feature/jwt

.gitignore

@@ -161,6 +161,8 @@ cython_debug/
 *_test.py
 # CDK
 node_modules/
+.env.local
+.env.local.*
 
 # CDK asset staging directory
 cdk.out
@@ -172,4 +174,4 @@ package-lock.json
 # Model Artifact
 internlm2-chat-7b/
 sqlcoder-7b-2/
-bge-m3/
+bge-m3/

report-front-end/.env

@@ -2,6 +2,7 @@
 VITE_TITLE=Guidance for Generative BI on Amazon Web Services
 VITE_LOGO=
 VITE_RIGHT_LOGO=
+VITE_LOGO_DISPLAY_ON_LOGIN_PAGE=true
 # VITE_TITLE=Guidance for Generative BI on Amazon Web Services
 # VITE_LOGO=/log.png
 # VITE_RIGHT_LOGO=/logo.png
@@ -26,4 +27,4 @@ VITE_SQL_DISPLAY=yes
 VITE_BACKEND_URL=PLACEHOLDER_VITE_BACKEND_URL
 
 # Websocket configuration, e.g. ws://34.208.51.119:8000/qa/ws
-VITE_WEBSOCKET_URL=PLACEHOLDER_VITE_WEBSOCKET_URL
+VITE_WEBSOCKET_URL=PLACEHOLDER_VITE_WEBSOCKET_URL

report-front-end/.env.template

@@ -1,10 +1,11 @@
 # General configuration
 VITE_TITLE=Guidance for Generative BI on Amazon Web Services
-VITE_LOGO=/logo.png
+VITE_LOGO=
 VITE_RIGHT_LOGO=
+VITE_LOGO_DISPLAY_ON_LOGIN_PAGE=true
 # VITE_TITLE=Guidance for Generative BI on Amazon Web Services
 # VITE_LOGO=/log.png
-# VITE_RIGHT_LOGO=/logo.png
+# VITE_RIGHT_LOGO=
 
 
 

report-front-end/package.json

@@ -20,6 +20,7 @@
     "luxon": "^3.4.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-hot-toast": "^2.4.1",
     "react-json-view-lite": "^0.9.8",
     "react-markdown": "^9.0.0",
     "react-redux": "^9.1.2",
@@ -31,6 +32,7 @@
     "redux": "^5.0.1",
     "regenerator-runtime": "^0.14.0",
     "remark-gfm": "^4.0.0",
+    "umi-request": "^1.4.0",
     "uuid": "^9.0.0"
   },
   "devDependencies": {
@@ -45,6 +47,7 @@
     "@typescript-eslint/parser": "^6.0.0",
     "@vitejs/plugin-react": "^4.0.3",
     "autoprefixer": "^10.4.14",
+    "classnames": "^2.5.1",
     "cross-env": "^7.0.3",
     "eslint": "^8.45.0",
     "eslint-plugin-react-hooks": "^4.6.0",
@@ -53,7 +56,6 @@
     "sass": "^1.65.1",
     "typescript": "^5.0.2",
     "vite": "^4.5.2",
-    "zen-observable": "^0.10.0",
-    "classnames": "^2.5.1"
+    "zen-observable": "^0.10.0"
   }
 }

report-front-end/src/app.tsx

@@ -1,44 +1,72 @@
-import "./app.scss";
-import PageRouter from "./pages/page-router";
-import CustomTopNavigation from "./components/top-navigation";
-import { BrowserRouter } from "react-router-dom";
+import { AmplifyUser } from "@aws-amplify/ui";
+import { UseAuthenticator } from "@aws-amplify/ui-react-core";
 import { useEffect } from "react";
-import { Auth } from "aws-amplify";
+import toast, { Toaster } from "react-hot-toast";
 import { useDispatch } from "react-redux";
+import { BrowserRouter } from "react-router-dom";
+import "./app.scss";
+import {
+  COGNITO,
+  LOCAL_STORAGE_KEYS,
+  LOGIN_TYPE,
+} from "./common/constant/constants";
 import { ActionType, UserInfo } from "./common/helpers/types";
 import AlertMsg from "./components/alert-msg";
-import { COGNITO, LOGIN_TYPE } from "./common/constant/constants";
+import CustomTopNavigation from "./components/top-navigation";
+import PageRouter from "./pages/page-router";
 
-function App() {
+export type SignOut = UseAuthenticator["signOut"];
 
+const App: React.FC<{
+  signOut?: SignOut;
+  user?: AmplifyUser & { signInUserSession: any };
+}> = ({ user }) => {
   const dispatch = useDispatch();
+  console.log({ user, signInUserSession: user?.signInUserSession });
 
   useEffect(() => {
     if (LOGIN_TYPE === COGNITO) {
-      (async () => {
-        const user = await Auth.currentUserInfo();
+      if (!user?.signInUserSession) {
+        toast.error("User session not found");
+        return;
+      }
+      try {
+        const {
+          signInUserSession: {
+            accessToken: { jwtToken: accessToken },
+            idToken: { jwtToken: idToken },
+            refreshToken: { token: refreshToken },
+          },
+        } = user;
         const loginUser: UserInfo = {
           userId: user?.attributes?.sub || "",
-          displayName: user?.attributes?.displayName || user?.attributes?.email || "",
+          displayName:
+            user?.attributes?.displayName || user?.attributes?.email || "",
           loginExpiration: 0,
-          isLogin: true
+          isLogin: true,
         };
-        dispatch({type: ActionType.UpdateUserInfo, state: loginUser});
-      })();
+        dispatch({ type: ActionType.UpdateUserInfo, state: loginUser });
+        localStorage.setItem(LOCAL_STORAGE_KEYS.accessToken, accessToken);
+        localStorage.setItem(LOCAL_STORAGE_KEYS.idToken, idToken);
+        localStorage.setItem(LOCAL_STORAGE_KEYS.refreshToken, refreshToken);
+      } catch (error) {
+        console.error("Initiating cognito user state error: ", error);
+      }
     } else {
       const loginUser: UserInfo = {
         userId: "none",
         displayName: "",
         loginExpiration: 0,
-        isLogin: true
+        isLogin: true,
       };
-      dispatch({type: ActionType.UpdateUserInfo, state: loginUser});
+      dispatch({ type: ActionType.UpdateUserInfo, state: loginUser });
     }
-  }, []);
+  }, [dispatch, user]);
 
   return (
     <div style={{ height: "100%" }}>
       <BrowserRouter>
+        <Toaster />
         <AlertMsg />
         <CustomTopNavigation />
         <div style={{ height: "56px", backgroundColor: "#000716" }}>&nbsp;</div>
@@ -48,6 +76,6 @@ function App() {
       </BrowserRouter>
     </div>
   );
-}
+};
 
 export default App;