Sultan
/
Flowise
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bugfix/Generator Prompt Markdown Format (#4592) 

* add ui fixes

* refactor: update image structure in CustomAssistantLayout to use object format
This commit is contained in:
Henry Heng 2025-06-06 18:07:43 +01:00 committed by GitHub
parent 8793ed628c
commit 2cd8db0c53
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
15 changed files with 234 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/ui/package.json
View File

@ -68,6 +68,7 @@
"rehype-raw": "^7.0.0", "rehype-raw": "^7.0.0",
"remark-gfm": "^3.0.1", "remark-gfm": "^3.0.1",
"remark-math": "^5.1.1", "remark-math": "^5.1.1",
"showdown": "^2.1.0",
"tippy.js": "^6.3.7", "tippy.js": "^6.3.7",
"uuid": "^9.0.1", "uuid": "^9.0.1",
"yup": "^0.32.9" "yup": "^0.32.9"

22
packages/ui/src/ui-component/dialog/AgentflowGeneratorDialog.jsx
View File

@ -15,7 +15,7 @@ import { Dropdown } from '@/ui-component/dropdown/Dropdown'
import { useTheme } from '@mui/material/styles' import { useTheme } from '@mui/material/styles'
import assistantsApi from '@/api/assistants' import assistantsApi from '@/api/assistants'
import { baseURL } from '@/store/constant' import { baseURL } from '@/store/constant'
import { initNode } from '@/utils/genericHelper' import { initNode, showHideInputParams } from '@/utils/genericHelper'
import DocStoreInputHandler from '@/views/docstore/DocStoreInputHandler' import DocStoreInputHandler from '@/views/docstore/DocStoreInputHandler'
import useApi from '@/hooks/useApi' import useApi from '@/hooks/useApi'
@ -55,6 +55,15 @@ const AgentflowGeneratorDialog = ({ show, dialogProps, onCancel, onConfirm }) =>
const enqueueSnackbar = (...args) => dispatch(enqueueSnackbarAction(...args)) const enqueueSnackbar = (...args) => dispatch(enqueueSnackbarAction(...args))
const closeSnackbar = (...args) => dispatch(closeSnackbarAction(...args)) const closeSnackbar = (...args) => dispatch(closeSnackbarAction(...args))
const handleChatModelDataChange = ({ inputParam, newValue }) => {
setSelectedChatModel((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
useEffect(() => { useEffect(() => {
if (getChatModelsApi.data) { if (getChatModelsApi.data) {
setChatModelsComponents(getChatModelsApi.data) setChatModelsComponents(getChatModelsApi.data)
@ -303,10 +312,15 @@ const AgentflowGeneratorDialog = ({ show, dialogProps, onCancel, onConfirm }) =>
borderRadius: 2 borderRadius: 2
}} }}
> >
{(selectedChatModel.inputParams ?? []) {showHideInputParams(selectedChatModel)
.filter((inputParam) => !inputParam.hidden) .filter((inputParam) => !inputParam.hidden && inputParam.display !== false)
.map((inputParam, index) => ( .map((inputParam, index) => (
<DocStoreInputHandler key={index} inputParam={inputParam} data={selectedChatModel} /> <DocStoreInputHandler
key={index}
inputParam={inputParam}
data={selectedChatModel}
onNodeDataChange={handleChatModelDataChange}
/>
))} ))}
</Box> </Box>
)} )}

6
packages/ui/src/ui-component/dialog/NodeInfoDialog.jsx
View File

@ -81,7 +81,11 @@ const NodeInfoDialog = ({ show, dialogProps, onCancel }) => {
height: 50, height: 50,
marginRight: 10, marginRight: 10,
borderRadius: '50%', borderRadius: '50%',
backgroundColor: 'white' backgroundColor: 'white',
flexShrink: 0,
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
}} }}
> >
<img <img

6
packages/ui/src/ui-component/extended/SpeechToText.jsx
View File

@ -379,7 +379,11 @@ const SpeechToText = ({ dialogProps }) => {
width: 50, width: 50,
height: 50, height: 50,
borderRadius: '50%', borderRadius: '50%',
backgroundColor: 'white' backgroundColor: 'white',
flexShrink: 0,
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
}} }}
> >
<img <img

40
packages/ui/src/views/assistants/custom/CustomAssistantConfigurePreview.jsx
View File

@ -53,7 +53,7 @@ import { baseURL } from '@/store/constant'
import { SET_CHATFLOW, closeSnackbar as closeSnackbarAction, enqueueSnackbar as enqueueSnackbarAction } from '@/store/actions' import { SET_CHATFLOW, closeSnackbar as closeSnackbarAction, enqueueSnackbar as enqueueSnackbarAction } from '@/store/actions'
// Utils // Utils
import { initNode } from '@/utils/genericHelper' import { initNode, showHideInputParams } from '@/utils/genericHelper'
import useNotifier from '@/utils/useNotifier' import useNotifier from '@/utils/useNotifier'
import { toolAgentFlow } from './toolAgentFlow' import { toolAgentFlow } from './toolAgentFlow'
@ -127,6 +127,28 @@ const CustomAssistantConfigurePreview = () => {
const enqueueSnackbar = (...args) => dispatch(enqueueSnackbarAction(...args)) const enqueueSnackbar = (...args) => dispatch(enqueueSnackbarAction(...args))
const closeSnackbar = (...args) => dispatch(closeSnackbarAction(...args)) const closeSnackbar = (...args) => dispatch(closeSnackbarAction(...args))
const handleChatModelDataChange = ({ inputParam, newValue }) => {
setSelectedChatModel((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
const handleToolDataChange =
(toolIndex) =>
({ inputParam, newValue }) => {
setSelectedTools((prevTools) => {
const updatedTools = [...prevTools]
const updatedTool = { ...updatedTools[toolIndex] }
updatedTool.inputs[inputParam.name] = newValue
updatedTool.inputParams = showHideInputParams(updatedTool)
updatedTools[toolIndex] = updatedTool
return updatedTools
})
}
const displayWarning = () => { const displayWarning = () => {
enqueueSnackbar({ enqueueSnackbar({
message: 'Please fill in all mandatory fields.', message: 'Please fill in all mandatory fields.',
@ -1126,13 +1148,14 @@ const CustomAssistantConfigurePreview = () => {
borderRadius: 2 borderRadius: 2
}} }}
> >
{(selectedChatModel.inputParams ?? []) {showHideInputParams(selectedChatModel)
.filter((inputParam) => !inputParam.hidden) .filter((inputParam) => !inputParam.hidden && inputParam.display !== false)
.map((inputParam, index) => ( .map((inputParam, index) => (
<DocStoreInputHandler <DocStoreInputHandler
key={index} key={index}
inputParam={inputParam} inputParam={inputParam}
data={selectedChatModel} data={selectedChatModel}
onNodeDataChange={handleChatModelDataChange}
/> />
))} ))}
</Box> </Box>
@ -1217,13 +1240,16 @@ const CustomAssistantConfigurePreview = () => {
mb: 1 mb: 1
}} }}
> >
{(tool.inputParams ?? []) {showHideInputParams(tool)
.filter((inputParam) => !inputParam.hidden) .filter(
.map((inputParam, index) => ( (inputParam) => !inputParam.hidden && inputParam.display !== false
)
.map((inputParam, inputIndex) => (
<DocStoreInputHandler <DocStoreInputHandler
key={index} key={inputIndex}
inputParam={inputParam} inputParam={inputParam}
data={tool} data={tool}
onNodeDataChange={handleToolDataChange(index)}
/> />
))} ))}
</Box> </Box>

4
packages/ui/src/views/assistants/custom/CustomAssistantLayout.jsx
View File

@ -64,7 +64,9 @@ const CustomAssistantLayout = () => {
const getImages = (details) => { const getImages = (details) => {
const images = [] const images = []
if (details && details.chatModel && details.chatModel.name) { if (details && details.chatModel && details.chatModel.name) {
images.push(`${baseURL}/api/v1/node-icon/${details.chatModel.name}`) images.push({
imageSrc: `${baseURL}/api/v1/node-icon/${details.chatModel.name}`
})
} }
return images return images
} }

13
packages/ui/src/views/canvas/NodeInputHandler.jsx
View File

@ -3,6 +3,7 @@ import { Handle, Position, useUpdateNodeInternals } from 'reactflow'
import { useEffect, useRef, useState, useContext } from 'react' import { useEffect, useRef, useState, useContext } from 'react'
import { useSelector, useDispatch } from 'react-redux' import { useSelector, useDispatch } from 'react-redux'
import { cloneDeep } from 'lodash' import { cloneDeep } from 'lodash'
import showdown from 'showdown'
// material-ui // material-ui
import { useTheme, styled } from '@mui/material/styles' import { useTheme, styled } from '@mui/material/styles'
@ -98,6 +99,13 @@ const StyledPopper = styled(Popper)({
} }
}) })
const markdownConverter = new showdown.Converter({
simplifiedAutoLink: true,
strikethrough: true,
tables: true,
tasklists: true
})
// ===========================|| NodeInputHandler ||=========================== // // ===========================|| NodeInputHandler ||=========================== //
const NodeInputHandler = ({ const NodeInputHandler = ({
@ -1389,7 +1397,12 @@ const NodeInputHandler = ({
onCancel={() => setPromptGeneratorDialogOpen(false)} onCancel={() => setPromptGeneratorDialogOpen(false)}
onConfirm={(generatedInstruction) => { onConfirm={(generatedInstruction) => {
try { try {
if (inputParam?.acceptVariable && window.location.href.includes('v2/agentcanvas')) {
const htmlContent = markdownConverter.makeHtml(generatedInstruction)
data.inputs[inputParam.name] = htmlContent
} else {
data.inputs[inputParam.name] = generatedInstruction data.inputs[inputParam.name] = generatedInstruction
}
setPromptGeneratorDialogOpen(false) setPromptGeneratorDialogOpen(false)
} catch (error) { } catch (error) {
enqueueSnackbar({ enqueueSnackbar({

6
packages/ui/src/views/credentials/CredentialListDialog.jsx
View File

@ -140,7 +140,11 @@ const CredentialListDialog = ({ show, dialogProps, onCancel, onCredentialSelecte
width: 50, width: 50,
height: 50, height: 50,
borderRadius: '50%', borderRadius: '50%',
backgroundColor: 'white' backgroundColor: 'white',
flexShrink: 0,
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
}} }}
> >
<img <img

6
packages/ui/src/views/docstore/ComponentsListDialog.jsx
View File

@ -153,7 +153,11 @@ const ComponentsListDialog = ({ show, dialogProps, onCancel, apiCall, onSelected
width: 50, width: 50,
height: 50, height: 50,
borderRadius: '50%', borderRadius: '50%',
backgroundColor: 'white' backgroundColor: 'white',
flexShrink: 0,
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
}} }}
> >
<img <img

26
packages/ui/src/views/docstore/DocStoreInputHandler.jsx
View File

@ -1,5 +1,5 @@
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import { useState } from 'react' import { useState, useContext } from 'react'
import { useSelector } from 'react-redux' import { useSelector } from 'react-redux'
// material-ui // material-ui
@ -20,14 +20,17 @@ import { CodeEditor } from '@/ui-component/editor/CodeEditor'
import ExpandTextDialog from '@/ui-component/dialog/ExpandTextDialog' import ExpandTextDialog from '@/ui-component/dialog/ExpandTextDialog'
import ManageScrapedLinksDialog from '@/ui-component/dialog/ManageScrapedLinksDialog' import ManageScrapedLinksDialog from '@/ui-component/dialog/ManageScrapedLinksDialog'
import CredentialInputHandler from '@/views/canvas/CredentialInputHandler' import CredentialInputHandler from '@/views/canvas/CredentialInputHandler'
import { flowContext } from '@/store/context/ReactFlowContext'
// const // const
import { FLOWISE_CREDENTIAL_ID } from '@/store/constant' import { FLOWISE_CREDENTIAL_ID } from '@/store/constant'
// ===========================|| DocStoreInputHandler ||=========================== // // ===========================|| DocStoreInputHandler ||=========================== //
const DocStoreInputHandler = ({ inputParam, data, disabled = false }) => { const DocStoreInputHandler = ({ inputParam, data, disabled = false, onNodeDataChange }) => {
const customization = useSelector((state) => state.customization) const customization = useSelector((state) => state.customization)
const flowContextValue = useContext(flowContext)
const nodeDataChangeHandler = onNodeDataChange || flowContextValue?.onNodeDataChange
const [showExpandDialog, setShowExpandDialog] = useState(false) const [showExpandDialog, setShowExpandDialog] = useState(false)
const [expandDialogProps, setExpandDialogProps] = useState({}) const [expandDialogProps, setExpandDialogProps] = useState({})
@ -35,6 +38,14 @@ const DocStoreInputHandler = ({ inputParam, data, disabled = false }) => {
const [manageScrapedLinksDialogProps, setManageScrapedLinksDialogProps] = useState({}) const [manageScrapedLinksDialogProps, setManageScrapedLinksDialogProps] = useState({})
const [reloadTimestamp, setReloadTimestamp] = useState(Date.now().toString()) const [reloadTimestamp, setReloadTimestamp] = useState(Date.now().toString())
const handleDataChange = ({ inputParam, newValue }) => {
data.inputs[inputParam.name] = newValue
const allowedShowHideInputTypes = ['boolean', 'asyncOptions', 'asyncMultiOptions', 'options', 'multiOptions']
if (allowedShowHideInputTypes.includes(inputParam.type) && nodeDataChangeHandler) {
nodeDataChangeHandler({ nodeId: data.id, inputParam, newValue })
}
}
const onExpandDialogClicked = (value, inputParam) => { const onExpandDialogClicked = (value, inputParam) => {
const dialogProps = { const dialogProps = {
value, value,
@ -149,7 +160,7 @@ const DocStoreInputHandler = ({ inputParam, data, disabled = false }) => {
{inputParam.type === 'boolean' && ( {inputParam.type === 'boolean' && (
<SwitchInput <SwitchInput
disabled={disabled} disabled={disabled}
onChange={(newValue) => (data.inputs[inputParam.name] = newValue)} onChange={(newValue) => handleDataChange({ inputParam, newValue })}
value={data.inputs[inputParam.name] ?? inputParam.default ?? false} value={data.inputs[inputParam.name] ?? inputParam.default ?? false}
/> />
)} )}
@ -203,7 +214,7 @@ const DocStoreInputHandler = ({ inputParam, data, disabled = false }) => {
disabled={disabled} disabled={disabled}
name={inputParam.name} name={inputParam.name}
options={inputParam.options} options={inputParam.options}
onSelect={(newValue) => (data.inputs[inputParam.name] = newValue)} onSelect={(newValue) => handleDataChange({ inputParam, newValue })}
value={data.inputs[inputParam.name] ?? inputParam.default ?? 'choose an option'} value={data.inputs[inputParam.name] ?? inputParam.default ?? 'choose an option'}
/> />
)} )}
@ -213,7 +224,7 @@ const DocStoreInputHandler = ({ inputParam, data, disabled = false }) => {
disabled={disabled} disabled={disabled}
name={inputParam.name} name={inputParam.name}
options={inputParam.options} options={inputParam.options}
onSelect={(newValue) => (data.inputs[inputParam.name] = newValue)} onSelect={(newValue) => handleDataChange({ inputParam, newValue })}
value={data.inputs[inputParam.name] ?? inputParam.default ?? 'choose an option'} value={data.inputs[inputParam.name] ?? inputParam.default ?? 'choose an option'}
/> />
)} )}
@ -230,7 +241,7 @@ const DocStoreInputHandler = ({ inputParam, data, disabled = false }) => {
freeSolo={inputParam.freeSolo} freeSolo={inputParam.freeSolo}
multiple={inputParam.type === 'asyncMultiOptions'} multiple={inputParam.type === 'asyncMultiOptions'}
value={data.inputs[inputParam.name] ?? inputParam.default ?? 'choose an option'} value={data.inputs[inputParam.name] ?? inputParam.default ?? 'choose an option'}
onSelect={(newValue) => (data.inputs[inputParam.name] = newValue)} onSelect={(newValue) => handleDataChange({ inputParam, newValue })}
onCreateNew={() => addAsyncOption(inputParam.name)} onCreateNew={() => addAsyncOption(inputParam.name)}
/> />
</div> </div>
@ -296,7 +307,8 @@ const DocStoreInputHandler = ({ inputParam, data, disabled = false }) => {
DocStoreInputHandler.propTypes = { DocStoreInputHandler.propTypes = {
inputParam: PropTypes.object, inputParam: PropTypes.object,
data: PropTypes.object, data: PropTypes.object,
disabled: PropTypes.bool disabled: PropTypes.bool,
onNodeDataChange: PropTypes.func
} }
export default DocStoreInputHandler export default DocStoreInputHandler

6
packages/ui/src/views/docstore/DocumentLoaderListDialog.jsx
View File

@ -153,7 +153,11 @@ const DocumentLoaderListDialog = ({ show, dialogProps, onCancel, onDocLoaderSele
width: 50, width: 50,
height: 50, height: 50,
borderRadius: '50%', borderRadius: '50%',
backgroundColor: 'white' backgroundColor: 'white',
flexShrink: 0,
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
}} }}
> >
<img <img

36
packages/ui/src/views/docstore/LoaderConfigPreviewChunks.jsx
View File

@ -35,7 +35,7 @@ import { closeSnackbar as closeSnackbarAction, enqueueSnackbar as enqueueSnackba
import { useError } from '@/store/context/ErrorContext' import { useError } from '@/store/context/ErrorContext'
// Utils // Utils
import { initNode } from '@/utils/genericHelper' import { initNode, showHideInputParams } from '@/utils/genericHelper'
import useNotifier from '@/utils/useNotifier' import useNotifier from '@/utils/useNotifier'
const CardWrapper = styled(MainCard)(({ theme }) => ({ const CardWrapper = styled(MainCard)(({ theme }) => ({
@ -98,6 +98,24 @@ const LoaderConfigPreviewChunks = () => {
const enqueueSnackbar = (...args) => dispatch(enqueueSnackbarAction(...args)) const enqueueSnackbar = (...args) => dispatch(enqueueSnackbarAction(...args))
const closeSnackbar = (...args) => dispatch(closeSnackbarAction(...args)) const closeSnackbar = (...args) => dispatch(closeSnackbarAction(...args))
const handleDocumentLoaderDataChange = ({ inputParam, newValue }) => {
setSelectedDocumentLoader((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
const handleTextSplitterDataChange = ({ inputParam, newValue }) => {
setSelectedTextSplitter((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
const onSplitterChange = (name) => { const onSplitterChange = (name) => {
const textSplitter = (textSplitterNodes ?? []).find((splitter) => splitter.name === name) const textSplitter = (textSplitterNodes ?? []).find((splitter) => splitter.name === name)
if (textSplitter) { if (textSplitter) {
@ -452,13 +470,14 @@ const LoaderConfigPreviewChunks = () => {
</Box> </Box>
{selectedDocumentLoader && {selectedDocumentLoader &&
Object.keys(selectedDocumentLoader).length > 0 && Object.keys(selectedDocumentLoader).length > 0 &&
(selectedDocumentLoader.inputParams ?? []) showHideInputParams(selectedDocumentLoader)
.filter((inputParam) => !inputParam.hidden) .filter((inputParam) => !inputParam.hidden && inputParam.display !== false)
.map((inputParam, index) => ( .map((inputParam, index) => (
<DocStoreInputHandler <DocStoreInputHandler
key={index} key={index}
inputParam={inputParam} inputParam={inputParam}
data={selectedDocumentLoader} data={selectedDocumentLoader}
onNodeDataChange={handleDocumentLoaderDataChange}
/> />
))} ))}
{textSplitterNodes && textSplitterNodes.length > 0 && ( {textSplitterNodes && textSplitterNodes.length > 0 && (
@ -511,10 +530,15 @@ const LoaderConfigPreviewChunks = () => {
</> </>
)} )}
{Object.keys(selectedTextSplitter).length > 0 && {Object.keys(selectedTextSplitter).length > 0 &&
(selectedTextSplitter.inputParams ?? []) showHideInputParams(selectedTextSplitter)
.filter((inputParam) => !inputParam.hidden) .filter((inputParam) => !inputParam.hidden && inputParam.display !== false)
.map((inputParam, index) => ( .map((inputParam, index) => (
<DocStoreInputHandler key={index} data={selectedTextSplitter} inputParam={inputParam} /> <DocStoreInputHandler
key={index}
data={selectedTextSplitter}
inputParam={inputParam}
onNodeDataChange={handleTextSplitterDataChange}
/>
))} ))}
</div> </div>
</Grid> </Grid>

52
packages/ui/src/views/docstore/VectorStoreConfigure.jsx
View File

@ -40,7 +40,7 @@ import Storage from '@mui/icons-material/Storage'
import DynamicFeed from '@mui/icons-material/Filter1' import DynamicFeed from '@mui/icons-material/Filter1'
// utils // utils
import { initNode } from '@/utils/genericHelper' import { initNode, showHideInputParams } from '@/utils/genericHelper'
import useNotifier from '@/utils/useNotifier' import useNotifier from '@/utils/useNotifier'
// const // const
@ -89,6 +89,33 @@ const VectorStoreConfigure = () => {
const [showUpsertHistoryDetailsDialog, setShowUpsertHistoryDetailsDialog] = useState(false) const [showUpsertHistoryDetailsDialog, setShowUpsertHistoryDetailsDialog] = useState(false)
const [upsertDetailsDialogProps, setUpsertDetailsDialogProps] = useState({}) const [upsertDetailsDialogProps, setUpsertDetailsDialogProps] = useState({})
const handleEmbeddingsProviderDataChange = ({ inputParam, newValue }) => {
setSelectedEmbeddingsProvider((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
const handleVectorStoreProviderDataChange = ({ inputParam, newValue }) => {
setSelectedVectorStoreProvider((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
const handleRecordManagerProviderDataChange = ({ inputParam, newValue }) => {
setSelectedRecordManagerProvider((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
const onEmbeddingsSelected = (component) => { const onEmbeddingsSelected = (component) => {
const nodeData = cloneDeep(initNode(component, uuidv4())) const nodeData = cloneDeep(initNode(component, uuidv4()))
if (!showEmbeddingsListDialog && documentStore.embeddingConfig) { if (!showEmbeddingsListDialog && documentStore.embeddingConfig) {
@ -599,14 +626,17 @@ const VectorStoreConfigure = () => {
</Box> </Box>
{selectedEmbeddingsProvider && {selectedEmbeddingsProvider &&
Object.keys(selectedEmbeddingsProvider).length > 0 && Object.keys(selectedEmbeddingsProvider).length > 0 &&
(selectedEmbeddingsProvider.inputParams ?? []) showHideInputParams(selectedEmbeddingsProvider)
.filter((inputParam) => !inputParam.hidden) .filter(
(inputParam) => !inputParam.hidden && inputParam.display !== false
)
.map((inputParam, index) => ( .map((inputParam, index) => (
<DocStoreInputHandler <DocStoreInputHandler
key={index} key={index}
data={selectedEmbeddingsProvider} data={selectedEmbeddingsProvider}
inputParam={inputParam} inputParam={inputParam}
isAdditionalParams={inputParam.additionalParams} isAdditionalParams={inputParam.additionalParams}
onNodeDataChange={handleEmbeddingsProviderDataChange}
/> />
))} ))}
</div> </div>
@ -714,14 +744,17 @@ const VectorStoreConfigure = () => {
</Box> </Box>
{selectedVectorStoreProvider && {selectedVectorStoreProvider &&
Object.keys(selectedVectorStoreProvider).length > 0 && Object.keys(selectedVectorStoreProvider).length > 0 &&
(selectedVectorStoreProvider.inputParams ?? []) showHideInputParams(selectedVectorStoreProvider)
.filter((inputParam) => !inputParam.hidden) .filter(
(inputParam) => !inputParam.hidden && inputParam.display !== false
)
.map((inputParam, index) => ( .map((inputParam, index) => (
<DocStoreInputHandler <DocStoreInputHandler
key={index} key={index}
data={selectedVectorStoreProvider} data={selectedVectorStoreProvider}
inputParam={inputParam} inputParam={inputParam}
isAdditionalParams={inputParam.additionalParams} isAdditionalParams={inputParam.additionalParams}
onNodeDataChange={handleVectorStoreProviderDataChange}
/> />
))} ))}
</div> </div>
@ -837,17 +870,18 @@ const VectorStoreConfigure = () => {
</Box> </Box>
{selectedRecordManagerProvider && {selectedRecordManagerProvider &&
Object.keys(selectedRecordManagerProvider).length > 0 && Object.keys(selectedRecordManagerProvider).length > 0 &&
(selectedRecordManagerProvider.inputParams ?? []) showHideInputParams(selectedRecordManagerProvider)
.filter((inputParam) => !inputParam.hidden) .filter(
(inputParam) => !inputParam.hidden && inputParam.display !== false
)
.map((inputParam, index) => ( .map((inputParam, index) => (
<>
<DocStoreInputHandler <DocStoreInputHandler
key={index} key={index}
data={selectedRecordManagerProvider} data={selectedRecordManagerProvider}
inputParam={inputParam} inputParam={inputParam}
isAdditionalParams={inputParam.additionalParams} isAdditionalParams={inputParam.additionalParams}
onNodeDataChange={handleRecordManagerProviderDataChange}
/> />
</>
))} ))}
</div> </div>
</Grid> </Grid>

16
packages/ui/src/views/docstore/VectorStoreQuery.jsx
View File

@ -31,7 +31,7 @@ import useApi from '@/hooks/useApi'
import { useAuth } from '@/hooks/useAuth' import { useAuth } from '@/hooks/useAuth'
import useNotifier from '@/utils/useNotifier' import useNotifier from '@/utils/useNotifier'
import { baseURL } from '@/store/constant' import { baseURL } from '@/store/constant'
import { initNode } from '@/utils/genericHelper' import { initNode, showHideInputParams } from '@/utils/genericHelper'
import { closeSnackbar as closeSnackbarAction, enqueueSnackbar as enqueueSnackbarAction } from '@/store/actions' import { closeSnackbar as closeSnackbarAction, enqueueSnackbar as enqueueSnackbarAction } from '@/store/actions'
const CardWrapper = styled(MainCard)(({ theme }) => ({ const CardWrapper = styled(MainCard)(({ theme }) => ({
@ -84,6 +84,15 @@ const VectorStoreQuery = () => {
const getVectorStoreNodeDetailsApi = useApi(nodesApi.getSpecificNode) const getVectorStoreNodeDetailsApi = useApi(nodesApi.getSpecificNode)
const [selectedVectorStoreProvider, setSelectedVectorStoreProvider] = useState({}) const [selectedVectorStoreProvider, setSelectedVectorStoreProvider] = useState({})
const handleVectorStoreProviderDataChange = ({ inputParam, newValue }) => {
setSelectedVectorStoreProvider((prevData) => {
const updatedData = { ...prevData }
updatedData.inputs[inputParam.name] = newValue
updatedData.inputParams = showHideInputParams(updatedData)
return updatedData
})
}
const chunkSelected = (chunkId, selectedChunkNumber) => { const chunkSelected = (chunkId, selectedChunkNumber) => {
const selectedChunk = documentChunks.find((chunk) => chunk.id === chunkId) const selectedChunk = documentChunks.find((chunk) => chunk.id === chunkId)
const dialogProps = { const dialogProps = {
@ -354,14 +363,15 @@ const VectorStoreQuery = () => {
</Box> </Box>
{selectedVectorStoreProvider && {selectedVectorStoreProvider &&
Object.keys(selectedVectorStoreProvider).length > 0 && Object.keys(selectedVectorStoreProvider).length > 0 &&
(selectedVectorStoreProvider.inputParams ?? []) showHideInputParams(selectedVectorStoreProvider)
.filter((inputParam) => !inputParam.hidden) .filter((inputParam) => !inputParam.hidden && inputParam.display !== false)
.map((inputParam, index) => ( .map((inputParam, index) => (
<DocStoreInputHandler <DocStoreInputHandler
key={index} key={index}
data={selectedVectorStoreProvider} data={selectedVectorStoreProvider}
inputParam={inputParam} inputParam={inputParam}
isAdditionalParams={inputParam.additionalParams} isAdditionalParams={inputParam.additionalParams}
onNodeDataChange={handleVectorStoreProviderDataChange}
/> />
))} ))}
</div> </div>

32
pnpm-lock.yaml
View File

@ -726,7 +726,7 @@ importers:
version: 6.9.15 version: 6.9.15
openai: openai:
specifier: 4.96.0 specifier: 4.96.0
version: 4.96.0(encoding@0.1.13)(ws@8.18.0(bufferutil@4.0.8)(utf-8-validate@6.0.4))(zod@3.22.4) version: 4.96.0(encoding@0.1.13)(ws@8.18.2(bufferutil@4.0.8)(utf-8-validate@6.0.4))(zod@3.22.4)
passport: passport:
specifier: ^0.7.0 specifier: ^0.7.0
version: 0.7.0 version: 0.7.0
@ -1067,6 +1067,9 @@ importers:
remark-math: remark-math:
specifier: ^5.1.1 specifier: ^5.1.1
version: 5.1.1 version: 5.1.1
showdown:
specifier: ^2.1.0
version: 2.1.0
tippy.js: tippy.js:
specifier: ^6.3.7 specifier: ^6.3.7
version: 6.3.7 version: 6.3.7
@ -16119,6 +16122,10 @@ packages:
shimmer@1.2.1: shimmer@1.2.1:
resolution: { integrity: sha512-sQTKC1Re/rM6XyFM6fIAGHRPVGvyXfgzIDvzoq608vM+jeyVD0Tu1E6Np0Kc2zAIFWIj963V2800iF/9LPieQw== } resolution: { integrity: sha512-sQTKC1Re/rM6XyFM6fIAGHRPVGvyXfgzIDvzoq608vM+jeyVD0Tu1E6Np0Kc2zAIFWIj963V2800iF/9LPieQw== }
showdown@2.1.0:
resolution: { integrity: sha512-/6NVYu4U819R2pUIk79n67SYgJHWCce0a5xTP979WbNp0FL9MN1I1QK662IDU1b6JzKTvmhgI7T7JYIxBi3kMQ== }
hasBin: true
shx@0.3.4: shx@0.3.4:
resolution: { integrity: sha512-N6A9MLVqjxZYcVn8hLmtneQWIJtp8IKzMP4eMnx+nqkvXoqinUPCbUFLp2UcWTEIUONhlk0ewxr/jaVGlc+J+g== } resolution: { integrity: sha512-N6A9MLVqjxZYcVn8hLmtneQWIJtp8IKzMP4eMnx+nqkvXoqinUPCbUFLp2UcWTEIUONhlk0ewxr/jaVGlc+J+g== }
engines: { node: '>=6' } engines: { node: '>=6' }
@ -21653,7 +21660,7 @@ snapshots:
dotenv: 16.4.5 dotenv: 16.4.5
openai: 4.96.0(encoding@0.1.13)(ws@8.18.0(bufferutil@4.0.8)(utf-8-validate@6.0.4))(zod@3.22.4) openai: 4.96.0(encoding@0.1.13)(ws@8.18.0(bufferutil@4.0.8)(utf-8-validate@6.0.4))(zod@3.22.4)
sharp: 0.33.5 sharp: 0.33.5
ws: 8.18.0(bufferutil@4.0.8)(utf-8-validate@6.0.4) ws: 8.18.2(bufferutil@4.0.8)(utf-8-validate@6.0.4)
zod: 3.22.4 zod: 3.22.4
zod-to-json-schema: 3.24.1(zod@3.22.4) zod-to-json-schema: 3.24.1(zod@3.22.4)
transitivePeerDependencies: transitivePeerDependencies:
@ -22402,7 +22409,7 @@ snapshots:
'@google/genai@0.7.0(bufferutil@4.0.8)(encoding@0.1.13)(utf-8-validate@6.0.4)': '@google/genai@0.7.0(bufferutil@4.0.8)(encoding@0.1.13)(utf-8-validate@6.0.4)':
dependencies: dependencies:
google-auth-library: 9.15.1(encoding@0.1.13) google-auth-library: 9.15.1(encoding@0.1.13)
ws: 8.18.0(bufferutil@4.0.8)(utf-8-validate@6.0.4) ws: 8.18.2(bufferutil@4.0.8)(utf-8-validate@6.0.4)
transitivePeerDependencies: transitivePeerDependencies:
- bufferutil - bufferutil
- encoding - encoding
@ -36019,6 +36026,21 @@ snapshots:
transitivePeerDependencies: transitivePeerDependencies:
- encoding - encoding
openai@4.96.0(encoding@0.1.13)(ws@8.18.2(bufferutil@4.0.8)(utf-8-validate@6.0.4))(zod@3.22.4):
dependencies:
'@types/node': 18.19.23
'@types/node-fetch': 2.6.12
abort-controller: 3.0.0
agentkeepalive: 4.5.0
form-data-encoder: 1.7.2
formdata-node: 4.4.1
node-fetch: 2.7.0(encoding@0.1.13)
optionalDependencies:
ws: 8.18.2(bufferutil@4.0.8)(utf-8-validate@6.0.4)
zod: 3.22.4
transitivePeerDependencies:
- encoding
openapi-types@12.1.3: {} openapi-types@12.1.3: {}
openapi-typescript-fetch@1.1.3: {} openapi-typescript-fetch@1.1.3: {}
@ -38734,6 +38756,10 @@ snapshots:
shimmer@1.2.1: {} shimmer@1.2.1: {}
showdown@2.1.0:
dependencies:
commander: 9.5.0
shx@0.3.4: shx@0.3.4:
dependencies: dependencies:
minimist: 1.2.8 minimist: 1.2.8