From 79f4ce954dc76cdce63968003ba4a01608077db1 Mon Sep 17 00:00:00 2001
From: joerger <bjoerger@goteleport.com>
Date: Tue, 17 Dec 2024 20:02:10 -0800
Subject: [PATCH] Use mfa context in api calls.

---
 .../teleport/src/MFAContext/MFAContext.tsx     | 12 +++++++-----
 web/packages/teleport/src/Teleport.tsx         |  6 +++---
 web/packages/teleport/src/services/api/api.ts  | 18 +++++++++++-------
 .../src/services/joinToken/joinToken.ts        |  6 +++---
 4 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/web/packages/teleport/src/MFAContext/MFAContext.tsx b/web/packages/teleport/src/MFAContext/MFAContext.tsx
index f54667eb31bc3..ddd478f207fba 100644
--- a/web/packages/teleport/src/MFAContext/MFAContext.tsx
+++ b/web/packages/teleport/src/MFAContext/MFAContext.tsx
@@ -1,18 +1,19 @@
 import { PropsWithChildren, createContext, useCallback, useRef } from 'react';
 import AuthnDialog from 'teleport/components/AuthnDialog';
 import { useMfa } from 'teleport/lib/useMfa';
+import api from 'teleport/services/api';
 import { MfaChallengeScope } from 'teleport/services/auth/auth';
 import { MfaChallengeResponse } from 'teleport/services/mfa';
 
 import { useTeleport } from '..';
 
-export interface MFAContextValue {
+export interface MfaContextValue {
   getAdminActionMfaResponse(reusable?: boolean): Promise<MfaChallengeResponse>;
 }
 
-export const MFAContext = createContext<MFAContextValue>(null);
+export const MfaContext = createContext<MfaContextValue>(null);
 
-export const MFAContextProvider = ({ children }: PropsWithChildren) => {
+export const MfaContextProvider = ({ children }: PropsWithChildren) => {
   const allowReuse = useRef(false);
   const adminMfa = useMfa({
     req: {
@@ -36,11 +37,12 @@ export const MFAContextProvider = ({ children }: PropsWithChildren) => {
 
   const ctx = useTeleport();
   ctx.joinTokenService.setMfaContext(mfaCtx);
+  api.setMfaContext(mfaCtx);
 
   return (
-    <MFAContext.Provider value={mfaCtx}>
+    <MfaContext.Provider value={mfaCtx}>
       <AuthnDialog {...adminMfa}></AuthnDialog>
       {children}
-    </MFAContext.Provider>
+    </MfaContext.Provider>
   );
 };
diff --git a/web/packages/teleport/src/Teleport.tsx b/web/packages/teleport/src/Teleport.tsx
index fa86e458fbf40..58605ce56e545 100644
--- a/web/packages/teleport/src/Teleport.tsx
+++ b/web/packages/teleport/src/Teleport.tsx
@@ -46,7 +46,7 @@ import { Player } from './Player';
 import { DesktopSessionContainer as DesktopSession } from './DesktopSession';
 
 import { HeadlessRequest } from './HeadlessRequest';
-import { MFAContextProvider } from './MFAContext/MFAContext';
+import { MfaContextProvider } from './MFAContext/MFAContext';
 
 import { Main } from './Main';
 
@@ -93,7 +93,7 @@ const Teleport: React.FC<Props> = props => {
                   <Authenticated>
                     <UserContextProvider>
                       <TeleportContextProvider ctx={ctx}>
-                        <MFAContextProvider>
+                        <MfaContextProvider>
                           <Switch>
                             <Route
                               path={cfg.routes.appLauncher}
@@ -101,7 +101,7 @@ const Teleport: React.FC<Props> = props => {
                             />
                             <Route>{createPrivateRoutes()}</Route>
                           </Switch>
-                        </MFAContextProvider>
+                        </MfaContextProvider>
                       </TeleportContextProvider>
                     </UserContextProvider>
                   </Authenticated>
diff --git a/web/packages/teleport/src/services/api/api.ts b/web/packages/teleport/src/services/api/api.ts
index 33ad92933904c..00097fb21bcff 100644
--- a/web/packages/teleport/src/services/api/api.ts
+++ b/web/packages/teleport/src/services/api/api.ts
@@ -16,18 +16,25 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import 'whatwg-fetch';
-import auth, { MfaChallengeScope } from 'teleport/services/auth/auth';
 import websession from 'teleport/services/websession';
+import 'whatwg-fetch';
+
+import { MfaContextValue } from 'teleport/MFAContext/MFAContext';
 
-import { storageService } from '../storageService';
 import { MfaChallengeResponse } from '../mfa';
+import { storageService } from '../storageService';
 
 import parseError, { ApiError } from './parseError';
 
 export const MFA_HEADER = 'Teleport-Mfa-Response';
 
+let mfaContext: MfaContextValue;
+
 const api = {
+  setMfaContext(mfa: MfaContextValue) {
+    mfaContext = mfa;
+  },
+
   get(
     url: string,
     abortSignal?: AbortSignal,
@@ -189,10 +196,7 @@ const api = {
 
     let mfaResponseForRetry;
     try {
-      const challenge = await auth.getMfaChallenge({
-        scope: MfaChallengeScope.ADMIN_ACTION,
-      });
-      mfaResponseForRetry = await auth.getMfaChallengeResponse(challenge);
+      mfaResponseForRetry = await mfaContext.getAdminActionMfaResponse();
     } catch {
       throw new Error(
         'Failed to fetch MFA challenge. Please connect a registered hardware key and try again. If you do not have a hardware key registered, you can add one from your account settings page.'
diff --git a/web/packages/teleport/src/services/joinToken/joinToken.ts b/web/packages/teleport/src/services/joinToken/joinToken.ts
index 0669ee952e1f2..e6bc2e34b126d 100644
--- a/web/packages/teleport/src/services/joinToken/joinToken.ts
+++ b/web/packages/teleport/src/services/joinToken/joinToken.ts
@@ -17,7 +17,7 @@
  */
 
 import cfg from 'teleport/config';
-import { MFAContextValue } from 'teleport/MFAContext/MFAContext';
+import { MfaContextValue } from 'teleport/MFAContext/MFAContext';
 import api from 'teleport/services/api';
 
 import { makeLabelMapOfStrArrs } from '../agents/make';
@@ -29,8 +29,8 @@ const TeleportTokenNameHeader = 'X-Teleport-TokenName';
 
 class JoinTokenService {
   // MFA context is set late by the MFA Context provider.
-  mfa: MFAContextValue;
-  setMfaContext(mfa: MFAContextValue) {
+  mfa: MfaContextValue;
+  setMfaContext(mfa: MfaContextValue) {
     this.mfa = mfa;
   }