App template market (#2337)

* feat: add app template market (#2012) * feat: add app template market * fix * fix * i18n * fix * perf: template market ux * perf: simple mode app ui * perf: tempalte modal ui * perf: tempalte market ui * perf: template position * feat: create app modal * regiter default app * perf: icon * change templates position (#2331) * change templates position * fix * perf: template market ux --------- Co-authored-by: heheer <[email protected]>
labring · Aug 12, 2024 · 2196930 · 2196930
1 parent 231afc4
commit 2196930
Show file tree

Hide file tree

Showing 58 changed files with 5,979 additions and 3,210 deletions.
diff --git a/packages/global/common/system/types/index.d.ts b/packages/global/common/system/types/index.d.ts
@@ -37,6 +37,7 @@ export type FastGPTFeConfigsType = {
   chatbotUrl?: string;
   openAPIDocUrl?: string;
   systemPluginCourseUrl?: string;
+  appTemplateCourse?: string;
 
   systemTitle?: string;
   systemDescription?: string;

diff --git a/packages/global/core/app/constants.ts b/packages/global/core/app/constants.ts
@@ -29,3 +29,12 @@ export const defaultAppSelectFileConfig: AppFileSelectConfigType = {
   canSelectImg: false,
   maxFiles: 10
 };
+
+export enum AppTemplateTypeEnum {
+  recommendation = 'recommendation',
+  writing = 'writing',
+  imageGeneration = 'image-generation',
+  webSearch = 'web-search',
+  roleplay = 'roleplay',
+  officeServices = 'office-services'
+}
diff --git a/packages/global/core/workflow/type/index.d.ts b/packages/global/core/workflow/type/index.d.ts
@@ -24,7 +24,7 @@ import { FlowNodeTemplateType, StoreNodeItemType } from './node';
 export type WorkflowTemplateBasicType = {
   nodes: StoreNodeItemType[];
   edges: StoreEdgeItemType[];
-  chatConfigs?: AppChatConfigType;
+  chatConfig?: AppChatConfigType;
 };
 export type WorkflowTemplateType = {
   id: string;
@@ -46,7 +46,18 @@ export type WorkflowTemplateType = {
 
 // template market
 export type TemplateMarketItemType = WorkflowTemplateType & {
-  tags?: { id: string; label: string }[];
+  tags: string[];
+  type: AppTypeEnum.simple | AppTypeEnum.workflow | AppTypeEnum.plugin;
+};
+// template market list
+export type TemplateMarketListItemType = {
+  id: string;
+  name: string;
+  intro?: string;
+  author?: string;
+  tags: string[];
+  type: AppTypeEnum.simple | AppTypeEnum.workflow | AppTypeEnum.plugin;
+  avatar: string;
 };
 
 // system plugin

diff --git a/packages/service/type.d.ts b/packages/service/type.d.ts
@@ -9,6 +9,7 @@ import {
 import { SubPlanType } from '@fastgpt/global/support/wallet/sub/type';
 import { WorkerNameEnum, WorkerPool } from './worker/utils';
 import { Worker } from 'worker_threads';
+import { TemplateMarketItemType } from '@fastgpt/global/core/workflow/type';
 
 declare global {
   var feConfigs: FastGPTFeConfigsType;
@@ -25,4 +26,5 @@ declare global {
   var systemLoadedGlobalConfig: boolean;
 
   var workerPoll: Record<WorkerNameEnum, WorkerPool>;
+  var appMarketTemplates: TemplateMarketItemType[];
 }
diff --git a/packages/web/components/common/Icon/constants.ts b/packages/web/components/common/Icon/constants.ts
@@ -61,6 +61,7 @@ export const iconPaths = {
   'common/text/t': () => import('./icons/common/text/t.svg'),
   'common/tickFill': () => import('./icons/common/tickFill.svg'),
   'common/trash': () => import('./icons/common/trash.svg'),
+  'common/upRightArrowLight': () => import('./icons/common/upRightArrowLight.svg'),
   'common/uploadFileFill': () => import('./icons/common/uploadFileFill.svg'),
   'common/viewLight': () => import('./icons/common/viewLight.svg'),
   'common/voiceLight': () => import('./icons/common/voiceLight.svg'),

diff --git a/packages/web/components/common/Icon/icons/common/searchLight.svg b/packages/web/components/common/Icon/icons/common/searchLight.svg
diff --git a/packages/web/components/common/Icon/icons/common/upRightArrowLight.svg b/packages/web/components/common/Icon/icons/common/upRightArrowLight.svg
diff --git a/packages/web/components/common/Input/SearchInput/index.tsx b/packages/web/components/common/Input/SearchInput/index.tsx
@@ -0,0 +1,14 @@
+import React from 'react';
+import { InputGroup, Input, InputProps, Flex } from '@chakra-ui/react';
+import MyIcon from '../../Icon';
+
+const SearchInput = (props: InputProps) => {
+  return (
+    <Flex alignItems={'center'} position={'relative'}>
+      <Input {...props} />
+      <MyIcon name={'common/searchLight'} w={'1rem'} position={'absolute'} left={2} zIndex={10} />
+    </Flex>
+  );
+};
+
+export default SearchInput;
diff --git a/packages/web/components/common/MyMenu/index.tsx b/packages/web/components/common/MyMenu/index.tsx
@@ -8,10 +8,10 @@ import {
   MenuButton,
   MenuItemProps
 } from '@chakra-ui/react';
-import MyIcon from '../Icon';
 import MyDivider from '../MyDivider';
 import type { IconNameType } from '../Icon/type';
 import { useSystem } from '../../../hooks/useSystem';
+import Avatar from '../Avatar';
 
 export type MenuItemType = 'primary' | 'danger';
 
@@ -172,7 +172,7 @@ const MyMenu = ({
                     _notLast={{ mb: 0.5 }}
                     {...typeMapStyle[child.type || 'primary']}
                   >
-                    {!!child.icon && <MyIcon name={child.icon as any} w={iconSize} mr={3} />}
+                    {!!child.icon && <Avatar src={child.icon as any} w={iconSize} mr={3} />}
                     <Box>
                       <Box color={child.description ? 'myGray.900' : 'inherit'} fontSize={'sm'}>
                         {child.label}

diff --git a/packages/web/components/common/MyModal/index.tsx b/packages/web/components/common/MyModal/index.tsx
@@ -9,7 +9,6 @@ import {
   Box,
   Image
 } from '@chakra-ui/react';
-import MyIcon from '../Icon';
 import MyBox from '../MyBox';
 import { useSystem } from '../../../hooks/useSystem';
 import Avatar from '../Avatar';

diff --git a/packages/web/components/common/Textarea/PromptEditor/Editor.tsx b/packages/web/components/common/Textarea/PromptEditor/Editor.tsx
@@ -35,7 +35,8 @@ export default function Editor({
   onBlur,
   value,
   placeholder = '',
-  isFlow
+  isFlow,
+  bg = 'white'
 }: {
   h?: number;
   maxLength?: number;
@@ -49,6 +50,7 @@ export default function Editor({
   value?: string;
   placeholder?: string;
   isFlow?: boolean;
+  bg?: string;
 }) {
   const [key, setKey] = useState(getNanoid(6));
   const [_, startSts] = useTransition();
@@ -95,6 +97,7 @@ export default function Editor({
       h={`${height}px`}
       cursor={'text'}
       color={'myGray.700'}
+      bg={focus ? 'white' : bg}
     >
       <LexicalComposer initialConfig={initialConfig} key={key}>
         <PlainTextPlugin

diff --git a/packages/web/components/common/Textarea/PromptEditor/index.module.scss b/packages/web/components/common/Textarea/PromptEditor/index.module.scss
@@ -5,7 +5,7 @@
   border: 1px solid rgb(232, 235, 240);
   border-radius: var(--chakra-radii-md);
   padding: 8px 12px;
-  background: #fff;
+  // background: #fff;
 
   font-size: var(--chakra-fontSizes-sm);
   overflow-y: auto;
@@ -18,7 +18,7 @@
   border: 1px solid var(--chakra-colors-myGray-200);
   border-radius: var(--chakra-radii-sm);
   padding: 6px 8px;
-  background: #fff;
+  // background: #fff;
   font-size: var(--chakra-fontSizes-sm);
   overflow-y: auto;
 }

diff --git a/packages/web/components/common/Textarea/PromptEditor/index.tsx b/packages/web/components/common/Textarea/PromptEditor/index.tsx
@@ -1,4 +1,4 @@
-import { Button, ModalBody, ModalFooter, useDisclosure } from '@chakra-ui/react';
+import { Box, Button, ModalBody, ModalFooter, useDisclosure } from '@chakra-ui/react';
 import React from 'react';
 import { editorStateToText } from './utils';
 import Editor from './Editor';
@@ -20,7 +20,8 @@ const PromptEditor = ({
   maxLength,
   placeholder,
   title,
-  isFlow
+  isFlow,
+  bg = 'white'
 }: {
   showOpenModal?: boolean;
   showResize?: boolean;
@@ -34,6 +35,7 @@ const PromptEditor = ({
   placeholder?: string;
   title?: string;
   isFlow?: boolean;
+  bg?: string;
 }) => {
   const { isOpen, onOpen, onClose } = useDisclosure();
   const { t } = useTranslation();
@@ -62,6 +64,7 @@ const PromptEditor = ({
         onBlur={onBlurInput}
         placeholder={placeholder}
         isFlow={isFlow}
+        bg={bg}
       />
       <MyModal isOpen={isOpen} onClose={onClose} iconSrc="modal/edit" title={title} w={'full'}>
         <ModalBody>

diff --git a/packages/web/i18n/en/app.json b/packages/web/i18n/en/app.json
@@ -18,6 +18,9 @@
   "confirm_delete_folder_tip": "Are you sure to delete this folder? All the following applications and corresponding chat records will be deleted, please confirm!",
   "copy_one_app": "Copy",
   "create_copy_success": "Create copy success",
+  "create_empty_app": "Create default app",
+  "create_empty_plugin": "Create default plugin",
+  "create_empty_workflow": "Create default workflow",
   "cron": {
     "every_day": "Executed every day",
     "every_month": "Executed monthly",
@@ -84,14 +87,30 @@
   "template": {
     "simple_robot": "Simple Robot"
   },
+  "templateMarket": {
+    "Search_template": "Search template",
+    "Template_market": "Template market",
+    "Use": "Use",
+    "no_intro": "No intro~",
+    "templateTags": {
+      "Image_generation": "Image generation",
+      "Office_services": "Office searvices",
+      "Roleplay": "Roleplay",
+      "Web_search": "Web search",
+      "Writing": "Writing"
+    }
+  },
+  "template_market": "Templates",
+  "template_market_description": "Explore more ways to play in the template market, configuration tutorials and usage guides will help you understand and get started with various applications.",
+  "template_market_empty_data": "No suitable template found",
   "time_zone": "Time zone",
   "tool_input_param_tip": "Configure related information before the plugin runs properly",
   "transition_to_workflow": "Transition to workflow",
   "transition_to_workflow_create_new_placeholder": "Create a new application instead of modifying the current one",
   "transition_to_workflow_create_new_tip": "After converting to workflow, it will not be able to convert back to simple mode, please confirm!",
   "type": {
     "All": "All",
-    "Create http plugin tip": "Create plug-ins in batches using OpenAPI schema, compatible with GPTs format.",
+    "Create http plugin tip": "Create plug-ins in batches using OpenAPI schema, compatible with GPTs format",
     "Create one plugin tip": "The input and output workflows can be customized",
     "Create plugin bot": "Create plugin bot",
     "Create simple bot": "Create simple bot",
@@ -101,6 +120,7 @@
     "Http plugin": "Http plugin",
     "Plugin": "Plugin",
     "Simple bot": "Simple bot",
+    "Template": "Create by template",
     "Workflow bot": "Workflow"
   },
   "upload_file_max_amount": "Max files",

diff --git a/packages/web/i18n/en/common.json b/packages/web/i18n/en/common.json
@@ -271,6 +271,7 @@
     }
   },
   "confirm_choice": "Confirm selection",
+  "contribute_app_template": "Contribution template",
   "core": {
     "Chat": "Chat",
     "Max Token": "Max token per data",
@@ -1431,5 +1432,6 @@
     },
     "type": "type"
   },
-  "verification": "verify"
+  "verification": "verify",
+  "xx_search_result": "{{key}} Search results"
 }
diff --git a/packages/web/i18n/zh/app.json b/packages/web/i18n/zh/app.json
@@ -18,6 +18,9 @@
   "confirm_delete_folder_tip": "确认删除该文件夹？将会删除它下面所有应用及对应的聊天记录，请确认！",
   "copy_one_app": "创建副本",
   "create_copy_success": "创建副本成功",
+  "create_empty_app": "创建空白应用",
+  "create_empty_plugin": "创建空白插件",
+  "create_empty_workflow": "创建空白工作流",
   "cron": {
     "every_day": "每天执行",
     "every_month": "每月执行",
@@ -84,23 +87,42 @@
   "template": {
     "simple_robot": "简易机器人"
   },
+  "templateMarket": {
+    "Search_template": "搜索模板",
+    "Template_market": "模板市场",
+    "Use": "使用",
+    "no_intro": "还没有介绍～",
+    "templateTags": {
+      "Image_generation": "图片生成",
+      "Office_services": "办公服务",
+      "Recommendation": "推荐",
+      "Roleplay": "角色扮演",
+      "Web_search": "联网搜索",
+      "Writing": "文本创作"
+    }
+  },
+  "template_market": "模板市场",
+  "template_market_description": "在模板市场探索更多玩法，配置教程与使用引导，带你理解并上手各种应用",
+  "template_market_empty_data": "找不到合适的模板",
   "time_zone": "时区",
   "tool_input_param_tip": "该插件正常运行需要配置相关信息",
   "transition_to_workflow": "转成工作流",
   "transition_to_workflow_create_new_placeholder": "创建一个新的应用，而不是修改当前应用",
   "transition_to_workflow_create_new_tip": "转化成工作流后，将无法转化回简易模式，请确认！",
   "type": {
     "All": "全部",
-    "Create http plugin tip": "通过 OpenAPI Schema 批量创建插件，兼容 GPTs 格式。",
+    "Create http plugin tip": "通过 OpenAPI Schema 批量创建插件，兼容 GPTs 格式",
     "Create one plugin tip": "可以自定义输入和输出的工作流，通常用于封装重复使用的工作流",
     "Create plugin bot": "创建插件",
     "Create simple bot": "创建简易应用",
     "Create simple bot tip": "通过填表单形式，创建简单的 AI 应用，适合新手",
+    "Create template tip": "在模板市场探索更多玩法，带你理解并上手各种应用",
     "Create workflow bot": "创建工作流",
     "Create workflow tip": "通过低代码的方式，构建逻辑复杂的多轮对话 AI 应用，推荐高级玩家使用",
     "Http plugin": "HTTP 插件",
     "Plugin": "插件",
     "Simple bot": "简易应用",
+    "Template": "通过模板创建",
     "Workflow bot": "工作流"
   },
   "upload_file_max_amount": "最大文件数量",

diff --git a/packages/web/i18n/zh/common.json b/packages/web/i18n/zh/common.json
@@ -273,6 +273,7 @@
     }
   },
   "confirm_choice": "确认选择",
+  "contribute_app_template": "贡献模板",
   "core": {
     "Chat": "对话",
     "Max Token": "单条数据上限",
@@ -359,6 +360,14 @@
       "logs": {
         "Source And Time": "来源 & 时间"
       },
+      "more": "查看更多",
+      "navbar": {
+        "External": "外部使用",
+        "Flow mode": "高级编排",
+        "Publish": "发布",
+        "Publish app": "发布应用",
+        "Simple mode": "简易配置"
+      },
       "no_app": "还没有应用，快去创建一个吧！",
       "not_published": "未发布",
       "outLink": {
@@ -598,7 +607,8 @@
             "success": "开始同步"
           }
         },
-        "training": {}
+        "training": {
+        }
       },
       "data": {
         "Auxiliary Data": "辅助数据",
@@ -1437,5 +1447,6 @@
     },
     "type": "类型"
   },
-  "verification": "验证"
+  "verification": "验证",
+  "xx_search_result": "{{key}} 的搜索结果"
 }
diff --git a/projects/app/data/pluginTemplates/customFeedback.json b/projects/app/data/pluginTemplates/customFeedback.json
@@ -1,5 +1,5 @@
 {
-  "author": "FastGPT Team",
+  "author": "FastGPT",
   "version": "481",
   "templateType": "other",
   "name": "自定义反馈",

diff --git a/projects/app/data/pluginTemplates/getCurrentTime.json b/projects/app/data/pluginTemplates/getCurrentTime.json
@@ -1,5 +1,5 @@
 {
-  "author": "FastGPT Team",
+  "author": "FastGPT",
   "version": "481",
   "templateType": "tools",
   "name": "获取当前时间",

diff --git a/projects/app/data/pluginTemplates/textEditor.json b/projects/app/data/pluginTemplates/textEditor.json
@@ -1,5 +1,5 @@
 {
-  "author": "FastGPT Team",
+  "author": "FastGPT",
   "version": "481",
   "name": "文本加工",
   "avatar": "/imgs/workflow/textEditor.svg",

diff --git a/projects/app/data/pluginTemplates/v1/customFeedback.json b/projects/app/data/pluginTemplates/v1/customFeedback.json
@@ -1,5 +1,5 @@
 {
-  "author": "FastGPT Team",
+  "author": "FastGPT",
   "templateType": "other",
   "name": "自定义反馈",
   "avatar": "/imgs/module/customFeedback.svg",