From f34810fa806201dd5c2c2ccfd370b2e03aa77cc5 Mon Sep 17 00:00:00 2001 From: Noah Spannbauer Date: Mon, 20 Jan 2025 17:11:21 -0600 Subject: [PATCH] Refactoring --- .DS_Store | Bin 8196 -> 8196 bytes app/src/components/siteNav/SiteNav.tsx | 72 +++++++++---------- app/src/main.tsx | 92 +++++++++++++++++++------ infrastructure/config/main.tf | 4 ++ infrastructure/config/outputs.tf | 4 ++ infrastructure/main.tf | 30 ++++++++ 6 files changed, 144 insertions(+), 58 deletions(-) diff --git a/.DS_Store b/.DS_Store index 6d6147ffcf734ddc2f0bda18b43d674ec436b36a..ccd73f23a00c1d0b2a45a43c2524989f6aed3faf 100644 GIT binary patch delta 16 XcmZp1XmQveBRpA1$a{0T@LV1MFHZ$P delta 14 VcmZp1XmQveBg|;NSyuQt4*(-U1a<%b diff --git a/app/src/components/siteNav/SiteNav.tsx b/app/src/components/siteNav/SiteNav.tsx index d725309..448db82 100644 --- a/app/src/components/siteNav/SiteNav.tsx +++ b/app/src/components/siteNav/SiteNav.tsx @@ -43,8 +43,8 @@ const SiteNav: React.FC = () => { url: '/pilots' } ]; - const handleSignIn = async () => { - await instance.loginRedirect({ + const handleSignIn = () => { + instance.loginRedirect({ scopes: [`api://${import.meta.env.VITE_CLIENT_ID}/user_impersonation`] }); }; @@ -98,44 +98,44 @@ const SiteNav: React.FC = () => { ); }; - useEffect(() => { - const callback = instance.addEventCallback( - async (message: EventMessage) => { - if (message.eventType === EventType.LOGIN_SUCCESS) { - try { - setLoading(true); + // useEffect(() => { + // const callback = instance.addEventCallback( + // async (message: EventMessage) => { + // if (message.eventType === EventType.LOGIN_SUCCESS) { + // try { + // setLoading(true); - const eventPayload: EventPayloadExtended = - message.payload as EventPayloadExtended; - const userProfile: User = await getUserProfile( - eventPayload.accessToken - ); - const userPhoto = await getUserPhoto(eventPayload.accessToken); + // const eventPayload: EventPayloadExtended = + // message.payload as EventPayloadExtended; + // const userProfile: User = await getUserProfile( + // eventPayload.accessToken + // ); + // const userPhoto = await getUserPhoto(eventPayload.accessToken); - appContext.dispatch({ - type: 'SET_USER_PROFILE', - payload: userProfile - }); - } catch (error) { - console.log(error); - } finally { - setLoading(false); - } - } - } - ); + // appContext.dispatch({ + // type: 'SET_USER_PROFILE', + // payload: userProfile + // }); + // } catch (error) { + // console.log(error); + // } finally { + // setLoading(false); + // } + // } + // } + // ); - instance.handleRedirectPromise().then((response) => { - console.log(response) - }) + // instance.handleRedirectPromise().then((response) => { + // console.log(response) + // }) - return () => { - if (callback) { - instance.removeEventCallback(callback); - appContext.dispatch({ type: 'SET_USER_PROFILE', payload: {} }); - } - }; - }, []); + // return () => { + // if (callback) { + // instance.removeEventCallback(callback); + // appContext.dispatch({ type: 'SET_USER_PROFILE', payload: {} }); + // } + // }; + // }, []); useEffect(() => { const setUserProfile = async () => { diff --git a/app/src/main.tsx b/app/src/main.tsx index e1e5a54..d515e34 100644 --- a/app/src/main.tsx +++ b/app/src/main.tsx @@ -5,35 +5,83 @@ import AppContextProvider from './context/appContext/AppContextProvider.tsx'; import { BrowserRouter } from 'react-router-dom'; import './index.css'; import '@noahspan/noahspan-components/noahspan-components.css'; -import { PublicClientApplication } from '@azure/msal-browser'; +import { Configuration, EventType, LogLevel, PublicClientApplication } from '@azure/msal-browser'; import { MsalProvider } from '@azure/msal-react'; -const msalInstance: PublicClientApplication = new PublicClientApplication({ +const msalConfig: Configuration = { auth: { clientId: import.meta.env.VITE_CLIENT_ID, authority: `https://login.microsoftonline.com/${import.meta.env.VITE_TENANT_ID}`, - redirectUri: import.meta.env.VITE_REDIRECT_URL - } -}); + redirectUri: import.meta.env.VITE_REDIRECT_URL, + postLogoutRedirectUri: '/', + navigateToLoginRequestUrl: false, + }, + cache: { + cacheLocation: 'localStorage', + storeAuthStateInCookie: false, + }, + system: { + loggerOptions: { + loggerCallback: (level, message, containsPii) => { + if (containsPii) { + return; + } + switch (level) { + case LogLevel.Error: + console.error(message); + return; + case LogLevel.Info: + console.info(message); + return; + case LogLevel.Verbose: + console.debug(message); + return; + case LogLevel.Warning: + console.warn(message); + return; + default: + return; + } + }, + }, + }, +}; -console.log(msalInstance); +const msalInstance: PublicClientApplication = new PublicClientApplication(msalConfig); -console.log('ClientId :' + import.meta.env.VITE_CLIENT_ID) -console.log('TenantId :' + import.meta.env.VITE_TENANT_ID) -console.log('RedirectUrl :' + import.meta.env.VITE_REDIRECT_URL) +msalInstance.initialize() + .then(() => { + console.log('Initialized!'); + if (!msalInstance.getActiveAccount() && msalInstance.getAllAccounts().length > 0) { + msalInstance.setActiveAccount(msalInstance.getAllAccounts()[0]); + } + msalInstance.enableAccountStorageEvents(); + msalInstance.addEventCallback((event: any) => { + if ( + event.eventType === EventType.LOGIN_SUCCESS || + event.eventType === EventType.ACQUIRE_TOKEN_SUCCESS || + event.eventType === EventType.SSO_SILENT_SUCCESS + ) { + const account = event.payload.account; + msalInstance.setActiveAccount(account); + } + }); + }) + .catch((err) => { + console.error('Error during initialization'); + console.error(err); + }); -msalInstance.initialize().then(() => { - ReactDOM.createRoot(document.getElementById('root')!).render( - - - - - - - - - - ); -}); \ No newline at end of file +ReactDOM.createRoot(document.getElementById('root')!).render( + + + + + + + + + +); \ No newline at end of file diff --git a/infrastructure/config/main.tf b/infrastructure/config/main.tf index 48f0305..54a6494 100644 --- a/infrastructure/config/main.tf +++ b/infrastructure/config/main.tf @@ -16,6 +16,10 @@ locals { test = "flying-app-test" prod = "flying-app-prod" } + + container_app_app_redirect_url = { + dev = "https://flying-app-dev.greensea-e83e7646.centralus.azurecontainerapps.io" + } container_app_api_name = { dev = "flying-api-dev" diff --git a/infrastructure/config/outputs.tf b/infrastructure/config/outputs.tf index c7103b0..2764245 100644 --- a/infrastructure/config/outputs.tf +++ b/infrastructure/config/outputs.tf @@ -14,6 +14,10 @@ output "container_app_api_name" { value = local.container_app_api_name[var.environment] } +output "container_app_app_redirect_url" { + value = local.container_app_app_redirect_url[var.environment] +} + output "container_app_api_container_image" { value = local.container_app_api_container_image[var.environment] } diff --git a/infrastructure/main.tf b/infrastructure/main.tf index 7a88ee9..50c5df1 100644 --- a/infrastructure/main.tf +++ b/infrastructure/main.tf @@ -128,6 +128,26 @@ resource "azurerm_container_app" "container_app_app" { image = module.environment.container_app_app_container_image cpu = 0.25 memory = "0.5Gi" + + env { + name = "VITE_API_URL" + value = azurerm_container_app.container_app_api.latest_revision_fqdn + } + + env { + name = "VITE_CLIENT_ID" + secret_name = "client-id" + } + + env { + name = "VITE_REDIRECT_URL" + value = module.environment.container_app_app_redirect_url + } + + env { + name = "VITE_TENANT_ID" + secret_name = "tenant-id" + } } } @@ -143,11 +163,21 @@ resource "azurerm_container_app" "container_app_app" { } } + secret { + name = "client-id" + value = var.CLIENT_ID + } + secret { name = "docker-io-password" value = var.DOCKER_IO_PASSWORD } + secret { + name = "tenant-id" + value = var.TENANT_ID + } + lifecycle { ignore_changes = [ template[0].container[0].image ] }