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={} + />
);