diff --git a/client/src/context/Data.tsx b/client/src/context/Data.tsx
index 339378ed..dea82964 100644
--- a/client/src/context/Data.tsx
+++ b/client/src/context/Data.tsx
@@ -174,6 +174,8 @@ export const DataProvider = (props: { children: React.ReactNode }) => {
     try {
       // set loading true
       setLoading(true);
+      // set collections
+      setCollections([]);
       // fetch collections
       const res = await CollectionService.getCollections();
       // check state
@@ -343,6 +345,18 @@ export const DataProvider = (props: { children: React.ReactNode }) => {
   };
 
   useEffect(() => {
+    const clear = () => {
+      // clear collections
+      setCollections([]);
+      // clear database
+      setDatabases([]);
+      // set connected to false
+      setConnected(false);
+      // remove all listeners when component unmount
+      socket.current?.offAny();
+      socket.current?.disconnect();
+    };
+
     if (isAuth) {
       // update database get from auth
       setDatabase(authReq.database);
@@ -370,14 +384,12 @@ export const DataProvider = (props: { children: React.ReactNode }) => {
         socket.current?.disconnect();
       });
     } else {
-      socket.current?.disconnect();
-      // clear collections
-      setCollections([]);
-      // clear database
-      setDatabases([]);
-      // set connected to false
-      setConnected(false);
+      clear();
     }
+
+    return () => {
+      clear();
+    };
   }, [isAuth]);
 
   useEffect(() => {
diff --git a/server/src/collections/collections.service.ts b/server/src/collections/collections.service.ts
index 9d942d19..e779f924 100644
--- a/server/src/collections/collections.service.ts
+++ b/server/src/collections/collections.service.ts
@@ -438,12 +438,12 @@ export class CollectionsService {
   // get all collections details
   async getAllCollections(
     clientId: string,
-    collectionName: string[] = []
+    collections: string[] = []
   ): Promise<CollectionObject[]> {
     const cache = clientCache.get(clientId);
 
-    // clear collectionsQueue
-    if (collectionName.length === 0) {
+    // clear collectionsQueue if we fetch all collections
+    if (collections.length === 0) {
       cache.collectionsQueue.stop();
       cache.collectionsQueue = new SimpleQueue<string>();
     }
@@ -460,12 +460,15 @@ export class CollectionsService {
 
     // get target collections details
     const targetCollections = allCollections.data.filter(
-      d => collectionName.indexOf(d.name) !== -1
+      d => collections.indexOf(d.name) !== -1
     );
 
     const targets =
       targetCollections.length > 0 ? targetCollections : allCollections.data;
 
+    // sort targets by name
+    targets.sort((a, b) => a.name.localeCompare(b.name));
+
     // get all collection details
     for (let i = 0; i < targets.length; i++) {
       const collection = targets[i];
@@ -496,17 +499,6 @@ export class CollectionsService {
       }, 5);
     }
 
-    // sort data by loadedPercentage and has index or not, then createdTime.
-    data.sort((a, b) => {
-      if (a.loadedPercentage === b.loadedPercentage && a.schema && b.schema) {
-        if (a.schema.hasVectorIndex === b.schema.hasVectorIndex) {
-          return b.createdTime - a.createdTime;
-        }
-        return a.schema.hasVectorIndex ? -1 : 1;
-      }
-      return (b.loadedPercentage || 0) - (a.loadedPercentage || 0);
-    });
-
     // return data
     return data;
   }