pref: navigate to the schema page after creation (#861)

Signed-off-by: ryjiang <jiangruiyi@gmail.com>

client/src/context/hooks/useCollectionsManagement.ts

@@ -152,7 +152,10 @@ export function useCollectionsManagement(database: string) {
 
   const createCollection = async (data: any) => {
     const newCollection = await CollectionService.createCollection(data);
-    const newCollections = collections.concat(newCollection).sort((a, b) => {
+    const filteredCollections = collections.filter(
+      c => c.collection_name !== newCollection.collection_name
+    );
+    const newCollections = filteredCollections.concat(newCollection).sort((a, b) => {
       if (a.loadedPercentage === b.loadedPercentage && a.schema && b.schema) {
         if (a.schema.hasVectorIndex === b.schema.hasVectorIndex) {
           return b.createdTime - a.createdTime;

client/src/pages/databases/collections/Collections.tsx

@@ -1,6 +1,7 @@
 import { useContext, useMemo, useState, useEffect } from 'react';
 import { Link, useSearchParams } from 'react-router-dom';
 import { Theme } from '@mui/material';
+import { useNavigate } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import Highlighter from 'react-highlight-words';
 import { rootContext, authContext, dataContext } from '@/context';
@@ -81,6 +82,8 @@ const Collections = () => {
     batchRefreshCollections,
   } = useContext(dataContext);
 
+  const navigate = useNavigate();
+
   const [searchParams] = useSearchParams();
   const [search, setSearch] = useState<string>(
     (searchParams.get('search') as string) || ''
@@ -128,7 +131,14 @@ const Collections = () => {
           open: true,
           type: 'custom',
           params: {
-            component: <CreateCollectionDialog />,
+            component: (
+              <CreateCollectionDialog
+                onCreate={collection_name => {
+                  //navigate to the new collection
+                 navigate(`/databases/${database}/${collection_name}/schema`);
+                }}
+              />
+            ),
           },
         });
       },

client/src/pages/databases/collections/Types.ts

@@ -2,7 +2,7 @@ import { Dispatch, SetStateAction } from 'react';
 import { DataTypeEnum, FunctionType } from '@/consts';
 
 export interface CollectionCreateProps {
-  onCreate?: () => void;
+  onCreate?: (collection_name: string) => void;
 }
 
 export type FunctionConfig = {

client/src/pages/databases/tree/TreeContextMenu.tsx

@@ -46,7 +46,15 @@ export const TreeContextMenu = (props: {
                 open: true,
                 type: 'custom',
                 params: {
-                  component: <CreateCollectionDialog />,
+                  component: (
+                    <CreateCollectionDialog
+                      onCreate={collection_name => {
+                        navigate(
+                          `/databases/${database}/${collection_name}/schema`
+                        );
+                      }}
+                    />
+                  ),
                 },
               });
             }}

client/src/pages/dialogs/CreateCollectionDialog.tsx

@@ -255,7 +255,7 @@ const CreateCollectionDialog: FC<CollectionCreateProps> = ({ onCreate }) => {
       })
     );
 
-    onCreate && onCreate();
+    onCreate && onCreate(param.collection_name);
     handleCloseDialog();
   };