feat: support dialogue count in chatflow (#7440)

web/app/components/workflow/nodes/_base/components/option-card.tsx

@@ -3,7 +3,9 @@ import type { FC } from 'react'
 import React, { useCallback } from 'react'
 import type { VariantProps } from 'class-variance-authority'
 import { cva } from 'class-variance-authority'
+import { RiQuestionLine } from '@remixicon/react'
 import cn from '@/utils/classnames'
+import TooltipPlus from '@/app/components/base/tooltip-plus'
 
 const variants = cva([], {
   variants: {
@@ -26,6 +28,7 @@ type Props = {
   selected: boolean
   disabled?: boolean
   align?: 'left' | 'center' | 'right'
+  tooltip?: string
 } & VariantProps<typeof variants>
 
 const OptionCard: FC<Props> = ({
@@ -35,6 +38,7 @@ const OptionCard: FC<Props> = ({
   selected,
   disabled,
   align = 'center',
+  tooltip,
 }) => {
   const handleSelect = useCallback(() => {
     if (selected || disabled)
@@ -54,7 +58,14 @@ const OptionCard: FC<Props> = ({
       )}
       onClick={handleSelect}
     >
-      {title}
+      <span>{title}</span>
+      {tooltip && <TooltipPlus
+        popupContent={<div className='w-[240px]'>
+          {tooltip}
+        </div>}
+      >
+        <RiQuestionLine className='ml-0.5 w-[14px] h-[14px] text-text-quaternary' />
+      </TooltipPlus>}
     </div>
   )
 }

web/app/components/workflow/nodes/_base/components/variable/utils.ts

@@ -99,6 +99,10 @@ const formatItem = (
           variable: 'sys.query',
           type: VarType.string,
         })
+        res.vars.push({
+          variable: 'sys.dialogue_count',
+          type: VarType.number,
+        })
         res.vars.push({
           variable: 'sys.conversation_id',
           type: VarType.string,

web/app/components/workflow/nodes/assigner/panel.tsx

@@ -49,7 +49,6 @@ const Panel: FC<NodePanelProps<AssignerNodeType>> = ({
         </Field>
         <Field
           title={t(`${i18nPrefix}.writeMode`)}
-          tooltip={t(`${i18nPrefix}.writeModeTip`)!}
         >
           <div className={cn('grid gap-2 grid-cols-3')}>
             {writeModeTypes.map(type => (
@@ -59,6 +58,7 @@ const Panel: FC<NodePanelProps<AssignerNodeType>> = ({
                 onSelect={handleWriteModeChange(type)}
                 selected={inputs.write_mode === type}
                 disabled={!isSupportAppend && type === WriteMode.Append}
+                tooltip={type === WriteMode.Append ? t(`${i18nPrefix}.writeModeTip`)! : undefined}
               />
             ))}
           </div>

web/app/components/workflow/nodes/start/panel.tsx

@@ -84,17 +84,30 @@ const Panel: FC<NodePanelProps<StartNodeType>> = ({
               />
               {
                 isChatMode && (
-                  <VarItem
-                    readonly
-                    payload={{
-                      variable: 'sys.conversation_id',
-                    } as any}
-                    rightContent={
-                      <div className='text-xs font-normal text-gray-500'>
-                        String
-                      </div>
-                    }
-                  />
+                  <>
+                    <VarItem
+                      readonly
+                      payload={{
+                        variable: 'sys.dialogue_count',
+                      } as any}
+                      rightContent={
+                        <div className='text-xs font-normal text-gray-500'>
+                          Number
+                        </div>
+                      }
+                    />
+                    <VarItem
+                      readonly
+                      payload={{
+                        variable: 'sys.conversation_id',
+                      } as any}
+                      rightContent={
+                        <div className='text-xs font-normal text-gray-500'>
+                          String
+                        </div>
+                      }
+                    />
+                  </>
                 )
               }
               <VarItem

web/package.json

@@ -143,7 +143,8 @@
   },
   "resolutions": {
     "@types/react": "~18.2.0",
-    "@types/react-dom": "~18.2.0"
+    "@types/react-dom": "~18.2.0",
+    "string-width": "4.2.3"
   },
   "lint-staged": {
     "**/*.js?(x)": [

web/yarn.lock

@@ -3669,11 +3669,6 @@ domutils@^3.0.1:
     domelementtype "^2.3.0"
     domhandler "^5.0.3"
 
-eastasianwidth@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz"
-  integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==
-
 echarts-for-react@^3.0.2:
   version "3.0.2"
   resolved "https://registry.npmjs.org/echarts-for-react/-/echarts-for-react-3.0.2.tgz"
@@ -8376,7 +8371,7 @@ string-length@^4.0.1:
     char-regex "^1.0.2"
     strip-ansi "^6.0.0"
 
-"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3:
+"string-width-cjs@npm:string-width@^4.2.0":
   version "4.2.3"
   resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -8385,14 +8380,14 @@ string-length@^4.0.1:
     is-fullwidth-code-point "^3.0.0"
     strip-ansi "^6.0.1"
 
-string-width@^5.0.0, string-width@^5.0.1, string-width@^5.1.2:
-  version "5.1.2"
-  resolved "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz"
-  integrity sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==
+string-width@4.2.3, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3, string-width@^5.0.0, string-width@^5.0.1, string-width@^5.1.2:
+  version "4.2.3"
+  resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
+  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
   dependencies:
-    eastasianwidth "^0.2.0"
-    emoji-regex "^9.2.2"
-    strip-ansi "^7.0.1"
+    emoji-regex "^8.0.0"
+    is-fullwidth-code-point "^3.0.0"
+    strip-ansi "^6.0.1"
 
 string.prototype.matchall@^4.0.8:
   version "4.0.10"
@@ -8444,7 +8439,14 @@ stringify-entities@^4.0.0:
     character-entities-html4 "^2.0.0"
     character-entities-legacy "^3.0.0"
 
-"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
+"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
+  version "6.0.1"
+  resolved "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz"
+  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
+  dependencies:
+    ansi-regex "^5.0.1"
+
+strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   version "6.0.1"
   resolved "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz"
   integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -9218,7 +9220,7 @@ word-wrap@^1.2.3:
   resolved "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz"
   integrity sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==
 
-"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
+"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
   version "7.0.0"
   resolved "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz"
   integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@@ -9236,6 +9238,15 @@ wrap-ansi@^6.2.0:
     string-width "^4.1.0"
     strip-ansi "^6.0.0"
 
+wrap-ansi@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz"
+  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
+  dependencies:
+    ansi-styles "^4.0.0"
+    string-width "^4.1.0"
+    strip-ansi "^6.0.0"
+
 wrap-ansi@^8.1.0:
   version "8.1.0"
   resolved "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz"