fix: default selection issue & trigger retrieval setting unintentionally

This commit is contained in:
Yi 2024-09-28 14:13:02 +08:00
parent b92fced974
commit 69c0f3f2ad
5 changed files with 49 additions and 11 deletions

View File

@ -0,0 +1,11 @@
import { create } from 'zustand'
type DatasetStore = {
showExternalApiPanel: boolean
setShowExternalApiPanel: (show: boolean) => void
}
export const useDatasetStore = create<DatasetStore>(set => ({
showExternalApiPanel: false,
setShowExternalApiPanel: show => set({ showExternalApiPanel: show }),
}))

View File

@ -1,4 +1,4 @@
import React, { useState } from 'react'
import React, { useEffect, useState } from 'react'
import {
RiAddLine,
RiArrowDownSLine,
@ -15,18 +15,23 @@ type ApiItem = {
type ExternalApiSelectProps = {
items: ApiItem[]
defaultValue?: string
value?: string
onSelect: (item: ApiItem) => void
}
const ExternalApiSelect: React.FC<ExternalApiSelectProps> = ({ items, defaultValue, onSelect }) => {
const ExternalApiSelect: React.FC<ExternalApiSelectProps> = ({ items, value, onSelect }) => {
const { t } = useTranslation()
const [isOpen, setIsOpen] = useState(false)
const router = useRouter()
const [selectedItem, setSelectedItem] = useState<ApiItem | null>(
items.find(item => item.value === defaultValue) || null,
items.find(item => item.value === value) || null,
)
useEffect(() => {
const newSelectedItem = items.find(item => item.value === value) || null
setSelectedItem(newSelectedItem)
}, [value, items])
const handleAddNewAPI = () => {
router.push('/datasets?openExternalApiPanel=true')
}
@ -40,7 +45,7 @@ const ExternalApiSelect: React.FC<ExternalApiSelectProps> = ({ items, defaultVal
return (
<div className="relative w-full">
<div
className={`flex items-center justify-between cursor-point px-2 py-1 gap-0.5 self-stretch rounded-lg
className={`flex items-center justify-between cursor-pointer px-2 py-1 gap-0.5 self-stretch rounded-lg
bg-components-input-bg-normal hover:bg-state-base-hover-alt ${isOpen && 'bg-state-base-hover-alt'}`}
onClick={() => setIsOpen(!isOpen)}
>

View File

@ -1,6 +1,6 @@
'use client'
import React, { useEffect } from 'react'
import React, { useEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { RiAddLine } from '@remixicon/react'
import { useRouter } from 'next/navigation'
@ -19,6 +19,7 @@ const ExternalApiSelection: React.FC<ExternalApiSelectionProps> = ({ external_kn
const { t } = useTranslation()
const router = useRouter()
const { externalKnowledgeApiList } = useExternalKnowledgeApi()
const [selectedApiId, setSelectedApiId] = useState(external_knowledge_api_id)
const apiItems = externalKnowledgeApiList.map(api => ({
value: api.id,
@ -26,6 +27,15 @@ const ExternalApiSelection: React.FC<ExternalApiSelectionProps> = ({ external_kn
url: api.settings.endpoint,
}))
useEffect(() => {
if (apiItems.length > 0) {
const newSelectedId = external_knowledge_api_id || apiItems[0].value
setSelectedApiId(newSelectedId)
if (newSelectedId !== external_knowledge_api_id)
onChange({ external_knowledge_api_id: newSelectedId, external_knowledge_id })
}
}, [apiItems, external_knowledge_api_id, external_knowledge_id, onChange])
const handleAddNewAPI = () => {
router.push('/datasets?openExternalApiPanel=true')
}
@ -44,8 +54,11 @@ const ExternalApiSelection: React.FC<ExternalApiSelectionProps> = ({ external_kn
{apiItems.length > 0
? <ExternalApiSelect
items={apiItems}
defaultValue={apiItems[0].value}
onSelect={e => onChange({ external_knowledge_api_id: e.value as string, external_knowledge_id })}
value={selectedApiId}
onSelect={(e) => {
setSelectedApiId(e.value)
onChange({ external_knowledge_api_id: e.value, external_knowledge_id })
}}
/>
: <Button variant={'tertiary'} onClick={handleAddNewAPI} className='justify-start gap-0.5'>
<RiAddLine className='w-4 h-4 text-text-tertiary' />

View File

@ -47,6 +47,11 @@ const DatasetItem: FC<Props> = ({
hideSettingsModal()
}, [hideSettingsModal, onChange])
const handleRemove = useCallback((e: React.MouseEvent) => {
e.stopPropagation()
onRemove()
}, [onRemove])
return (
<div className={`flex items-center h-10 justify-between rounded-xl px-2 border-[0.5px]
border-components-panel-border-subtle cursor-pointer group/dataset-item
@ -71,12 +76,15 @@ const DatasetItem: FC<Props> = ({
{!readonly && (
<div className='hidden group-hover/dataset-item:flex shrink-0 ml-2 items-center space-x-1'>
<ActionButton
onClick={showSettingsModal}
onClick={(e) => {
e.stopPropagation()
showSettingsModal()
}}
>
<RiEditLine className='w-4 h-4 flex-shrink-0 text-text-tertiary' />
</ActionButton>
<ActionButton
onClick={onRemove}
onClick={handleRemove}
state={ActionButtonState.Destructive}
onMouseEnter={() => setIsDeleteHovered(true)}
onMouseLeave={() => setIsDeleteHovered(false)}

View File

@ -208,6 +208,7 @@ const useConfig = (id: string, payload: KnowledgeRetrievalNodeType) => {
allEconomic,
mixtureHighQualityAndEconomic,
inconsistentEmbeddingModel,
allInternal,
} = getSelectedDatasetsMode(newDatasets)
const newInputs = produce(inputs, (draft) => {
draft.dataset_ids = newDatasets.map(d => d.id)
@ -220,7 +221,7 @@ const useConfig = (id: string, payload: KnowledgeRetrievalNodeType) => {
setInputs(newInputs)
setSelectedDatasets(newDatasets)
if (allEconomic || mixtureHighQualityAndEconomic || inconsistentEmbeddingModel)
if (allInternal && (allEconomic || mixtureHighQualityAndEconomic || inconsistentEmbeddingModel))
setRerankModelOpen(true)
}, [inputs, setInputs, payload.retrieval_mode])