From 75060c04215d79ed8fe280c015f1d3695e90e8d5 Mon Sep 17 00:00:00 2001 From: Noah Spannbauer Date: Mon, 15 Jul 2024 21:51:15 -0500 Subject: [PATCH] add pilot --- api/package.json | 2 +- api/src/app.controller.ts | 17 +++----- app/src/App.tsx | 1 + app/src/components/pilotForm/PilotForm.tsx | 43 +++++++++++++-------- app/src/hooks/accessToken/UseAcessToken.tsx | 32 +++++++++++++++ package-lock.json | 8 ++-- 6 files changed, 71 insertions(+), 32 deletions(-) create mode 100644 app/src/hooks/accessToken/UseAcessToken.tsx diff --git a/api/package.json b/api/package.json index 32faa55..99c8239 100644 --- a/api/package.json +++ b/api/package.json @@ -28,7 +28,7 @@ "@nestjs/core": "^10.0.0", "@nestjs/passport": "^10.0.3", "@nestjs/platform-express": "^10.0.0", - "@noahspan/noahspan-modules": "^0.3.4", + "@noahspan/noahspan-modules": "^0.3.5", "@schematics/angular": "^17.3.7", "dotenv": "^16.4.5", "reflect-metadata": "0.1.13", diff --git a/api/src/app.controller.ts b/api/src/app.controller.ts index 4c06a75..b6aec36 100644 --- a/api/src/app.controller.ts +++ b/api/src/app.controller.ts @@ -21,6 +21,7 @@ export class AppController { @Query() query: any ): Promise<{ key: string; enabled: boolean }[]> { try { + console.log(query); const featureFlagKeys: string[] = query.keys && query.keys.toString().includes(';') ? query.keys.split(';') @@ -46,7 +47,8 @@ export class AppController { async getUserProfile(@Headers() headers: any) { try { const graphToken: string = await this.msGraphService.getMsGraphAuth( - headers.authorization.replace('Bearer ', '') + headers.authorization.replace('Bearer ', ''), + ['user.read'] ); const client: MsGraphClient = await this.msGraphService.getMsGraphClientDelegated(graphToken); @@ -64,17 +66,10 @@ export class AppController { @Query('search') search: any ): Promise { try { - const graphToken: string = await this.msGraphService.getMsGraphAuth( - headers.authorization.replace('Bearer ', '') - ); - const client: MsGraphClient = - await this.msGraphService.getMsGraphClientDelegated(graphToken); - const results: any = await client - .api(`me/people/?$search=${search}`) - .get(); - const personResults: Person[] = results.values ? results.values : []; + const personSearchResults: Person[] = + await getPersonSearshResults(search); - return personResults; + return personSearchResults; } catch (error) { return error; } diff --git a/app/src/App.tsx b/app/src/App.tsx index 3eb41b1..33aa589 100644 --- a/app/src/App.tsx +++ b/app/src/App.tsx @@ -32,6 +32,7 @@ const App: React.FC = () => { const response: AxiosResponse = await httpClient.get( `api/featureFlags?keys=${featureFlagKeys}&label=${import.meta.env.MODE}` ); + console.log(response.data); const featureFlags: { key: string; enabled: boolean }[] = response.data; if (featureFlags.length > 0) { diff --git a/app/src/components/pilotForm/PilotForm.tsx b/app/src/components/pilotForm/PilotForm.tsx index 68de13d..5f87f83 100644 --- a/app/src/components/pilotForm/PilotForm.tsx +++ b/app/src/components/pilotForm/PilotForm.tsx @@ -14,18 +14,18 @@ import { } from '@noahspan/noahspan-components'; import PilotFormCertificates from '../pilotFormCertificates/PilotFormCertificates'; import PilotFormEndorsements from '../pilotFormEndorsements/PilotFormEndorsements'; -import { Person } from '@microsoft/microsoft-graph-types'; +// import { Person } from '@microsoft/microsoft-graph-types'; import { AxiosInstance, AxiosResponse } from 'axios'; import { useHttpClient } from '../../hooks/httpClient/UseHttpClient'; -import { useAccount } from '@azure/msal-react'; +import { useAccessToken } from '../../hooks/accessToken/UseAcessToken'; const PilotForm: React.FC = () => { const httpClient: AxiosInstance = useHttpClient(); - const accountInfo = useAccount(); const [open, setOpen] = useState(0); - const [peoplePickerResults, setPeoplePickerResults] = useState([]); + const [peoplePickerResults, setPeoplePickerResults] = useState([]); const [isPeoplePickerLoading, setIsPeoplePickerLoading] = useState(false); + const { getAccessToken } = useAccessToken(); const handleOpen = (value: number) => { setOpen(open === value ? 0 : value); }; @@ -39,21 +39,32 @@ const PilotForm: React.FC = () => { const handlePeoplePickerOnChange = async ( event: React.ChangeEvent ) => { - const searchString: string = event.target.value; - const response: AxiosResponse = await httpClient.get( - `api/personSearch?search=${searchString}`, - { - headers: { - Authorization: `Bearer ${accountInfo?.idToken}` + setIsPeoplePickerLoading(true); + + try { + const searchString: string = event.target.value; + const accessToken: string = await getAccessToken(); + const response: AxiosResponse = await httpClient.get( + `api/personSearch?search=${searchString}`, + { + headers: { + Authorization: accessToken + } } - } - ); + ); + console.log(response); + setPeoplePickerResults(response.data); + } catch (error) { + console.log(error); + } finally { + setIsPeoplePickerLoading(false); + } }; return (
- {/* : } > @@ -64,8 +75,8 @@ const PilotForm: React.FC = () => { ( - ( + = () => { - */} + : } diff --git a/app/src/hooks/accessToken/UseAcessToken.tsx b/app/src/hooks/accessToken/UseAcessToken.tsx new file mode 100644 index 0000000..bc37731 --- /dev/null +++ b/app/src/hooks/accessToken/UseAcessToken.tsx @@ -0,0 +1,32 @@ +import { + AuthenticationResult, + InteractionRequiredAuthError +} from '@azure/msal-browser'; +import { useMsal } from '@azure/msal-react'; + +export const useAccessToken = () => { + const { accounts, instance } = useMsal(); + const getAccessToken = async () => { + const tokenRequest = { + account: accounts[0], + scopes: [`api://${import.meta.env.VITE_CLIENT_ID}/user_impersonation`] + }; + + try { + const response: AuthenticationResult = + await instance.acquireTokenSilent(tokenRequest); + console.log(response.accessToken); + return `Bearer ${response.accessToken}`; + } catch (error) { + if (error instanceof InteractionRequiredAuthError) { + await instance.acquireTokenRedirect(tokenRequest); + } + + throw error; + } + }; + + return { + getAccessToken + }; +}; diff --git a/package-lock.json b/package-lock.json index 6a24f5c..b0ba1f5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -38,7 +38,7 @@ "@nestjs/core": "^10.0.0", "@nestjs/passport": "^10.0.3", "@nestjs/platform-express": "^10.0.0", - "@noahspan/noahspan-modules": "^0.3.4", + "@noahspan/noahspan-modules": "^0.3.5", "@schematics/angular": "^17.3.7", "dotenv": "^16.4.5", "reflect-metadata": "0.1.13", @@ -3419,9 +3419,9 @@ } }, "node_modules/@noahspan/noahspan-modules": { - "version": "0.3.4", - "resolved": "https://registry.npmjs.org/@noahspan/noahspan-modules/-/noahspan-modules-0.3.4.tgz", - "integrity": "sha512-bmcMshrfODrZCo+zTw8Ojn9FzjhPz6yYepSgPTniF4i0XEeZDdgAZdNRbe2yRtC+RedLt6Hx+HGQfKMMcPkqNA==", + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/@noahspan/noahspan-modules/-/noahspan-modules-0.3.5.tgz", + "integrity": "sha512-VUCEtJcFTcrVyROMDpP8a90LFez5VPzo//0pUdHlpV7KqIDPRPpp7z/RXkXoUBYM0g06kS2CD5t3ZtzyIewBNg==", "dependencies": { "@azure/app-configuration": "^1.6.0", "@azure/identity": "^4.2.0",