Release v0.1.2

webui/src/layout/Titlebar.tsx

@@ -5,6 +5,7 @@ import type { ApiSettings, AuthInfo, AuthTenantMembership, LoginResponse } from
 import HelpMenu from "./HelpMenu";
 import LoginModal from "../features/auth/LoginModal";
 import DismissibleAlert from "../components/DismissibleAlert";
+import { useUnsavedChanges } from "../components/UnsavedChangesGuard";
 import { logout, switchTenant } from "../api/auth";
 import { hasAnyScope } from "../utils/permissions";
 
@@ -17,6 +18,7 @@ type Props = {
 
 export default function Titlebar({ settings, auth, onAuthChange }: Props) {
   const navigate = useNavigate();
+  const { requestNavigation } = useUnsavedChanges();
   const [accountOpen, setAccountOpen] = useState(false);
   const [tenantOpen, setTenantOpen] = useState(false);
   const [loginOpen, setLoginOpen] = useState(false);
@@ -66,7 +68,7 @@ export default function Titlebar({ settings, auth, onAuthChange }: Props) {
     );
   }
 
-  async function handleLogout() {
+  async function performLogout() {
     try {
       await logout(settings);
     } catch {
@@ -76,11 +78,7 @@ export default function Titlebar({ settings, auth, onAuthChange }: Props) {
     setAccountOpen(false);
   }
 
-  async function handleTenantSelect(tenant: AuthTenantMembership) {
-    if (!auth || tenant.id === activeTenant?.id || switchingTenantId) {
-      setTenantOpen(false);
-      return;
-    }
+  async function performTenantSelect(tenant: AuthTenantMembership) {
     setSwitchingTenantId(tenant.id);
     setTenantError("");
     try {
@@ -97,6 +95,23 @@ export default function Titlebar({ settings, auth, onAuthChange }: Props) {
     }
   }
 
+  function handleLogout() {
+    requestNavigation(() => { void performLogout(); });
+  }
+
+  function handleTenantSelect(tenant: AuthTenantMembership) {
+    if (!auth || tenant.id === activeTenant?.id || switchingTenantId) {
+      setTenantOpen(false);
+      return;
+    }
+    requestNavigation(() => { void performTenantSelect(tenant); });
+  }
+
+  function handleAccountSettings() {
+    setAccountOpen(false);
+    requestNavigation(() => navigate("/settings?section=profile"));
+  }
+
   return (
     <header className="titlebar">
       {auth && activeTenant && showTenantControl && (
@@ -152,7 +167,7 @@ export default function Titlebar({ settings, auth, onAuthChange }: Props) {
                   <strong>{auth.user.display_name || auth.user.email}</strong>
                   <span>{auth.user.email}</span>
                 </div>
-                <button className="dropdown-item" onClick={() => { setAccountOpen(false); navigate("/settings?section=profile"); }}><Settings size={16} /> Account settings</button>
+                <button className="dropdown-item" onClick={handleAccountSettings}><Settings size={16} /> Account settings</button>
                 <button className="dropdown-item" onClick={handleLogout}><LogOut size={16} /> Sign out</button>
               </>
             ) : (