diff --git a/gui/src/components/AssistantAndOrgListbox/AccountOption.tsx b/gui/src/components/AssistantAndOrgListbox/AccountOption.tsx
deleted file mode 100644
index 98e8adbc53..0000000000
--- a/gui/src/components/AssistantAndOrgListbox/AccountOption.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import {
- ArrowRightEndOnRectangleIcon,
- UserCircleIcon as UserCircleIconOutline,
-} from "@heroicons/react/24/outline";
-import { isOnPremSession } from "core/control-plane/AuthTypes";
-import { useAuth } from "../../context/Auth";
-import { ListboxOption, useFontSize } from "../ui";
-
-interface AccountOptionProps {
- onClose: () => void;
-}
-
-export function AccountOption({ onClose }: AccountOptionProps) {
- const { session, logout, login } = useAuth();
- const tinyFont = useFontSize(-4);
-
- // No account option for on-prem deployments
- if (session && isOnPremSession(session)) {
- return null;
- }
-
- async function handleClick() {
- if (session) {
- logout();
- } else {
- await login(false);
- }
- onClose();
- }
-
- return (
-
-
- {session ? (
-
- ) : (
-
- )}
- {session ? "Log out" : "Sign in"}
-
-
- );
-}
diff --git a/gui/src/components/AssistantAndOrgListbox/index.tsx b/gui/src/components/AssistantAndOrgListbox/index.tsx
index 65b9e6a814..40d15c709d 100644
--- a/gui/src/components/AssistantAndOrgListbox/index.tsx
+++ b/gui/src/components/AssistantAndOrgListbox/index.tsx
@@ -18,7 +18,6 @@ import {
Transition,
useFontSize,
} from "../ui";
-import { AccountOption } from "./AccountOption";
import { AssistantOptions } from "./AssistantOptions";
import { ScopeSelect } from "./ScopeSelect";
import { SelectedAssistantButton } from "./SelectedAssistantButton";
@@ -34,6 +33,7 @@ export function AssistantAndOrgListbox() {
selectedProfile,
session,
login,
+ logout,
organizations,
refreshProfiles,
} = useAuth();
@@ -57,6 +57,11 @@ export function AssistantAndOrgListbox() {
close();
}
+ function onLogout() {
+ logout();
+ close();
+ }
+
useEffect(() => {
let lastToggleTime = 0;
const DEBOUNCE_MS = 800;
@@ -184,7 +189,21 @@ export function AssistantAndOrgListbox() {
-
+ {session && (
+
+
+ Log out
+
+
+ )}
login(false)}
+ >
+ Sign in
+
+ );
+ }
+
+ // No login button for on-prem deployments
+ if (isOnPremSession(session)) {
+ return null;
+ }
+
+ return (
+
+ {({ close }) => (
+ <>
+
+
+
+ {selectedOrg === null ? "Personal" : selectedOrg.name}
+
+
+
+
+
+
+
+
+
+ {session.account.label}
+
+ {session.account.id}
+
+
+
+ {organizations.length > 0 && (
+
+
+
+
+ )}
+
+
+
+
+
+ >
+ )}
+
+ );
+}
diff --git a/gui/src/pages/config/index.tsx b/gui/src/pages/config/index.tsx
index d9939a2c8e..ea5ccef443 100644
--- a/gui/src/pages/config/index.tsx
+++ b/gui/src/pages/config/index.tsx
@@ -9,6 +9,7 @@ import { useNavigate } from "react-router-dom";
import { PageHeader } from "../../components/PageHeader";
import { useNavigationListener } from "../../hooks/useNavigationListener";
import { fontSize } from "../../util";
+import { AccountButton } from "./AccountButton";
import { HelpCenterSection } from "./HelpCenterSection";
import { IndexingSettingsSection } from "./IndexingSettingsSection";
import KeyboardShortcuts from "./KeyboardShortcuts";
@@ -62,6 +63,7 @@ function ConfigPage() {
showBorder
onTitleClick={() => navigate("/")}
title="Chat"
+ rightContent={
}
/>
{/* Tab Headers */}
diff --git a/gui/src/pages/history/index.tsx b/gui/src/pages/history/index.tsx
index 86950ff24b..a8be3d92f3 100644
--- a/gui/src/pages/history/index.tsx
+++ b/gui/src/pages/history/index.tsx
@@ -2,6 +2,7 @@ import { useNavigate } from "react-router-dom";
import { History } from "../../components/History";
import { PageHeader } from "../../components/PageHeader";
import { getFontSize } from "../../util";
+import { AccountButton } from "../config/AccountButton";
export default function HistoryPage() {
const navigate = useNavigate();
@@ -11,7 +12,12 @@ export default function HistoryPage() {
className="flex flex-1 flex-col overflow-auto"
style={{ fontSize: getFontSize() }}
>
-
navigate("/")} title="Chat" />
+ navigate("/")}
+ title="Chat"
+ rightContent={}
+ />
);