Improve query settings input experience in WebUI
This commit is contained in:
parent
465757aa6a
commit
fc7b0a9273
1 changed files with 70 additions and 23 deletions
|
|
@ -2,7 +2,6 @@ import { useCallback } from 'react'
|
||||||
import { QueryMode, QueryRequest } from '@/api/lightrag'
|
import { QueryMode, QueryRequest } from '@/api/lightrag'
|
||||||
// Removed unused import for Text component
|
// Removed unused import for Text component
|
||||||
import Checkbox from '@/components/ui/Checkbox'
|
import Checkbox from '@/components/ui/Checkbox'
|
||||||
import NumberInput from '@/components/ui/NumberInput'
|
|
||||||
import Input from '@/components/ui/Input'
|
import Input from '@/components/ui/Input'
|
||||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/Card'
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/Card'
|
||||||
import {
|
import {
|
||||||
|
|
@ -121,13 +120,23 @@ export default function QuerySettings() {
|
||||||
</TooltipProvider>
|
</TooltipProvider>
|
||||||
<div>
|
<div>
|
||||||
{/* Removed sr-only label */}
|
{/* Removed sr-only label */}
|
||||||
<NumberInput
|
<Input
|
||||||
id="top_k"
|
id="top_k"
|
||||||
stepper={1}
|
type="number"
|
||||||
value={querySettings.top_k}
|
value={querySettings.top_k ?? ''}
|
||||||
onValueChange={(v) => handleChange('top_k', v)}
|
onChange={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
handleChange('top_k', value === '' ? '' : parseInt(value) || 0)
|
||||||
|
}}
|
||||||
|
onBlur={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
if (value === '' || isNaN(parseInt(value))) {
|
||||||
|
handleChange('top_k', 1)
|
||||||
|
}
|
||||||
|
}}
|
||||||
min={1}
|
min={1}
|
||||||
placeholder={t('retrievePanel.querySettings.topKPlaceholder')}
|
placeholder={t('retrievePanel.querySettings.topKPlaceholder')}
|
||||||
|
className="h-9"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
@ -149,13 +158,23 @@ export default function QuerySettings() {
|
||||||
</TooltipProvider>
|
</TooltipProvider>
|
||||||
<div>
|
<div>
|
||||||
{/* Removed sr-only label */}
|
{/* Removed sr-only label */}
|
||||||
<NumberInput
|
<Input
|
||||||
id="max_token_for_text_unit"
|
id="max_token_for_text_unit"
|
||||||
stepper={500}
|
type="number"
|
||||||
value={querySettings.max_token_for_text_unit}
|
value={querySettings.max_token_for_text_unit ?? ''}
|
||||||
onValueChange={(v) => handleChange('max_token_for_text_unit', v)}
|
onChange={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
handleChange('max_token_for_text_unit', value === '' ? '' : parseInt(value) || 0)
|
||||||
|
}}
|
||||||
|
onBlur={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
if (value === '' || isNaN(parseInt(value))) {
|
||||||
|
handleChange('max_token_for_text_unit', 10000)
|
||||||
|
}
|
||||||
|
}}
|
||||||
min={1}
|
min={1}
|
||||||
placeholder={t('retrievePanel.querySettings.maxTokensTextUnit')}
|
placeholder={t('retrievePanel.querySettings.maxTokensTextUnit')}
|
||||||
|
className="h-9"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
@ -175,13 +194,23 @@ export default function QuerySettings() {
|
||||||
</TooltipProvider>
|
</TooltipProvider>
|
||||||
<div>
|
<div>
|
||||||
{/* Removed sr-only label */}
|
{/* Removed sr-only label */}
|
||||||
<NumberInput
|
<Input
|
||||||
id="max_token_for_global_context"
|
id="max_token_for_global_context"
|
||||||
stepper={500}
|
type="number"
|
||||||
value={querySettings.max_token_for_global_context}
|
value={querySettings.max_token_for_global_context ?? ''}
|
||||||
onValueChange={(v) => handleChange('max_token_for_global_context', v)}
|
onChange={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
handleChange('max_token_for_global_context', value === '' ? '' : parseInt(value) || 0)
|
||||||
|
}}
|
||||||
|
onBlur={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
if (value === '' || isNaN(parseInt(value))) {
|
||||||
|
handleChange('max_token_for_global_context', 4000)
|
||||||
|
}
|
||||||
|
}}
|
||||||
min={1}
|
min={1}
|
||||||
placeholder={t('retrievePanel.querySettings.maxTokensGlobalContext')}
|
placeholder={t('retrievePanel.querySettings.maxTokensGlobalContext')}
|
||||||
|
className="h-9"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
@ -201,13 +230,23 @@ export default function QuerySettings() {
|
||||||
</TooltipProvider>
|
</TooltipProvider>
|
||||||
<div>
|
<div>
|
||||||
{/* Removed sr-only label */}
|
{/* Removed sr-only label */}
|
||||||
<NumberInput
|
<Input
|
||||||
id="max_token_for_local_context"
|
id="max_token_for_local_context"
|
||||||
stepper={500}
|
type="number"
|
||||||
value={querySettings.max_token_for_local_context}
|
value={querySettings.max_token_for_local_context ?? ''}
|
||||||
onValueChange={(v) => handleChange('max_token_for_local_context', v)}
|
onChange={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
handleChange('max_token_for_local_context', value === '' ? '' : parseInt(value) || 0)
|
||||||
|
}}
|
||||||
|
onBlur={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
if (value === '' || isNaN(parseInt(value))) {
|
||||||
|
handleChange('max_token_for_local_context', 4000)
|
||||||
|
}
|
||||||
|
}}
|
||||||
min={1}
|
min={1}
|
||||||
placeholder={t('retrievePanel.querySettings.maxTokensLocalContext')}
|
placeholder={t('retrievePanel.querySettings.maxTokensLocalContext')}
|
||||||
|
className="h-9"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
@ -229,15 +268,23 @@ export default function QuerySettings() {
|
||||||
</TooltipProvider>
|
</TooltipProvider>
|
||||||
<div>
|
<div>
|
||||||
{/* Removed sr-only label */}
|
{/* Removed sr-only label */}
|
||||||
<NumberInput
|
<Input
|
||||||
className="!border-input"
|
|
||||||
id="history_turns"
|
id="history_turns"
|
||||||
stepper={1}
|
type="number"
|
||||||
type="text"
|
value={querySettings.history_turns ?? ''}
|
||||||
value={querySettings.history_turns}
|
onChange={(e) => {
|
||||||
onValueChange={(v) => handleChange('history_turns', v)}
|
const value = e.target.value
|
||||||
|
handleChange('history_turns', value === '' ? '' : parseInt(value) || 0)
|
||||||
|
}}
|
||||||
|
onBlur={(e) => {
|
||||||
|
const value = e.target.value
|
||||||
|
if (value === '' || isNaN(parseInt(value))) {
|
||||||
|
handleChange('history_turns', 0)
|
||||||
|
}
|
||||||
|
}}
|
||||||
min={0}
|
min={0}
|
||||||
placeholder={t('retrievePanel.querySettings.historyTurnsPlaceholder')}
|
placeholder={t('retrievePanel.querySettings.historyTurnsPlaceholder')}
|
||||||
|
className="h-9"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue