refactor(auth): 移除用户登出功能并优化导航组件
- 从 app-top-nav.tsx 中移除登出相关代码和 LogOut 图标 - 从 canvas-client-page.tsx 中移除用户信息显示和登出回调函数 - 从 admin layout.tsx 中移除登出菜单项 - 将 navigation-tools 从 lib 目录迁移到 constant 目录 - 更新 UserStatusActions 组件以简化用户菜单逻辑 - 在用户状态操作组件中集成快捷键功能和管理员入口
This commit is contained in:
@@ -2,7 +2,6 @@
|
|||||||
|
|
||||||
import { FileTextOutlined, HomeOutlined, LogoutOutlined, PictureOutlined, SettingOutlined } from "@ant-design/icons";
|
import { FileTextOutlined, HomeOutlined, LogoutOutlined, PictureOutlined, SettingOutlined } from "@ant-design/icons";
|
||||||
import { Button, Flex, Layout, Menu, Typography, theme } from "antd";
|
import { Button, Flex, Layout, Menu, Typography, theme } from "antd";
|
||||||
import { LogOut } from "lucide-react";
|
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { usePathname, useRouter } from "next/navigation";
|
import { usePathname, useRouter } from "next/navigation";
|
||||||
import type { ReactNode } from "react";
|
import type { ReactNode } from "react";
|
||||||
@@ -70,10 +69,7 @@ export default function AdminLayout({ children }: { children: ReactNode }) {
|
|||||||
<Layout.Header style={{ display: "flex", alignItems: "center", justifyContent: "space-between", height: adminLayoutStyle.headerHeight, padding: "0 24px", background: antToken.colorBgContainer, borderBottom: `1px solid ${antToken.colorBorder}` }}>
|
<Layout.Header style={{ display: "flex", alignItems: "center", justifyContent: "space-between", height: adminLayoutStyle.headerHeight, padding: "0 24px", background: antToken.colorBgContainer, borderBottom: `1px solid ${antToken.colorBorder}` }}>
|
||||||
<Typography.Title level={5} style={{ margin: 0 }}>{pageTitle}</Typography.Title>
|
<Typography.Title level={5} style={{ margin: 0 }}>{pageTitle}</Typography.Title>
|
||||||
<Flex align="center" gap={4}>
|
<Flex align="center" gap={4}>
|
||||||
<UserStatusActions
|
<UserStatusActions showConfig={false} />
|
||||||
showConfig={false}
|
|
||||||
menuItems={[{ key: "logout", icon: <LogOut className="size-4" />, label: "退出登录", onClick: logout }]}
|
|
||||||
/>
|
|
||||||
</Flex>
|
</Flex>
|
||||||
</Layout.Header>
|
</Layout.Header>
|
||||||
<Layout.Content style={{ minHeight: 0, overflow: "auto" }}>{children}</Layout.Content>
|
<Layout.Content style={{ minHeight: 0, overflow: "auto" }}>{children}</Layout.Content>
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
|
import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
|
||||||
import type { ChangeEvent as ReactChangeEvent, DragEvent as ReactDragEvent, MouseEvent as ReactMouseEvent, PointerEvent as ReactPointerEvent } from "react";
|
import type { ChangeEvent as ReactChangeEvent, DragEvent as ReactDragEvent, MouseEvent as ReactMouseEvent, PointerEvent as ReactPointerEvent } from "react";
|
||||||
import { useParams, useRouter } from "next/navigation";
|
import { useParams, useRouter } from "next/navigation";
|
||||||
import { Home, ImageIcon, Images, Keyboard, List, LogOut, Menu, MessageSquare, Plus, Redo2, Settings2, Trash2, Undo2, Upload } from "lucide-react";
|
import { Home, ImageIcon, Images, List, Menu, MessageSquare, Plus, Redo2, Settings2, Trash2, Undo2, Upload } from "lucide-react";
|
||||||
|
|
||||||
import { requestEdit, requestGeneration, requestImageQuestion } from "@/services/api/image";
|
import { requestEdit, requestGeneration, requestImageQuestion } from "@/services/api/image";
|
||||||
import { defaultConfig, type AiConfig, useConfigStore, useEffectiveConfig } from "@/stores/use-config-store";
|
import { defaultConfig, type AiConfig, useConfigStore, useEffectiveConfig } from "@/stores/use-config-store";
|
||||||
@@ -11,10 +11,9 @@ import { resolveImageUrl, uploadImage, type UploadedImage } from "@/services/ima
|
|||||||
import { nanoid } from "nanoid";
|
import { nanoid } from "nanoid";
|
||||||
import { getDataUrlByteSize, readImageMeta } from "@/lib/image-utils";
|
import { getDataUrlByteSize, readImageMeta } from "@/lib/image-utils";
|
||||||
import { canvasThemes, type CanvasBackgroundMode } from "@/lib/canvas-theme";
|
import { canvasThemes, type CanvasBackgroundMode } from "@/lib/canvas-theme";
|
||||||
import { useThemeStore } from "@/stores/use-theme-store";
|
|
||||||
import { useAssetStore } from "@/stores/use-asset-store";
|
|
||||||
import { useUserStore } from "@/stores/use-user-store";
|
|
||||||
import { UserStatusActions } from "@/components/layout/user-status-actions";
|
import { UserStatusActions } from "@/components/layout/user-status-actions";
|
||||||
|
import { useAssetStore } from "@/stores/use-asset-store";
|
||||||
|
import { useThemeStore } from "@/stores/use-theme-store";
|
||||||
import { cropDataUrl } from "../utils/canvas-image-data";
|
import { cropDataUrl } from "../utils/canvas-image-data";
|
||||||
import { App, Button, Dropdown, Modal } from "antd";
|
import { App, Button, Dropdown, Modal } from "antd";
|
||||||
import { NODE_DEFAULT_SIZE, getNodeSpec } from "../constants";
|
import { NODE_DEFAULT_SIZE, getNodeSpec } from "../constants";
|
||||||
@@ -243,8 +242,6 @@ function InfiniteCanvasPage() {
|
|||||||
const renameProject = useCanvasStore((state) => state.renameProject);
|
const renameProject = useCanvasStore((state) => state.renameProject);
|
||||||
const deleteProjects = useCanvasStore((state) => state.deleteProjects);
|
const deleteProjects = useCanvasStore((state) => state.deleteProjects);
|
||||||
const currentProject = useCanvasStore((state) => state.projects.find((project) => project.id === projectId));
|
const currentProject = useCanvasStore((state) => state.projects.find((project) => project.id === projectId));
|
||||||
const user = useUserStore((state) => state.user);
|
|
||||||
const logout = useUserStore((state) => state.clearSession);
|
|
||||||
const theme = canvasThemes[useThemeStore((state) => state.theme)];
|
const theme = canvasThemes[useThemeStore((state) => state.theme)];
|
||||||
const [nodes, setNodes] = useState<CanvasNodeData[]>([]);
|
const [nodes, setNodes] = useState<CanvasNodeData[]>([]);
|
||||||
const [connections, setConnections] = useState<CanvasConnection[]>([]);
|
const [connections, setConnections] = useState<CanvasConnection[]>([]);
|
||||||
@@ -1764,7 +1761,6 @@ function InfiniteCanvasPage() {
|
|||||||
title={currentProject?.title || "未命名画布"}
|
title={currentProject?.title || "未命名画布"}
|
||||||
titleDraft={titleDraft}
|
titleDraft={titleDraft}
|
||||||
isTitleEditing={titleEditing}
|
isTitleEditing={titleEditing}
|
||||||
userName={user?.username || "访客"}
|
|
||||||
onTitleDraftChange={setTitleDraft}
|
onTitleDraftChange={setTitleDraft}
|
||||||
onStartTitleEditing={startTitleEditing}
|
onStartTitleEditing={startTitleEditing}
|
||||||
onFinishTitleEditing={finishTitleEditing}
|
onFinishTitleEditing={finishTitleEditing}
|
||||||
@@ -1778,8 +1774,6 @@ function InfiniteCanvasPage() {
|
|||||||
onImportImage={() => handleUploadRequest()}
|
onImportImage={() => handleUploadRequest()}
|
||||||
onUndo={undoCanvas}
|
onUndo={undoCanvas}
|
||||||
onRedo={redoCanvas}
|
onRedo={redoCanvas}
|
||||||
onOpenConfig={() => openConfigDialog(false)}
|
|
||||||
onLogout={logout}
|
|
||||||
assistantCollapsed={assistantCollapsed}
|
assistantCollapsed={assistantCollapsed}
|
||||||
onExpandAssistant={() => {
|
onExpandAssistant={() => {
|
||||||
setAssistantMounted(true);
|
setAssistantMounted(true);
|
||||||
@@ -2051,7 +2045,6 @@ function CanvasTopBar({
|
|||||||
title,
|
title,
|
||||||
titleDraft,
|
titleDraft,
|
||||||
isTitleEditing,
|
isTitleEditing,
|
||||||
userName,
|
|
||||||
onTitleDraftChange,
|
onTitleDraftChange,
|
||||||
onStartTitleEditing,
|
onStartTitleEditing,
|
||||||
onFinishTitleEditing,
|
onFinishTitleEditing,
|
||||||
@@ -2065,15 +2058,12 @@ function CanvasTopBar({
|
|||||||
onImportImage,
|
onImportImage,
|
||||||
onUndo,
|
onUndo,
|
||||||
onRedo,
|
onRedo,
|
||||||
onOpenConfig,
|
|
||||||
onLogout,
|
|
||||||
assistantCollapsed,
|
assistantCollapsed,
|
||||||
onExpandAssistant,
|
onExpandAssistant,
|
||||||
}: {
|
}: {
|
||||||
title: string;
|
title: string;
|
||||||
titleDraft: string;
|
titleDraft: string;
|
||||||
isTitleEditing: boolean;
|
isTitleEditing: boolean;
|
||||||
userName: string;
|
|
||||||
onTitleDraftChange: (value: string) => void;
|
onTitleDraftChange: (value: string) => void;
|
||||||
onStartTitleEditing: () => void;
|
onStartTitleEditing: () => void;
|
||||||
onFinishTitleEditing: () => void;
|
onFinishTitleEditing: () => void;
|
||||||
@@ -2087,14 +2077,11 @@ function CanvasTopBar({
|
|||||||
onImportImage: () => void;
|
onImportImage: () => void;
|
||||||
onUndo: () => void;
|
onUndo: () => void;
|
||||||
onRedo: () => void;
|
onRedo: () => void;
|
||||||
onOpenConfig: () => void;
|
|
||||||
onLogout: () => void;
|
|
||||||
assistantCollapsed: boolean;
|
assistantCollapsed: boolean;
|
||||||
onExpandAssistant: () => void;
|
onExpandAssistant: () => void;
|
||||||
}) {
|
}) {
|
||||||
const colorTheme = useThemeStore((state) => state.theme);
|
const colorTheme = useThemeStore((state) => state.theme);
|
||||||
const theme = canvasThemes[colorTheme];
|
const theme = canvasThemes[colorTheme];
|
||||||
const initial = (userName.trim()[0] || "U").toUpperCase();
|
|
||||||
const titleRef = useRef<HTMLDivElement>(null);
|
const titleRef = useRef<HTMLDivElement>(null);
|
||||||
const accountRef = useRef<HTMLDivElement>(null);
|
const accountRef = useRef<HTMLDivElement>(null);
|
||||||
const [shortcutsOpen, setShortcutsOpen] = useState(false);
|
const [shortcutsOpen, setShortcutsOpen] = useState(false);
|
||||||
@@ -2173,26 +2160,16 @@ function CanvasTopBar({
|
|||||||
|
|
||||||
<div className="pointer-events-auto flex items-center gap-1.5">
|
<div className="pointer-events-auto flex items-center gap-1.5">
|
||||||
<UserStatusActions
|
<UserStatusActions
|
||||||
onOpenConfig={onOpenConfig}
|
|
||||||
userName={userName}
|
|
||||||
initial={initial}
|
|
||||||
accountOpen={accountOpen}
|
accountOpen={accountOpen}
|
||||||
onAccountOpenChange={setAccountOpen}
|
onAccountOpenChange={setAccountOpen}
|
||||||
accountRef={accountRef}
|
accountRef={accountRef}
|
||||||
getPopupContainer={(node) => node.parentElement || document.body}
|
getPopupContainer={(node) => node.parentElement || document.body}
|
||||||
|
onOpenShortcuts={() => { setShortcutsOpen(true); setAccountOpen(false); }}
|
||||||
iconStyle={{ color: theme.node.text }}
|
iconStyle={{ color: theme.node.text }}
|
||||||
gitHubClassName="size-11 text-base"
|
gitHubClassName="size-11 text-base"
|
||||||
gitHubStyle={{ color: theme.node.text }}
|
gitHubStyle={{ color: theme.node.text }}
|
||||||
versionStyle={{ color: theme.node.text }}
|
versionStyle={{ color: theme.node.text }}
|
||||||
avatarStyle={{ borderColor: theme.toolbar.border, color: theme.node.text }}
|
avatarStyle={{ borderColor: theme.toolbar.border, color: theme.node.text }}
|
||||||
userLabel={initial}
|
|
||||||
menuItems={[
|
|
||||||
{ key: "user", disabled: true, label: <span className="font-medium text-current">{userName}</span> },
|
|
||||||
{ type: "divider" },
|
|
||||||
{ key: "shortcuts", icon: <Keyboard className="size-4" />, label: "快捷键", onClick: () => { setShortcutsOpen(true); setAccountOpen(false); } },
|
|
||||||
{ type: "divider" },
|
|
||||||
{ key: "logout", icon: <LogOut className="size-4" />, label: "退出登录", onClick: () => { setAccountOpen(false); onLogout(); } },
|
|
||||||
]}
|
|
||||||
/>
|
/>
|
||||||
{assistantCollapsed ? (
|
{assistantCollapsed ? (
|
||||||
<>
|
<>
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ import type { ReactNode } from "react";
|
|||||||
import { usePathname } from "next/navigation";
|
import { usePathname } from "next/navigation";
|
||||||
|
|
||||||
import { AppTopNav } from "@/components/layout/app-top-nav";
|
import { AppTopNav } from "@/components/layout/app-top-nav";
|
||||||
import { type NavigationToolSlug, navigationTools } from "@/lib/navigation-tools";
|
import { type NavigationToolSlug, navigationTools } from "@/constant/navigation-tools";
|
||||||
import { useConfigStore } from "@/stores/use-config-store";
|
import { useConfigStore } from "@/stores/use-config-store";
|
||||||
|
|
||||||
export default function UserLayout({ children }: { children: ReactNode }) {
|
export default function UserLayout({ children }: { children: ReactNode }) {
|
||||||
|
|||||||
@@ -5,7 +5,7 @@ import { type ReactNode, useEffect, useState } from "react";
|
|||||||
import { App, Button, Image, Tag } from "antd";
|
import { App, Button, Image, Tag } from "antd";
|
||||||
|
|
||||||
import { fetchPrompts, type Prompt } from "@/services/api/prompts";
|
import { fetchPrompts, type Prompt } from "@/services/api/prompts";
|
||||||
import { navigationTools } from "@/lib/navigation-tools";
|
import { navigationTools } from "@/constant/navigation-tools";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
|
||||||
function Highlighter({
|
function Highlighter({
|
||||||
|
|||||||
@@ -1,16 +1,16 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { LogOut, Menu, Settings2, Shield } from "lucide-react";
|
import { Menu, Settings2 } from "lucide-react";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { App, Button, Drawer, Form, Input, Modal, Segmented } from "antd";
|
import { App, Button, Drawer, Form, Input, Modal, Segmented } from "antd";
|
||||||
|
|
||||||
import { ModelPicker } from "@/components/model-picker";
|
import { ModelPicker } from "@/components/model-picker";
|
||||||
import { AnimatedThemeToggler } from "@/components/ui/animated-theme-toggler";
|
import { AnimatedThemeToggler } from "@/components/ui/animated-theme-toggler";
|
||||||
|
import { navigationTools, type NavigationToolSlug } from "@/constant/navigation-tools";
|
||||||
import { GitHubLink } from "@/components/layout/github-link";
|
import { GitHubLink } from "@/components/layout/github-link";
|
||||||
import { UserStatusActions } from "@/components/layout/user-status-actions";
|
import { UserStatusActions } from "@/components/layout/user-status-actions";
|
||||||
import { VersionReleaseModal } from "@/components/layout/version-release-modal";
|
import { VersionReleaseModal } from "@/components/layout/version-release-modal";
|
||||||
import { useConfigStore, useEffectiveConfig, type AiConfig } from "@/stores/use-config-store";
|
import { useConfigStore, useEffectiveConfig, type AiConfig } from "@/stores/use-config-store";
|
||||||
import { navigationTools, type NavigationToolSlug } from "@/lib/navigation-tools";
|
|
||||||
import { fetchImageModels } from "@/services/api/image";
|
import { fetchImageModels } from "@/services/api/image";
|
||||||
import { useThemeStore } from "@/stores/use-theme-store";
|
import { useThemeStore } from "@/stores/use-theme-store";
|
||||||
import { useUserStore } from "@/stores/use-user-store";
|
import { useUserStore } from "@/stores/use-user-store";
|
||||||
@@ -37,7 +37,6 @@ export function AppTopNav({ activeToolSlug, config, onConfigChange, hideHeader =
|
|||||||
const setTheme = useThemeStore((state) => state.setTheme);
|
const setTheme = useThemeStore((state) => state.setTheme);
|
||||||
const user = useUserStore((state) => state.user);
|
const user = useUserStore((state) => state.user);
|
||||||
const isReady = useUserStore((state) => state.isReady);
|
const isReady = useUserStore((state) => state.isReady);
|
||||||
const logout = useUserStore((state) => state.clearSession);
|
|
||||||
const publicSettings = useConfigStore((state) => state.publicSettings);
|
const publicSettings = useConfigStore((state) => state.publicSettings);
|
||||||
const effectiveConfig = useEffectiveConfig();
|
const effectiveConfig = useEffectiveConfig();
|
||||||
const modelChannel = publicSettings?.modelChannel;
|
const modelChannel = publicSettings?.modelChannel;
|
||||||
@@ -132,13 +131,7 @@ export function AppTopNav({ activeToolSlug, config, onConfigChange, hideHeader =
|
|||||||
|
|
||||||
<div className="my-auto flex h-9 min-w-0 items-center justify-end gap-2 justify-self-end whitespace-nowrap">
|
<div className="my-auto flex h-9 min-w-0 items-center justify-end gap-2 justify-self-end whitespace-nowrap">
|
||||||
{isReady && user ? (
|
{isReady && user ? (
|
||||||
<UserStatusActions
|
<UserStatusActions />
|
||||||
onOpenConfig={() => openConfigDialog(false)}
|
|
||||||
menuItems={[
|
|
||||||
...(user.role === "admin" ? [{ key: "admin", icon: <Shield className="size-4" />, label: <Link href="/admin">管理后台</Link> }] : []),
|
|
||||||
{ key: "logout", icon: <LogOut className="size-4" />, label: "退出登录", onClick: logout },
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
<button
|
<button
|
||||||
|
|||||||
@@ -1,23 +1,22 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import type { CSSProperties, ReactNode, RefObject } from "react";
|
import type { CSSProperties, RefObject } from "react";
|
||||||
import { Dropdown } from "antd";
|
import { Dropdown } from "antd";
|
||||||
import { Settings2 } from "lucide-react";
|
import { Keyboard, LogOut, Settings2, Shield } from "lucide-react";
|
||||||
import type { ItemType } from "antd/es/menu/interface";
|
import type { ItemType } from "antd/es/menu/interface";
|
||||||
|
import Link from "next/link";
|
||||||
|
|
||||||
import { AnimatedThemeToggler } from "@/components/ui/animated-theme-toggler";
|
import { AnimatedThemeToggler } from "@/components/ui/animated-theme-toggler";
|
||||||
import { GitHubLink } from "@/components/layout/github-link";
|
import { GitHubLink } from "@/components/layout/github-link";
|
||||||
import { VersionReleaseModal } from "@/components/layout/version-release-modal";
|
import { VersionReleaseModal } from "@/components/layout/version-release-modal";
|
||||||
import { cn } from "@/lib/utils";
|
import { cn } from "@/lib/utils";
|
||||||
|
import { useConfigStore } from "@/stores/use-config-store";
|
||||||
import { useThemeStore } from "@/stores/use-theme-store";
|
import { useThemeStore } from "@/stores/use-theme-store";
|
||||||
import { useUserStore } from "@/stores/use-user-store";
|
import { useUserStore } from "@/stores/use-user-store";
|
||||||
|
|
||||||
type UserStatusActionsProps = {
|
type UserStatusActionsProps = {
|
||||||
onOpenConfig?: () => void;
|
|
||||||
showConfig?: boolean;
|
showConfig?: boolean;
|
||||||
userName?: string;
|
onOpenShortcuts?: () => void;
|
||||||
initial?: string;
|
|
||||||
menuItems: ItemType[];
|
|
||||||
accountOpen?: boolean;
|
accountOpen?: boolean;
|
||||||
onAccountOpenChange?: (open: boolean) => void;
|
onAccountOpenChange?: (open: boolean) => void;
|
||||||
accountRef?: RefObject<HTMLDivElement | null>;
|
accountRef?: RefObject<HTMLDivElement | null>;
|
||||||
@@ -27,16 +26,12 @@ type UserStatusActionsProps = {
|
|||||||
gitHubClassName?: string;
|
gitHubClassName?: string;
|
||||||
gitHubStyle?: CSSProperties;
|
gitHubStyle?: CSSProperties;
|
||||||
versionStyle?: CSSProperties;
|
versionStyle?: CSSProperties;
|
||||||
userLabel?: ReactNode;
|
|
||||||
iconStyle?: CSSProperties;
|
iconStyle?: CSSProperties;
|
||||||
};
|
};
|
||||||
|
|
||||||
export function UserStatusActions({
|
export function UserStatusActions({
|
||||||
onOpenConfig,
|
|
||||||
showConfig = true,
|
showConfig = true,
|
||||||
userName,
|
onOpenShortcuts,
|
||||||
initial,
|
|
||||||
menuItems,
|
|
||||||
accountOpen,
|
accountOpen,
|
||||||
onAccountOpenChange,
|
onAccountOpenChange,
|
||||||
accountRef,
|
accountRef,
|
||||||
@@ -46,15 +41,23 @@ export function UserStatusActions({
|
|||||||
gitHubClassName,
|
gitHubClassName,
|
||||||
gitHubStyle,
|
gitHubStyle,
|
||||||
versionStyle,
|
versionStyle,
|
||||||
userLabel,
|
|
||||||
iconStyle,
|
iconStyle,
|
||||||
}: UserStatusActionsProps) {
|
}: UserStatusActionsProps) {
|
||||||
const theme = useThemeStore((state) => state.theme);
|
const theme = useThemeStore((state) => state.theme);
|
||||||
const setTheme = useThemeStore((state) => state.setTheme);
|
const setTheme = useThemeStore((state) => state.setTheme);
|
||||||
const storedUserName = useUserStore((state) => state.user?.username);
|
const user = useUserStore((state) => state.user);
|
||||||
const resolvedUserName = userName || storedUserName;
|
const logout = useUserStore((state) => state.clearSession);
|
||||||
const avatarText = initial || (resolvedUserName?.trim()[0] || "U").toUpperCase();
|
const openConfigDialog = useConfigStore((state) => state.openConfigDialog);
|
||||||
|
const userName = user?.username || "用户";
|
||||||
|
const avatarText = (userName.trim()[0] || "U").toUpperCase();
|
||||||
const naturalIconClass = "inline-flex size-8 shrink-0 items-center justify-center text-stone-600 transition hover:text-stone-950 dark:text-stone-300 dark:hover:text-white [&_svg]:size-4";
|
const naturalIconClass = "inline-flex size-8 shrink-0 items-center justify-center text-stone-600 transition hover:text-stone-950 dark:text-stone-300 dark:hover:text-white [&_svg]:size-4";
|
||||||
|
const menuItems: ItemType[] = [
|
||||||
|
{ key: "user", disabled: true, label: <span className="font-medium text-current">{userName}</span> },
|
||||||
|
...(user?.role === "admin" ? [{ key: "admin", icon: <Shield className="size-4" />, label: <Link href="/admin">管理后台</Link> }] : []),
|
||||||
|
...(onOpenShortcuts ? [{ key: "shortcuts", icon: <Keyboard className="size-4" />, label: "快捷键", onClick: onOpenShortcuts }] : []),
|
||||||
|
{ type: "divider" },
|
||||||
|
{ key: "logout", icon: <LogOut className="size-4" />, label: "退出登录", onClick: logout },
|
||||||
|
];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="inline-flex shrink-0 items-center gap-1.5">
|
<div className="inline-flex shrink-0 items-center gap-1.5">
|
||||||
@@ -63,7 +66,7 @@ export function UserStatusActions({
|
|||||||
type="button"
|
type="button"
|
||||||
className={naturalIconClass}
|
className={naturalIconClass}
|
||||||
style={iconStyle}
|
style={iconStyle}
|
||||||
onClick={onOpenConfig}
|
onClick={() => openConfigDialog(false)}
|
||||||
aria-label="配置"
|
aria-label="配置"
|
||||||
title="配置"
|
title="配置"
|
||||||
>
|
>
|
||||||
@@ -96,7 +99,7 @@ export function UserStatusActions({
|
|||||||
style={avatarStyle}
|
style={avatarStyle}
|
||||||
aria-label="账户菜单"
|
aria-label="账户菜单"
|
||||||
>
|
>
|
||||||
<span className="leading-none">{userLabel ?? avatarText}</span>
|
<span className="leading-none">{avatarText}</span>
|
||||||
</button>
|
</button>
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user