Show icon-only Code return above sidebar branding
This commit is contained in:
@@ -3,7 +3,7 @@ import { useLocation, useNavigate } from 'react-router-dom';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { AI_MODULE_SELECTION_PATH, aiModules, getAiModuleForPath } from '@/lib/ai-modules';
|
||||
|
||||
export function ModuleSwitcher({ sidebarCollapsed, compact = false, toolbar = false }: { sidebarCollapsed: boolean; compact?: boolean; toolbar?: boolean }) {
|
||||
export function ModuleSwitcher({ sidebarCollapsed, compact = false, toolbar = false, iconOnly = false }: { sidebarCollapsed: boolean; compact?: boolean; toolbar?: boolean; iconOnly?: boolean }) {
|
||||
const location = useLocation();
|
||||
const navigate = useNavigate();
|
||||
const activeModuleId = getAiModuleForPath(location.pathname);
|
||||
@@ -29,6 +29,7 @@ export function ModuleSwitcher({ sidebarCollapsed, compact = false, toolbar = fa
|
||||
? 'inline-flex min-h-9 w-fit translate-y-2 justify-start gap-1.5 rounded-xl p-2 text-xs'
|
||||
: 'flex min-h-11 w-full justify-between gap-2 rounded-2xl p-3 text-sm',
|
||||
sidebarCollapsed ? 'justify-center px-0' : '',
|
||||
toolbar && iconOnly && 'w-8 justify-center px-0',
|
||||
)}
|
||||
>
|
||||
<ArrowLeft
|
||||
@@ -36,7 +37,7 @@ export function ModuleSwitcher({ sidebarCollapsed, compact = false, toolbar = fa
|
||||
aria-hidden="true"
|
||||
className="h-4 w-4 shrink-0 -translate-y-px text-muted-foreground transition-[color,transform] duration-150 group-hover:-translate-x-0.5 group-hover:text-brand"
|
||||
/>
|
||||
{!sidebarCollapsed ? <span className={cn('min-w-0 whitespace-nowrap leading-4', toolbar && 'truncate')}>{activeModuleLabel}</span> : null}
|
||||
{!sidebarCollapsed && !iconOnly ? <span className={cn('min-w-0 whitespace-nowrap leading-4', toolbar && 'truncate')}>{activeModuleLabel}</span> : null}
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -415,12 +415,8 @@ export function Sidebar({
|
||||
)}
|
||||
>
|
||||
<div className="min-w-0 w-full">
|
||||
{workspaceLayout && <button type="button" aria-label="返回首页" title="返回首页" onClick={() => navigate('/module-select')} className="classroom-brand flex w-full items-center gap-2 rounded-lg text-left">
|
||||
<span className="classroom-brand-mark"><img src={classroomMark} alt="" className="h-7 w-7" /></span>
|
||||
<span className="min-w-0"><span className="block text-base font-semibold tracking-tight">麦洛</span><span className="classroom-brand-caption">把脑洞变成作品</span></span>
|
||||
</button>}
|
||||
{workspaceLayout && <div className="no-drag flex h-10 min-w-0 items-center gap-1" data-testid="classroom-sidebar-navigation">
|
||||
<ModuleSwitcher sidebarCollapsed={sidebarCollapsed} toolbar />
|
||||
<ModuleSwitcher sidebarCollapsed={sidebarCollapsed} toolbar iconOnly />
|
||||
{!sidebarPinnedCollapsed && ['darwin', 'win32'].includes(window.electron?.platform ?? '') && <button
|
||||
type="button"
|
||||
data-testid="titlebar-sidebar-toggle"
|
||||
@@ -431,6 +427,10 @@ export function Sidebar({
|
||||
className="no-drag motion-press flex h-8 w-8 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-surface-subtle hover:text-foreground"
|
||||
><PanelLeftClose className="h-4 w-4" /></button>}
|
||||
</div>}
|
||||
{workspaceLayout && <button type="button" aria-label="返回首页" title="返回首页" onClick={() => navigate('/module-select')} className="classroom-brand flex w-full items-center gap-2 rounded-lg text-left">
|
||||
<span className="classroom-brand-mark"><img src={classroomMark} alt="" className="h-7 w-7" /></span>
|
||||
<span className="min-w-0"><span className="block text-base font-semibold tracking-tight">麦洛</span><span className="classroom-brand-caption">把脑洞变成作品</span></span>
|
||||
</button>}
|
||||
{workspaceLayout && <CommunityLink variant="sidebar" collapsed={sidebarCollapsed} />}
|
||||
{!workspaceLayout && <ModuleSwitcher sidebarCollapsed={sidebarCollapsed} compact={!sidebarCollapsed} />}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user