fix(canvas): restore left project sidebar

src/components/layout/MainLayout.tsx

@@ -79,20 +79,18 @@ export function MainLayout() {
         integrated
         workspaceLayout={isChatWorkspace}
         overlay={isPaintingModule}
-        showSidebarControls={!isCanvasWorkspace}
         sidebarPeekOpen={sidebarPeekOpen}
         onSidebarPeekChange={handleSidebarPeekChange}
       />
 
       {/* Below the title bar: sidebar + content */}
       <div className="relative flex min-h-0 flex-1 overflow-hidden">
-        {!isCanvasWorkspace ? (
-          <Sidebar
-            workspaceLayout={isChatWorkspace}
-            sidebarPeekOpen={sidebarPeekOpen}
-            onSidebarPeekChange={handleSidebarPeekChange}
-          />
-        ) : null}
+        <Sidebar
+          workspaceLayout={isChatWorkspace}
+          hideOnCompact={isCanvasWorkspace}
+          sidebarPeekOpen={sidebarPeekOpen}
+          onSidebarPeekChange={handleSidebarPeekChange}
+        />
         <main
           data-testid="main-content"
           className={cn(

src/components/layout/Sidebar.tsx

@@ -151,11 +151,17 @@ function getCoarsePointLabel(balance: WorksTokenPointBalance | null): string {
 
 type SidebarProps = {
   workspaceLayout?: boolean;
+  hideOnCompact?: boolean;
   sidebarPeekOpen?: boolean;
   onSidebarPeekChange?: (open: boolean, source: SidebarPeekSource) => void;
 };
 
-export function Sidebar({ workspaceLayout = false, sidebarPeekOpen = false, onSidebarPeekChange }: SidebarProps = {}) {
+export function Sidebar({
+  workspaceLayout = false,
+  hideOnCompact = false,
+  sidebarPeekOpen = false,
+  onSidebarPeekChange,
+}: SidebarProps = {}) {
   const { t } = useTranslation('common');
   const sidebarPinnedCollapsed = useSettingsStore((state) => state.sidebarCollapsed);
   const sidebarCollapsed = sidebarPinnedCollapsed && !sidebarPeekOpen;
@@ -544,6 +550,7 @@ export function Sidebar({ workspaceLayout = false, sidebarPeekOpen = false, onSi
         // full window height without reflowing the page underneath it.
         sidebarPinnedCollapsed && 'fixed inset-y-0 left-0 z-[350]',
         sidebarPeekPreview && 'sidebar-peek-surface pt-10 shadow-float',
+        hideOnCompact && 'hidden lg:flex',
       )}
     >
       <div

src/pages/ImageCanvas/index.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 import {
   Cloud,
   CloudOff,
-  PanelRight,
+  PanelLeft,
   Plus,
   RefreshCw,
   Sparkles,
@@ -48,18 +48,10 @@ function LoadingWorkspace() {
   return (
     <div className="flex h-full min-h-0 flex-col bg-background" aria-label="正在加载 AI 设计">
       <div className="h-16 animate-pulse border-b border-border/60 bg-surface-subtle/60" />
-      <div className="grid min-h-0 flex-1 lg:grid-cols-[minmax(0,1fr)_320px]">
-        <div className="space-y-4 bg-surface-subtle/35 p-6 lg:border-r lg:border-border/60">
-          <div className="h-16 animate-pulse rounded-2xl bg-surface-subtle" />
-          <div className="ml-auto h-20 w-4/5 animate-pulse rounded-2xl bg-brand/[0.07]" />
-          <div className="h-48 w-5/6 animate-pulse rounded-2xl bg-surface-subtle" />
-        </div>
-        <div className="hidden space-y-3 p-4 lg:block">
-          <div className="h-10 animate-pulse rounded-xl bg-surface-subtle" />
-          {[0, 1, 2, 3].map((item) => (
-            <div key={item} className="h-16 animate-pulse rounded-2xl bg-surface-subtle" />
-          ))}
-        </div>
+      <div className="min-h-0 flex-1 space-y-4 bg-surface-subtle/35 p-6">
+        <div className="h-16 animate-pulse rounded-2xl bg-surface-subtle" />
+        <div className="ml-auto h-20 w-4/5 animate-pulse rounded-2xl bg-brand/[0.07]" />
+        <div className="h-48 w-5/6 animate-pulse rounded-2xl bg-surface-subtle" />
       </div>
     </div>
   );
@@ -166,7 +158,7 @@ export function ImageCanvas() {
     : null;
   const platform = window.electron?.platform;
   const openCreate = () => {
-    setWorksOpen(true);
+    if (!desktopLayout) setWorksOpen(true);
     globalThis.setTimeout(() => {
       window.dispatchEvent(new Event(IMAGE_WORKSPACE_CREATE_PROJECT_EVENT));
     }, 0);
@@ -177,7 +169,7 @@ export function ImageCanvas() {
       <header className={cn(
         'flex min-h-16 shrink-0 items-center gap-4 border-b border-border/70 bg-background py-3',
         platform === 'darwin'
-          ? 'pl-[92px] pr-[116px]'
+          ? 'pl-4 pr-[116px] sm:pl-5'
           : platform === 'win32'
             ? 'pl-5 pr-[260px]'
             : 'px-4 sm:px-5',
@@ -227,7 +219,7 @@ export function ImageCanvas() {
             className="h-9 rounded-xl"
             onClick={() => setWorksOpen(true)}
           >
-            <PanelRight className="mr-1.5 h-4 w-4" />
+            <PanelLeft className="mr-1.5 h-4 w-4" />
             作品
           </Button>
         )}
@@ -246,8 +238,8 @@ export function ImageCanvas() {
         </div>
       )}
 
-      <main className="grid min-h-0 flex-1 lg:grid-cols-[minmax(0,1fr)_320px] xl:grid-cols-[minmax(0,1fr)_340px]">
-        <div className="flex min-h-0 lg:border-r lg:border-border/70">
+      <main className="flex min-h-0 flex-1">
+        <div className="flex min-h-0 min-w-0 flex-1">
           {workspace ? (
             <DesignConversationPane
               workspace={workspace}
@@ -258,15 +250,11 @@ export function ImageCanvas() {
             <EmptyWorkspace onCreate={openCreate} />
           )}
         </div>
-
-        {desktopLayout && (
-          <DesignWorksRail workspace={workspace} />
-        )}
       </main>
 
       {!desktopLayout && (
         <Sheet open={worksOpen} onOpenChange={setWorksOpen}>
-          <SheetContent side="right" className="flex w-[min(92vw,360px)] flex-col overflow-hidden p-0 sm:max-w-[360px]">
+          <SheetContent side="left" className="flex w-[min(92vw,360px)] flex-col overflow-hidden p-0 sm:max-w-[360px]">
             <SheetHeader className="sr-only">
               <SheetTitle>我的作品</SheetTitle>
               <SheetDescription>新建、切换、重命名或删除 AI 绘画作品。</SheetDescription>