4.8.8 test fix (#2143)
* perf: transcriptions api * perf: variable picker tip * perf: variable picker tip * perf: chat select app * feat: router to app detail * perf: variable avoid space * perf: variable picker * perf: doc2x icon and params * perf: sandbox support countToken * feat: sandbox support delay and countToken
This commit is contained in:
Archer
@@ -27,50 +27,45 @@ const ChatHeader = ({
|
||||
chatData,
|
||||
history,
|
||||
showHistory,
|
||||
onRoute2AppDetail,
|
||||
apps
|
||||
apps,
|
||||
onRouteToAppDetail
|
||||
}: {
|
||||
history: ChatItemType[];
|
||||
showHistory?: boolean;
|
||||
onRoute2AppDetail?: () => void;
|
||||
apps?: AppListItemType[];
|
||||
chatData: InitChatResponse;
|
||||
apps?: AppListItemType[];
|
||||
onRouteToAppDetail?: () => void;
|
||||
}) => {
|
||||
const isPlugin = chatData.app.type === AppTypeEnum.plugin;
|
||||
const { isPc } = useSystem();
|
||||
return (
|
||||
<>
|
||||
{isPc && isPlugin ? null : (
|
||||
<Flex
|
||||
alignItems={'center'}
|
||||
px={[3, 5]}
|
||||
minH={['46px', '60px']}
|
||||
borderBottom={'sm'}
|
||||
color={'myGray.900'}
|
||||
fontSize={'sm'}
|
||||
>
|
||||
{isPc ? (
|
||||
<PcHeader
|
||||
title={chatData.title}
|
||||
chatModels={chatData.app.chatModels}
|
||||
history={history}
|
||||
/>
|
||||
) : (
|
||||
<MobileHeader
|
||||
apps={apps}
|
||||
appId={chatData.appId}
|
||||
go2AppDetail={onRoute2AppDetail}
|
||||
name={chatData.app.name}
|
||||
avatar={chatData.app.avatar}
|
||||
showHistory={showHistory}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* control */}
|
||||
{!isPlugin && <ToolMenu history={history} />}
|
||||
</Flex>
|
||||
return isPc && isPlugin ? null : (
|
||||
<Flex
|
||||
alignItems={'center'}
|
||||
px={[3, 5]}
|
||||
minH={['46px', '60px']}
|
||||
borderBottom={'sm'}
|
||||
color={'myGray.900'}
|
||||
fontSize={'sm'}
|
||||
>
|
||||
{isPc ? (
|
||||
<>
|
||||
<PcHeader title={chatData.title} chatModels={chatData.app.chatModels} history={history} />
|
||||
<Box flex={1} />
|
||||
</>
|
||||
) : (
|
||||
<MobileHeader
|
||||
apps={apps}
|
||||
appId={chatData.appId}
|
||||
name={chatData.app.name}
|
||||
avatar={chatData.app.avatar}
|
||||
showHistory={showHistory}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
|
||||
{/* control */}
|
||||
{!isPlugin && <ToolMenu history={history} onRouteToAppDetail={onRouteToAppDetail} />}
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -88,7 +83,6 @@ const MobileDrawer = ({
|
||||
app = 'app'
|
||||
}
|
||||
const { t } = useTranslation();
|
||||
const { isPc } = useSystem();
|
||||
const router = useRouter();
|
||||
const isTeamChat = router.pathname === '/chat/team';
|
||||
const [currentTab, setCurrentTab] = useState<TabEnum>(TabEnum.recently);
|
||||
@@ -103,129 +97,120 @@ const MobileDrawer = ({
|
||||
);
|
||||
}, []);
|
||||
const { onChangeAppId } = useContextSelector(ChatContext, (v) => v);
|
||||
const onclickApp = (id: string) => {
|
||||
onChangeAppId(id);
|
||||
onCloseDrawer();
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box
|
||||
position={'absolute'}
|
||||
top={'45px'}
|
||||
w={'100vw'}
|
||||
h={'calc(100% - 45px)'}
|
||||
background={'rgba(0, 0, 0, 0.2)'}
|
||||
left={0}
|
||||
zIndex={5}
|
||||
onClick={() => {
|
||||
onCloseDrawer();
|
||||
}}
|
||||
>
|
||||
{/* menu */}
|
||||
<Box
|
||||
position={'absolute'}
|
||||
top={'45px'}
|
||||
w={'100vw'}
|
||||
h={'calc(100% - 45px)'}
|
||||
background={'rgba(0, 0, 0, 0.2)'}
|
||||
left={0}
|
||||
zIndex={5}
|
||||
onClick={() => {
|
||||
onCloseDrawer();
|
||||
}}
|
||||
px={[2, 5]}
|
||||
padding={2}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
background={'white'}
|
||||
position={'relative'}
|
||||
>
|
||||
{/* menu */}
|
||||
<Box
|
||||
w={'100vw'}
|
||||
px={[2, 5]}
|
||||
padding={2}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
background={'white'}
|
||||
position={'relative'}
|
||||
>
|
||||
{!isPc && appId && (
|
||||
<LightRowTabs<TabEnum>
|
||||
flex={'1 0 0'}
|
||||
width={isTeamChat ? '30%' : '60%'}
|
||||
mr={10}
|
||||
inlineStyles={{
|
||||
px: 1
|
||||
}}
|
||||
list={[
|
||||
...(isTeamChat
|
||||
? [{ label: t('common:all_apps'), value: TabEnum.recently }]
|
||||
: [
|
||||
{ label: t('common:core.chat.Recent use'), value: TabEnum.recently },
|
||||
{ label: t('common:all_apps'), value: TabEnum.app }
|
||||
])
|
||||
]}
|
||||
value={currentTab}
|
||||
onChange={setCurrentTab}
|
||||
/>
|
||||
)}
|
||||
</Box>
|
||||
<Box
|
||||
width={'100vw'}
|
||||
height={'auto'}
|
||||
minH={'10vh'}
|
||||
maxH={'60vh'}
|
||||
overflow={'auto'}
|
||||
background={'white'}
|
||||
zIndex={3}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
borderRadius={'0 0 10px 10px'}
|
||||
position={'relative'}
|
||||
padding={3}
|
||||
pt={0}
|
||||
pb={4}
|
||||
>
|
||||
{/* history */}
|
||||
{currentTab === TabEnum.recently && (
|
||||
<>
|
||||
{Array.isArray(apps) &&
|
||||
apps.map((item) => (
|
||||
<Flex justify={'center'} key={item._id}>
|
||||
<Flex
|
||||
py={2.5}
|
||||
px={2}
|
||||
width={'100%'}
|
||||
borderRadius={'md'}
|
||||
alignItems={'center'}
|
||||
{...(item._id === appId
|
||||
? {
|
||||
backgroundColor: 'primary.50 !important',
|
||||
color: 'primary.600'
|
||||
}
|
||||
: {
|
||||
onClick: () => onChangeAppId(item._id)
|
||||
})}
|
||||
>
|
||||
<Avatar src={item.avatar} w={'24px'} />
|
||||
<Box ml={2} className={'textEllipsis'}>
|
||||
{item.name}
|
||||
</Box>
|
||||
</Flex>
|
||||
</Flex>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
{currentTab === TabEnum.app && !isPc && (
|
||||
<>
|
||||
<SelectOneResource
|
||||
value={appId}
|
||||
onSelect={(id) => {
|
||||
if (!id) return;
|
||||
onChangeAppId(id);
|
||||
}}
|
||||
server={getAppList}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</Box>
|
||||
<LightRowTabs<TabEnum>
|
||||
gap={3}
|
||||
inlineStyles={{
|
||||
px: 2
|
||||
}}
|
||||
list={[
|
||||
...(isTeamChat
|
||||
? [{ label: t('common:all_apps'), value: TabEnum.recently }]
|
||||
: [
|
||||
{ label: t('common:core.chat.Recent use'), value: TabEnum.recently },
|
||||
{ label: t('common:all_apps'), value: TabEnum.app }
|
||||
])
|
||||
]}
|
||||
value={currentTab}
|
||||
onChange={setCurrentTab}
|
||||
/>
|
||||
</Box>
|
||||
</>
|
||||
<Box
|
||||
width={'100%'}
|
||||
minH={'10vh'}
|
||||
background={'white'}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
borderRadius={'0 0 10px 10px'}
|
||||
position={'relative'}
|
||||
py={3}
|
||||
pt={0}
|
||||
pb={4}
|
||||
h={'65vh'}
|
||||
>
|
||||
{/* history */}
|
||||
{currentTab === TabEnum.recently && (
|
||||
<Box px={3} overflow={'auto'} h={'100%'}>
|
||||
{Array.isArray(apps) &&
|
||||
apps.map((item) => (
|
||||
<Flex justify={'center'} key={item._id}>
|
||||
<Flex
|
||||
py={2.5}
|
||||
px={2}
|
||||
width={'100%'}
|
||||
borderRadius={'md'}
|
||||
alignItems={'center'}
|
||||
{...(item._id === appId
|
||||
? {
|
||||
backgroundColor: 'primary.50 !important',
|
||||
color: 'primary.600'
|
||||
}
|
||||
: {
|
||||
onClick: () => onclickApp(item._id)
|
||||
})}
|
||||
>
|
||||
<Avatar src={item.avatar} w={'24px'} />
|
||||
<Box ml={2} className={'textEllipsis'}>
|
||||
{item.name}
|
||||
</Box>
|
||||
</Flex>
|
||||
</Flex>
|
||||
))}
|
||||
</Box>
|
||||
)}
|
||||
{currentTab === TabEnum.app && (
|
||||
<SelectOneResource
|
||||
value={appId}
|
||||
onSelect={(id) => {
|
||||
if (!id) return;
|
||||
onclickApp(id);
|
||||
}}
|
||||
server={getAppList}
|
||||
/>
|
||||
)}
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
const MobileHeader = ({
|
||||
showHistory,
|
||||
go2AppDetail,
|
||||
name,
|
||||
avatar,
|
||||
appId,
|
||||
apps
|
||||
}: {
|
||||
showHistory?: boolean;
|
||||
go2AppDetail?: () => void;
|
||||
avatar: string;
|
||||
name: string;
|
||||
apps?: AppListItemType[];
|
||||
appId: string;
|
||||
}) => {
|
||||
const { isPc } = useSystem();
|
||||
const router = useRouter();
|
||||
const onOpenSlider = useContextSelector(ChatContext, (v) => v.onOpenSlider);
|
||||
const { isOpen: isOpenDrawer, onToggle: toggleDrawer, onClose: onCloseDrawer } = useDisclosure();
|
||||
@@ -237,22 +222,21 @@ const MobileHeader = ({
|
||||
<MyIcon name={'menu'} w={'20px'} h={'20px'} color={'myGray.900'} onClick={onOpenSlider} />
|
||||
)}
|
||||
<Flex px={3} alignItems={'center'} flex={'1 0 0'} w={0} justifyContent={'center'}>
|
||||
<Avatar src={avatar} w={'16px'} />
|
||||
<Box ml={1} className="textEllipsis" onClick={go2AppDetail}>
|
||||
{name}
|
||||
</Box>
|
||||
{isShareChat ? null : (
|
||||
<MyIcon
|
||||
_active={{ transform: 'scale(0.9)' }}
|
||||
name={'core/chat/chevronSelector'}
|
||||
w={'20px'}
|
||||
h={'20px'}
|
||||
color={isOpenDrawer ? 'primary.600' : 'myGray.900'}
|
||||
onClick={toggleDrawer}
|
||||
/>
|
||||
)}
|
||||
<Flex alignItems={'center'} onClick={toggleDrawer}>
|
||||
<Avatar src={avatar} w={'1rem'} />
|
||||
<Box ml={1} className="textEllipsis">
|
||||
{name}
|
||||
</Box>
|
||||
{isShareChat ? null : (
|
||||
<MyIcon
|
||||
name={'core/chat/chevronSelector'}
|
||||
w={'1.25rem'}
|
||||
color={isOpenDrawer ? 'primary.600' : 'myGray.900'}
|
||||
/>
|
||||
)}
|
||||
</Flex>
|
||||
</Flex>
|
||||
{!isPc && isOpenDrawer && !isShareChat && (
|
||||
{isOpenDrawer && !isShareChat && (
|
||||
<MobileDrawer apps={apps} appId={appId} onCloseDrawer={onCloseDrawer} />
|
||||
)}
|
||||
</>
|
||||
@@ -292,7 +276,6 @@ const PcHeader = ({
|
||||
</MyTag>
|
||||
</MyTooltip>
|
||||
)}
|
||||
<Box flex={1} />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user