v4.5 (#403)

projects/app/src/components/ChatBox/utils.ts

@@ -1,6 +1,5 @@
 import { SystemInputEnum } from '@/constants/app';
 import { FlowModuleTypeEnum } from '@/constants/flow';
-import { getChatModel } from '@/service/utils/data';
 import { AppModuleItemType, VariableItemType } from '@/types/app';
 
 export const getGuideModule = (modules: AppModuleItemType[]) =>
@@ -23,11 +22,3 @@ export const splitGuideModule = (guideModules?: AppModuleItemType) => {
     questionGuide
   };
 };
-export const getChatModelNameList = (modules: AppModuleItemType[]): string[] => {
-  const chatModules = modules.filter((item) => item.flowType === FlowModuleTypeEnum.chatNode);
-  return chatModules
-    .map(
-      (item) => getChatModel(item.inputs.find((input) => input.key === 'model')?.value)?.name || ''
-    )
-    .filter((item) => item);
-};

projects/app/src/components/Markdown/index.tsx

@@ -62,7 +62,9 @@ const Markdown = ({ source, isChatting = false }: { source: string; isChatting?:
     []
   );
 
-  const formatSource = source.replace(/\\n/g, '\n ');
+  const formatSource = source
+    .replace(/\\n/g, '\n ')
+    .replace(/(http[s]?:\/\/[^\s，。]+)([。，])/g, '$1 $2');
 
   return (
     <ReactMarkdown

projects/app/src/components/MyModal/index.tsx

@@ -35,8 +35,6 @@ const MyModal = ({
     >
       <ModalOverlay />
       <ModalContent
-        display={'flex'}
-        flexDirection={'column'}
         w={w}
         minW={['90vw', '400px']}
         maxW={maxW}
@@ -46,7 +44,7 @@ const MyModal = ({
       >
         {!!title && <ModalHeader>{title}</ModalHeader>}
         {onClose && <ModalCloseButton />}
-        <Box overflow={'overlay'} h={'100%'}>
+        <Box overflow={'overlay'} h={'100%'} display={'flex'} flexDirection={'column'}>
           {children}
         </Box>
       </ModalContent>

projects/app/src/components/PromptTemplate/index.tsx

@@ -0,0 +1,64 @@
+import React, { useState } from 'react';
+import MyModal from '../MyModal';
+import { Box, Button, Grid, useTheme } from '@chakra-ui/react';
+import { PromptTemplateItem } from '@fastgpt/core/ai/type';
+import { ModalBody, ModalFooter } from '@chakra-ui/react';
+
+const PromptTemplate = ({
+  title,
+  templates,
+  onClose,
+  onSuccess
+}: {
+  title: string;
+  templates: PromptTemplateItem[];
+  onClose: () => void;
+  onSuccess: (e: string) => void;
+}) => {
+  const theme = useTheme();
+  const [selectTemplateTitle, setSelectTemplateTitle] = useState<PromptTemplateItem>();
+
+  return (
+    <MyModal isOpen title={title} onClose={onClose}>
+      <ModalBody w={'600px'}>
+        <Grid gridTemplateColumns={['1fr', '1fr 1fr']} gridGap={4}>
+          {templates.map((item) => (
+            <Box
+              key={item.title}
+              border={theme.borders.base}
+              py={2}
+              px={2}
+              borderRadius={'md'}
+              cursor={'pointer'}
+              {...(item.title === selectTemplateTitle?.title
+                ? {
+                    bg: 'myBlue.100'
+                  }
+                : {})}
+              onClick={() => setSelectTemplateTitle(item)}
+            >
+              <Box>{item.title}</Box>
+              <Box color={'myGray.600'} fontSize={'sm'} whiteSpace={'pre-wrap'}>
+                {item.value}
+              </Box>
+            </Box>
+          ))}
+        </Grid>
+      </ModalBody>
+      <ModalFooter>
+        <Button
+          disabled={!selectTemplateTitle}
+          onClick={() => {
+            if (!selectTemplateTitle) return;
+            onSuccess(selectTemplateTitle.value);
+            onClose();
+          }}
+        >
+          确认选择
+        </Button>
+      </ModalFooter>
+    </MyModal>
+  );
+};
+
+export default PromptTemplate;