Global variables support external variable; Extract module support default value (#921)

packages/global/core/module/constants.ts

@@ -116,17 +116,29 @@ export enum ModuleOutputKeyEnum {
 export enum VariableInputEnum {
   input = 'input',
   textarea = 'textarea',
-  select = 'select'
+  select = 'select',
+  external = 'external'
 }
 export const variableMap = {
   [VariableInputEnum.input]: {
-    icon: 'core/app/variable/input'
+    icon: 'core/app/variable/input',
+    title: 'core.module.variable.input type',
+    desc: ''
   },
   [VariableInputEnum.textarea]: {
-    icon: 'core/app/variable/textarea'
+    icon: 'core/app/variable/textarea',
+    title: 'core.module.variable.textarea type',
+    desc: '允许用户最多输入4000字的对话框。'
   },
   [VariableInputEnum.select]: {
-    icon: 'core/app/variable/select'
+    icon: 'core/app/variable/select',
+    title: 'core.module.variable.select type',
+    desc: ''
+  },
+  [VariableInputEnum.external]: {
+    icon: 'core/app/variable/external',
+    title: 'core.module.variable.External type',
+    desc: '可以通过API接口或分享链接的Query传递变量。增加该类型变量的主要目的是用于变量提示。使用例子: 你可以通过分享链接Query中拼接Token，来实现内部系统身份鉴权。'
   }
 };
 

packages/global/core/module/template/system/contextExtract.ts

@@ -57,7 +57,7 @@ export const ContextExtractModule: FlowModuleTemplateType = {
     {
       key: ModuleInputKeyEnum.extractKeys,
       type: FlowNodeInputTypeEnum.custom,
-      label: '目标字段',
+      label: '',
       valueType: ModuleIOValueTypeEnum.any,
       description: "由 '描述' 和 'key' 组成一个目标字段，可提取多个目标字段",
       value: [], // {desc: string; key: string; required: boolean; enum: string[]}[]
@@ -76,6 +76,7 @@ export const ContextExtractModule: FlowModuleTemplateType = {
     {
       key: ModuleOutputKeyEnum.failed,
       label: '提取字段缺失',
+      description: '存在一个或多个字段未提取成功。尽管使用了默认值也算缺失。',
       valueType: ModuleIOValueTypeEnum.boolean,
       type: FlowNodeOutputTypeEnum.source,
       targets: []

packages/global/core/module/type.d.ts

@@ -80,6 +80,7 @@ export type ContextExtractAgentItemType = {
   desc: string;
   key: string;
   required: boolean;
+  defaultValue?: string;
   enum?: string;
 };
 

packages/service/common/vectorStore/pg/index.ts

@@ -1,3 +1,5 @@
+import { delay } from '@fastgpt/global/common/system/utils';
+import { addLog } from '../../system/log';
 import { Pool } from 'pg';
 import type { QueryResultRow } from 'pg';
 
@@ -15,10 +17,13 @@ export const connectPg = async (): Promise<Pool> => {
     connectionTimeoutMillis: 20000
   });
 
-  global.pgClient.on('error', (err) => {
+  global.pgClient.on('error', async (err) => {
     console.log(err);
     global.pgClient?.end();
     global.pgClient = null;
+
+    await delay(1000);
+    addLog.info(`Retry connect pg`);
     connectPg();
   });
 
@@ -27,7 +32,12 @@ export const connectPg = async (): Promise<Pool> => {
     console.log('pg connected');
     return global.pgClient;
   } catch (error) {
+    global.pgClient?.end();
     global.pgClient = null;
+
+    await delay(1000);
+    addLog.info(`Retry connect pg`);
+
     return connectPg();
   }
 };

packages/web/components/common/Icon/constants.ts

@@ -69,6 +69,7 @@ export const iconPaths = {
   'core/app/simpleMode/tts': () => import('./icons/core/app/simpleMode/tts.svg'),
   'core/app/simpleMode/variable': () => import('./icons/core/app/simpleMode/variable.svg'),
   'core/app/ttsFill': () => import('./icons/core/app/ttsFill.svg'),
+  'core/app/variable/external': () => import('./icons/core/app/variable/external.svg'),
   'core/app/variable/input': () => import('./icons/core/app/variable/input.svg'),
   'core/app/variable/select': () => import('./icons/core/app/variable/select.svg'),
   'core/app/variable/textarea': () => import('./icons/core/app/variable/textarea.svg'),

packages/web/components/common/Icon/icons/core/app/variable/external.svg

@@ -0,0 +1,6 @@
+<svg t="1709524607561" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5121"
+    width="128" height="128">
+    <path
+        d="M310.4 454.4v-118.4h435.2c44.8 0 86.4 25.6 105.6 64 16-22.4 22.4-48 22.4-73.6 0-73.6-57.6-131.2-131.2-131.2H310.4V76.8c0-16-19.2-28.8-35.2-19.2L9.6 246.4c-12.8 9.6-12.8 25.6 0 35.2l268.8 188.8c12.8 12.8 32 3.2 32-16zM1014.4 742.4l-268.8-188.8c-12.8-9.6-35.2 0-35.2 19.2v118.4H278.4c-44.8 0-86.4-25.6-105.6-64-16 22.4-22.4 48-22.4 73.6 0 73.6 57.6 131.2 131.2 131.2h432v118.4c0 16 19.2 28.8 35.2 19.2l268.8-188.8c9.6-12.8 9.6-32-3.2-38.4z"
+        p-id="5122"></path>
+</svg>

packages/web/components/common/Textarea/PromptEditor/index.tsx

@@ -2,7 +2,7 @@ import { Button, ModalBody, ModalFooter, useDisclosure } from '@chakra-ui/react'
 import React, { useEffect } from 'react';
 import { editorStateToText } from './utils';
 import Editor from './Editor';
-import MyModal from '../../MyModal';
+import MyModal from '../../CustomModal';
 import { useTranslation } from 'next-i18next';
 import { $getRoot, EditorState, type LexicalEditor } from 'lexical';
 import { EditorVariablePickerType } from './type.d';

packages/web/styles/theme.ts

@@ -0,0 +1,532 @@
+import { extendTheme, defineStyleConfig, ComponentStyleConfig } from '@chakra-ui/react';
+import {
+  modalAnatomy,
+  switchAnatomy,
+  selectAnatomy,
+  numberInputAnatomy,
+  checkboxAnatomy
+} from '@chakra-ui/anatomy';
+import { createMultiStyleConfigHelpers, defineStyle } from '@chakra-ui/styled-system';
+
+const { definePartsStyle, defineMultiStyleConfig } = createMultiStyleConfigHelpers(
+  modalAnatomy.keys
+);
+const { definePartsStyle: switchPart, defineMultiStyleConfig: switchMultiStyle } =
+  createMultiStyleConfigHelpers(switchAnatomy.keys);
+const { definePartsStyle: selectPart, defineMultiStyleConfig: selectMultiStyle } =
+  createMultiStyleConfigHelpers(selectAnatomy.keys);
+const { definePartsStyle: numInputPart, defineMultiStyleConfig: numInputMultiStyle } =
+  createMultiStyleConfigHelpers(numberInputAnatomy.keys);
+const { definePartsStyle: checkBoxPart, defineMultiStyleConfig: checkBoxMultiStyle } =
+  createMultiStyleConfigHelpers(checkboxAnatomy.keys);
+
+// 按键
+const Button = defineStyleConfig({
+  baseStyle: {
+    _active: {
+      transform: 'scale(0.98)'
+    }
+  },
+  sizes: {
+    xs: {
+      fontSize: 'xs',
+      px: '8px',
+      py: '0',
+      h: '24px',
+      fontWeight: 'normal',
+      borderRadius: '8px'
+    },
+    xsSquare: {
+      fontSize: 'xs',
+      px: '0',
+      py: '0',
+      h: '24px',
+      w: '24px',
+      fontWeight: 'normal',
+      borderRadius: '4px'
+    },
+    sm: {
+      fontSize: 'sm',
+      px: '14px',
+      py: 0,
+      fontWeight: 'normal',
+      h: '30px',
+      borderRadius: '8px'
+    },
+    smSquare: {
+      fontSize: 'sm',
+      px: '0',
+      py: 0,
+      fontWeight: 'normal',
+      h: '30px',
+      w: '30px',
+      borderRadius: '8px'
+    },
+    md: {
+      fontSize: 'md',
+      px: '20px',
+      py: 0,
+      h: '36px',
+      fontWeight: 'normal',
+      borderRadius: '8px'
+    },
+    mdSquare: {
+      fontSize: 'md',
+      px: '0',
+      py: 0,
+      h: '36px',
+      w: '36px',
+      fontWeight: 'normal',
+      borderRadius: '6px'
+    },
+    lg: {
+      fontSize: 'md',
+      px: '20px',
+      py: 0,
+      h: '40px',
+      fontWeight: 'normal',
+      borderRadius: '8px'
+    },
+    lgSquare: {
+      fontSize: 'md',
+      px: '0',
+      py: 0,
+      h: '40px',
+      w: '40px',
+      fontWeight: 'normal',
+      borderRadius: '6px'
+    }
+  },
+  variants: {
+    primary: {
+      bg: 'primary.600',
+      color: 'white',
+      border: 'none',
+      boxShadow: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 1px 2px 0px rgba(19, 51, 107, 0.05)',
+      _hover: {
+        filter: 'brightness(120%)'
+      },
+      _disabled: {
+        bg: 'primary.7 !important'
+      }
+    },
+    primaryOutline: {
+      color: 'primary.600',
+      border: '1px solid',
+      borderColor: 'primary.300',
+      bg: 'white',
+      transition: 'background 0.1s',
+      boxShadow: '1',
+      _hover: {
+        bg: 'primary.1'
+      },
+      _active: {
+        color: 'primary.600'
+      },
+      _disabled: {
+        bg: 'white !important'
+      }
+    },
+    primaryGhost: {
+      color: 'primary.600',
+      border: '1px solid',
+      borderColor: 'primary.300',
+      bg: 'primary.50',
+      transition: 'background 0.1s',
+      boxShadow: '1',
+      _hover: {
+        bg: 'primary.600',
+        color: 'white',
+        borderColor: 'primary.600'
+      },
+      _disabled: {
+        color: 'primary.600 !important',
+        bg: 'primary.50 !important',
+        borderColor: 'primary.300 !important'
+      }
+    },
+    whiteBase: {
+      color: 'myGray.600',
+      border: '1px solid',
+      borderColor: 'myGray.250',
+      bg: 'white',
+      transition: 'background 0.1s',
+      boxShadow: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 1px 2px 0px rgba(19, 51, 107, 0.05)',
+      _hover: {
+        color: 'primary.600'
+      },
+      _active: {
+        color: 'primary.600'
+      },
+      _disabled: {
+        color: 'myGray.600 !important'
+      }
+    },
+    whitePrimary: {
+      color: 'myGray.600',
+      border: '1px solid',
+      borderColor: 'myGray.250',
+      bg: 'white',
+      transition: 'background 0.1s',
+      boxShadow: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 1px 2px 0px rgba(19, 51, 107, 0.05)',
+      _hover: {
+        color: 'primary.600',
+        background: 'primary.1',
+        borderColor: 'primary.300'
+      },
+      _active: {
+        color: 'primary.600'
+      },
+      _disabled: {
+        color: 'myGray.600 !important'
+      }
+    },
+    whiteDanger: {
+      color: 'myGray.600',
+      border: '1px solid',
+      borderColor: 'myGray.250',
+      bg: 'white',
+      transition: 'background 0.1s',
+      boxShadow: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 1px 2px 0px rgba(19, 51, 107, 0.05)',
+      _hover: {
+        color: 'red.600',
+        background: 'red.1',
+        borderColor: 'red.300'
+      },
+      _active: {
+        color: 'red.600'
+      }
+    },
+    grayBase: {
+      bg: 'myGray.150',
+      color: 'myGray.900',
+      _hover: {
+        color: 'primary.600',
+        bg: 'primary.50'
+      },
+      _disabled: {
+        bg: 'myGray.50'
+      }
+    }
+  },
+  defaultProps: {
+    size: 'md',
+    variant: 'primary'
+  }
+});
+
+const Input: ComponentStyleConfig = {
+  baseStyle: {
+    fontsize: '1rem'
+  },
+  sizes: {
+    sm: defineStyle({
+      field: {
+        h: '32px',
+        borderRadius: 'md'
+      }
+    }),
+    md: defineStyle({
+      field: {
+        h: '40px',
+        borderRadius: 'md'
+      }
+    })
+  },
+  variants: {
+    outline: {
+      field: {
+        border: '1px solid',
+        borderColor: 'borderColor.low',
+        _focus: {
+          borderColor: 'primary.500',
+          boxShadow: '0px 0px 0px 2.4px rgba(51, 112, 255, 0.15)',
+          bg: 'white'
+        },
+        _disabled: {
+          color: 'myGray.400',
+          bg: 'myWhite.300'
+        }
+      }
+    }
+  },
+  defaultProps: {
+    size: 'md',
+    variant: 'outline'
+  }
+};
+
+const NumberInput = numInputMultiStyle({
+  sizes: {
+    sm: defineStyle({
+      field: {
+        h: '32px',
+        borderRadius: 'md'
+      }
+    }),
+    md: defineStyle({
+      field: {
+        h: '40px',
+        borderRadius: 'md'
+      }
+    })
+  },
+  variants: {
+    outline: numInputPart({
+      field: {
+        bg: 'myGray.50',
+        border: '1px solid',
+        borderColor: 'myGray.200',
+        _focus: {
+          borderColor: 'primary.500 !important',
+          boxShadow: '0px 0px 0px 2.4px rgba(51, 112, 255, 0.15) !important',
+          bg: 'transparent'
+        },
+        _disabled: {
+          color: 'myGray.400 !important',
+          bg: 'myWhite.300 !important'
+        }
+      },
+      stepper: {
+        bg: 'transparent',
+        border: 'none',
+        color: 'myGray.600',
+        _active: {
+          color: 'primary.500'
+        }
+      }
+    })
+  },
+  defaultProps: {
+    variant: 'outline'
+  }
+});
+
+const Textarea: ComponentStyleConfig = {
+  variants: {
+    outline: {
+      border: '1px solid',
+      borderRadius: 'md',
+      borderColor: 'myGray.200',
+      _hover: {
+        borderColor: ''
+      },
+      _focus: {
+        borderColor: 'primary.500',
+        boxShadow: '0px 0px 0px 2.4px rgba(51, 112, 255, 0.15)',
+        bg: 'white'
+      }
+    }
+  },
+
+  defaultProps: {
+    size: 'md',
+    variant: 'outline'
+  }
+};
+
+const Switch = switchMultiStyle({
+  baseStyle: switchPart({
+    track: {
+      bg: 'myGray.100',
+      borderWidth: '1px',
+      borderColor: 'borders.base',
+      _checked: {
+        bg: 'primary.600'
+      }
+    }
+  }),
+  defaultProps: {
+    size: 'md'
+  }
+});
+
+const Select = selectMultiStyle({
+  variants: {
+    outline: selectPart({
+      field: {
+        borderColor: 'myGray.200',
+        _focusWithin: {
+          boxShadow: '0px 0px 0px 2.4px rgba(51, 112, 255, 0.15)',
+          borderColor: 'primary.500'
+        }
+      }
+    })
+  }
+});
+
+const Checkbox = checkBoxMultiStyle({
+  baseStyle: checkBoxPart({
+    label: {
+      fontFamily: 'mono' // change the font family of the label
+    }
+  })
+});
+
+// 全局主题
+export const theme = extendTheme({
+  styles: {
+    global: {
+      'html, body': {
+        fontSize: '14px',
+        color: 'myGray.900',
+        fontWeight: 400,
+        height: '100%',
+        overflow: 'hidden'
+      },
+      a: {
+        color: 'primary.600'
+      }
+    }
+  },
+  colors: {
+    myWhite: {
+      100: '#FEFEFE',
+      200: '#FDFDFE',
+      300: '#FBFBFC',
+      400: '#F8FAFB',
+      500: '#F6F8F9',
+      600: '#F4F6F8',
+      700: '#C3C5C6',
+      800: '#929495',
+      900: '#626263',
+      1000: '#313132'
+    },
+    myGray: {
+      '05': 'rgba(17, 24, 36, 0.05)',
+      1: 'rgba(17, 24, 36, 0.1)',
+      15: 'rgba(17, 24, 36, 0.15)',
+
+      25: '#FBFBFC',
+      50: '#F7F8FA',
+      100: '#F4F4F7',
+      150: '#F0F1F6',
+      200: '#E8EBF0',
+      250: '#DFE2EA',
+      300: '#C4CBD7',
+      400: '#8A95A7',
+      500: '#667085',
+      600: '#485264',
+      700: '#383F50',
+      800: '#1D2532',
+      900: '#111824'
+    },
+    primary: {
+      1: 'rgba(51, 112, 255, 0.1)',
+      '015': 'rgba(51, 112, 255, 0.15)',
+      3: 'rgba(51, 112, 255, 0.3)',
+      5: 'rgba(51, 112, 255, 0.5)',
+      7: 'rgba(51, 112, 255, 0.7)',
+      9: 'rgba(51, 112, 255, 0.9)',
+
+      50: '#F0F4FF',
+      100: '#E1EAFF',
+      200: '#C5D7FF',
+      300: '#94B5FF',
+      400: '#5E8FFF',
+      500: '#487FFF',
+      600: '#3370FF',
+      700: '#2B5FD9',
+      800: '#2450B5',
+      900: '#1D4091'
+    },
+    red: {
+      1: 'rgba(217,45,32,0.1)',
+      3: 'rgba(217,45,32,0.3)',
+      5: 'rgba(217,45,32,0.5)',
+
+      25: '#FFFBFA',
+      50: '#FEF3F2',
+      100: '#FEE4E2',
+      200: '#FECDCA',
+      300: '#FDA29B',
+      400: '#F97066',
+      500: '#F04438',
+      600: '#D92D20',
+      700: '#B42318',
+      800: '#912018',
+      900: '#7A271A'
+    },
+    green: {
+      25: '#F9FEFB',
+      50: '#EDFBF3',
+      100: '#D1FADF',
+      200: '#B9F4D1',
+      300: '#76E4AA',
+      400: '#32D583',
+      500: '#12B76A',
+      600: '#039855',
+      700: '#027A48',
+      800: '#05603A',
+      900: '#054F31'
+    },
+    borderColor: {
+      low: '#E8EBF0',
+      base: '#DFE2EA',
+      high: '#C4CBD7',
+      highest: '#8A95A7'
+    }
+  },
+  fonts: {
+    body: 'PingFang,Noto Sans,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"'
+  },
+  fontSizes: {
+    xs: '0.8rem',
+    sm: '0.93rem',
+    md: '1rem',
+    lg: '1.15rem',
+    xl: '1.3rem',
+    '2xl': '1.45rem',
+    '3xl': '1.6rem',
+    '4xl': '1.75rem',
+    '5xl': '1.9rem',
+    '6xl': '2.05rem'
+  },
+  borders: {
+    sm: '1px solid #E8EBF0',
+    base: '1px solid #DFE2EA',
+    md: '1px solid #DAE0E2',
+    lg: '1px solid #D0E0E2'
+  },
+  radii: {
+    xs: '4px',
+    sm: '6px',
+    md: '8px',
+    lg: '12px',
+    xl: '16px'
+  },
+  shadows: {
+    1: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 1px 2px 0px rgba(19, 51, 107, 0.05)',
+    1.5: '0px 0px 1px 0px rgba(19, 51, 107, 0.15), 0px 1px 2px 0px rgba(19, 51, 107, 0.10)',
+    2: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 4px 4px 0px rgba(19, 51, 107, 0.05)',
+    3: '0px 0px 1px 0px rgba(19, 51, 107, 0.08), 0px 4px 10px 0px rgba(19, 51, 107, 0.08)',
+    3.5: '0px 0px 1px 0px rgba(19, 51, 107, 0.10), 0px 4px 10px 0px rgba(19, 51, 107, 0.10)',
+    4: '0px 0px 1px 0px rgba(19, 51, 107, 0.20), 0px 12px 16px -4px rgba(19, 51, 107, 0.20)',
+    5: '0px 0px 1px 0px rgba(19, 51, 107, 0.15), 0px 20px 24px -8px rgba(19, 51, 107, 0.15)',
+    6: '0px 0px 1px 0px rgba(19, 51, 107, 0.20), 0px 24px 48px -12px rgba(19, 51, 107, 0.20)',
+    7: '0px 0px 1px 0px rgba(19, 51, 107, 0.20), 0px 32px 64px -12px rgba(19, 51, 107, 0.20)',
+    focus: '0px 0px 0px 2.4px rgba(51, 112, 255, 0.15)'
+  },
+  breakpoints: {
+    sm: '900px',
+    md: '1200px',
+    lg: '1500px',
+    xl: '1800px',
+    '2xl': '2100px'
+  },
+  lgColor: {
+    activeBlueGradient: 'linear-gradient(to bottom right, #d6e8ff 0%, #f0f7ff 100%)',
+    hoverBlueGradient: 'linear-gradient(to top left, #d6e8ff 0%, #f0f7ff 100%)',
+    primary: 'linear-gradient(to bottom right, #2152d9 0%,#3370ff 40%, #4e83fd 100%)',
+    primary2: 'linear-gradient(to bottom right, #2152d9 0%,#3370ff 30%,#4e83fd 80%, #85b1ff 100%)'
+  },
+  components: {
+    Button,
+    Input,
+    Textarea,
+    Switch,
+    Select,
+    NumberInput,
+    Checkbox
+  }
+});