memos/web/src/components/BrandBanner.tsx
2025-07-01 19:29:48 +08:00

27 lines
1 KiB
TypeScript

import { observer } from "mobx-react-lite";
import { cn } from "@/lib/utils";
import { workspaceStore } from "@/store/v2";
import UserAvatar from "./UserAvatar";
interface Props {
className?: string;
collapsed?: boolean;
}
const BrandBanner = observer((props: Props) => {
const { collapsed } = props;
const workspaceGeneralSetting = workspaceStore.state.generalSetting;
const title = workspaceGeneralSetting.customProfile?.title || "Memos";
const avatarUrl = workspaceGeneralSetting.customProfile?.logoUrl || "/full-logo.webp";
return (
<div className={cn("relative w-full h-auto shrink-0", props.className)}>
<div className={cn("w-auto flex flex-row justify-start items-center text-gray-800 dark:text-gray-400", collapsed ? "px-1" : "px-3")}>
<UserAvatar className="shrink-0" avatarUrl={avatarUrl} />
{!collapsed && <span className="ml-2 text-lg font-medium text-slate-800 dark:text-gray-300 shrink truncate">{title}</span>}
</div>
</div>
);
});
export default BrandBanner;