From f3b37a5d4a93365e71c2f3e3376f959622f4665e Mon Sep 17 00:00:00 2001
From: Alihaghighattalab <alihtofficial@gmail.com>
Date: Tue, 13 Aug 2024 11:45:07 +0330
Subject: [PATCH] set header for axios - set get api bank cards

---
 src/components/forms/login-form.tsx               |  5 ++---
 src/components/management-bank-accounts/index.tsx | 14 +++++++++++++-
 src/services/api/bank-card.ts                     |  4 ++++
 src/services/axios.ts                             |  5 ++++-
 src/store/auth-token.ts                           | 11 -----------
 src/types/index.ts                                |  9 +++++++--
 6 files changed, 30 insertions(+), 18 deletions(-)
 create mode 100644 src/services/api/bank-card.ts
 delete mode 100644 src/store/auth-token.ts

diff --git a/src/components/forms/login-form.tsx b/src/components/forms/login-form.tsx
index f29420e..3317c9c 100644
--- a/src/components/forms/login-form.tsx
+++ b/src/components/forms/login-form.tsx
@@ -7,13 +7,12 @@ import { ErrorComponent } from "../common/error"
 import { yupResolver } from '@hookform/resolvers/yup'
 import { useMutation } from "@tanstack/react-query"
 import { loginMutation } from "../../services/api/auth"
-import { useAuthStore } from "../../store/auth-token"
 import { ButtonComponent } from "../common/button"
 import toast from "react-hot-toast"
 
 export const LoginForm = () => {
     const navigate = useNavigate()
-    const { setToken: setLoginToken } = useAuthStore()
+
     const { mutate, isPending } = useMutation({
         mutationFn: loginMutation
     })
@@ -30,7 +29,7 @@ export const LoginForm = () => {
             remember_me: true
         }, {
             onSuccess: (data: any) => {
-                setLoginToken(data?.data?.token)
+                window.localStorage.setItem("token", data?.data?.token)
                 toast.success("با موفقیت وارد شدین")
                 navigate("/")
             },
diff --git a/src/components/management-bank-accounts/index.tsx b/src/components/management-bank-accounts/index.tsx
index 4cd201b..836bcfb 100644
--- a/src/components/management-bank-accounts/index.tsx
+++ b/src/components/management-bank-accounts/index.tsx
@@ -1,18 +1,30 @@
-import { useState } from "react"
+import { useEffect, useState } from "react"
 import { BankCartInterface } from "../../types"
 import { bankCarts } from "../../utility/cart"
 import { BankCart } from "./bank-cart"
 import { CreateNewCart } from "./create-new-cart"
 import { AddNewCardDialog } from "./add-new-cart-dialog"
 import { DeleteCardDialog } from "./delete-card"
+import { useQuery } from "@tanstack/react-query"
+import { getUserCardsList } from "../../services/api/bank-card"
 
 export const ManagementBankAccounts = () => {
+    const { data, isLoading } = useQuery({
+        queryKey: ["bank-card"],
+        queryFn: getUserCardsList
+    })
     const [showDialog, setShowDialog] = useState<boolean>(false)
     const handleCloseDialog = () => setShowDialog(false)
     const handleOpenDialog = () => setShowDialog(true)
     const [showDeleteDialog, setShowDeleteDialog] = useState<boolean>(false)
     const handleOpenDeleteDialog = () => setShowDeleteDialog(true)
     const handleCloseDeleteDialog = () => setShowDeleteDialog(false)
+
+    useEffect(() => {
+        console.log("data =>", data)
+    }, [data])
+
+    if (isLoading) return <p>LOADING...</p>
     return (
         <>
             <div className="w-full grid grid-cols-1 xl:grid-cols-2 2xl:grid-cols-3 gap-6">
diff --git a/src/services/api/bank-card.ts b/src/services/api/bank-card.ts
new file mode 100644
index 0000000..1688843
--- /dev/null
+++ b/src/services/api/bank-card.ts
@@ -0,0 +1,4 @@
+import { LoginFormInterface } from "../../types";
+import { axiosInstance } from "../axios";
+
+export const getUserCardsList = () => axiosInstance.get<LoginFormInterface>("/gps/bank-card")
\ No newline at end of file
diff --git a/src/services/axios.ts b/src/services/axios.ts
index 42f5f05..8297f4e 100644
--- a/src/services/axios.ts
+++ b/src/services/axios.ts
@@ -1,7 +1,10 @@
 import axios, { AxiosRequestConfig } from "axios";
 
 const axiosParam: AxiosRequestConfig = {
-    baseURL: process.env.REACT_APP_API_Address
+    baseURL: process.env.REACT_APP_API_Address,
+    headers: {
+        Authorization: `Bearer ${window.localStorage.getItem("token")}`,
+    }
 }
 
 export const axiosInstance = axios.create(axiosParam)
\ No newline at end of file
diff --git a/src/store/auth-token.ts b/src/store/auth-token.ts
deleted file mode 100644
index 27e7d73..0000000
--- a/src/store/auth-token.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import create from 'zustand';
-
-interface AuthState {
-    token: string | null;
-    setToken: (token: string | null) => void;
-}
-
-export const useAuthStore = create<AuthState>((set) => ({
-    token: null,
-    setToken: (token) => set({ token }),
-}));
\ No newline at end of file
diff --git a/src/types/index.ts b/src/types/index.ts
index 80653a1..88b34c9 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -2,7 +2,12 @@ import React from "react"
 
 export interface LoginFormInterface {
     username: string,
-    password: string
+    password: string,
+    remember_me?: boolean
+}
+
+export interface LoginResponseInterface {
+    token: string
 }
 
 export interface ResetPasswordInterface {
@@ -136,5 +141,5 @@ export interface SubscriptionReportInterface {
     renewal_type: string
     amount: string
     contribution: string,
-    percentage:string
+    percentage: string
 }
\ No newline at end of file