refactor project

package-lock.json

@@ -30,15 +30,13 @@
         "react-dom": "^18.3.1",
         "react-hook-form": "^7.52.2",
         "react-hot-toast": "^2.4.1",
-        "react-modern-calendar-datepicker": "^3.1.6",
         "react-multi-date-picker": "^4.5.2",
         "react-otp-input": "^3.1.1",
         "react-router-dom": "^6.26.0",
         "react-scripts": "5.0.1",
         "typescript": "^4.9.5",
         "web-vitals": "^2.1.4",
-        "yup": "^1.4.0",
+        "yup": "^1.4.0"
-        "zustand": "^4.5.4"
       },
       "devDependencies": {
         "@tanstack/eslint-plugin-query": "^5.51.15",
@@ -16596,19 +16594,6 @@
       "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
       "license": "MIT"
     },
-    "node_modules/react-modern-calendar-datepicker": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/react-modern-calendar-datepicker/-/react-modern-calendar-datepicker-3.1.6.tgz",
-      "integrity": "sha512-lnMqEMj9Wn32/sm119tjCl5lOkq4u9vJE7wggi7hdXV4s8rPdKlH56FVVehlBi0dfYeWQVZ9npY384Zprjn4WA==",
-      "license": "MIT",
-      "dependencies": {
-        "jalaali-js": "^1.1.0"
-      },
-      "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-      }
-    },
     "node_modules/react-multi-date-picker": {
       "version": "4.5.2",
       "resolved": "https://registry.npmjs.org/react-multi-date-picker/-/react-multi-date-picker-4.5.2.tgz",
@@ -19177,15 +19162,6 @@
         "requires-port": "^1.0.0"
       }
     },
-    "node_modules/use-sync-external-store": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz",
-      "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==",
-      "license": "MIT",
-      "peerDependencies": {
-        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
-      }
-    },
     "node_modules/util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@@ -20299,34 +20275,6 @@
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
       }
-    },
-    "node_modules/zustand": {
-      "version": "4.5.4",
-      "resolved": "https://registry.npmjs.org/zustand/-/zustand-4.5.4.tgz",
-      "integrity": "sha512-/BPMyLKJPtFEvVL0E9E9BTUM63MNyhPGlvxk1XjrfWTUlV+BR8jufjsovHzrtR6YNcBEcL7cMHovL1n9xHawEg==",
-      "license": "MIT",
-      "dependencies": {
-        "use-sync-external-store": "1.2.0"
-      },
-      "engines": {
-        "node": ">=12.7.0"
-      },
-      "peerDependencies": {
-        "@types/react": ">=16.8",
-        "immer": ">=9.0.6",
-        "react": ">=16.8"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        },
-        "immer": {
-          "optional": true
-        },
-        "react": {
-          "optional": true
-        }
-      }
     }
   }
 }

package.json

@@ -25,15 +25,13 @@
     "react-dom": "^18.3.1",
     "react-hook-form": "^7.52.2",
     "react-hot-toast": "^2.4.1",
-    "react-modern-calendar-datepicker": "^3.1.6",
     "react-multi-date-picker": "^4.5.2",
     "react-otp-input": "^3.1.1",
     "react-router-dom": "^6.26.0",
     "react-scripts": "5.0.1",
     "typescript": "^4.9.5",
     "web-vitals": "^2.1.4",
-    "yup": "^1.4.0",
+    "yup": "^1.4.0"
-    "zustand": "^4.5.4"
   },
   "scripts": {
     "start": "react-scripts start",

src/components/common/table.tsx

@@ -42,6 +42,7 @@ export const Table: FC<Props> = ({ columns, data, setSorting, sorting, tableStat
                     <ComboBox placeholder="100" className="bg-auth-form" />
                 </div>
             </div>
+            {tableStatus && <div className="w-full flex justify-end items-end text-sm lg:text-lg text-primary-text-color font-normal -mb-7 pl-2">امتیاز من: {tableStatus}</div>}
             <div className="block max-w-full overflow-x-auto overflow-y-hidden bg-auth-form rounded-[40px] shadow-sm p-4 pb-0 xl:p-9 xl:pb-0 relative">
                 <table>
                     <thead className="border-b border-b-secondary-color">
@@ -70,14 +71,13 @@ export const Table: FC<Props> = ({ columns, data, setSorting, sorting, tableStat
                         ))}
                     </tbody>}
                 </table>
-                {isLoading ? <Loading /> : <>
+                {isLoading ? <Loading /> :
                     <div className="flex flex-row justify-center items-center border-t p-4 gap-x-3 mt-3">
                         <ArrowRight2 color="#11212D" size={19} className="cursor-pointer" onClick={() => table.getCanNextPage() && table.nextPage()} />
                         <p className="text-base font-normal text-primary-text-color">1-{table.getPageCount()}</p>
                         <ArrowLeft2 color="#11212D" size={19} className="cursor-pointer" onClick={() => table.getCanPreviousPage() && table.previousPage()} />
                     </div>
-                    {tableStatus && <div className="absolute text-sm bottom-1.5 lg:left-10 lg:top-5 lg:text-lg text-primary-text-color font-normal">امتیاز من: {tableStatus}</div>}
+                }
-                </>}
             </div>
         </div>
     );

src/components/score/index.tsx

@@ -12,6 +12,6 @@ export const Score = () => {
         queryFn: getScoresList
     })
     return (
-        <Table sorting={sorting} setSorting={setSorting} columns={scoresCol} data={data?.data?.data} tableStatus={data?.score} isLoading={isLoading} />
+        <Table sorting={sorting} setSorting={setSorting} columns={scoresCol} data={data?.data?.data} tableStatus={data?.data?.score} isLoading={isLoading} />
     )
 }

src/services/api/score.ts

@@ -1,21 +1,7 @@
+import { ScoreResponse } from "../../types";
 import axiosInstance from "../axios";
 
-export type ScoreData = {
-    _id: string,
-    deviceId: string,
-    score: number,
-    created_at: string,
-    updated_at: string,
-    __v: number,
-    userId: string,
-    id: string
-}
 
-export interface ScoreResponse {
-    data: ScoreData[] | []
-    score: number,
-    total: number
-}
 
-export const getScoresList = () => axiosInstance.get<ScoreData, any>("/gps/score")
+export const getScoresList = () => axiosInstance.get<ScoreResponse, any>("/gps/score")
 

src/services/api/transactions.ts

@@ -1,30 +1,4 @@
+import { TransactionsResponse } from "../../types";
 import axiosInstance from "../axios";
 
-export interface TransactionsResponse {
-    data: TransactionsData[] | []
-}
-
-export interface TransactionsData {
-    _id: string,
-    card: TransactionsCard
-    userId: string,
-    amount: number,
-    dollarAmount: number,
-    status: number,
-    created_at: string,
-    updated_at: string,
-    __v: number,
-    id: string
-}
-
-export interface TransactionsCard {
-    _id: string,
-    holderName: string,
-    PAN: number,
-    IBAN: string,
-    created_at: string,
-    updated_at: string,
-    id: string
-}
-
 export const getTransactionsList = () => axiosInstance.get<TransactionsResponse>("/gps/withdraw")

src/services/api/wallet.ts

@@ -1,17 +1,5 @@
 import axiosInstance from "../axios";
-
+import { OverviewResponse } from "./overview";
-export type OverviewUser = {
-    walletBalance: number,
-    dollarBalance: number,
-    score: number,
-    _id: string,
-    id: string
-}
-
-export interface OverviewResponse {
-    pending: boolean,
-    user: OverviewUser
-}
 
 export const getWalletDetails = () => axiosInstance.get<OverviewResponse[] | OverviewResponse | [], any>("/gps/overview/wallet")
 

src/store/user-token.ts

@@ -1,14 +0,0 @@
-import { create } from "zustand";
-
-type UserType = {
-    token: string | null
-}
-
-const useUserStore = create<UserType>((set) => ({
-    token: '',
-    setToken: (token: string | null) => {
-        set({ token: token });
-    },
-}));
-
-export default useUserStore;

src/types/index.ts

@@ -218,4 +218,61 @@ export interface AwardsResponse {
     updated_at: string,
     __v: number,
     id: string
+}
+
+interface TransactionsData {
+    _id: string,
+    card: TransactionsCard
+    userId: string,
+    amount: number,
+    dollarAmount: number,
+    status: number,
+    created_at: string,
+    updated_at: string,
+    __v: number,
+    id: string
+}
+
+interface TransactionsCard {
+    _id: string,
+    holderName: string,
+    PAN: number,
+    IBAN: string,
+    created_at: string,
+    updated_at: string,
+    id: string
+}
+
+export interface TransactionsResponse {
+    data: TransactionsData[] | []
+}
+
+type OverviewUser = {
+    walletBalance: number,
+    dollarBalance: number,
+    score: number,
+    _id: string,
+    id: string
+}
+
+export interface OverviewResponse {
+    pending: boolean,
+    user: OverviewUser
+}
+
+type ScoreData = {
+    _id: string,
+    deviceId: string,
+    score: number,
+    created_at: string,
+    updated_at: string,
+    __v: number,
+    userId: string,
+    id: string
+}
+
+export interface ScoreResponse {
+    data: ScoreData[] | []
+    score: number,
+    total: number
 }