From 3b26fe6056adc2776f592b48e3ffd6c878cdb4f3 Mon Sep 17 00:00:00 2001
From: David Lyon <5115845+dauglyon@users.noreply.github.com>
Date: Thu, 17 Jul 2025 18:29:35 -0700
Subject: [PATCH 1/2] Add MFA status indicators to login sessions

- Add mfaAuthenticated field to token type definitions
- Create MfaStatusIndicator component with color-coded icons
- Add MFA Status column to both Current and Other login session tables
- Display green check (MFA used), red check (single factor), or grey check (not supported)
- Include tooltips for each status type
- Only show indicators for Login token types
---
 src/common/api/authService.ts          |  2 ++
 src/features/account/LogInSessions.tsx | 30 ++++++++++++++++++++++++++
 src/features/auth/authSlice.ts         |  1 +
 3 files changed, 33 insertions(+)

diff --git a/src/common/api/authService.ts b/src/common/api/authService.ts
index 5e9b7573..cfc0a8cc 100644
--- a/src/common/api/authService.ts
+++ b/src/common/api/authService.ts
@@ -25,6 +25,7 @@ interface TokenResponse {
   type: string;
   user: string;
   cachefor: number;
+  mfaAuthenticated: boolean | null;
 }
 
 interface AuthParams {
@@ -158,6 +159,7 @@ interface AuthResults {
       device: string;
       ip: string;
       name?: string;
+      mfaAuthenticated: boolean | null;
     }[];
     user: string;
     revokeallurl: string;
diff --git a/src/features/account/LogInSessions.tsx b/src/features/account/LogInSessions.tsx
index 330d6954..626c2aff 100644
--- a/src/features/account/LogInSessions.tsx
+++ b/src/features/account/LogInSessions.tsx
@@ -19,6 +19,28 @@ import { Loader } from '../../common/components';
 import { useAppSelector } from '../../common/hooks';
 import { useLogout } from '../login/LogIn';
 
+const MfaStatusIndicator: FC<{ mfaAuthenticated: boolean | null }> = ({ mfaAuthenticated }) => {
+  if (mfaAuthenticated === true) {
+    return (
+      <Tooltip title="MFA used">
+        <FontAwesomeIcon icon={faCheck} style={{ color: 'green' }} />
+      </Tooltip>
+    );
+  } else if (mfaAuthenticated === false) {
+    return (
+      <Tooltip title="Single factor">
+        <FontAwesomeIcon icon={faCheck} style={{ color: 'red' }} />
+      </Tooltip>
+    );
+  } else {
+    return (
+      <Tooltip title="MFA not supported">
+        <FontAwesomeIcon icon={faCheck} style={{ color: 'grey' }} />
+      </Tooltip>
+    );
+  }
+};
+
 /**
  * Content for the Log In Sessions tab in the Account page
  */
@@ -68,6 +90,7 @@ export const LogInSessions: FC = () => {
                 <TableCell>Browser</TableCell>
                 <TableCell>Operating System</TableCell>
                 <TableCell>IP Address</TableCell>
+                <TableCell>MFA Status</TableCell>
                 <TableCell>Action</TableCell>
               </TableRow>
             </TableHead>
@@ -86,6 +109,9 @@ export const LogInSessions: FC = () => {
                   {currentToken?.os} {currentToken?.osver}
                 </TableCell>
                 <TableCell>{currentToken?.ip}</TableCell>
+                <TableCell>
+                  <MfaStatusIndicator mfaAuthenticated={currentToken?.mfaAuthenticated ?? null} />
+                </TableCell>
                 <TableCell>
                   <LogOutButton tokenId={currentToken?.id} />
                 </TableCell>
@@ -105,6 +131,7 @@ export const LogInSessions: FC = () => {
                 <TableCell>Browser</TableCell>
                 <TableCell>Operating System</TableCell>
                 <TableCell>IP Address</TableCell>
+                <TableCell>MFA Status</TableCell>
                 <TableCell>Action</TableCell>
               </TableRow>
             </TableHead>
@@ -124,6 +151,9 @@ export const LogInSessions: FC = () => {
                     {otherToken.os} {otherToken.osver}
                   </TableCell>
                   <TableCell>{otherToken.ip}</TableCell>
+                  <TableCell>
+                    <MfaStatusIndicator mfaAuthenticated={otherToken.mfaAuthenticated ?? null} />
+                  </TableCell>
                   <TableCell>
                     <LogOutButton tokenId={otherToken.id} />
                   </TableCell>
diff --git a/src/features/auth/authSlice.ts b/src/features/auth/authSlice.ts
index 0a546e6b..10cb998e 100644
--- a/src/features/auth/authSlice.ts
+++ b/src/features/auth/authSlice.ts
@@ -11,6 +11,7 @@ export interface TokenInfo {
   type: string;
   user: string;
   cachefor: number;
+  mfaAuthenticated: boolean | null;
 }
 
 interface AuthState {

From 0f85435d12c8fae8de3772d4b2414174c134bc04 Mon Sep 17 00:00:00 2001
From: David Lyon <5115845+dauglyon@users.noreply.github.com>
Date: Thu, 17 Jul 2025 18:44:02 -0700
Subject: [PATCH 2/2] fix lint

---
 src/features/account/LogInSessions.tsx | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/features/account/LogInSessions.tsx b/src/features/account/LogInSessions.tsx
index 626c2aff..c5193f2b 100644
--- a/src/features/account/LogInSessions.tsx
+++ b/src/features/account/LogInSessions.tsx
@@ -19,7 +19,9 @@ import { Loader } from '../../common/components';
 import { useAppSelector } from '../../common/hooks';
 import { useLogout } from '../login/LogIn';
 
-const MfaStatusIndicator: FC<{ mfaAuthenticated: boolean | null }> = ({ mfaAuthenticated }) => {
+const MfaStatusIndicator: FC<{ mfaAuthenticated: boolean | null }> = ({
+  mfaAuthenticated,
+}) => {
   if (mfaAuthenticated === true) {
     return (
       <Tooltip title="MFA used">
@@ -110,7 +112,9 @@ export const LogInSessions: FC = () => {
                 </TableCell>
                 <TableCell>{currentToken?.ip}</TableCell>
                 <TableCell>
-                  <MfaStatusIndicator mfaAuthenticated={currentToken?.mfaAuthenticated ?? null} />
+                  <MfaStatusIndicator
+                    mfaAuthenticated={currentToken?.mfaAuthenticated ?? null}
+                  />
                 </TableCell>
                 <TableCell>
                   <LogOutButton tokenId={currentToken?.id} />
@@ -152,7 +156,9 @@ export const LogInSessions: FC = () => {
                   </TableCell>
                   <TableCell>{otherToken.ip}</TableCell>
                   <TableCell>
-                    <MfaStatusIndicator mfaAuthenticated={otherToken.mfaAuthenticated ?? null} />
+                    <MfaStatusIndicator
+                      mfaAuthenticated={otherToken.mfaAuthenticated ?? null}
+                    />
                   </TableCell>
                   <TableCell>
                     <LogOutButton tokenId={otherToken.id} />