|
|
@@ -1,4 +1,4 @@
|
|
|
-import { TextField, Typography } from '@material-ui/core';
|
|
|
+import { TextField, Typography, Button } from '@material-ui/core';
|
|
|
import { useTranslation } from 'react-i18next';
|
|
|
import { useNavigationHook } from '../../hooks/Navigation';
|
|
|
import { ALL_ROUTER_TYPES } from '../../router/Types';
|
|
|
@@ -33,7 +33,7 @@ import Filter from '../../components/advancedSearch';
|
|
|
import { Field } from '../../components/advancedSearch/Types';
|
|
|
import { useLocation } from 'react-router-dom';
|
|
|
import { parseLocationSearch } from '../../utils/Format';
|
|
|
-import { cloneObj } from '../../utils/Common';
|
|
|
+import { cloneObj, generateVector } from '../../utils/Common';
|
|
|
import { CustomDatePicker } from '../../components/customDatePicker/CustomDatePicker';
|
|
|
import { useTimeTravelHook } from '../../hooks/TimeTravel';
|
|
|
|
|
|
@@ -135,8 +135,10 @@ const VectorSearch = () => {
|
|
|
}))
|
|
|
: [];
|
|
|
}, [searchResult, primaryKeyField]);
|
|
|
+
|
|
|
+ const [selectedMetricType, setSelectedMetricType] = useState<string>('');
|
|
|
+
|
|
|
const {
|
|
|
- metricType,
|
|
|
indexType,
|
|
|
indexParams,
|
|
|
fieldType,
|
|
|
@@ -154,6 +156,8 @@ const VectorSearch = () => {
|
|
|
index?._metricType || DEFAULT_METRIC_VALUE_MAP[embeddingType];
|
|
|
const indexParams = index?._indexParameterPairs || [];
|
|
|
const dim = selectedFieldInfo?.dimension || 0;
|
|
|
+ setSelectedMetricType(metric);
|
|
|
+
|
|
|
return {
|
|
|
metricType: metric,
|
|
|
indexType: index?._indexType || getDefaultIndexType(embeddingType),
|
|
|
@@ -163,8 +167,8 @@ const VectorSearch = () => {
|
|
|
selectedFieldDimension: dim,
|
|
|
};
|
|
|
}
|
|
|
+
|
|
|
return {
|
|
|
- metricType: '',
|
|
|
indexType: '',
|
|
|
indexParams: [],
|
|
|
fieldType: 0,
|
|
|
@@ -172,8 +176,6 @@ const VectorSearch = () => {
|
|
|
selectedFieldDimension: 0,
|
|
|
};
|
|
|
}, [selectedField, fieldOptions]);
|
|
|
- const [selectedMetricType, setSelectedMetricType] =
|
|
|
- useState<string>(metricType);
|
|
|
|
|
|
/**
|
|
|
* vector value validation
|
|
|
@@ -341,15 +343,55 @@ const VectorSearch = () => {
|
|
|
setVectors(value);
|
|
|
};
|
|
|
|
|
|
+ const fillWithExampleVector = (selectedFieldDimension: number) => {
|
|
|
+ const v = generateVector(selectedFieldDimension);
|
|
|
+ setVectors(`[${v}]`);
|
|
|
+ };
|
|
|
+
|
|
|
return (
|
|
|
<section className="page-wrapper">
|
|
|
{/* form section */}
|
|
|
<form className={classes.form}>
|
|
|
+ {/* collection and field selectors */}
|
|
|
+ <fieldset className="field">
|
|
|
+ <Typography className="text">{searchTrans('secondTip')}</Typography>
|
|
|
+ <CustomSelector
|
|
|
+ options={collectionOptions}
|
|
|
+ wrapperClass={classes.selector}
|
|
|
+ variant="filled"
|
|
|
+ label={searchTrans(
|
|
|
+ collectionOptions.length === 0 ? 'noCollection' : 'collection'
|
|
|
+ )}
|
|
|
+ disabled={collectionOptions.length === 0}
|
|
|
+ value={selectedCollection}
|
|
|
+ onChange={(e: { target: { value: unknown } }) => {
|
|
|
+ const collection = e.target.value;
|
|
|
+
|
|
|
+ setSelectedCollection(collection as string);
|
|
|
+ // every time selected collection changed, reset field
|
|
|
+ setSelectedField('');
|
|
|
+ setSearchResult([]);
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ <CustomSelector
|
|
|
+ options={fieldOptions}
|
|
|
+ // readOnly can't avoid all events, so we use disabled instead
|
|
|
+ disabled={selectedCollection === ''}
|
|
|
+ wrapperClass={classes.selector}
|
|
|
+ variant="filled"
|
|
|
+ label={searchTrans('field')}
|
|
|
+ value={selectedField}
|
|
|
+ onChange={(e: { target: { value: unknown } }) => {
|
|
|
+ const field = e.target.value;
|
|
|
+ setSelectedField(field as string);
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </fieldset>
|
|
|
{/**
|
|
|
* vector value textarea
|
|
|
* use field-params class because it also has error msg if invalid
|
|
|
*/}
|
|
|
- <fieldset className="field field-params">
|
|
|
+ <fieldset className="field field-params field-second">
|
|
|
<Typography className="text">
|
|
|
{searchTrans('firstTip', {
|
|
|
dimensionTip:
|
|
|
@@ -357,7 +399,23 @@ const VectorSearch = () => {
|
|
|
? `(dimension: ${selectedFieldDimension})`
|
|
|
: '',
|
|
|
})}
|
|
|
+ {selectedFieldDimension !== 0 ? (
|
|
|
+ <Button
|
|
|
+ variant="outlined"
|
|
|
+ size="small"
|
|
|
+ onClick={() => {
|
|
|
+ const dim =
|
|
|
+ fieldType === DataTypeEnum.BinaryVector
|
|
|
+ ? selectedFieldDimension / 8
|
|
|
+ : selectedFieldDimension;
|
|
|
+ fillWithExampleVector(dim);
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {btnTrans('example')}
|
|
|
+ </Button>
|
|
|
+ ) : null}
|
|
|
</Typography>
|
|
|
+
|
|
|
<TextField
|
|
|
className="textarea"
|
|
|
InputProps={{
|
|
|
@@ -386,41 +444,7 @@ const VectorSearch = () => {
|
|
|
</Typography>
|
|
|
)}
|
|
|
</fieldset>
|
|
|
- {/* collection and field selectors */}
|
|
|
- <fieldset className="field field-second">
|
|
|
- <Typography className="text">{searchTrans('secondTip')}</Typography>
|
|
|
- <CustomSelector
|
|
|
- options={collectionOptions}
|
|
|
- wrapperClass={classes.selector}
|
|
|
- variant="filled"
|
|
|
- label={searchTrans(
|
|
|
- collectionOptions.length === 0 ? 'noCollection' : 'collection'
|
|
|
- )}
|
|
|
- disabled={collectionOptions.length === 0}
|
|
|
- value={selectedCollection}
|
|
|
- onChange={(e: { target: { value: unknown } }) => {
|
|
|
- const collection = e.target.value;
|
|
|
|
|
|
- setSelectedCollection(collection as string);
|
|
|
- // every time selected collection changed, reset field
|
|
|
- setSelectedField('');
|
|
|
- setSearchResult([]);
|
|
|
- }}
|
|
|
- />
|
|
|
- <CustomSelector
|
|
|
- options={fieldOptions}
|
|
|
- // readOnly can't avoid all events, so we use disabled instead
|
|
|
- disabled={selectedCollection === ''}
|
|
|
- wrapperClass={classes.selector}
|
|
|
- variant="filled"
|
|
|
- label={searchTrans('field')}
|
|
|
- value={selectedField}
|
|
|
- onChange={(e: { target: { value: unknown } }) => {
|
|
|
- const field = e.target.value;
|
|
|
- setSelectedField(field as string);
|
|
|
- }}
|
|
|
- />
|
|
|
- </fieldset>
|
|
|
{/* search params selectors */}
|
|
|
<fieldset className="field field-params">
|
|
|
<Typography className="text">{searchTrans('thirdTip')}</Typography>
|
ryjiang