Polish settings and auth flows

job-tracker-ui/src/components/GoogleAuthCard.tsx

@@ -3,7 +3,7 @@ import React, { useEffect, useMemo, useRef, useState } from "react";
 import { Box, Button, Chip, Paper, Typography } from "@mui/material";
 
 import { api } from "../api";
-import { clearAuthToken, decodeJwtPayload, getAuthToken, setAuthToken } from "../auth";
+import { clearAuthToken, decodeJwtPayload, getAuthPersistencePreference, getAuthToken, setAuthToken } from "../auth";
 import { useToast } from "../toast";
 import { useI18n } from "../i18n/I18nProvider";
 
@@ -58,6 +58,12 @@ export default function GoogleAuthCard({ onSignedIn }: { onSignedIn?: () => void
   const payload = useMemo(() => (token ? decodeJwtPayload(token) : null), [token]);
   const isRawGoogleToken = payload?.iss === "accounts.google.com" || payload?.iss === "https://accounts.google.com";
 
+  const actionLabel = !token
+    ? t("continueWithGoogle")
+    : me?.provider === "local" && !me?.googleLink?.linked
+      ? t("linkWithGoogle")
+      : t("signInWithGoogle");
+
   async function refreshMe() {
     if (!getAuthToken()) {
       setMe(null);
@@ -82,7 +88,7 @@ export default function GoogleAuthCard({ onSignedIn }: { onSignedIn?: () => void
       try {
         const res = await api.post<{ accessToken: string }>("/auth/google/exchange", { token });
         if (cancelled) return;
-        setAuthToken(res.data.accessToken);
+        setAuthToken(res.data.accessToken, getAuthPersistencePreference());
         setToken(res.data.accessToken);
         toast(t("googleSignedIn"), "success");
         onSignedIn?.();
@@ -125,7 +131,7 @@ export default function GoogleAuthCard({ onSignedIn }: { onSignedIn?: () => void
                 await refreshMe();
               } else {
                 const res = await api.post<{ accessToken: string }>("/auth/google/exchange", { token: credential });
-                setAuthToken(res.data.accessToken);
+                setAuthToken(res.data.accessToken, getAuthPersistencePreference());
                 setToken(res.data.accessToken);
                 toast(t("googleSignedIn"), "success");
                 onSignedIn?.();
@@ -191,9 +197,14 @@ export default function GoogleAuthCard({ onSignedIn }: { onSignedIn?: () => void
             </Typography>
           )}
 
-          <Box sx={{ display: "flex", alignItems: "center", gap: 2, flexWrap: "wrap" }}>
+          <Box sx={{ display: "flex", flexDirection: "column", alignItems: "flex-start", gap: 1 }}>
+            <Typography variant="caption" sx={{ color: "text.secondary", fontWeight: 700, letterSpacing: 0.4, textTransform: "uppercase" }}>
+              {actionLabel}
+            </Typography>
             <div ref={hostRef} />
+          </Box>
 
+          <Box sx={{ display: "flex", alignItems: "center", gap: 2, flexWrap: "wrap" }}>
             {token ? (
               <Button
                 variant="outlined"