Add new product sliders to home

frontend/composables/api/home/useHomeData.ts

@@ -2,7 +2,6 @@
 
 import { useQuery } from "@tanstack/vue-query";
 import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
-import type { GetArticleResponse } from "~/composables/api/blog/useGetArticle";
 
 // types
 
@@ -16,6 +15,10 @@ export type GetHomeDataResponse = {
         video: string | null;
     }[];
     main_categories: Category[];
+    top_seller_products: ProductListItem[];
+    lot_of_discount_products: ProductListItem[];
+    most_viewed_products: ProductListItem[];
+    trends_products: ProductListItem[];
     products: ProductListItem[];
     difreance_section: {
         image1: string;

frontend/pages/index.vue

@@ -2,7 +2,6 @@
 // import
 
 import useHomeData from "~/composables/api/home/useHomeData";
-import ProductsGrid from "~/components/global/ProductsGrid.vue";
 
 // state
 
@@ -25,11 +24,29 @@ if (response.isError) {
         <!-- <LoadingOverlay /> -->
         <Hero class="mb-20 max-md:mt-20" />
         <Preview />
+        <div class="py-20">
+            <ProductsSlider
+                title="محصولات پرتخفیف"
+                :products="homeData!.lot_of_discount_products"
+            />
+        </div>
+        <div class="py-20">
+            <ProductsSlider
+                title="محصولات محبوب"
+                :products="homeData!.trends_products"
+            />
+        </div>
         <ProductsShowcase class="lg:mb-12" />
         <div class="py-20">
             <ProductsSlider
                 title="محصولات پرفروش"
-                :products="homeData!.products"
+                :products="homeData!.top_seller_products"
+            />
+        </div>
+        <div class="py-20">
+            <ProductsSlider
+                title="محصولات پربازدید"
+                :products="homeData!.most_viewed_products"
             />
         </div>
         <Categories class="mt-12" />