refactor(core): workbench

packages/frontend/component/src/components/resize-panel/resize-panel.tsx

@@ -39,6 +39,7 @@ export interface ResizePanelProps
   resizeHandleVerticalPadding?: number;
   enableAnimation?: boolean;
   width: number;
+  unmountOnExit?: boolean;
   onOpen: (open: boolean) => void;
   onResizing: (resizing: boolean) => void;
   onWidthChange: (width: number) => void;
@@ -149,6 +150,7 @@ export const ResizePanel = forwardRef<HTMLDivElement, ResizePanelProps>(
       floating,
       enableAnimation: _enableAnimation = true,
       open,
+      unmountOnExit,
       onOpen,
       onResizing,
       onWidthChange,
@@ -182,7 +184,7 @@ export const ResizePanel = forwardRef<HTMLDivElement, ResizePanelProps>(
         data-handle-position={resizeHandlePos}
         data-enable-animation={enableAnimation && !resizing}
       >
-        {status !== 'exited' && children}
+        {!(status === 'exited' && unmountOnExit !== false) && children}
         <ResizeHandle
           resizeHandlePos={resizeHandlePos}
           resizeHandleOffset={resizeHandleOffset}

packages/frontend/core/src/blocksuite/presets/ai/provider.ts

@@ -2,8 +2,6 @@ import type { EditorHost } from '@blocksuite/block-std';
 import { PaymentRequiredError, UnauthorizedError } from '@blocksuite/blocks';
 import { Slot } from '@blocksuite/store';
 
-import type { ChatCards } from './chat-panel/chat-cards';
-
 export interface AIUserInfo {
   id: string;
   email: string;
@@ -72,19 +70,6 @@ export class AIProvider {
     return AIProvider.instance.toggleGeneralAIOnboarding;
   }
 
-  static genRequestChatCardsFn(params: AIChatParams) {
-    return async (chatPanel: HTMLElement) => {
-      const chatCards: ChatCards | null = await new Promise(resolve =>
-        requestAnimationFrame(() =>
-          resolve(chatPanel.querySelector('chat-cards'))
-        )
-      );
-      if (!chatCards) return;
-      if (chatCards.temporaryParams) return;
-      chatCards.temporaryParams = params;
-    };
-  }
-
   private static readonly instance = new AIProvider();
 
   static LAST_ACTION_SESSIONID = '';

packages/frontend/core/src/components/blocksuite/block-suite-header/menu/index.tsx

@@ -48,16 +48,18 @@ type PageMenuProps = {
   rename?: () => void;
   page: Doc;
   isJournal?: boolean;
+  containerWidth: number;
 };
 // fixme: refactor this file
 export const PageHeaderMenuButton = ({
   rename,
   page,
   isJournal,
+  containerWidth,
 }: PageMenuProps) => {
   const pageId = page?.id;
   const t = useI18n();
-  const { hideShare } = useDetailPageHeaderResponsive();
+  const { hideShare } = useDetailPageHeaderResponsive(containerWidth);
   const confirmEnableCloud = useEnableCloud();
 
   const workspace = useService(WorkspaceService).workspace;

packages/frontend/core/src/components/pure/ai-island/index.tsx

@@ -1,5 +1,10 @@
-import { RightSidebarService } from '@affine/core/modules/right-sidebar';
-import { useLiveData, useService } from '@toeverything/infra';
+import { WorkbenchService } from '@affine/core/modules/workbench';
+import {
+  GlobalStateService,
+  LiveData,
+  useLiveData,
+  useService,
+} from '@toeverything/infra';
 import { useEffect, useState } from 'react';
 
 import { ToolContainer } from '../../workspace';
@@ -32,18 +37,37 @@ if (
   registerAngle(borderAngle3, 180);
 }
 
+const RIGHT_SIDEBAR_AI_HAS_EVER_OPENED_KEY =
+  'app:settings:rightsidebar:ai:has-ever-opened';
+
 export const AIIsland = () => {
   // to make sure ai island is hidden first and animate in
   const [hide, setHide] = useState(true);
 
-  const rightSidebar = useService(RightSidebarService).rightSidebar;
-  const activeTabName = useLiveData(rightSidebar.activeTabName$);
-  const rightSidebarOpen = useLiveData(rightSidebar.isOpen$);
-  const aiChatHasEverOpened = useLiveData(rightSidebar.aiChatHasEverOpened$);
+  const workbench = useService(WorkbenchService).workbench;
+  const activeView = useLiveData(workbench.activeView$);
+  const haveChatTab = useLiveData(
+    activeView.sidebarTabs$.map(tabs => tabs.some(t => t.id === 'chat'))
+  );
+  const activeTab = useLiveData(activeView.activeSidebarTab$);
+  const sidebarOpen = useLiveData(workbench.sidebarOpen$);
+  const globalState = useService(GlobalStateService).globalState;
+  const aiChatHasEverOpened = useLiveData(
+    LiveData.from(
+      globalState.watch<boolean>(RIGHT_SIDEBAR_AI_HAS_EVER_OPENED_KEY),
+      false
+    )
+  );
+
+  useEffect(() => {
+    if (sidebarOpen && activeTab?.id === 'chat') {
+      globalState.set(RIGHT_SIDEBAR_AI_HAS_EVER_OPENED_KEY, true);
+    }
+  }, [activeTab, globalState, sidebarOpen]);
 
   useEffect(() => {
-    setHide(rightSidebarOpen && activeTabName === 'chat');
-  }, [activeTabName, rightSidebarOpen]);
+    setHide((sidebarOpen && activeTab?.id === 'chat') || !haveChatTab);
+  }, [activeTab, haveChatTab, sidebarOpen]);
 
   return (
     <ToolContainer>
@@ -58,8 +82,8 @@ export const AIIsland = () => {
           data-testid="ai-island"
           onClick={() => {
             if (hide) return;
-            rightSidebar.open();
-            rightSidebar.setActiveTabName('chat');
+            workbench.openSidebar();
+            activeView.activeSidebarTab('chat');
           }}
         >
           <AIIcon />

packages/frontend/core/src/layouts/workspace-layout.tsx

@@ -48,6 +48,7 @@ import { SyncAwareness } from '../components/affine/awareness';
 import { appSidebarResizingAtom } from '../components/app-sidebar';
 import { usePageHelper } from '../components/blocksuite/block-suite-page-list/utils';
 import type { DraggableTitleCellData } from '../components/page-list';
+import { AIIsland } from '../components/pure/ai-island';
 import { RootAppSidebar } from '../components/root-app-sidebar';
 import { MainContainer } from '../components/workspace';
 import { WorkspaceUpgrade } from '../components/workspace-upgrade';
@@ -117,6 +118,7 @@ export const WorkspaceLayout = function WorkspaceLayout({
       <WorkspaceLayoutInner>{children}</WorkspaceLayoutInner>
       {/* should show after workspace loaded */}
       <WorkspaceAIOnboarding />
+      <AIIsland />
     </SWRConfigProvider>
   );
 };

packages/frontend/core/src/modules/index.ts

@@ -9,7 +9,6 @@ import { configureNavigationModule } from './navigation';
 import { configurePeekViewModule } from './peek-view';
 import { configurePermissionsModule } from './permissions';
 import { configureWorkspacePropertiesModule } from './properties';
-import { configureRightSidebarModule } from './right-sidebar';
 import { configureShareDocsModule } from './share-doc';
 import { configureStorageImpls } from './storage';
 import { configureTagModule } from './tag';
@@ -20,7 +19,6 @@ export function configureCommonModules(framework: Framework) {
   configureInfraModules(framework);
   configureCollectionModule(framework);
   configureNavigationModule(framework);
-  configureRightSidebarModule(framework);
   configureTagModule(framework);
   configureWorkbenchModule(framework);
   configureWorkspacePropertiesModule(framework);