refine code

client/src/components/advancedSearch/Filter.tsx

@@ -267,8 +267,10 @@ const Filter = forwardRef((props: FilterProps, ref) => {
     setFilteredFlatConditions(initConditions);
   };
   // Expose func
+  // useImperativeHandle customizes the instance value that is exposed to parent components when using ref.
+  // https://reactjs.org/docs/hooks-reference.html#useimperativehandle
   useImperativeHandle(ref, () => ({
-    // Expose handleHardReset
+    // Expose handleHardReset, parent components can call it by `ref.current.getReset()`
     getReset() {
       handleHardReset();
     },

client/src/http/BaseModel.ts

@@ -79,12 +79,6 @@ export default class BaseModel {
     return res.data;
   }
 
-  static async vectorSearch(options: updateParamsType) {
-    const { path, data } = options;
-    const res = await http.post(path, data);
-    return res.data.data;
-  }
-
   static async query(options: updateParamsType) {
     const { path, data } = options;
     const res = await http.post(path, data);

client/src/http/Collection.ts

@@ -86,7 +86,7 @@ export class CollectionHttp extends BaseModel implements CollectionView {
   }
 
   static vectorSearchData(collectionName: string, params: VectorSearchParam) {
-    return super.vectorSearch({
+    return super.query({
       path: `${this.COLLECTIONS_URL}/${collectionName}/search`,
       data: params,
     });

client/src/i18n/cn/collection.ts

@@ -60,6 +60,7 @@ const collectionTrans = {
   schemaTab: 'Schema',
   queryTab: 'Data Query',
   startTip: 'Start your data query',
+  exprPlaceHolder: 'Please enter your query by using advanced filter ->',
 };
 
 export default collectionTrans;

client/src/i18n/en/collection.ts

@@ -59,7 +59,8 @@ const collectionTrans = {
   partitionTab: 'Partitions',
   schemaTab: 'Schema',
   queryTab: 'Data Query',
-  startTip: 'Start your data query'
+  startTip: 'Start your data query',
+  exprPlaceHolder: 'Please enter your query by using advanced filter ->',
 };
 
 export default collectionTrans;

client/src/pages/collections/Collection.tsx

@@ -40,6 +40,10 @@ const Collection = () => {
   };
 
   const tabs: ITab[] = [
+    {
+      label: collectionTrans('queryTab'),
+      component: <Query collectionName={collectionName} />,
+    },
     {
       label: collectionTrans('schemaTab'),
       component: <Schema collectionName={collectionName} />,
@@ -48,10 +52,6 @@ const Collection = () => {
       label: collectionTrans('partitionTab'),
       component: <Partitions collectionName={collectionName} />,
     },
-    {
-      label: collectionTrans('queryTab'),
-      component: <Query collectionName={collectionName} />,
-    },
   ];
 
   return (

client/src/pages/query/Query.tsx

@@ -112,10 +112,11 @@ const Query: FC<{
         expr: expression,
         output_fields: fields.map(i => i.name),
       });
-      setTableLoading(false);
       const result = res.data;
       setQueryResult(result);
     } catch (err) {
+      setQueryResult([]);
+    } finally {
       setTableLoading(false);
     }
   };
@@ -125,7 +126,7 @@ const Query: FC<{
       <div className={classes.toolbar}>
         <div className="left">
           <div>{`${
-            expression || 'Please enter your query or use advanced filter ->'
+            expression || collectionTrans('exprPlaceHolder')
           }`}</div>
           <Filter
             ref={filterRef}
@@ -151,7 +152,7 @@ const Query: FC<{
           </CustomButton>
         </div>
       </div>
-      {tableLoading || queryResult ? (
+      {tableLoading || queryResult?.length ? (
         <MilvusGrid
           toolbarConfigs={[]}
           colDefinitions={fields.map(i => ({
@@ -178,7 +179,7 @@ const Query: FC<{
           wrapperClass={`page-empty-card ${classes.emptyCard}`}
           icon={<VectorSearchIcon />}
           text={
-            queryResult?.length > 0
+            queryResult?.length === 0
               ? searchTrans('empty')
               : collectionTrans('startTip')
           }