get business catalog

src/pages/catalogue/Business.tsx

@@ -0,0 +1,26 @@
+import GridWrapper from "@/components/GridWrapper";
+import { type FC } from "react";
+import { useParams } from "react-router-dom";
+import ButtonAddCatalogue from "./components/ButtonAddCatalogue";
+import CatalogueItem from "./components/CatalogueItem";
+import { useGetBusinessCatalog } from "./hooks/useCatalogueData";
+
+const Business: FC = () => {
+  const { slug } = useParams<{ slug: string }>();
+  const { data, isPending, refetch } = useGetBusinessCatalog(slug ?? "");
+  //   const { data: businessData, isLoading: businessLoading } =
+  //     useGetBusinessBySlug(slug ?? "");
+
+  return (
+    <div className="w-full mt-5">
+      <GridWrapper desktop={4} gapDesktop={40} mobile={1}>
+        {data?.data?.map((item) => {
+          return <CatalogueItem refetch={refetch} key={item.id} item={item} />;
+        })}
+        <ButtonAddCatalogue isFirst={data?.data?.length === 0} />
+      </GridWrapper>
+    </div>
+  );
+};
+
+export default Business;

src/pages/catalogue/hooks/useCatalogueData.ts

@@ -1,4 +1,4 @@
-import { useMutation } from "@tanstack/react-query";
+import { useMutation, useQuery } from "@tanstack/react-query";
 import * as api from "../service/CatalogueService";
 
 export const usePurchaseInitate = () => {
@@ -6,3 +6,19 @@ export const usePurchaseInitate = () => {
     mutationFn: api.purchaseInitate,
   });
 };
+
+export const useGetBusinessCatalog = (slug: string) => {
+  return useQuery({
+    queryKey: ["businessCatalog", slug],
+    queryFn: () => api.getBusinessCatalog(slug),
+    enabled: !!slug,
+  });
+};
+
+export const useGetBusinessBySlug = (slug: string) => {
+  return useQuery({
+    queryKey: ["business", slug],
+    queryFn: () => api.getBusinessBySlug(slug),
+    enabled: !!slug,
+  });
+};

src/pages/catalogue/service/CatalogueService.ts

@@ -1,5 +1,5 @@
 import axios from "@/config/axios";
-import type { PurchaseInitiate } from "../types/Types";
+import type { CatalogResponseType, PurchaseInitiate } from "../types/Types";
 
 export const purchaseInitate = async (params: PurchaseInitiate) => {
   const { data } = await axios.post(
@@ -8,3 +8,15 @@ export const purchaseInitate = async (params: PurchaseInitiate) => {
   );
   return data;
 };
+
+export const getBusinessCatalog = async (slug: string) => {
+  const { data } = await axios.get<CatalogResponseType>(
+    `/public/catalogue/business/slug/${slug}`,
+  );
+  return data;
+};
+
+export const getBusinessBySlug = async (slug: string) => {
+  const { data } = await axios.get(`/public/business/${slug}`);
+  return data;
+};