feat: plan index;flat i18n and add variable value type (#2762)

* feat: plan index * flat i18n and add variable value type * fix: ts * perf: free plan tip
2025-07-23 13:03:50 +00:00 · 2024-09-20 17:36:33 +08:00
parent 75af549c7f
commit 9eb02b7e38
25 changed files with 2830 additions and 3545 deletions
--- a/projects/app/src/components/core/app/VariableEdit.tsx
+++ b/projects/app/src/components/core/app/VariableEdit.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo, useState } from 'react';
+import React, { useCallback, useMemo, useState } from 'react';
 import {
  Box,
  Button,
@@ -41,6 +41,29 @@ import MyRadio from '@/components/common/MyRadio';
 import { formatEditorVariablePickerIcon } from '@fastgpt/global/core/workflow/utils';
 import ChatFunctionTip from './Tip';
 import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
+import { FlowValueTypeMap } from '@fastgpt/global/core/workflow/node/constant';
+import MySelect from '@fastgpt/web/components/common/MySelect';
+
+export const defaultVariable: VariableItemType = {
+  id: nanoid(),
+  key: 'key',
+  label: 'label',
+  type: VariableInputEnum.input,
+  required: true,
+  maxLen: 50,
+  enums: [{ value: '' }],
+  valueType: WorkflowIOValueTypeEnum.string
+};
+export const addVariable = () => {
+  const newVariable = { ...defaultVariable, key: '', id: '' };
+  return newVariable;
+};
+const valueTypeMap = {
+  [VariableInputEnum.input]: WorkflowIOValueTypeEnum.string,
+  [VariableInputEnum.select]: WorkflowIOValueTypeEnum.string,
+  [VariableInputEnum.textarea]: WorkflowIOValueTypeEnum.string,
+  [VariableInputEnum.custom]: WorkflowIOValueTypeEnum.any
+};

 const VariableEdit = ({
  variables = [],
@@ -65,6 +88,7 @@ const VariableEdit = ({

  const { isOpen: isOpenEdit, onOpen: onOpenEdit, onClose: onCloseEdit } = useDisclosure();
  const {
+    setValue,
    reset: resetEdit,
    register: registerEdit,
    getValues: getValuesEdit,
@@ -75,6 +99,7 @@ const VariableEdit = ({
  } = useForm<{ variable: VariableItemType }>();

  const variableType = watch('variable.type');
+  const valueType = watch('variable.valueType');

  const {
    fields: selectEnums,
@@ -96,8 +121,85 @@ const VariableEdit = ({
    });
  }, [variables]);

+  const valueTypeSelectList = useMemo(
+    () =>
+      Object.values(FlowValueTypeMap)
+        .map((item) => ({
+          label: t(item.label as any),
+          value: item.value
+        }))
+        .filter(
+          (item) =>
+            ![
+              WorkflowIOValueTypeEnum.arrayAny,
+              WorkflowIOValueTypeEnum.selectApp,
+              WorkflowIOValueTypeEnum.selectDataset,
+              WorkflowIOValueTypeEnum.dynamic
+            ].includes(item.value)
+        ),
+    [t]
+  );
+  const showValueTypeSelect = variableType === VariableInputEnum.custom;
+
+  const onSubmit = useCallback(
+    ({ variable }: { variable: VariableItemType }) => {
+      variable.key = variable.key.trim();
+
+      // check select
+      if (variable.type === VariableInputEnum.select) {
+        const enums = variable.enums.filter((item) => item.value);
+        if (enums.length === 0) {
+          toast({
+            status: 'warning',
+            title: t('common:core.module.variable.variable option is required')
+          });
+          return;
+        }
+      }
+
+      // check repeat key
+      const existingVariable = variables.find(
+        (item) => item.key === variable.key && item.id !== variable.id
+      );
+      if (existingVariable) {
+        toast({
+          status: 'warning',
+          title: t('common:core.module.variable.key already exists')
+        });
+        return;
+      }
+
+      // set valuetype based on variable.type
+      variable.valueType =
+        variable.type === VariableInputEnum.custom
+          ? variable.valueType
+          : valueTypeMap[variable.type];
+
+      // set default required value based on variableType
+      if (variable.type === VariableInputEnum.custom) {
+        variable.required = false;
+      }
+
+      const onChangeVariable = [...variables];
+      // update
+      if (variable.id) {
+        const index = variables.findIndex((item) => item.id === variable.id);
+        onChangeVariable[index] = variable;
+      } else {
+        onChangeVariable.push({
+          ...variable,
+          id: nanoid()
+        });
+      }
+      onChange(onChangeVariable);
+      onCloseEdit();
+    },
+    [onChange, onCloseEdit, t, toast, variables]
+  );
+
  return (
    <Box>
+      {/* Row box */}
      <Flex alignItems={'center'}>
        <MyIcon name={'core/app/simpleMode/variable'} w={'20px'} />
        <FormLabel ml={2}>{t('common:core.module.Variable')}</FormLabel>
@@ -117,6 +219,7 @@ const VariableEdit = ({
          {t('common:common.Add New')}
        </Button>
      </Flex>
+      {/* Form render */}
      {formatVariables.length > 0 && (
        <Box mt={2} borderRadius={'md'} overflow={'hidden'} borderWidth={'1px'} borderBottom="none">
          <TableContainer>
@@ -171,6 +274,7 @@ const VariableEdit = ({
          </TableContainer>
        </Box>
      )}
+      {/* Edit modal */}
      <MyModal
        iconSrc="core/app/simpleMode/variable"
        title={t('common:core.module.Variable Setting')}
@@ -201,6 +305,24 @@ const VariableEdit = ({
              })}
            />
          </Flex>
+          <Flex mt={5} alignItems={'center'}>
+            <FormLabel w={'80px'}>{t('workflow:value_type')}</FormLabel>
+            {showValueTypeSelect ? (
+              <Box flex={1}>
+                <MySelect<WorkflowIOValueTypeEnum>
+                  list={valueTypeSelectList.filter(
+                    (item) => item.value !== WorkflowIOValueTypeEnum.arrayAny
+                  )}
+                  value={valueType}
+                  onchange={(e) => {
+                    setValue('variable.valueType', e);
+                  }}
+                />
+              </Box>
+            ) : (
+              <Box fontSize={'14px'}>{valueTypeMap[variableType]}</Box>
+            )}
+          </Flex>

          <FormLabel mt={5} mb={2}>
            {t('common:core.workflow.Variable.Variable type')}
@@ -299,57 +421,7 @@ const VariableEdit = ({
          <Button variant={'whiteBase'} mr={3} onClick={onCloseEdit}>
            {t('common:common.Close')}
          </Button>
-          <Button
-            onClick={handleSubmitEdit(({ variable }) => {
-              variable.key = variable.key.trim();
-
-              // check select
-              if (variable.type === VariableInputEnum.select) {
-                const enums = variable.enums.filter((item) => item.value);
-                if (enums.length === 0) {
-                  toast({
-                    status: 'warning',
-                    title: t('common:core.module.variable.variable option is required')
-                  });
-                  return;
-                }
-              }
-
-              // check repeat key
-              const existingVariable = variables.find(
-                (item) => item.key === variable.key && item.id !== variable.id
-              );
-              if (existingVariable) {
-                toast({
-                  status: 'warning',
-                  title: t('common:core.module.variable.key already exists')
-                });
-                return;
-              }
-
-              // set valuetype based on variable.type
-              variable.valueType = valueTypeMap[variable.type];
-
-              // set default required value based on variableType
-              if (variable.type === VariableInputEnum.custom) {
-                variable.required = false;
-              }
-
-              const onChangeVariable = [...variables];
-              // update
-              if (variable.id) {
-                const index = variables.findIndex((item) => item.id === variable.id);
-                onChangeVariable[index] = variable;
-              } else {
-                onChangeVariable.push({
-                  ...variable,
-                  id: nanoid()
-                });
-              }
-              onChange(onChangeVariable);
-              onCloseEdit();
-            })}
-          >
+          <Button onClick={handleSubmitEdit(onSubmit)}>
            {getValuesEdit('variable.id')
              ? t('common:common.Confirm Update')
              : t('common:common.Add New')}
@@ -361,24 +433,3 @@ const VariableEdit = ({
 };

 export default React.memo(VariableEdit);
-
-export const defaultVariable: VariableItemType = {
-  id: nanoid(),
-  key: 'key',
-  label: 'label',
-  type: VariableInputEnum.input,
-  required: true,
-  maxLen: 50,
-  enums: [{ value: '' }],
-  valueType: WorkflowIOValueTypeEnum.string
-};
-export const addVariable = () => {
-  const newVariable = { ...defaultVariable, key: '', id: '' };
-  return newVariable;
-};
-const valueTypeMap = {
-  [VariableInputEnum.input]: WorkflowIOValueTypeEnum.string,
-  [VariableInputEnum.select]: WorkflowIOValueTypeEnum.string,
-  [VariableInputEnum.textarea]: WorkflowIOValueTypeEnum.string,
-  [VariableInputEnum.custom]: WorkflowIOValueTypeEnum.any
-};
--- a/projects/app/src/pages/account/components/Info/index.tsx
+++ b/projects/app/src/pages/account/components/Info/index.tsx
@@ -451,13 +451,12 @@ const PlanUsage = () => {
          </Button>
        </Flex>
        <Box px={[5, 7]} pb={[3, 6]}>
-          {isFreeTeam ? (
-            <>
-              <Box mt="2" color={'#485264'} fontSize="sm">
-                {t('common:info.free_plan')}
-              </Box>
-            </>
-          ) : (
+          {isFreeTeam && (
+            <Box mt="2" color={'#485264'} fontSize="sm">
+              {t('common:info.free_plan')}
+            </Box>
+          )}
+          {standardPlan.currentSubLevel !== StandardSubLevelEnum.free && (
            <Flex mt="2" color={'#485264'} fontSize="xs">
              <Box>{t('common:support.wallet.Plan expired time')}:</Box>
              <Box ml={2}>{formatTime2YMD(standardPlan?.expiredTime)}</Box>
--- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoop.tsx
+++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoop.tsx
@@ -10,7 +10,7 @@ import { Background, NodeProps } from 'reactflow';
 import NodeCard from '../render/NodeCard';
 import Container from '../../components/Container';
 import IOTitle from '../../components/IOTitle';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from 'next-i18next';
 import RenderInput from '../render/RenderInput';
 import { Box } from '@chakra-ui/react';
 import FormLabel from '@fastgpt/web/components/common/MyBox/FormLabel';
--- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoopEnd.tsx
+++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoopEnd.tsx
@@ -12,7 +12,7 @@ import {
 import { useContextSelector } from 'use-context-selector';
 import { WorkflowContext } from '../../../context';
 import { AppContext } from '../../../../context';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from 'next-i18next';
 import { getGlobalVariableNode } from '@/web/core/workflow/adapt';

 const typeMap = {
--- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoopStart.tsx
+++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/Loop/NodeLoopStart.tsx
@@ -1,5 +1,5 @@
 import { FlowNodeItemType } from '@fastgpt/global/core/workflow/type/node';
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from 'next-i18next';
 import { NodeProps } from 'reactflow';
 import NodeCard from '../render/NodeCard';
 import EmptyTip from '@fastgpt/web/components/common/EmptyTip';
--- a/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodePluginIO/InputEditModal.tsx
+++ b/projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodePluginIO/InputEditModal.tsx
@@ -409,7 +409,7 @@ const FieldEditModal = ({
            {/* value type */}
            <Flex alignItems={'center'}>
              <FormLabel flex={'0 0 100px'} fontWeight={'medium'}>
-                {t('common:core.module.Data Type')}
+                {t('workflow:value_type')}
              </FormLabel>
              {showValueTypeSelect ? (
                <Box flex={1}>
--- a/projects/app/src/pages/app/list/index.tsx
+++ b/projects/app/src/pages/app/list/index.tsx
@@ -43,7 +43,6 @@ import LightRowTabs from '@fastgpt/web/components/common/Tabs/LightRowTabs';
 import { useSystem } from '@fastgpt/web/hooks/useSystem';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import TemplateMarketModal from './components/TemplateMarketModal';
-import { useSystemStore } from '@/web/common/system/useSystemStore';

 const CreateModal = dynamic(() => import('./components/CreateModal'));
 const EditFolderModal = dynamic(
@@ -71,7 +70,6 @@ const MyApps = () => {
    setSearchKey
  } = useContextSelector(AppListContext, (v) => v);
  const { userInfo } = useUserStore();
-  const { setAppType } = useSystemStore();

  const [createAppType, setCreateAppType] = useState<CreateAppType>();
  const {
@@ -173,13 +171,12 @@ const MyApps = () => {
              fontSize={['sm', 'md']}
              flexShrink={0}
              onChange={(e) => {
-                setAppType(e);
-                // router.push({
-                //   query: {
-                //     ...router.query,
-                //     type: e
-                //   }
-                // });
+                router.push({
+                  query: {
+                    ...router.query,
+                    type: e
+                  }
+                });
              }}
            />
            <Box flex={1} />
--- a/projects/app/src/pages/dataset/detail/components/MetaDataCard.tsx
+++ b/projects/app/src/pages/dataset/detail/components/MetaDataCard.tsx
@@ -1,6 +1,5 @@
-import React, { useMemo, useState } from 'react';
-import { Box, Flex, Button, IconButton, Input, Textarea, HStack } from '@chakra-ui/react';
-import { DeleteIcon } from '@chakra-ui/icons';
+import React, { useMemo } from 'react';
+import { Box, Flex, Button } from '@chakra-ui/react';
 import { useTranslation } from 'next-i18next';
 import { useRequest2 } from '@fastgpt/web/hooks/useRequest';
 import { getDatasetCollectionById } from '@/web/core/dataset/api';
@@ -33,7 +32,7 @@ const MetaDataCard = ({ datasetId }: { datasetId: string }) => {
      manual: false
    }
  );
-  const metadataList = useMemo(() => {
+  const metadataList = useMemo<{ label?: string; value?: any }[]>(() => {
    if (!collection) return [];

    const webSelector =