online and offline base cart

src/app/cart/hooks/useCartData.ts

@@ -0,0 +1,27 @@
+import * as api from "../service/Service";
+import { useQuery, useMutation } from "@tanstack/react-query";
+
+export const useGetCart = () => {
+  return useQuery({
+    queryKey: ["cart"],
+    queryFn: api.getCart,
+  });
+};
+
+export const useAddToCart = () => {
+  return useMutation({
+    mutationFn: api.addToCart,
+  });
+};
+
+export const useUpdateCart = () => {
+  return useMutation({
+    mutationFn: api.updateCart,
+  });
+};
+
+export const useRemoveFromCart = () => {
+  return useMutation({
+    mutationFn: api.removeFromCart,
+  });
+};

src/app/cart/page.tsx

@@ -1,11 +1,16 @@
+'use client'
 import { Button } from "@/components/ui/button"
 import CartItem from "@/app/cart/components/CartItem"
 import CartSummary from "@/components/CartSummary"
 import Layout from "@/hoc/Layout"
 import { Trash } from "iconsax-react"
 import { NextPage } from "next"
+import { useGetCart } from "./hooks/useCartData"
 
 const Cart: NextPage = () => {
+
+    const { data } = useGetCart();
+
     return (
         <div className="mt-12 sm:mt-14 px-3 sm:px-4 md:px-8 lg:px-20">
             <div className="border-b border-border flex flex-row justify-between items-center gap-3 sm:gap-4">

src/app/cart/service/Service.ts

@@ -0,0 +1,27 @@
+import axios from "@/config/axios";
+import {
+  AddCartType,
+  UpdateCartType,
+  RemoveCartType,
+  CartResponseType,
+} from "../types/Types";
+
+export const getCart = async (): Promise<CartResponseType> => {
+  const { data } = await axios.get("/cart");
+  return data;
+};
+
+export const addToCart = async (params: AddCartType) => {
+  const { data } = await axios.post("/cart/add", params);
+  return data;
+};
+
+export const updateCart = async (params: UpdateCartType) => {
+  const { data } = await axios.post("/cart/update", params);
+  return data;
+};
+
+export const removeFromCart = async (params: RemoveCartType) => {
+  const { data } = await axios.post("/cart/remove", params);
+  return data;
+};

src/app/cart/types/Types.ts

@@ -0,0 +1,168 @@
+// Cart Item Types
+export type CartItemType = {
+  product: {
+    _id: number;
+    title_fa: string;
+    title_en: string;
+    seoTitle: string | null;
+    seoDescription: string | null;
+    source: string;
+    description: string;
+    metaDescription: string;
+    tags: string[];
+    advantages: string[];
+    disAdvantages: string[];
+    imagesUrl: {
+      cover: string;
+      list: string[];
+    };
+    isFake: string;
+    voice: string | null;
+    specifications: Array<{
+      title: string;
+      values: string[];
+    }>;
+    category: {
+      _id: string;
+    };
+  };
+  variant: {
+    _id: string;
+    market_status: string;
+    price: {
+      order_limit: number;
+      retailPrice: number;
+      selling_price: number;
+      is_specialSale: boolean;
+      discount_percent: number;
+      specialSale_order_limit: number | null;
+      specialSale_quantity: number | null;
+      specialSale_endDate: string | null;
+    };
+    stock: number;
+    postingTime: number;
+    isFreeShip: boolean;
+    isWholeSale: boolean;
+    shop: {
+      _id: string;
+      shopName: string;
+      shopCode: number;
+      owner: string;
+      shopDescription: string;
+      telephoneNumber: string;
+      isChatActive: boolean;
+      shopPostalCode: string;
+      logo: string;
+    };
+    shipmentMethod: Array<{
+      _id: number;
+      name: string;
+      description: string;
+      deliveryTime: number;
+      deliveryType: string;
+    }>;
+    warranty: {
+      _id: number;
+      duration: string;
+      logoUrl: string;
+      name: string;
+    };
+    meterage?: {
+      _id: number;
+      value: string;
+    };
+    size?: {
+      _id: number;
+      value: string;
+    };
+  };
+  quantity: number;
+};
+
+// Cart Types
+export type CartType = {
+  _id: string;
+  coupon_discount: number;
+  items: CartItemType[];
+  items_count: number;
+  payable_price: number;
+  retail_price: number;
+  total_discount: number;
+  user: {
+    _id: string;
+    fullName: string;
+    phoneNumber: string;
+    dateOfBirth: string | null;
+    address: {
+      _id: string;
+    };
+    nationalCode: string | null;
+    homeNumber: string | null;
+  };
+  isWholeSale: boolean;
+};
+
+// Recommended Product Type
+export type RecommendedProductType = {
+  _id: number;
+  title_fa: string;
+  title_en: string;
+  seoTitle: string | null;
+  seoDescription: string | null;
+  model: string;
+  source: string;
+  description: string;
+  metaDescription: string;
+  tags: string[];
+  advantages: string[];
+  disAdvantages: string[];
+  totalRate: number;
+  category: string;
+  shop: string;
+  brand: string;
+  status: string;
+  adminComments: string | null;
+  step: number;
+  isFake: boolean;
+  variants: string[];
+  voice: string | null;
+  deleted: boolean;
+  specifications: Array<{
+    title: string;
+    values: string[];
+  }>;
+  createdAt: string;
+  updatedAt: string;
+  imagesUrl: {
+    cover: string;
+    list: string[];
+  };
+  url: string;
+};
+
+// Cart API Response Type
+export type CartResponseType = {
+  status: number;
+  success: boolean;
+  results: {
+    cart: CartType;
+    recommended: RecommendedProductType[];
+  };
+};
+
+// Cart Action Types
+export type AddCartType = {
+  productId: number;
+  variantId: string;
+};
+
+export type UpdateCartType = {
+  productId: number;
+  variantId: string;
+  quantity: number;
+};
+
+export type RemoveCartType = {
+  productId: number;
+  variantId: string;
+};