diff --git a/enatega-multivendor-app/src/components/Main/TopBrands/TopBrands.js b/enatega-multivendor-app/src/components/Main/TopBrands/TopBrands.js
index 8d19f8b7..589b3e07 100644
--- a/enatega-multivendor-app/src/components/Main/TopBrands/TopBrands.js
+++ b/enatega-multivendor-app/src/components/Main/TopBrands/TopBrands.js
@@ -68,13 +68,15 @@ function TopBrands(props) {
   if (loading) return <TopBrandsLoadingUI />
   if (error) return <Text style={styles().margin}>Error: {error.message}</Text>
 
-  const restaurantBrands = data?.topRatedVendorsPreview?.filter(
-    (item) => item.shopType === 'restaurant'
-  )
+  const brandsData = {
+    restaurant: [],
+    grocery: [],
+  };
+
+  data?.topRatedVendorsPreview?.forEach((item) => {
+      brandsData[item.shopType].push(item);
+  });
 
-  const groceryBrands = data?.topRatedVendorsPreview?.filter(
-    (item) => item.shopType === 'grocery'
-  )
 
   return (
     <View style={styles().mainContainer}>
@@ -93,13 +95,12 @@ function TopBrands(props) {
             activeOpacity={0.8}
             onPress={() => {
               navigation.navigate('Menu', {
-                selectedType: '',
                 queryType: 'topBrands'
               })
             }}
           >
             <TextDefault H5 bolder textColor={currentTheme.main}>
-            {t('SeeAll')}
+              {t('SeeAll')}
             </TextDefault>
           </TouchableOpacity>
         </View>
@@ -138,13 +139,13 @@ function TopBrands(props) {
             }}
           >
             <TextDefault H5 bolder textColor={currentTheme.main}>
-            {t('SeeAll')}
+              {t('SeeAll')}
             </TextDefault>
           </TouchableOpacity>
         </View>
         <View style={{ ...alignment.PRsmall }}>
           <FlatList
-            data={restaurantBrands}
+            data={brandsData.restaurant}
             renderItem={({ item }) => {
               return <NewRestaurantCard {...item} />
             }}
@@ -156,7 +157,7 @@ function TopBrands(props) {
           />
         </View>
       </View>
-      
+
       <View style={styles().topbrandsSec}>
         <View style={styles().header}>
           <TextDefault
@@ -178,13 +179,13 @@ function TopBrands(props) {
             }}
           >
             <TextDefault H5 bolder textColor={currentTheme.main}>
-            {t('SeeAll')}
+              {t('SeeAll')}
             </TextDefault>
           </TouchableOpacity>
         </View>
         <View style={{ ...alignment.PRsmall }}>
           <FlatList
-            data={groceryBrands}
+            data={brandsData.grocery}
             renderItem={({ item }) => {
               return <NewRestaurantCard {...item} />
             }}