zhouhongbo
/
JZ_QGNB
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: zhouhongbo:0c72a94fed0e50ab6888ffe1f81f53a8fc6dc100
Branches Tags
zhouhongbo:main
..
compare: zhouhongbo:527a66af959af5ee43c15fb52675367c3001bbd1
Branches Tags
zhouhongbo:main

No commits in common. '0c72a94fed0e50ab6888ffe1f81f53a8fc6dc100' and '527a66af959af5ee43c15fb52675367c3001bbd1' have entirely different histories.
0c72a94fed ... 527a66af95

17 changed files with 194 additions and 162 deletions
Show Stats

22
DigitalHumanWeb/src/app/(main)/@nav/_layout/Desktop/Avatar.tsx
Unescape Escape View File

@ -1,13 +1,29 @@
import {Image} from 'antd'; import { ActionIcon } from '@lobehub/ui';
import {Image, Tooltip} from 'antd';
import { LucideX } from 'lucide-react';
import { memo } from 'react'; import { memo } from 'react';
import { useTranslation } from 'react-i18next';
import { Flexbox } from 'react-layout-kit'; import { Flexbox } from 'react-layout-kit';
// import UserAvatar from '@/features/User/UserAvatar';
// import UserPanel from '@/features/User/UserPanel'; import UserAvatar from '@/features/User/UserAvatar';
import UserPanel from '@/features/User/UserPanel';
import { useUserStore } from '@/store/user';
import { preferenceSelectors } from '@/store/user/selectors';
const Avatar = memo(() => { const Avatar = memo(() => {
const { t } = useTranslation('common');
const hideSettingsMoveGuide = useUserStore(preferenceSelectors.hideSettingsMoveGuide);
const updateGuideState = useUserStore((s) => s.updateGuideState);
const content = (
<UserPanel>
<UserAvatar clickable />
</UserPanel>
);
return ( return (
<>
<Image alt={""} preview={false} src="/images/logo.png" /> <Image alt={""} preview={false} src="/images/logo.png" />
</>
) )
}); });

65
DigitalHumanWeb/src/app/(main)/@nav/_layout/Desktop/TopActions.tsx
Unescape Escape View File

@ -1,7 +1,7 @@
// import { ActionIcon } from '@lobehub/ui'; import { ActionIcon } from '@lobehub/ui';
// import { Compass, FolderClosed, MessageSquare } from 'lucide-react'; import { Compass, FolderClosed, MessageSquare } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
import {memo, useState} from 'react'; import {memo, useEffect, useState} from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { useGlobalStore } from '@/store/global'; import { useGlobalStore } from '@/store/global';
@ -10,20 +10,17 @@ import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfi
import { useSessionStore } from '@/store/session'; import { useSessionStore } from '@/store/session';
import { useUserStore } from '@/store/user'; import { useUserStore } from '@/store/user';
import { createStyles } from 'antd-style'; import { createStyles } from 'antd-style';
import { Image } from "antd"; import {Button, Image} from "antd";
const useStyles = createStyles(({ css }) => ({ const useStyles = createStyles(({ css, token }) => ({
iconImg: css`
width: 48px;
height: 48px;
`,
iconText: css` iconText: css`
text-align: center; text-align: center;
color: #fff; color: #fff;
`, `,
iconSelectText: css` iconImg: css`
color: #0044FF; width: 48px;
height: 48px;
`, `,
linkUrl: css` linkUrl: css`
width: 100%; width: 100%;
@ -32,26 +29,34 @@ const useStyles = createStyles(({ css }) => ({
linkclic: css` linkclic: css`
background-color: #fff; background-color: #fff;
`, `,
iconSelectText: css`
color: #0044FF;
`,
})); }));
export interface TopActionProps { export interface TopActionProps {
tab?: SidebarTabKey; tab?: SidebarTabKey;
} }
const getUserId = (s) => s.user?.id
const TopActions = memo<TopActionProps>(() => { const TopActions = memo<TopActionProps>(({ tab }) => {
const { t } = useTranslation('common'); const { t } = useTranslation('common');
const switchBackToChat = useGlobalStore((s) => s.switchBackToChat); const switchBackToChat = useGlobalStore((s) => s.switchBackToChat);
const { showMarket, enableKnowledgeBase } = useServerConfigStore(featureFlagsSelectors); const { showMarket, enableKnowledgeBase } = useServerConfigStore(featureFlagsSelectors);
const { styles, cx } = useStyles() const { styles, cx } = useStyles()
const [value, setValue] = useState("chat") const [value, setValue] = useState("chat")
const getUserId = (s: UserStore) => s.user?.id
const userId = getUserId(useUserStore.getState()) const userId = getUserId(useUserStore.getState())
console.log(userId,'3837373266262266') console.log(userId,'3837373266262266')
const testFuc = (s: UserStore) => {
console.log(s,'999999999')
}
testFuc(useUserStore.getState())
return ( return (
<div style={{ textAlign: 'center', width: '100%'}}> <div style={{ width: '100%', textAlign: 'center'}}>
<Link <Link
aria-label={t('tab.chat')} aria-label={t('tab.chat')}
className={value === '/chat' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)}
href={'/chat'} href={'/chat'}
className={value == '/chat' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)}
onClick={(e) => { onClick={(e) => {
e.preventDefault(); e.preventDefault();
setValue("/chat") setValue("/chat")
@ -60,48 +65,48 @@ const TopActions = memo<TopActionProps>(() => {
}} }}
> >
<Image alt={"chat"} className={cx(styles.iconImg)} preview={false} src="/images/hh.png" /> <Image alt={"chat"} className={cx(styles.iconImg)} preview={false} src="/images/hh.png" />
<div className={value === '/chat' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>会话</div> <div className={value == '/chat' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>会话</div>
</Link> </Link>
{enableKnowledgeBase && ( {enableKnowledgeBase && (
<Link aria-label={t('tab.files')} className={value === '/discover/assistants' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} href={`/discover/assistants?userid=${userId}`} onClick={() => {setValue("/discover/assistants"); window.localStorage.setItem("nowChat", "")}}> <Link className={value == '/discover/assistants' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} aria-label={t('tab.files')} href={`/discover/assistants?userid=${userId}`} onClick={() => {setValue("/discover/assistants"); window.localStorage.setItem("nowChat", "")}}>
<Image alt={"files"} className={cx(styles.iconImg)} preview={false} src="/images/zs.png" /> <Image alt={"files"} className={cx(styles.iconImg)} preview={false} src="/images/zs.png" />
<div className={value === '/discover/assistants' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>助手</div> <div className={value == '/discover/assistants' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>助手</div>
</Link> </Link>
)} )}
{showMarket && ( {showMarket && (
<Link aria-label={t('tab.discover')} className={value === '/files' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} href={'/files'} onClick={() => {setValue("/files"); window.localStorage.setItem("nowChat", "")}}> <Link className={value == '/files' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} aria-label={t('tab.discover')} href={'/files'} onClick={() => {setValue("/files"); window.localStorage.setItem("nowChat", "")}}>
<Image alt={"discover"} className={cx(styles.iconImg)} preview={false} src="/images/gj.png" /> <Image alt={"discover"} className={cx(styles.iconImg)} preview={false} src="/images/gj.png" />
<div className={value === '/files' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>工具</div> <div className={value == '/files' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>工具</div>
</Link> </Link>
)} )}
{showMarket && ( {showMarket && (
<Link aria-label={t('tab.Model')} className={value === '/model' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} href={`/discover/models?userid=${userId}`} onClick={() => {setValue("/model"); window.localStorage.setItem("nowChat", "")}}> <Link className={value == '/model' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} aria-label={t('tab.Model')} href={`/discover/models?userid=${userId}`} onClick={() => {setValue("/model"); window.localStorage.setItem("nowChat", "")}}>
<Image alt={"model"} className={cx(styles.iconImg)} preview={false} src="/images/mx.png" /> <Image alt={"model"} className={cx(styles.iconImg)} preview={false} src="/images/mx.png" />
<div className={value === '/model' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>模型</div> <div className={value == '/model' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>模型</div>
</Link> </Link>
)} )}
{showMarket && ( {showMarket && (
<Link aria-label={t('tab.robot')} className={value === '/robot' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} href={'/robot'} onClick={() => {setValue("/robot"); window.localStorage.setItem("nowChat", "")}}> <Link className={value == '/robot' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} aria-label={t('tab.robot')} href={'/robot'} onClick={() => {setValue("/robot"); window.localStorage.setItem("nowChat", "")}}>
<Image alt={"robot"} className={cx(styles.iconImg)} preview={false} src="/images/szr.png" /> <Image alt={"robot"} className={cx(styles.iconImg)} preview={false} src="/images/szr.png" />
<div className={value === '/robot' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>数字人</div> <div className={value == '/robot' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>数字人</div>
</Link> </Link>
)} )}
{showMarket && ( {showMarket && (
<Link aria-label={t('tab.Plugins')} className={value === '/plugins' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} href={`/discover/plugins?userid=${userId}`} onClick={() => {setValue("/plugins"); window.localStorage.setItem("nowChat", "")}}> <Link className={value == '/plugins' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} aria-label={t('tab.Plugins')} href={`/discover/plugins?userid=${userId}`} onClick={() => {setValue("/plugins"); window.localStorage.setItem("nowChat", "")}}>
<Image alt={"plugins"} className={cx(styles.iconImg)} preview={false} src="/images/cj.png" /> <Image alt={"plugins"} className={cx(styles.iconImg)} preview={false} src="/images/cj.png" />
<div className={value === '/plugins' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>插件</div> <div className={value == '/plugins' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>插件</div>
</Link> </Link>
)} )}
{showMarket && ( {showMarket && (
<Link aria-label={t('tab.Power')} className={value === '/power' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} href={'/power'} onClick={() => {setValue("/power"); window.localStorage.setItem("nowChat", "")}}> <Link className={value == '/power' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} aria-label={t('tab.Power')} href={'/power'} onClick={() => {setValue("/power"); window.localStorage.setItem("nowChat", "")}}>
<Image alt={"power"} className={cx(styles.iconImg)} preview={false} src="/images/sl.png" /> <Image alt={"power"} className={cx(styles.iconImg)} preview={false} src="/images/sl.png" />
<div className={value === '/power' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>算力</div> <div className={value == '/power' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>算力</div>
</Link> </Link>
)} )}
{showMarket && ( {showMarket && (
<Link aria-label={t('tab.knowledge')} className={value === '/knowledge' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} href={'/knowledge'} onClick={() => {setValue("/knowledge")}}> <Link className={value == '/knowledge' ? cx(styles.linkUrl, styles.linkclic) : cx(styles.linkUrl)} aria-label={t('tab.knowledge')} href={'/knowledge'} onClick={() => {setValue("/knowledge")}}>
<Image className={cx(styles.iconImg)} preview={false} src="/images/zsk.png" /> <Image className={cx(styles.iconImg)} preview={false} src="/images/zsk.png" />
<div className={value === '/knowledge' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>知识库</div> <div className={value == '/knowledge' ? cx(styles.iconText, styles.iconSelectText) : cx(styles.iconText) }>知识库</div>
</Link> </Link>
)} )}
</div> </div>

5
DigitalHumanWeb/src/app/(main)/@nav/_layout/Desktop/index.tsx
Unescape Escape View File

@ -6,6 +6,7 @@ import { memo } from 'react';
import { useActiveTabKey } from '@/hooks/useActiveTabKey'; import { useActiveTabKey } from '@/hooks/useActiveTabKey';
import Avatar from './Avatar'; import Avatar from './Avatar';
import BottomActions from './BottomActions';
import TopActions from './TopActions'; import TopActions from './TopActions';
const Nav = memo(() => { const Nav = memo(() => {
@ -13,8 +14,8 @@ const Nav = memo(() => {
return ( return (
<SideNav <SideNav
avatar={<Avatar />} avatar={<Avatar />}
bottomActions={<></>} // bottomActions={<BottomActions />}
style={{ backgroundColor: '#2E62FF', height: '100%', width: '100px', zIndex: 100 }} style={{ height: '100%', zIndex: 100, width: '100px', backgroundColor: '#2E62FF' }}
topActions={<TopActions tab={sidebarKey} />} topActions={<TopActions tab={sidebarKey} />}
/> />
); );

4
DigitalHumanWeb/src/app/(main)/chat/(workspace)/@conversation/default.tsx
Unescape Escape View File

@ -15,9 +15,9 @@ const ChatConversation = () => {
<ChatInput /> <ChatInput />
<div style={{ backgroundColor: "rgba(200, 205, 220, 0.2)", color: '#909090', fontSize: '13px'}}> <div style={{ fontSize: '13px', color: '#909090', backgroundColor: "rgba(200, 205, 220, 0.2)"}}>
<span style={{ display: 'inline-block', }}>文字输入快捷键提示:</span> <span style={{ display: 'inline-block', }}>文字输入快捷键提示:</span>
<span style={{ display: 'inline-block', fontSize: "20px", margin: "0px 13px" }}>&crarr;</span> <span style={{ display: 'inline-block', margin: "0px 13px", fontSize: "20px" }}>&crarr;</span>
<span>键 发送 </span> <span>键 发送 </span>
<span style={{ display: 'inline-block', fontSize: "20px", marginLeft: '30px', marginRight: '11px' }}>&crarr;</span> <span style={{ display: 'inline-block', fontSize: "20px", marginLeft: '30px', marginRight: '11px' }}>&crarr;</span>
<span>键 + Ctrl 键 换行</span> <span>键 + Ctrl 键 换行</span>

92
DigitalHumanWeb/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/Footer/index.tsx
Unescape Escape View File

@ -1,23 +1,23 @@
// import { Icon } from '@lobehub/ui'; import { Icon } from '@lobehub/ui';
import { Button, Space } from 'antd'; import { Button, Skeleton, Space } from 'antd';
import { createStyles } from 'antd-style'; import { createStyles } from 'antd-style';
// import { ChevronUp, CornerDownLeft, LucideCommand } from 'lucide-react'; import { ChevronUp, CornerDownLeft, LucideCommand, Eraser } from 'lucide-react';
import { rgba } from 'polished'; import { rgba } from 'polished';
import { memo } from 'react'; import { memo, useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Flexbox } from 'react-layout-kit'; import { Center, Flexbox } from 'react-layout-kit';
import StopLoadingIcon from '@/components/StopLoading'; import StopLoadingIcon from '@/components/StopLoading';
// import SaveTopic from '@/features/ChatInput/Topic'; import SaveTopic from '@/features/ChatInput/Topic';
import { useSendMessage } from '@/features/ChatInput/useSend'; import { useSendMessage } from '@/features/ChatInput/useSend';
import { useChatStore } from '@/store/chat'; import { useChatStore } from '@/store/chat';
import { chatSelectors } from '@/store/chat/selectors'; import { chatSelectors } from '@/store/chat/selectors';
// import { useUserStore } from '@/store/user'; import { useUserStore } from '@/store/user';
// import { preferenceSelectors } from '@/store/user/selectors'; import { preferenceSelectors } from '@/store/user/selectors';
// import { isMacOS } from '@/utils/platform'; import { isMacOS } from '@/utils/platform';
// import LocalFiles from '../FilePreview'; import LocalFiles from '../FilePreview';
// import SendMore from './SendMore'; import SendMore from './SendMore';
import {HighlightOutlined, SendOutlined} from "@ant-design/icons"; import {HighlightOutlined, SendOutlined} from "@ant-design/icons";
const useStyles = createStyles(({ css, prefixCls, token }) => { const useStyles = createStyles(({ css, prefixCls, token }) => {
@ -27,6 +27,10 @@ const useStyles = createStyles(({ css, prefixCls, token }) => {
width: 28px; width: 28px;
} }
`, `,
btnDiv: css`
height: 50%;
width: 100px;
`,
btn: css` btn: css`
width: 96px; width: 96px;
height: 80%; height: 80%;
@ -35,10 +39,6 @@ const useStyles = createStyles(({ css, prefixCls, token }) => {
color: #2E62FF !important; color: #2E62FF !important;
font-size: 16px; font-size: 16px;
`, `,
btnDiv: css`
height: 50%;
width: 100px;
`,
btnSend: css` btnSend: css`
width: 96px; width: 96px;
height: 80%; height: 80%;
@ -77,47 +77,47 @@ interface FooterProps {
setExpand?: (expand: boolean) => void; setExpand?: (expand: boolean) => void;
} }
const Footer = memo<FooterProps>(({ clearClick, setExpand }) => { const Footer = memo<FooterProps>(({ setExpand, expand, clearClick }) => {
const { t } = useTranslation('chat'); const { t } = useTranslation('chat');
const { styles } = useStyles(); const { theme, styles } = useStyles();
const [isAIGenerating, stopGenerateMessage] = useChatStore((s) => [ const [isAIGenerating, stopGenerateMessage] = useChatStore((s) => [
chatSelectors.isAIGenerating(s), chatSelectors.isAIGenerating(s),
s.stopGenerateMessage, s.stopGenerateMessage,
]); ]);
// const [useCmdEnterToSend] = useUserStore((s) => [preferenceSelectors.useCmdEnterToSend(s)]); const [useCmdEnterToSend] = useUserStore((s) => [preferenceSelectors.useCmdEnterToSend(s)]);
const { send: sendMessage, canSend } = useSendMessage(); const { send: sendMessage, canSend } = useSendMessage();
// const [isMac, setIsMac] = useState<boolean>(); const [isMac, setIsMac] = useState<boolean>();
// useEffect(() => { useEffect(() => {
// setIsMac(isMacOS()); setIsMac(isMacOS());
// }, [setIsMac]); }, [setIsMac]);
// const cmdEnter = ( const cmdEnter = (
// <Flexbox gap={2} horizontal> <Flexbox gap={2} horizontal>
// {typeof isMac === 'boolean' ? ( {typeof isMac === 'boolean' ? (
// <Icon icon={isMac ? LucideCommand : ChevronUp} /> <Icon icon={isMac ? LucideCommand : ChevronUp} />
// ) : ( ) : (
// <Skeleton.Node active style={{ height: '100%', width: 12 }}> <Skeleton.Node active style={{ height: '100%', width: 12 }}>
// {' '} {' '}
// </Skeleton.Node> </Skeleton.Node>
// )} )}
// <Icon icon={CornerDownLeft} /> <Icon icon={CornerDownLeft} />
// </Flexbox> </Flexbox>
// ); );
// const enter = ( const enter = (
// <Center> <Center>
// <Icon icon={CornerDownLeft} /> <Icon icon={CornerDownLeft} />
// </Center> </Center>
// ); );
// const sendShortcut = useCmdEnterToSend ? cmdEnter : enter; const sendShortcut = useCmdEnterToSend ? cmdEnter : enter;
// const wrapperShortcut = useCmdEnterToSend ? enter : cmdEnter; const wrapperShortcut = useCmdEnterToSend ? enter : cmdEnter;
const handleClickClear = () => { const handleClickClear = () => {
clearClick() clearClick()
@ -127,12 +127,12 @@ const Footer = memo<FooterProps>(({ clearClick, setExpand }) => {
<Flexbox <Flexbox
align={'end'} align={'end'}
className={styles.overrideAntdIcon} className={styles.overrideAntdIcon}
style={{ display: 'inline-block', height: '100%', width: "140px" }}
distribution={'space-between'} distribution={'space-between'}
flex={'none'} flex={'none'}
gap={8} gap={8}
horizontal horizontal
padding={'0 24px'} padding={'0 24px'}
style={{ display: 'inline-block', height: '100%', width: "140px" }}
> >
{/*<Flexbox align={'center'} gap={8} horizontal style={{ overflow: 'hidden' }}>*/} {/*<Flexbox align={'center'} gap={8} horizontal style={{ overflow: 'hidden' }}>*/}
{/* {expand && <LocalFiles />}*/} {/* {expand && <LocalFiles />}*/}

5
DigitalHumanWeb/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/index.tsx
Unescape Escape View File

@ -8,6 +8,7 @@ import {
CHAT_TEXTAREA_HEIGHT, CHAT_TEXTAREA_HEIGHT,
CHAT_TEXTAREA_MAX_HEIGHT, CHAT_TEXTAREA_MAX_HEIGHT,
HEADER_HEIGHT, HEADER_HEIGHT,
CHAT_TEXTAREA_MIN_HEIGHT,
} from '@/const/layoutTokens'; } from '@/const/layoutTokens';
import { useGlobalStore } from '@/store/global'; import { useGlobalStore } from '@/store/global';
import { systemStatusSelectors } from '@/store/global/selectors'; import { systemStatusSelectors } from '@/store/global/selectors';
@ -58,9 +59,9 @@ const DesktopChatInput = memo(() => {
style={{ minHeight: CHAT_TEXTAREA_HEIGHT, position: 'relative' }} style={{ minHeight: CHAT_TEXTAREA_HEIGHT, position: 'relative' }}
> >
<Head expand={expand} setExpand={setExpand} /> <Head expand={expand} setExpand={setExpand} />
<div style={{ display: 'flex', height: '100%'}}> <div style={{ height: '100%', display: 'flex' }}>
<TextArea setExpand={setExpand} /> <TextArea setExpand={setExpand} />
<Footer clearClick={() => clearClick()} expand={expand} setExpand={setExpand} /> <Footer expand={expand} setExpand={setExpand} clearClick={() => clearClick()} />
</div> </div>
</Flexbox> </Flexbox>
</DraggablePanel> </DraggablePanel>

2
DigitalHumanWeb/src/app/(main)/chat/(workspace)/@topic/features/TopicListContent/index.tsx
Unescape Escape View File

@ -86,6 +86,7 @@ const TopicListContent = memo(() => {
)} )}
<Virtuoso <Virtuoso
// components={{ ScrollSeekPlaceholder: Placeholder }} // components={{ ScrollSeekPlaceholder: Placeholder }}
style={{ height: "150px" }}
computeItemKey={(_, item) => item.id} computeItemKey={(_, item) => item.id}
data={topics} data={topics}
fixedItemHeight={44} fixedItemHeight={44}
@ -93,7 +94,6 @@ const TopicListContent = memo(() => {
itemContent={itemContent} itemContent={itemContent}
overscan={44 * 10} overscan={44 * 10}
ref={virtuosoRef} ref={virtuosoRef}
style={{ height: "150px" }}
// scrollSeekConfiguration={{ // scrollSeekConfiguration={{
// enter: (velocity) => Math.abs(velocity) > 350, // enter: (velocity) => Math.abs(velocity) > 350,
// exit: (velocity) => Math.abs(velocity) < 10, // exit: (velocity) => Math.abs(velocity) < 10,

32
DigitalHumanWeb/src/app/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/HeaderAction.tsx
Unescape Escape View File

@ -1,35 +1,35 @@
'use client'; 'use client';
// import { ActionIcon } from '@lobehub/ui'; import { ActionIcon } from '@lobehub/ui';
// import { PanelRightClose, PanelRightOpen } from 'lucide-react'; import { PanelRightClose, PanelRightOpen } from 'lucide-react';
import { memo } from 'react'; import { memo } from 'react';
// import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
// import { DESKTOP_HEADER_ICON_SIZE } from '@/const/layoutTokens'; import { DESKTOP_HEADER_ICON_SIZE } from '@/const/layoutTokens';
// import { useGlobalStore } from '@/store/global'; import { useGlobalStore } from '@/store/global';
// import { systemStatusSelectors } from '@/store/global/selectors'; import { systemStatusSelectors } from '@/store/global/selectors';
// import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig'; import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
// import SettingButton from '../../../features/SettingButton'; import SettingButton from '../../../features/SettingButton';
// import ShareButton from '../../../features/ShareButton'; import ShareButton from '../../../features/ShareButton';
import {Button} from "antd"; import {Button} from "antd";
import { useOpenChatSettings } from '@/hooks/useInterceptingRoutes'; import { useOpenChatSettings } from '@/hooks/useInterceptingRoutes';
const HeaderAction = memo(() => { const HeaderAction = memo(() => {
// const { t } = useTranslation('chat'); const { t } = useTranslation('chat');
// const [showAgentSettings, toggleConfig] = useGlobalStore((s) => [ const [showAgentSettings, toggleConfig] = useGlobalStore((s) => [
// systemStatusSelectors.showChatSideBar(s), systemStatusSelectors.showChatSideBar(s),
// s.toggleChatSideBar, s.toggleChatSideBar,
// ]); ]);
// const { isAgentEditable } = useServerConfigStore(featureFlagsSelectors); const { isAgentEditable } = useServerConfigStore(featureFlagsSelectors);
const openChatSettings = useOpenChatSettings(); const openChatSettings = useOpenChatSettings();
return ( return (
<> <>
<Button onClick={() => openChatSettings()} shape="round" style={{ borderColor: '#2E62FF', color: "#2E62FF" }}>会话设置</Button> <Button onClick={() => openChatSettings()} style={{ borderColor: '#2E62FF', color: "#2E62FF" }} shape="round">会话设置</Button>
{/*<ShareButton />*/} {/*<ShareButton />*/}
{/*<ActionIcon*/} {/*<ActionIcon*/}
{/* icon={showAgentSettings ? PanelRightClose : PanelRightOpen}*/} {/* icon={showAgentSettings ? PanelRightClose : PanelRightOpen}*/}

22
DigitalHumanWeb/src/app/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/Main.tsx
Unescape Escape View File

@ -1,28 +1,28 @@
'use client'; 'use client';
import { Avatar } from '@lobehub/ui'; import { ActionIcon, Avatar, ChatHeaderTitle } from '@lobehub/ui';
import { Skeleton } from 'antd'; import { Skeleton } from 'antd';
// import { PanelLeftClose, PanelLeftOpen } from 'lucide-react'; import { PanelLeftClose, PanelLeftOpen } from 'lucide-react';
import { Suspense, memo } from 'react'; import { Suspense, memo } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Flexbox } from 'react-layout-kit'; import { Flexbox } from 'react-layout-kit';
// import { DESKTOP_HEADER_ICON_SIZE } from '@/const/layoutTokens'; import { DESKTOP_HEADER_ICON_SIZE } from '@/const/layoutTokens';
import { useOpenChatSettings } from '@/hooks/useInterceptingRoutes'; import { useOpenChatSettings } from '@/hooks/useInterceptingRoutes';
// import { useGlobalStore } from '@/store/global'; import { useGlobalStore } from '@/store/global';
// import { systemStatusSelectors } from '@/store/global/selectors'; import { systemStatusSelectors } from '@/store/global/selectors';
import { useSessionStore } from '@/store/session'; import { useSessionStore } from '@/store/session';
import { sessionMetaSelectors, sessionSelectors } from '@/store/session/selectors'; import { sessionMetaSelectors, sessionSelectors } from '@/store/session/selectors';
import { useInitAgentConfig } from '../../useInitAgentConfig'; import { useInitAgentConfig } from '../../useInitAgentConfig';
// import Tags from './Tags'; import Tags from './Tags';
const Main = memo(() => { const Main = memo(() => {
const { t } = useTranslation('chat'); const { t } = useTranslation('chat');
useInitAgentConfig(); useInitAgentConfig();
const [init, isInbox, title, avatar, backgroundColor] = useSessionStore((s) => [ const [init, isInbox, title, description, avatar, backgroundColor] = useSessionStore((s) => [
sessionSelectors.isSomeSessionActive(s), sessionSelectors.isSomeSessionActive(s),
sessionSelectors.isInboxSession(s), sessionSelectors.isInboxSession(s),
sessionMetaSelectors.currentAgentTitle(s), sessionMetaSelectors.currentAgentTitle(s),
@ -34,9 +34,9 @@ const Main = memo(() => {
const openChatSettings = useOpenChatSettings(); const openChatSettings = useOpenChatSettings();
const displayTitle = isInbox ? t('inbox.title') : title; const displayTitle = isInbox ? t('inbox.title') : title;
// const displayDesc = isInbox ? t('inbox.desc') : description; const displayDesc = isInbox ? t('inbox.desc') : description;
// const showSessionPanel = useGlobalStore(systemStatusSelectors.showSessionPanel); const showSessionPanel = useGlobalStore(systemStatusSelectors.showSessionPanel);
// const updateSystemStatus = useGlobalStore((s) => s.updateSystemStatus); const updateSystemStatus = useGlobalStore((s) => s.updateSystemStatus);
return !init ? ( return !init ? (
<Flexbox horizontal> <Flexbox horizontal>
@ -73,7 +73,7 @@ const Main = memo(() => {
<div> <div>
<div style={{ fontSize: "15px" }}>{displayTitle}</div> <div style={{ fontSize: "15px" }}>{displayTitle}</div>
{/*<ChatHeaderTitle desc={displayDesc} title={displayTitle} />*/} {/*<ChatHeaderTitle desc={displayDesc} title={displayTitle} />*/}
<div style={{ color: "#A7A0A0", fontSize: '12px' }}>{displayTitle}</div> <div style={{ fontSize: '12px', color: "#A7A0A0" }}>{displayTitle}</div>
</div> </div>
</Flexbox> </Flexbox>
); );

1
DigitalHumanWeb/src/app/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/Tags.tsx
Unescape Escape View File

@ -17,6 +17,7 @@ const TitleTags = memo(() => {
agentSelectors.currentAgentModel(s), agentSelectors.currentAgentModel(s),
agentSelectors.hasKnowledge(s), agentSelectors.hasKnowledge(s),
]); ]);
console.log(model, 20202020)
const plugins = useAgentStore(agentSelectors.currentAgentPlugins, isEqual); const plugins = useAgentStore(agentSelectors.currentAgentPlugins, isEqual);
const enabledKnowledge = useAgentStore(agentSelectors.currentEnabledKnowledge, isEqual); const enabledKnowledge = useAgentStore(agentSelectors.currentEnabledKnowledge, isEqual);

28
DigitalHumanWeb/src/app/(main)/chat/(workspace)/_layout/Desktop/TopicPanel.tsx
Unescape Escape View File

@ -3,16 +3,16 @@
import { DraggablePanel, DraggablePanelContainer } from '@lobehub/ui'; import { DraggablePanel, DraggablePanelContainer } from '@lobehub/ui';
import { createStyles, useResponsive } from 'antd-style'; import { createStyles, useResponsive } from 'antd-style';
import isEqual from 'fast-deep-equal'; import isEqual from 'fast-deep-equal';
import { memo, useEffect, useState } from 'react'; import { PropsWithChildren, memo, useEffect, useState } from 'react';
// import SafeSpacing from '@/components/SafeSpacing'; import SafeSpacing from '@/components/SafeSpacing';
import { CHAT_SIDEBAR_WIDTH } from '@/const/layoutTokens'; import { CHAT_SIDEBAR_WIDTH } from '@/const/layoutTokens';
import { useChatStore } from '@/store/chat'; import { useChatStore } from '@/store/chat';
import { chatPortalSelectors } from '@/store/chat/slices/portal/selectors'; import { chatPortalSelectors } from '@/store/chat/slices/portal/selectors';
import { useGlobalStore } from '@/store/global'; import { useGlobalStore } from '@/store/global';
import { systemStatusSelectors } from '@/store/global/selectors'; import { systemStatusSelectors } from '@/store/global/selectors';
import {Form, Image} from "antd"; import {Form, Image} from "antd";
import {EditFilled} from "@ant-design/icons"; import {EditFilled, EditTwoTone} from "@ant-design/icons";
import TopicListContent from "@/app/(main)/chat/(workspace)/@topic/features/TopicListContent"; import TopicListContent from "@/app/(main)/chat/(workspace)/@topic/features/TopicListContent";
import Header from "@/app/(main)/chat/(workspace)/@topic/features/Header"; import Header from "@/app/(main)/chat/(workspace)/@topic/features/Header";
@ -31,6 +31,11 @@ const useStyles = createStyles(({ css, token }) => ({
header: css` header: css`
border-block-end: 1px solid ${token.colorBorder}; border-block-end: 1px solid ${token.colorBorder};
`, `,
topTitle: css`
font-size: 18px;
display: inline-block;
width: calc(100% - 24px)
`,
topEdit: css` topEdit: css`
display: inline-block; display: inline-block;
text-align: center; text-align: center;
@ -39,14 +44,9 @@ const useStyles = createStyles(({ css, token }) => ({
background-color: #AFC1FF; background-color: #AFC1FF;
color: #fff; color: #fff;
`, `,
topTitle: css`
font-size: 18px;
display: inline-block;
width: calc(100% - 24px)
`,
})); }));
const TopicPanel = memo(() => { const TopicPanel = memo(({ children }: PropsWithChildren) => {
const { styles } = useStyles(); const { styles } = useStyles();
const [form] = Form.useForm() const [form] = Form.useForm()
const { md = true, lg = true } = useResponsive(); const { md = true, lg = true } = useResponsive();
@ -87,8 +87,8 @@ const TopicPanel = memo(() => {
style={{ style={{
flex: 'none', flex: 'none',
height: '100%', height: '100%',
border: "1px solid #ddd",
maxHeight: '100vh', maxHeight: '100vh',
border: "1px solid #ddd",
minWidth: CHAT_SIDEBAR_WIDTH, minWidth: CHAT_SIDEBAR_WIDTH,
}} }}
> >
@ -97,14 +97,14 @@ const TopicPanel = memo(() => {
<div className={styles.topEdit}><EditFilled /></div> <div className={styles.topEdit}><EditFilled /></div>
</div> </div>
<div><Image alt="头像" preview={false} src="/images/zsImage.png" /></div> <div><Image alt="头像" preview={false} src="/images/zsImage.png" /></div>
<Form colon={false} form={form} labelCol={{ span: 6 }} layout="horizontal" wrapperCol={{ span: 18 }}> <Form layout="horizontal" colon={false} form={form} labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}>
<Form.Item label="名称" name="name"> <Form.Item name="name" label="名称">
<span style={{ width: "18px" }}>Linda</span> <span style={{ width: "18px" }}>Linda</span>
</Form.Item> </Form.Item>
<Form.Item label="简介" name="jj"> <Form.Item name="jj" label="简介">
<span style={{ color: "#999999", fontSize: '13px' }}>这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介</span> <span style={{ color: "#999999", fontSize: '13px' }}>这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介这是一段简介</span>
</Form.Item> </Form.Item>
<Form.Item label="任务" name="rw"> <Form.Item name="rw" label="任务">
<span style={{ color: "#999999", fontSize: '13px' }}>这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务</span> <span style={{ color: "#999999", fontSize: '13px' }}>这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务这是一段任务</span>
</Form.Item> </Form.Item>
</Form> </Form>

7
DigitalHumanWeb/src/app/(main)/discover/(detail)/assistant/[slug]/features/Actions.tsx
Unescape Escape View File

@ -2,11 +2,12 @@
import { memo } from 'react'; import { memo } from 'react';
import { Flexbox, FlexboxProps } from 'react-layout-kit'; import { Flexbox, FlexboxProps } from 'react-layout-kit';
import urlJoin from 'url-join';
// import { OFFICIAL_URL } from '@/const/url'; import { OFFICIAL_URL } from '@/const/url';
import { DiscoverAssistantItem } from '@/types/discover'; import { DiscoverAssistantItem } from '@/types/discover';
// import ShareButton from '../../../features/ShareButton'; import ShareButton from '../../../features/ShareButton';
import AddAgent from './AddAgent'; import AddAgent from './AddAgent';
interface AssistantActionProps extends FlexboxProps { interface AssistantActionProps extends FlexboxProps {
@ -14,7 +15,7 @@ interface AssistantActionProps extends FlexboxProps {
identifier: string; identifier: string;
} }
const AssistantAction = memo<AssistantActionProps>(({ data }) => { const AssistantAction = memo<AssistantActionProps>(({ identifier, data }) => {
return ( return (
<Flexbox align={'center'} gap={8} horizontal style={{marginLeft: 100}}> <Flexbox align={'center'} gap={8} horizontal style={{marginLeft: 100}}>
<AddAgent data={data} /> <AddAgent data={data} />

22
DigitalHumanWeb/src/app/(main)/discover/(detail)/assistant/[slug]/features/AddAgent.tsx
Unescape Escape View File

@ -1,9 +1,9 @@
'use client'; 'use client';
import { ActionIcon } from '@lobehub/ui'; import { ActionIcon, Icon } from '@lobehub/ui';
import { App, Button } from 'antd'; import { App, Dropdown, Button } from 'antd';
import { createStyles } from 'antd-style'; import { createStyles } from 'antd-style';
import { PlusIcon } from 'lucide-react'; import { ChevronDownIcon, PlusIcon } from 'lucide-react';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { memo, useState } from 'react'; import { memo, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -40,13 +40,13 @@ const AddAgent = memo<{ data: DiscoverAssistantItem; mobile?: boolean }>(({ data
router.push(SESSION_CHAT_URL(session, mobile)); router.push(SESSION_CHAT_URL(session, mobile));
}; };
// const handleAddAgent = async () => { const handleAddAgent = async () => {
// if (!data) return; if (!data) return;
// setIsLoading(true); setIsLoading(true);
// createSession({ config: data.config, meta: data.meta }, false); createSession({ config: data.config, meta: data.meta }, false);
// message.success(t('assistants.addAgentSuccess')); message.success(t('assistants.addAgentSuccess'));
// setIsLoading(false); setIsLoading(false);
// }; };
if (mobile) if (mobile)
return ( return (
@ -60,7 +60,9 @@ const AddAgent = memo<{ data: DiscoverAssistantItem; mobile?: boolean }>(({ data
); );
return ( return (
<>
<Button className={styles.button} loading={isLoading} onClick={handleAddAgentAndConverse}>添加并会话</Button> <Button className={styles.button} loading={isLoading} onClick={handleAddAgentAndConverse}>添加并会话</Button>
</>
); );
}); });

27
DigitalHumanWeb/src/app/(main)/discover/(detail)/assistant/[slug]/features/Header.tsx
Unescape Escape View File

@ -1,16 +1,16 @@
'use client'; 'use client';
import { Avatar, Tag } from '@lobehub/ui'; import { Avatar, Icon, Tag } from '@lobehub/ui';
import { Button } from 'antd'; import { Button } from 'antd';
import { createStyles } from 'antd-style'; import { createStyles } from 'antd-style';
import { startCase } from 'lodash-es'; import { startCase } from 'lodash-es';
// import { ChevronRight } from 'lucide-react'; import { ChevronRight } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
// import qs from 'query-string'; import qs from 'query-string';
import { memo } from 'react'; import { memo } from 'react';
// import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Flexbox } from 'react-layout-kit'; import { Flexbox } from 'react-layout-kit';
// import urlJoin from 'url-join'; import urlJoin from 'url-join';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { DiscoverAssistantItem } from '@/types/discover'; import { DiscoverAssistantItem } from '@/types/discover';
import { useUserStore } from '@/store/user'; import { useUserStore } from '@/store/user';
@ -40,6 +40,11 @@ export const useStyles = createStyles(({ css, token }) => ({
border-color: rgba(187, 204, 253, 0.24); border-color: rgba(187, 204, 253, 0.24);
padding: 20px 50px; padding: 20px 50px;
`, `,
topBtn: css`
border-radius: 20px;
color: #2E62FF;
border: 1px solid #2E62FF;
`,
conTitle: css` conTitle: css`
width: 125px; width: 125px;
height: 40px; height: 40px;
@ -51,11 +56,6 @@ export const useStyles = createStyles(({ css, token }) => ({
opacity: 1; opacity: 1;
background: linear-gradient(270deg, #2D65FF 0%, rgba(0, 166, 255, 0.52) 99%); background: linear-gradient(270deg, #2D65FF 0%, rgba(0, 166, 255, 0.52) 99%);
`, `,
topBtn: css`
border-radius: 20px;
color: #2E62FF;
border: 1px solid #2E62FF;
`,
description: css` description: css`
padding: 0 45px; padding: 0 45px;
margin-top: 10px; margin-top: 10px;
@ -71,18 +71,19 @@ interface HeaderProps {
identifier: string; identifier: string;
mobile?: boolean; mobile?: boolean;
} }
const getUserId = (s) => s.user?.id
const Header = memo<HeaderProps>(({ identifier, data, mobile }) => { const Header = memo<HeaderProps>(({ identifier, data, mobile }) => {
const { styles, theme } = useStyles(); const { styles, theme } = useStyles();
const router = useRouter() const router = useRouter()
// const { t } = useTranslation('discover'); const { t } = useTranslation('discover');
const getUserId = (s: UserStore) => s.user?.id
const userId = getUserId(useUserStore.getState()) const userId = getUserId(useUserStore.getState())
const handleBack = () => { const handleBack = () => {
router.push('/discover/assistants?userid=' + userId) router.push('/discover/assistants?userid=' + userId)
} }
return ( return (
<Flexbox gap={12} width={'100%'}> <Flexbox gap={12} width={'100%'}>
<Flexbox align={'center'} className={styles.top} gap={8} horizontal justify={'space-between'} width={'100%'}> <Flexbox align={'center'} gap={8} horizontal justify={'space-between'} width={'100%'} className={styles.top}>
<Flexbox align={'center'} gap={16} horizontal justify={'flex-start'}> <Flexbox align={'center'} gap={16} horizontal justify={'flex-start'}>
<Avatar <Avatar
alt={identifier} alt={identifier}

10
DigitalHumanWeb/src/app/(main)/discover/(detail)/assistant/[slug]/features/Temp.tsx
Unescape Escape View File

@ -3,14 +3,14 @@
import { Markdown } from '@lobehub/ui'; import { Markdown } from '@lobehub/ui';
import { Skeleton } from 'antd'; import { Skeleton } from 'antd';
import { useTheme } from 'antd-style'; import { useTheme } from 'antd-style';
// import { BotMessageSquare } from 'lucide-react'; import { BotMessageSquare } from 'lucide-react';
import { memo } from 'react'; import { memo } from 'react';
// import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Flexbox, FlexboxProps } from 'react-layout-kit'; import { Flexbox, FlexboxProps } from 'react-layout-kit';
import { DiscoverAssistantItem } from '@/types/discover'; import { DiscoverAssistantItem } from '@/types/discover';
// import HighlightBlock from '../../../features/HighlightBlock'; import HighlightBlock from '../../../features/HighlightBlock';
interface ConversationExampleProps extends FlexboxProps { interface ConversationExampleProps extends FlexboxProps {
data: DiscoverAssistantItem; data: DiscoverAssistantItem;
@ -19,10 +19,11 @@ interface ConversationExampleProps extends FlexboxProps {
} }
const ConversationExample = memo<ConversationExampleProps>(({ data }) => { const ConversationExample = memo<ConversationExampleProps>(({ data }) => {
// const { t } = useTranslation('discover'); const { t } = useTranslation('discover');
const theme = useTheme(); const theme = useTheme();
console.log(data.config.systemRole,111111111) console.log(data.config.systemRole,111111111)
return ( return (
<>
<Flexbox paddingInline={16} style={{padding: '0 45'}}> <Flexbox paddingInline={16} style={{padding: '0 45'}}>
{data.config.systemRole ? ( {data.config.systemRole ? (
<Markdown fontSize={theme.fontSize}>{data.config.systemRole}</Markdown> <Markdown fontSize={theme.fontSize}>{data.config.systemRole}</Markdown>
@ -30,6 +31,7 @@ const ConversationExample = memo<ConversationExampleProps>(({ data }) => {
<Skeleton paragraph={{ rows: 4 }} title={false} /> <Skeleton paragraph={{ rows: 4 }} title={false} />
)} )}
</Flexbox> </Flexbox>
</>
); );
}); });

8
DigitalHumanWeb/src/app/(main)/discover/(detail)/assistant/[slug]/page.tsx
Unescape Escape View File

@ -67,10 +67,10 @@ const Page = async ({ params, searchParams }: Props) => {
console.log(data,'37373733737') console.log(data,'37373733737')
const { meta, createdAt, author, config } = data; const { meta, createdAt, author, config } = data;
// let pluginData: DiscoverPlugintem[] = []; let pluginData: DiscoverPlugintem[] = [];
// if (config?.plugins && config.plugins?.length > 0) { if (config?.plugins && config.plugins?.length > 0) {
// pluginData = await discoverService.getPluginByIds(locale, config.plugins); pluginData = await discoverService.getPluginByIds(locale, config.plugins);
// } }
const ld = ldModule.generate({ const ld = ldModule.generate({
article: { article: {

4
DigitalHumanWeb/src/app/(main)/discover/(detail)/features/DetailLayout.tsx
Unescape Escape View File

@ -6,7 +6,7 @@ import { Flexbox } from 'react-layout-kit';
import Footer from '@/features/Setting/Footer'; import Footer from '@/features/Setting/Footer';
// import SidebarContainer from './SidebarContainer'; import SidebarContainer from './SidebarContainer';
interface DetailLayoutProps { interface DetailLayoutProps {
actions?: ReactNode; actions?: ReactNode;
@ -36,6 +36,7 @@ const DetailLayout = memo<DetailLayoutProps>(
); );
return ( return (
<>
<div style={{ backgroundColor: '#fff'}}> <div style={{ backgroundColor: '#fff'}}>
{header} {header}
<Flexbox gap={32} horizontal width={'100%'}> <Flexbox gap={32} horizontal width={'100%'}>
@ -45,6 +46,7 @@ const DetailLayout = memo<DetailLayoutProps>(
</Flexbox> </Flexbox>
</Flexbox> </Flexbox>
</div> </div>
</>
); );
}, },
); );

Write Preview
Loading…
Cancel
Save