diff --git a/apps/web/src/components/AmrLoginPill.tsx b/apps/web/src/components/AmrLoginPill.tsx
index acf958dd76..038ca94df2 100644
--- a/apps/web/src/components/AmrLoginPill.tsx
+++ b/apps/web/src/components/AmrLoginPill.tsx
@@ -27,6 +27,7 @@ import {
amrLoginStatusEventReason,
notifyAmrLoginStatusChanged,
} from './amrLoginPolling';
+import { Icon } from './Icon';
import { amrConsoleUrlForProfile, amrProfileBadgeLabel } from '../runtime/amr-guidance';
interface AmrLoginPillProps {
@@ -42,6 +43,7 @@ interface AmrLoginPillProps {
showActivationDetails?: boolean;
revealPendingCancelAction?: boolean;
showConsoleAction?: boolean;
+ iconOnlySignOut?: boolean;
onStatusChange?: (status: VelaLoginStatus | null) => void;
}
@@ -72,6 +74,7 @@ export interface AmrAccountControlProps {
signInLabel?: string;
showConsoleAction?: boolean;
consoleUrl?: string;
+ iconOnlySignOut?: boolean;
showCancelSignInAction?: boolean;
// Device-authorization details surfaced while signing in, so the user can
// complete login manually when the browser did not auto-open (see
@@ -119,6 +122,7 @@ export function AmrAccountControl({
signInLabel,
showConsoleAction = false,
consoleUrl,
+ iconOnlySignOut = false,
showCancelSignInAction = false,
activationUrl,
userCode,
@@ -156,6 +160,9 @@ export function AmrAccountControl({
? ''
: t('settings.amrNotSignedIn');
const canSignIn = showSignInAction && (status === 'signed-out' || hasError);
+ const signOutLabel = signOutDisabled
+ ? t('settings.amrLoggingOut')
+ : t('settings.amrLogout');
return (
- {signOutDisabled ? t('settings.amrLoggingOut') : t('settings.amrLogout')}
+ {iconOnlySignOut ? (
+
+ ) : (
+ signOutLabel
+ )}
) : null}
{isSigningIn && showCancelSignInAction && onCancelSignIn ? (
@@ -290,6 +307,7 @@ export function AmrLoginPill({
showActivationDetails = false,
revealPendingCancelAction = false,
showConsoleAction = false,
+ iconOnlySignOut = false,
onStatusChange,
}: AmrLoginPillProps) {
const { t } = useI18n();
@@ -614,6 +632,7 @@ export function AmrLoginPill({
hideSignedInStatus={hideSignedInStatus}
signInLabel={signInLabel}
showConsoleAction={showConsoleAction}
+ iconOnlySignOut={iconOnlySignOut}
signInDisabled={loginInFlight}
signOutDisabled={logoutInFlight}
showCancelSignInAction={revealPendingCancelAction && loginInFlight}
diff --git a/apps/web/src/components/Icon.tsx b/apps/web/src/components/Icon.tsx
index ddc61dbb66..0cdeca2d38 100644
--- a/apps/web/src/components/Icon.tsx
+++ b/apps/web/src/components/Icon.tsx
@@ -44,6 +44,7 @@ export type IconName =
| 'languages'
| 'lightbulb'
| 'link'
+ | 'log-out'
| 'integrations-filled'
| 'mic'
| 'minus'
@@ -254,6 +255,14 @@ export function Icon({ name, size = 14, strokeWidth = 1.6, ...rest }: Props) {
);
+ case 'log-out':
+ return (
+
+ );
case 'file':
return (