@lobehub/lobehub 2.0.0-next.277 → 2.0.0-next.279

package/src/store/chat/slices/portal/action.test.ts

@@ -268,45 +268,4 @@ describe('chatDockSlice', () => {
     });
   });
 
-  describe('toggleDock', () => {
-    it('should toggle dock state when no argument is provided', () => {
-      const { result } = renderHook(() => useChatStore());
-
-      expect(result.current.showPortal).toBe(false);
-
-      act(() => {
-        result.current.togglePortal();
-      });
-
-      expect(result.current.showPortal).toBe(true);
-
-      act(() => {
-        result.current.togglePortal();
-      });
-
-      expect(result.current.showPortal).toBe(false);
-    });
-
-    it('should set dock state to the provided value', () => {
-      const { result } = renderHook(() => useChatStore());
-
-      act(() => {
-        result.current.togglePortal(true);
-      });
-
-      expect(result.current.showPortal).toBe(true);
-
-      act(() => {
-        result.current.togglePortal(false);
-      });
-
-      expect(result.current.showPortal).toBe(false);
-
-      act(() => {
-        result.current.togglePortal(true);
-      });
-
-      expect(result.current.showPortal).toBe(true);
-    });
-  });
 });

package/src/store/chat/slices/portal/action.ts

@@ -28,7 +28,6 @@ export interface ChatPortalAction {
   pushPortalView: (view: PortalViewData) => void;
   replacePortalView: (view: PortalViewData) => void;
   toggleNotebook: (open?: boolean) => void;
-  togglePortal: (open?: boolean) => void;
 }
 
 // Helper to get current view type from stack
@@ -222,28 +221,4 @@ pushPortalView: (view) => {
       get().closeNotebook();
     }
   },
-
-  togglePortal: (open) => {
-    const nextOpen = open === undefined ? !get().showPortal : open;
-
-    if (!nextOpen) {
-      // When closing, clear the stack
-      set({ portalStack: [], showPortal: false }, false, 'togglePortal/close');
-    } else {
-      // When opening, if stack is empty, push Home view
-      const { portalStack } = get();
-      if (portalStack.length === 0) {
-        set(
-          {
-            portalStack: [{ type: PortalViewType.Home }],
-            showPortal: true,
-          },
-          false,
-          'togglePortal/openHome',
-        );
-      } else {
-        set({ showPortal: true }, false, 'togglePortal/open');
-      }
-    }
-  },
 });

package/src/store/chat/slices/thread/action.test.ts

@@ -141,7 +141,7 @@ describe('thread action', () => {
   describe('openThreadCreator', () => {
     it('should set thread creator state and open portal', () => {
       const { result } = renderHook(() => useChatStore());
-      const togglePortalSpy = vi.spyOn(result.current, 'togglePortal');
+      const pushPortalViewSpy = vi.spyOn(result.current, 'pushPortalView');
 
       act(() => {
         result.current.openThreadCreator('message-id');
@@ -150,14 +150,14 @@ describe('thread action', () => {
       expect(result.current.threadStartMessageId).toBe('message-id');
       expect(result.current.portalThreadId).toBeUndefined();
       expect(result.current.startToForkThread).toBe(true);
-      expect(togglePortalSpy).toHaveBeenCalledWith(true);
+      expect(pushPortalViewSpy).toHaveBeenCalledWith({ type: 'thread', startMessageId: 'message-id' });
     });
   });
 
   describe('openThreadInPortal', () => {
     it('should set portal thread state and open portal', () => {
       const { result } = renderHook(() => useChatStore());
-      const togglePortalSpy = vi.spyOn(result.current, 'togglePortal');
+      const pushPortalViewSpy = vi.spyOn(result.current, 'pushPortalView');
 
       act(() => {
         result.current.openThreadInPortal('thread-id', 'source-message-id');
@@ -166,7 +166,11 @@ describe('thread action', () => {
       expect(result.current.portalThreadId).toBe('thread-id');
       expect(result.current.threadStartMessageId).toBe('source-message-id');
       expect(result.current.startToForkThread).toBe(false);
-      expect(togglePortalSpy).toHaveBeenCalledWith(true);
+      expect(pushPortalViewSpy).toHaveBeenCalledWith({
+        type: 'thread',
+        threadId: 'thread-id',
+        startMessageId: 'source-message-id',
+      });
     });
   });
 
@@ -182,7 +186,7 @@ describe('thread action', () => {
         });
       });
 
-      const togglePortalSpy = vi.spyOn(result.current, 'togglePortal');
+      const clearPortalStackSpy = vi.spyOn(result.current, 'clearPortalStack');
 
       act(() => {
         result.current.closeThreadPortal();
@@ -191,7 +195,7 @@ describe('thread action', () => {
       expect(result.current.portalThreadId).toBeUndefined();
       expect(result.current.threadStartMessageId).toBeUndefined();
       expect(result.current.startToForkThread).toBeUndefined();
-      expect(togglePortalSpy).toHaveBeenCalledWith(false);
+      expect(clearPortalStackSpy).toHaveBeenCalled();
     });
   });
 

package/src/store/chat/slices/thread/action.ts

@@ -19,6 +19,7 @@ import { merge } from '@/utils/merge';
 import { setNamespace } from '@/utils/storeDebug';
 
 import { displayMessageSelectors } from '../message/selectors';
+import { PortalViewType } from '../portal/initialState';
 import { type ThreadDispatch, threadReducer } from './reducer';
 import { genParentMessages } from './selectors';
 
@@ -88,7 +89,8 @@ export const chatThreadMessage: StateCreator<
       false,
       'openThreadCreator',
     );
-    get().togglePortal(true);
+    // Push Thread view to portal stack instead of togglePortal
+    get().pushPortalView({ type: PortalViewType.Thread, startMessageId: messageId });
   },
   openThreadInPortal: (threadId, sourceMessageId) => {
     set(
@@ -96,7 +98,12 @@ export const chatThreadMessage: StateCreator<
       false,
       'openThreadInPortal',
     );
-    get().togglePortal(true);
+    // Push Thread view to portal stack with threadId
+    get().pushPortalView({
+      type: PortalViewType.Thread,
+      threadId,
+      startMessageId: sourceMessageId ?? undefined,
+    });
   },
 
   closeThreadPortal: () => {
@@ -105,7 +112,7 @@ export const chatThreadMessage: StateCreator<
       false,
       'closeThreadPortal',
     );
-    get().togglePortal(false);
+    get().clearPortalStack();
   },
   createThread: async ({ message, sourceMessageId, topicId, type }) => {
     set({ isCreatingThread: true }, false, n('creatingThread/start'));

package/src/app/[variants]/(main)/group/features/Portal/features/Portal.tsx

@@ -1,105 +0,0 @@
-'use client';
-
-import { DraggablePanel, DraggablePanelContainer, type DraggablePanelProps } from '@lobehub/ui';
-import { Flexbox } from '@lobehub/ui';
-import { createStaticStyles, useResponsive } from 'antd-style';
-import isEqual from 'fast-deep-equal';
-import { Activity, type PropsWithChildren, memo, useState } from 'react';
-
-import {
-  CHAT_PORTAL_MAX_WIDTH,
-  CHAT_PORTAL_TOOL_UI_WIDTH,
-  CHAT_PORTAL_WIDTH,
-} from '@/const/layoutTokens';
-import { useChatStore } from '@/store/chat';
-import { chatPortalSelectors, portalThreadSelectors } from '@/store/chat/selectors';
-import { useGlobalStore } from '@/store/global';
-import { systemStatusSelectors } from '@/store/global/selectors';
-
-const styles = createStaticStyles(({ css, cssVar }) => ({
-  content: css`
-    display: flex;
-    flex-direction: column;
-    height: 100% !important;
-  `,
-  drawer: css`
-    z-index: 10;
-    height: 100%;
-    background: ${cssVar.colorBgContainer};
-  `,
-  panel: css`
-    overflow: hidden;
-    height: 100%;
-    background: ${cssVar.colorBgContainer};
-  `,
-}));
-
-const PortalPanel = memo(({ children }: PropsWithChildren) => {
-  const { md = true } = useResponsive();
-
-  const [showPortal, showToolUI, showArtifactUI, showThread] = useChatStore((s) => [
-    chatPortalSelectors.showPortal(s),
-    chatPortalSelectors.showPluginUI(s),
-    chatPortalSelectors.showArtifactUI(s),
-    portalThreadSelectors.showThread(s),
-  ]);
-
-  const [portalWidth, updateSystemStatus] = useGlobalStore((s) => [
-    systemStatusSelectors.portalWidth(s),
-    s.updateSystemStatus,
-  ]);
-
-  const [tmpWidth, setWidth] = useState(portalWidth);
-  if (tmpWidth !== portalWidth) setWidth(portalWidth);
-
-  const handleSizeChange: DraggablePanelProps['onSizeChange'] = (_, size) => {
-    if (!size) return;
-    const nextWidth = typeof size.width === 'string' ? Number.parseInt(size.width) : size.width;
-    if (!nextWidth) return;
-
-    if (isEqual(nextWidth, portalWidth)) return;
-    setWidth(nextWidth);
-    updateSystemStatus({ portalWidth: nextWidth });
-  };
-
-  return (
-    <DraggablePanel
-      className={styles.drawer}
-      classNames={{
-        content: styles.content,
-      }}
-      defaultSize={{ width: tmpWidth }}
-      expand={showPortal}
-      maxWidth={CHAT_PORTAL_MAX_WIDTH}
-      minWidth={
-        (showArtifactUI || showToolUI || showThread) && md
-          ? CHAT_PORTAL_TOOL_UI_WIDTH
-          : CHAT_PORTAL_WIDTH
-      }
-      mode={md ? 'fixed' : 'float'}
-      onSizeChange={handleSizeChange}
-      placement={'right'}
-      showHandleWhenCollapsed={false}
-      showHandleWideArea={false}
-      size={{ height: '100%', width: portalWidth }}
-      styles={{
-        handle: { display: 'none' },
-      }}
-    >
-      <DraggablePanelContainer
-        style={{
-          flex: 'none',
-          height: '100%',
-          maxHeight: '100vh',
-          minWidth: CHAT_PORTAL_WIDTH,
-        }}
-      >
-        <Activity mode={showPortal ? 'visible' : 'hidden'} name="GroupPortal">
-          <Flexbox className={styles.panel}>{children}</Flexbox>
-        </Activity>
-      </DraggablePanelContainer>
-    </DraggablePanel>
-  );
-});
-
-export default PortalPanel;

package/src/app/[variants]/(main)/group/features/Portal/features/PortalPanel.tsx

@@ -1,23 +0,0 @@
-import { Suspense, memo } from 'react';
-
-import DesktopLayout from '@/app/[variants]/(main)/group/features/Portal/_layout/Desktop';
-import MobileLayout from '@/app/[variants]/(main)/group/features/Portal/_layout/Mobile';
-import Loading from '@/components/Loading/BrandTextLoading';
-
-interface PortalPanelProps {
-  mobile?: boolean;
-}
-
-const PortalPanel = memo<PortalPanelProps>(({ mobile }) => {
-  const Layout = mobile ? MobileLayout : DesktopLayout;
-
-  return (
-    <Suspense fallback={<Loading debugId="PortalPanel" />}>
-      <Layout />
-    </Suspense>
-  );
-});
-
-PortalPanel.displayName = 'PortalPanel';
-
-export default PortalPanel;