From 6e1fb1f072201667546b1c7a7b06befd31383925 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 15:53:43 +0330
Subject: [PATCH 01/37] Update imports

---
 frontend/components/global/ToastContainer/ToastBox.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/components/global/ToastContainer/ToastBox.vue b/frontend/components/global/ToastContainer/ToastBox.vue
index d274de6..d12d88e 100644
--- a/frontend/components/global/ToastContainer/ToastBox.vue
+++ b/frontend/components/global/ToastContainer/ToastBox.vue
@@ -2,7 +2,8 @@
 
 // import
 
-import type { ToastOptions } from "~/composables/useToast";
+import type { ToastOptions } from "~/composables/global/useToast";
+import { useToast } from "~/composables/global/useToast";
 
 // type
 

From 17493beffa5bf63c2dd0b7e365c6786cd4a005b6 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 15:53:52 +0330
Subject: [PATCH 02/37] Updated

---
 frontend/components/global/Header.vue | 20 +++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/frontend/components/global/Header.vue b/frontend/components/global/Header.vue
index 07cda45..3341176 100644
--- a/frontend/components/global/Header.vue
+++ b/frontend/components/global/Header.vue
@@ -19,24 +19,24 @@ const { logout } = useAuth();
 const nav_links = ref<NavLink[]>([
     {
         title: "فروشگاه",
-        path: "#",
+        path: "#"
     },
     {
         title: "دسته بندی ها",
-        path: "#",
+        path: "#"
     },
     {
         title: "جستجو",
-        path: "#",
+        path: "#"
     },
     {
         title: "ارتباط با ما",
-        path: "#",
+        path: "#"
     },
     {
         title: "امکانات",
-        path: "#",
-    },
+        path: "#"
+    }
 ]);
 </script>
 
@@ -53,7 +53,13 @@ const nav_links = ref<NavLink[]>([
                 <button @click="() => logout(true)">خروج از وبسایت</button>
             </div>
 
-            <div v-else class="text-black">KIR</div>
+            <button
+                @click="navigateTo('/signin')"
+                class="cursor-pointer"
+                v-else
+            >
+                وارد شوید
+            </button>
 
             <nav
                 class="flex-center gap-[2.5rem] w-8/12 typo-label-sm text-slate-500"

From 389edd93173cbc684fd10ca02f97806524c4c41e Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 15:57:50 +0330
Subject: [PATCH 03/37] Updated

---
 frontend/components/home/Categories.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/components/home/Categories.vue b/frontend/components/home/Categories.vue
index 13b07b3..aed0b34 100644
--- a/frontend/components/home/Categories.vue
+++ b/frontend/components/home/Categories.vue
@@ -61,6 +61,7 @@ const onSwiper = (swiper: SwiperClass) => {
                 :key="slide.id"
             >
                 <CategoryCard
+                    :id="slide.id"
                     category="یک دسته بندی تست"
                     picture="/img/product-1.jpg"
                     :count="20"

From 5cb831e848898aa37aa4de573188c57409f3b290 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:00:35 +0330
Subject: [PATCH 04/37] Add auth for chat

---
 .../product/ChatBox/ChatBoxContainer.vue      | 90 ++++++++++---------
 1 file changed, 50 insertions(+), 40 deletions(-)

diff --git a/frontend/components/product/ChatBox/ChatBoxContainer.vue b/frontend/components/product/ChatBox/ChatBoxContainer.vue
index a0c2d63..cedb98c 100644
--- a/frontend/components/product/ChatBox/ChatBoxContainer.vue
+++ b/frontend/components/product/ChatBox/ChatBoxContainer.vue
@@ -7,6 +7,7 @@ import ChatInput from "~/components/product/ChatBox/ChatInput.vue";
 import { useIsMutating } from "@tanstack/vue-query";
 import { MUTATION_KEYS } from "~/constants";
 import CloseButton from "~/components/product/ChatBox/CloseButton.vue";
+import { useAuth } from "~/composables/api/auth/useAuth";
 
 // provide-inject
 
@@ -14,6 +15,8 @@ const { isOpen } = inject("isOpen") as any;
 
 // state
 
+const { isLoggedIn } = useAuth();
+
 const route = useRoute();
 const id = route.params.id as string | number;
 
@@ -126,55 +129,62 @@ whenever(
         >
             <CloseButton :disabled="!!isCreateMessagePending" />
 
-            <Transition name="zoom" mode="out-in">
-                <div
-                    v-if="!isChatPending"
-                    class="p-4.5 h-full flex flex-col justify-between gap-4"
-                >
+            <template v-if="isLoggedIn">
+                <Transition name="zoom" mode="out-in">
+
                     <div
-                        :style="{
+                        v-if="!isChatPending"
+                        class="p-4.5 h-full flex flex-col justify-between gap-4"
+                    >
+                        <div
+                            :style="{
                             maskImage:
                                 'linear-gradient(to top, transparent, black 5%, black, black)',
                         }"
-                        class="hide-scrollbar flex flex-col py-7 gap-6 h-full overflow-y-auto"
-                        ref="chatContainerEl"
-                    >
-                        <div
-                            v-if="hasMoreChat"
-                            class="py-2 flex items-center justify-center"
+                            class="hide-scrollbar flex flex-col py-7 gap-6 h-full overflow-y-auto"
+                            ref="chatContainerEl"
                         >
-                            <Icon name="svg-spinners:3-dots-fade" size="24" />
+                            <div
+                                v-if="hasMoreChat"
+                                class="py-2 flex items-center justify-center"
+                            >
+                                <Icon name="svg-spinners:3-dots-fade" size="24" />
+                            </div>
+                            <ChatMessage
+                                v-for="(message, index) in chatMessages"
+                                :key="message.id"
+                                :id="message.id"
+                                :reverse="message.sender === 'ai'"
+                                :content="message.content"
+                                :isLast="chatMessages?.length === index + 1"
+                                @textUpdate="scrollToBottom"
+                            />
+                            <ChatMessage
+                                v-if="!!isCreateMessagePending"
+                                :id="Date.now() + 1"
+                                reverse
+                                content=""
+                                isLast
+                                @textUpdate="scrollToBottom"
+                                :loadingContent="!!isCreateMessagePending"
+                            />
                         </div>
-                        <ChatMessage
-                            v-for="(message, index) in chatMessages"
-                            :key="message.id"
-                            :id="message.id"
-                            :reverse="message.sender === 'ai'"
-                            :content="message.content"
-                            :isLast="chatMessages?.length === index + 1"
-                            @textUpdate="scrollToBottom"
-                        />
-                        <ChatMessage
-                            v-if="!!isCreateMessagePending"
-                            :id="Date.now() + 1"
-                            reverse
-                            content=""
-                            isLast
-                            @textUpdate="scrollToBottom"
-                            :loadingContent="!!isCreateMessagePending"
-                        />
+
+                        <ChatInput />
                     </div>
 
-                    <ChatInput />
-                </div>
 
-                <div
-                    v-else
-                    class="w-full h-full flex items-center justify-center absolute inset-0"
-                >
-                    <AiLoading />
-                </div>
-            </Transition>
+                    <div
+                        v-else
+                        class="w-full h-full flex items-center justify-center absolute inset-0"
+                    >
+                        <AiLoading />
+                    </div>
+                </Transition>
+            </template>
+            <div class="text-black p-4.5 size-full flex justify-center items-center" v-else>
+                Please sign in first
+            </div>
         </div>
     </Transition>
 </template>

From 04b668361da5602bf698c78cc4d21bedd3582b83 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:01:03 +0330
Subject: [PATCH 05/37] Add refresh token and isLoggedIn computed

---
 frontend/composables/api/auth/useAuth.ts | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/frontend/composables/api/auth/useAuth.ts b/frontend/composables/api/auth/useAuth.ts
index 2fa8493..e74d967 100644
--- a/frontend/composables/api/auth/useAuth.ts
+++ b/frontend/composables/api/auth/useAuth.ts
@@ -3,6 +3,7 @@ export const useAuth = () => {
     // state
 
     const token = useCookie("token");
+    const refreshToken = useCookie("refresh-token");
 
     // method
 
@@ -10,11 +11,20 @@ export const useAuth = () => {
         token.value = newToken;
     };
 
+    const updateRefreshToken = (newToken: string) => {
+        refreshToken.value = newToken;
+    };
+
     const logout = (reload ?: boolean) => {
         token.value = undefined;
+        refreshToken.value = undefined;
         if (reload) window.location.reload();
     };
 
-    return { token, updateToken, logout };
+    // computed
+
+    const isLoggedIn = computed(() => !!token.value);
+
+    return { token, refreshToken, updateRefreshToken, updateToken, logout, isLoggedIn };
 
 };
\ No newline at end of file

From 340d0ede2653ae947801c0db04bf3765a4ec98ff Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:01:18 +0330
Subject: [PATCH 06/37] Add refresh token composable api

---
 .../composables/api/auth/useRefreshAuth.ts    | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 frontend/composables/api/auth/useRefreshAuth.ts

diff --git a/frontend/composables/api/auth/useRefreshAuth.ts b/frontend/composables/api/auth/useRefreshAuth.ts
new file mode 100644
index 0000000..6540427
--- /dev/null
+++ b/frontend/composables/api/auth/useRefreshAuth.ts
@@ -0,0 +1,36 @@
+// imports
+
+import { useMutation } from "@tanstack/vue-query";
+import { API_ENDPOINTS } from "~/constants";
+
+// types
+
+export type RefreshAuthRequest = {
+    refresh: string,
+};
+
+export type RefreshAuthResponse = {
+    access: string,
+    refresh: string,
+};
+
+
+const useRefreshAuth = () => {
+
+    // state
+
+    const { $axios: axios } = useNuxtApp();
+
+    // methods
+
+    const handleRefreshAuth = async (variables: RefreshAuthRequest) => {
+        const { data } = await axios.post<RefreshAuthResponse>(`${API_ENDPOINTS.auth.refresh}/`, variables);
+        return data;
+    };
+
+    return useMutation({
+        mutationFn: (variables: RefreshAuthRequest) => handleRefreshAuth(variables)
+    });
+};
+
+export default useRefreshAuth;

From 2af9ab6e8ce221b5ab951206b052eb7c94bd2948 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:01:27 +0330
Subject: [PATCH 07/37] Add verify token composable api

---
 frontend/composables/api/auth/useVerify.ts | 30 ++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 frontend/composables/api/auth/useVerify.ts

diff --git a/frontend/composables/api/auth/useVerify.ts b/frontend/composables/api/auth/useVerify.ts
new file mode 100644
index 0000000..44c6c6d
--- /dev/null
+++ b/frontend/composables/api/auth/useVerify.ts
@@ -0,0 +1,30 @@
+// imports
+
+import { useMutation } from "@tanstack/vue-query";
+import { API_ENDPOINTS } from "~/constants";
+
+// types
+
+export type VerifyRequest = {
+    token: string,
+};
+
+const useVerify = () => {
+
+    // state
+
+    const { $axios: axios } = useNuxtApp();
+
+    // methods
+
+    const handleVerify = async (variables: VerifyRequest) => {
+        const { data } = await axios.post(`${API_ENDPOINTS.auth.verify}`, variables);
+        return data;
+    };
+
+    return useMutation({
+        mutationFn: (variables: VerifyRequest) => handleVerify(variables)
+    });
+};
+
+export default useVerify;

From 0a54b99aefaeb4a0bec2e2a0bbd6d6da7de80d2c Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:01:53 +0330
Subject: [PATCH 08/37] Enable chat api when isLoggedIn is true

---
 frontend/composables/api/chat/useGetChat.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/frontend/composables/api/chat/useGetChat.ts b/frontend/composables/api/chat/useGetChat.ts
index 32a6da1..8209937 100644
--- a/frontend/composables/api/chat/useGetChat.ts
+++ b/frontend/composables/api/chat/useGetChat.ts
@@ -2,6 +2,7 @@
 
 import { useInfiniteQuery } from "@tanstack/vue-query";
 import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
+import { useAuth } from "~/composables/api/auth/useAuth";
 
 // types
 
@@ -16,6 +17,8 @@ const useGetBranch = (
 
     const { $axios: axios } = useNuxtApp();
 
+    const { isLoggedIn } = useAuth();
+
     // method
 
     const handleGetChat = async ({ productId, limit, offset }: {
@@ -37,7 +40,7 @@ const useGetBranch = (
     };
 
     return useInfiniteQuery({
-        enabled,
+        enabled: isLoggedIn,
         queryKey: [QUERY_KEYS.chat],
         initialPageParam: {
             limit: 10,

From d58c8faf9da9adbc24105d19d86515d32af868b8 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:02:07 +0330
Subject: [PATCH 09/37] Add refresh and verify api endpoints

---
 frontend/constants/index.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/constants/index.ts b/frontend/constants/index.ts
index 7a3cd9f..60e2a1c 100644
--- a/frontend/constants/index.ts
+++ b/frontend/constants/index.ts
@@ -7,6 +7,8 @@ export const API_ENDPOINTS = {
         get: "/products",
     },
     auth: {
+        refresh: "/token/refresh",
+        verify: "/accounts/verify",
         signin: "/token",
         logout: "/accounts/logout",
     },

From c5ba268e0aa9bef54b0f73e42689a9e2fbd81724 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:02:54 +0330
Subject: [PATCH 10/37] Implement token validation cycle

---
 frontend/layouts/Default.vue | 67 ++++++++++++++++++++++++++++++++++++
 1 file changed, 67 insertions(+)

diff --git a/frontend/layouts/Default.vue b/frontend/layouts/Default.vue
index cb94ffa..3d5c39c 100644
--- a/frontend/layouts/Default.vue
+++ b/frontend/layouts/Default.vue
@@ -1,3 +1,70 @@
+<script lang="ts" setup>
+
+// import
+
+import { useAuth } from "~/composables/api/auth/useAuth";
+import useRefreshAuth from "~/composables/api/auth/useRefreshAuth";
+import useVerify from "~/composables/api/auth/useVerify";
+
+// state
+
+const { mutateAsync: refreshAuth } = useRefreshAuth();
+const { token, refreshToken, updateToken, updateRefreshToken, logout } = useAuth();
+const { mutateAsync: verify } = useVerify();
+
+// lifecycle
+
+onServerPrefetch(async () => {
+    if (!!token.value) {
+
+        // 1.1 - token is there
+
+        try {
+
+            await verify({
+                token: token.value
+            });
+
+            // 2.1 - token is valid, finish
+
+        } catch (e) {
+
+            // 2.2 - token is there, but not valid, try to refresh token
+
+            if (!!refreshToken.value) {
+
+                // 3.1 - refresh token is there, try to refresh
+
+                try {
+                    const refreshResponse = await refreshAuth({ refresh: refreshToken.value });
+
+                    // 4.1 - token is refreshed successfully, finish
+
+                    updateToken(refreshResponse.access);
+                    updateRefreshToken(refreshResponse.refresh);
+                } catch (e) {
+
+                    // 4.2 - cant refreshing token, logout
+
+                    logout();
+                }
+            } else {
+
+                // 3.2 - refresh token is not exist, logout
+
+                logout();
+            }
+        }
+    } else {
+
+        // 1.2 - token is not exist, logout
+
+        logout();
+    }
+});
+
+</script>
+
 <template>
     <div
         class="w-full flex flex-col-center persian-number font-iran-yekan-x"

From 458025edb40edae276e401b4f48ade01d5056400 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:03:12 +0330
Subject: [PATCH 11/37] Logout if there is no token

---
 frontend/middleware/checkIsLoggedIn.ts | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/frontend/middleware/checkIsLoggedIn.ts b/frontend/middleware/checkIsLoggedIn.ts
index 7f79e6b..e7f100b 100644
--- a/frontend/middleware/checkIsLoggedIn.ts
+++ b/frontend/middleware/checkIsLoggedIn.ts
@@ -1,9 +1,12 @@
-export default defineNuxtRouteMiddleware(() => {
-    const { token } = useAuth();
+import { useAuth } from "~/composables/api/auth/useAuth";
 
-    if (token.value) {
+export default defineNuxtRouteMiddleware(() => {
+    const { token, logout } = useAuth();
+
+    if (!!token.value) {
         return;
     } else {
+        logout();
         return navigateTo("/signin");
     }
 });

From 72b7c8be9a1ad70bee1fcd3c36393f41700ac86f Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:03:20 +0330
Subject: [PATCH 12/37] Updated

---
 frontend/middleware/checkIsNotLoggedIn.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/middleware/checkIsNotLoggedIn.ts b/frontend/middleware/checkIsNotLoggedIn.ts
index 3e8fdc3..3f183e5 100644
--- a/frontend/middleware/checkIsNotLoggedIn.ts
+++ b/frontend/middleware/checkIsNotLoggedIn.ts
@@ -1,3 +1,5 @@
+import { useAuth } from "~/composables/api/auth/useAuth";
+
 export default defineNuxtRouteMiddleware(() => {
 
     const { token } = useAuth();

From 46c474658227c41dc822e3fd2330690a8cffb819 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:03:42 +0330
Subject: [PATCH 13/37] Updated

---
 frontend/pages/signin/index.vue | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/frontend/pages/signin/index.vue b/frontend/pages/signin/index.vue
index b201195..ada01c8 100644
--- a/frontend/pages/signin/index.vue
+++ b/frontend/pages/signin/index.vue
@@ -28,11 +28,10 @@ definePageMeta({
 
 const { addToast } = useToast();
 
-const { updateToken } = useAuth();
+const { updateToken, updateRefreshToken } = useAuth();
 
 const { refetch: refetchAccount } = useGetAccount();
 
-
 const showOtp = ref(false);
 const otpCode = ref([]);
 
@@ -107,6 +106,8 @@ const handleLogin = async () => {
             });
 
             updateToken(response.access);
+            updateRefreshToken(response.refresh);
+            await new Promise(resolve => setTimeout(resolve, 1000));
             await refetchAccount();
 
             addToast({
@@ -116,9 +117,7 @@ const handleLogin = async () => {
                 }
             });
 
-            setTimeout(() => {
-                navigateTo("/");
-            }, 2000);
+            navigateTo("/");
         } catch (e) {
             otpCode.value = [];
             addToast({ message: "مشکلی پیش آمده" });

From 56b8885dc432fe126e53cfdc8034f57f5907bcbd Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:03:55 +0330
Subject: [PATCH 14/37] Updated

---
 frontend/plugins/axios.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/frontend/plugins/axios.ts b/frontend/plugins/axios.ts
index 2a63f37..16ac61c 100644
--- a/frontend/plugins/axios.ts
+++ b/frontend/plugins/axios.ts
@@ -4,10 +4,10 @@ import { API_ENDPOINTS } from "~/constants";
 
 export default defineNuxtPlugin(() => {
     const config = useRuntimeConfig();
-    const { token } = useAuth();
+    const { token, logout } = useAuth();
 
     const axios = axiosOriginal.create({
-        baseURL: config.public.API_BASE_URL,
+        baseURL: config.public.API_BASE_URL
     });
 
     axios.interceptors.request.use((config) => {
@@ -25,9 +25,9 @@ export default defineNuxtPlugin(() => {
         return response;
     }, function(error) {
 
-        if (error.status === 401) {
-            logout();
-        }
+        // if (error.status === 401) {
+        //     logout();
+        // }
 
         return Promise.reject(error);
     });

From fc92ce7ed2311737b20ef2a9334bbc677eb1ee2d Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:04:09 +0330
Subject: [PATCH 15/37] Updated

---
 frontend/.gitignore | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/.gitignore b/frontend/.gitignore
index 4a7f73a..5379696 100644
--- a/frontend/.gitignore
+++ b/frontend/.gitignore
@@ -10,7 +10,7 @@ dist
 node_modules
 
 # Logs
-logs
+.logs
 *.log
 
 # Misc

From 3fdaa8f2c5f6aced6b1ba43f80735c7a7a860414 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:05:49 +0330
Subject: [PATCH 16/37] Add swagger config

---
 frontend/swagger.yaml | 1213 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 1213 insertions(+)
 create mode 100644 frontend/swagger.yaml

diff --git a/frontend/swagger.yaml b/frontend/swagger.yaml
new file mode 100644
index 0000000..ccd8b14
--- /dev/null
+++ b/frontend/swagger.yaml
@@ -0,0 +1,1213 @@
+openapi: 3.0.3
+info:
+  title: ''
+  version: 1.0.0
+paths:
+  /accounts/address/{id}:
+    get:
+      operationId: accounts_address_retrieve
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - accounts
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/UserAddress'
+          description: ''
+  /accounts/address/create:
+    post:
+      operationId: accounts_address_create_create
+      tags:
+        - accounts
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/UserAddressRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/UserAddressRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/UserAddressRequest'
+        required: true
+      security:
+        - jwtAuth: []
+      responses:
+        '201':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/UserAddress'
+          description: ''
+  /accounts/address/delete/{id}:
+    delete:
+      operationId: accounts_address_delete_destroy
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - accounts
+      security:
+        - jwtAuth: []
+      responses:
+        '204':
+          description: No response body
+  /accounts/address/edit/{id}:
+    put:
+      operationId: accounts_address_edit_update
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - accounts
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/UserAddressRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/UserAddressRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/UserAddressRequest'
+        required: true
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/UserAddress'
+          description: ''
+    patch:
+      operationId: accounts_address_edit_partial_update
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - accounts
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/PatchedUserAddressRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/PatchedUserAddressRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/PatchedUserAddressRequest'
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/UserAddress'
+          description: ''
+  /accounts/address/list:
+    get:
+      operationId: accounts_address_list_list
+      tags:
+        - accounts
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                type: array
+                items:
+                  $ref: '#/components/schemas/UserAddress'
+          description: ''
+  /accounts/profile:
+    get:
+      operationId: accounts_profile_retrieve
+      tags:
+        - accounts
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Profile'
+          description: ''
+    patch:
+      operationId: accounts_profile_partial_update
+      tags:
+        - accounts
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/PatchedProfileRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/PatchedProfileRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/PatchedProfileRequest'
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Profile'
+          description: ''
+  /accounts/send_otp:
+    post:
+      operationId: accounts_send_otp_create
+      tags:
+        - Authentication
+      requestBody:
+        content:
+          application/json:
+            schema:
+              type: object
+              properties:
+                phone:
+                  type: string
+                  example: 09123456789
+              required:
+                - phone
+      security:
+        - jwtAuth: []
+        - {}
+      responses:
+        '200':
+          description: No response body
+  /accounts/verify:
+    post:
+      operationId: accounts_verify_create
+      description: |-
+        Takes a token and indicates if it is valid.  This view provides no
+        information about a token's fitness for a particular use.
+      tags:
+        - accounts
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/TokenVerifyRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/TokenVerifyRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/TokenVerifyRequest'
+        required: true
+      responses:
+        '200':
+          description: No response body
+  /chat/product/{id}:
+    get:
+      operationId: chat_product_retrieve
+      description: Retrieve all messages for a product chat.
+      summary: Retrieve messages for a product chat
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+        - in: query
+          name: limit
+          schema:
+            type: integer
+            default: 10
+          description: Number of results to return per page.
+        - in: query
+          name: offset
+          schema:
+            type: integer
+            default: 0
+          description: The starting position of the results.
+      tags:
+        - chat
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                type: object
+                additionalProperties: {}
+                description: Unspecified response body
+          description: ''
+    post:
+      operationId: chat_product_create
+      description: Send a new message in the product chat.
+      summary: Send a new message in the product chat
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - chat
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/NewMessageRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/NewMessageRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/NewMessageRequest'
+        required: true
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                type: object
+                additionalProperties: {}
+                description: Unspecified response body
+          description: ''
+        '400':
+          content:
+            application/json:
+              schema:
+                type: object
+                additionalProperties: {}
+                description: Unspecified response body
+          description: ''
+  /products/:
+    get:
+      operationId: products_list
+      description: Retrieve products with optional filters and sorting. Provide a
+        list of category IDs to filter products by those categories and their subcategories.
+      parameters:
+        - in: query
+          name: category
+          schema:
+            type: array
+            items:
+              type: number
+          explode: false
+          style: form
+        - in: query
+          name: has_discount
+          schema:
+            type: boolean
+          description: Filter products that have a discount.
+        - in: query
+          name: in_stock
+          schema:
+            type: boolean
+          description: Filter products that are in stock (positive stock).
+        - in: query
+          name: limit
+          schema:
+            type: integer
+          description: Number of results to return per page (pagination).
+        - in: query
+          name: offset
+          schema:
+            type: integer
+          description: The starting position of the results (pagination).
+        - in: query
+          name: price_gte
+          schema:
+            type: number
+            format: float
+          description: Filter products with price greater than or equal to this value.
+        - in: query
+          name: price_lte
+          schema:
+            type: number
+            format: float
+          description: Filter products with price less than or equal to this value.
+        - in: query
+          name: search
+          schema:
+            type: string
+          description: Search by product name or description.
+        - in: query
+          name: sort
+          schema:
+            type: string
+          description: |-
+            Sort results by one of the following fields:
+            `name`, `-name`, `price`, `-price`, `discount`, `-discount`, `created_at`, `-created_at`.
+            Prefix with `-` for descending order.
+      tags:
+        - products
+      security:
+        - {}
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/PaginatedProductList'
+          description: ''
+        '404':
+          content:
+            application/json:
+              schema:
+                type: object
+                additionalProperties: {}
+          description: ''
+  /products/{id}:
+    get:
+      operationId: products_retrieve
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - products
+      security:
+        - {}
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Product'
+          description: ''
+  /products/{id}/comments:
+    get:
+      operationId: products_comments_retrieve_2
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - products
+      security:
+        - jwtAuth: []
+        - {}
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Comment'
+          description: ''
+    post:
+      operationId: products_comments_create_2
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - products
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/CommentRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/CommentRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/CommentRequest'
+        required: true
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Comment'
+          description: ''
+    delete:
+      operationId: products_comments_destroy_2
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - products
+      security:
+        - jwtAuth: []
+      responses:
+        '204':
+          description: No response body
+  /products/categories:
+    get:
+      operationId: products_categories_list
+      parameters:
+        - in: query
+          name: search
+          schema:
+            type: string
+          description: Search by category name or description.
+      tags:
+        - products
+      security:
+        - {}
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                type: array
+                items:
+                  $ref: '#/components/schemas/Category'
+          description: ''
+        '404':
+          content:
+            application/json:
+              schema:
+                type: object
+                additionalProperties: {}
+          description: ''
+  /products/comments/{id}:
+    get:
+      operationId: products_comments_retrieve
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - products
+      security:
+        - jwtAuth: []
+        - {}
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Comment'
+          description: ''
+    post:
+      operationId: products_comments_create
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - products
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/CommentRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/CommentRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/CommentRequest'
+        required: true
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Comment'
+          description: ''
+    delete:
+      operationId: products_comments_destroy
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - products
+      security:
+        - jwtAuth: []
+      responses:
+        '204':
+          description: No response body
+  /tickets/:
+    get:
+      operationId: tickets_list
+      tags:
+        - tickets
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                type: array
+                items:
+                  $ref: '#/components/schemas/Ticket'
+          description: ''
+  /tickets/{id}:
+    get:
+      operationId: tickets_retrieve
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - tickets
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Ticket'
+          description: ''
+  /tickets/{id}/messages:
+    post:
+      operationId: tickets_messages_create
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - tickets
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/MessageRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/MessageRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/MessageRequest'
+        required: true
+      security:
+        - jwtAuth: []
+      responses:
+        '201':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Message'
+          description: ''
+  /tickets/{id}/update-status:
+    post:
+      operationId: tickets_update_status_create
+      parameters:
+        - in: path
+          name: id
+          schema:
+            type: integer
+          required: true
+      tags:
+        - tickets
+      security:
+        - jwtAuth: []
+      responses:
+        '200':
+          description: No response body
+  /tickets/create:
+    post:
+      operationId: tickets_create_create
+      tags:
+        - tickets
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/TicketRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/TicketRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/TicketRequest'
+        required: true
+      security:
+        - jwtAuth: []
+      responses:
+        '201':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/Ticket'
+          description: ''
+  /token/:
+    post:
+      operationId: token_create
+      description: |-
+        Takes a set of user credentials and returns an access and refresh JSON web
+        token pair to prove the authentication of those credentials.
+      tags:
+        - Authentication
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/CustomTokenObtainPairRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/CustomTokenObtainPairRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/CustomTokenObtainPairRequest'
+        required: true
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/CustomTokenObtainPair'
+          description: ''
+  /token/refresh/:
+    post:
+      operationId: token_refresh_create
+      description: |-
+        Takes a refresh type JSON web token and returns an access type JSON web
+        token if the refresh token is valid.
+      tags:
+        - token
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/TokenRefreshRequest'
+          application/x-www-form-urlencoded:
+            schema:
+              $ref: '#/components/schemas/TokenRefreshRequest'
+          multipart/form-data:
+            schema:
+              $ref: '#/components/schemas/TokenRefreshRequest'
+        required: true
+      responses:
+        '200':
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/TokenRefresh'
+          description: ''
+components:
+  schemas:
+    Category:
+      type: object
+      properties:
+        id:
+          type: integer
+          readOnly: true
+        name:
+          type: string
+          title: نام دسته‌بندی
+          maxLength: 50
+        slug:
+          type: string
+          description: اسم دسته را برای مسیر به انگلیسی و بدون فاصله وارد کنید
+          maxLength: 50
+          pattern: ^[-a-zA-Z0-9_]+$
+        icon:
+          type: string
+          nullable: true
+          title: آیکون دسته‌بندی
+          maxLength: 100
+        meta_title:
+          type: string
+          nullable: true
+          title: عنوان متا
+          description: عنوان متا برای SEO
+          maxLength: 60
+        meta_description:
+          type: string
+          nullable: true
+          title: توضیحات متا
+          description: توضیحات متا برای SEO
+          maxLength: 160
+        parent:
+          type: integer
+          nullable: true
+          title: دسته‌بندی والد
+        children:
+          type: string
+          readOnly: true
+      required:
+        - children
+        - id
+        - name
+        - slug
+    Comment:
+      type: object
+      properties:
+        id:
+          type: integer
+          readOnly: true
+        content:
+          type: string
+          title: محتوای نظر
+        timestamp:
+          type: string
+          format: date-time
+          readOnly: true
+          title: زمان ثبت کامنت
+        show:
+          type: boolean
+          readOnly: true
+          title: نشان دادن کامنت
+        product:
+          type: integer
+          readOnly: true
+          title: محصول
+        user:
+          type: integer
+      required:
+        - content
+        - id
+        - product
+        - show
+        - timestamp
+        - user
+    CommentRequest:
+      type: object
+      properties:
+        content:
+          type: string
+          minLength: 1
+          title: محتوای نظر
+        user:
+          type: integer
+      required:
+        - content
+        - user
+    CurrencyEnum:
+      enum:
+        - dollor
+        - toman
+        - derham
+      type: string
+      description: |-
+        * `dollor` - دلار
+        * `toman` - تومان
+        * `derham` - درهم
+    CustomTokenObtainPair:
+      type: object
+      properties:
+        otp:
+          type: string
+    CustomTokenObtainPairRequest:
+      type: object
+      properties:
+        otp:
+          type: string
+          minLength: 1
+        phone:
+          type: string
+          writeOnly: true
+          minLength: 1
+      required:
+        - phone
+    Message:
+      type: object
+      properties:
+        id:
+          type: integer
+          readOnly: true
+        content:
+          type: string
+        created_at:
+          type: string
+          format: date-time
+          readOnly: true
+        ticket:
+          type: integer
+        sender:
+          type: integer
+      required:
+        - content
+        - created_at
+        - id
+        - sender
+        - ticket
+    MessageRequest:
+      type: object
+      properties:
+        content:
+          type: string
+          minLength: 1
+        ticket:
+          type: integer
+        sender:
+          type: integer
+      required:
+        - content
+        - sender
+        - ticket
+    NewMessageRequest:
+      type: object
+      properties:
+        new_message:
+          type: string
+          minLength: 1
+          description: The message content to send to the chat.
+      required:
+        - new_message
+    PaginatedProductList:
+      type: object
+      required:
+        - count
+        - results
+      properties:
+        count:
+          type: integer
+          example: 123
+        next:
+          type: string
+          nullable: true
+          format: uri
+          example: http://api.example.org/accounts/?offset=400&limit=100
+        previous:
+          type: string
+          nullable: true
+          format: uri
+          example: http://api.example.org/accounts/?offset=200&limit=100
+        results:
+          type: array
+          items:
+            $ref: '#/components/schemas/Product'
+    PatchedProfileRequest:
+      type: object
+      properties:
+        first_name:
+          type: string
+          title: نام
+          maxLength: 50
+        last_name:
+          type: string
+          title: نام خانوادگی
+          maxLength: 50
+        email:
+          type: string
+          format: email
+          nullable: true
+          title: ایمیل
+          maxLength: 255
+        profile_photo:
+          type: string
+          format: binary
+          nullable: true
+          title: عکس پروفایل
+    PatchedUserAddressRequest:
+      type: object
+      properties:
+        name:
+          type: string
+          minLength: 1
+          maxLength: 30
+        address:
+          type: string
+          minLength: 1
+        postal_code:
+          type: string
+          minLength: 1
+          maxLength: 10
+        phone:
+          type: string
+          minLength: 1
+          maxLength: 11
+    Product:
+      type: object
+      properties:
+        id:
+          type: integer
+          readOnly: true
+        price:
+          type: string
+          readOnly: true
+        is_new:
+          type: string
+          readOnly: true
+        name:
+          type: string
+          maxLength: 255
+        description:
+          type: string
+        currency:
+          allOf:
+            - $ref: '#/components/schemas/CurrencyEnum'
+          title: نوع ارز
+        image:
+          type: string
+          format: uri
+        rating:
+          type: integer
+          maximum: 2147483647
+          minimum: 0
+        view:
+          type: integer
+          maximum: 2147483647
+          minimum: -2147483648
+          title: بازدید
+        sell:
+          type: integer
+          maximum: 2147483647
+          minimum: -2147483648
+          title: فروش
+        in_stock:
+          type: integer
+          maximum: 2147483647
+          minimum: -2147483648
+          title: تعداد موجود
+        discount:
+          type: integer
+          maximum: 32767
+          minimum: -32768
+          title: تخفیف
+        slug:
+          type: string
+          nullable: true
+          title: نام یکتا
+          description: این فیلد را خالی بگذارید
+          pattern: ^[-\w]+$
+          maxLength: 50
+        meta_description:
+          type: string
+          nullable: true
+          description: این فیلد را حتما پر کنید
+          maxLength: 300
+        meta_keywords:
+          type: string
+          nullable: true
+          description: این فیلد را حتما پر کنید
+          maxLength: 300
+        meta_rating:
+          type: number
+          format: double
+          description: امتیاز محصول
+        created_at:
+          type: string
+          format: date-time
+          readOnly: true
+          title: زمان ثبت محصول
+        category:
+          type: integer
+          nullable: true
+      required:
+        - created_at
+        - currency
+        - description
+        - id
+        - image
+        - is_new
+        - name
+        - price
+    Profile:
+      type: object
+      properties:
+        first_name:
+          type: string
+          title: نام
+          maxLength: 50
+        last_name:
+          type: string
+          title: نام خانوادگی
+          maxLength: 50
+        email:
+          type: string
+          format: email
+          nullable: true
+          title: ایمیل
+          maxLength: 255
+        profile_photo:
+          type: string
+          format: uri
+          nullable: true
+          title: عکس پروفایل
+        phone:
+          type: string
+          readOnly: true
+          title: شماره تماس
+      required:
+        - phone
+    StatusEnum:
+      enum:
+        - open
+        - in_progress
+        - resolved
+        - closed
+      type: string
+      description: |-
+        * `open` - Open
+        * `in_progress` - In Progress
+        * `resolved` - Resolved
+        * `closed` - Closed
+    Ticket:
+      type: object
+      properties:
+        id:
+          type: integer
+          readOnly: true
+        messages:
+          type: array
+          items:
+            $ref: '#/components/schemas/Message'
+          readOnly: true
+        subject:
+          type: string
+          maxLength: 255
+        status:
+          $ref: '#/components/schemas/StatusEnum'
+        created_at:
+          type: string
+          format: date-time
+          readOnly: true
+        updated_at:
+          type: string
+          format: date-time
+          readOnly: true
+        customer:
+          type: integer
+        admin:
+          type: integer
+          nullable: true
+      required:
+        - created_at
+        - customer
+        - id
+        - messages
+        - subject
+        - updated_at
+    TicketRequest:
+      type: object
+      properties:
+        subject:
+          type: string
+          minLength: 1
+          maxLength: 255
+        status:
+          $ref: '#/components/schemas/StatusEnum'
+        customer:
+          type: integer
+        admin:
+          type: integer
+          nullable: true
+      required:
+        - customer
+        - subject
+    TokenRefresh:
+      type: object
+      properties:
+        access:
+          type: string
+          readOnly: true
+        refresh:
+          type: string
+      required:
+        - access
+        - refresh
+    TokenRefreshRequest:
+      type: object
+      properties:
+        refresh:
+          type: string
+          minLength: 1
+      required:
+        - refresh
+    TokenVerifyRequest:
+      type: object
+      properties:
+        token:
+          type: string
+          writeOnly: true
+          minLength: 1
+      required:
+        - token
+    UserAddress:
+      type: object
+      properties:
+        id:
+          type: integer
+          readOnly: true
+        name:
+          type: string
+          maxLength: 30
+        address:
+          type: string
+        postal_code:
+          type: string
+          maxLength: 10
+        phone:
+          type: string
+          maxLength: 11
+      required:
+        - address
+        - id
+        - name
+        - phone
+        - postal_code
+    UserAddressRequest:
+      type: object
+      properties:
+        name:
+          type: string
+          minLength: 1
+          maxLength: 30
+        address:
+          type: string
+          minLength: 1
+        postal_code:
+          type: string
+          minLength: 1
+          maxLength: 10
+        phone:
+          type: string
+          minLength: 1
+          maxLength: 11
+      required:
+        - address
+        - name
+        - phone
+        - postal_code
+  securitySchemes:
+    jwtAuth:
+      type: http
+      scheme: bearer
+      bearerFormat: JWT

From 1bd4139471c8dbb30dbef03a3df6c3d4a43d6219 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Thu, 16 Jan 2025 16:06:16 +0330
Subject: [PATCH 17/37] Create logger tool

---
 frontend/tools/logger.ts | 77 ++++++++++++++++++++++++++++++++++++++++
 1 file changed, 77 insertions(+)
 create mode 100644 frontend/tools/logger.ts

diff --git a/frontend/tools/logger.ts b/frontend/tools/logger.ts
new file mode 100644
index 0000000..95a6f83
--- /dev/null
+++ b/frontend/tools/logger.ts
@@ -0,0 +1,77 @@
+import fs from "fs/promises";
+
+type LogType = {
+    title: string;
+    status?: "success" | "error" | "info" | "warning";
+    message?: string,
+    details?: any
+}
+
+class Logger {
+    private static formatToMarkdown(log: LogType) {
+        const date = new Date();
+        let month = "" + (date.getMonth() + 1);
+        let day = "" + date.getDate();
+        let year = date.getFullYear();
+        let hour = date.getHours();
+        let minutes = date.getMinutes();
+        let seconds = date.getSeconds();
+
+        if (month.length < 2) {
+            month = "0" + month;
+        }
+
+        if (day.length < 2) {
+            day = "0" + day;
+        }
+
+        let markdownContent = "";
+
+        let icon = "ℹ️";
+
+        switch (log.status) {
+            case "info":
+                icon = "ℹ️";
+                break;
+            case "error":
+                icon = "‼️";
+                break;
+            case "warning":
+                icon = "⚠️";
+                break;
+            case "success":
+                icon = "✅";
+                break;
+            default :
+                icon = "ℹ️";
+                break;
+        }
+
+        markdownContent += `# ${icon} ${log.title} \n`;
+        markdownContent += `## ${[year, month, day].join("-")} ${hour}:${minutes}:${seconds} \n`;
+
+        if (log.message) {
+            markdownContent += `**Message:** ${log.message}\n`;
+        }
+        if (log.details) {
+            markdownContent += `**Details:**\n\n\`\`\`json\n${JSON.stringify(log.details, null, 2)}\n\`\`\`\n\n`;
+        }
+
+        markdownContent += "<br></br>\n\n";
+        markdownContent += "---\n";
+
+        return markdownContent;
+    }
+
+    public static async log(info: LogType) {
+        const formattedLog = this.formatToMarkdown(info);
+
+        try {
+            await fs.appendFile(".logs/log.md", formattedLog);
+        } catch (e) {
+            console.error(e);
+        }
+    }
+}
+
+export default Logger;
\ No newline at end of file

From 59a42e1735a8191819298590338761ddcd6bbb71 Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:12:18 +0330
Subject: [PATCH 18/37] removed ssr on product page

---
 frontend/nuxt.config.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/frontend/nuxt.config.ts b/frontend/nuxt.config.ts
index a613368..bc534de 100644
--- a/frontend/nuxt.config.ts
+++ b/frontend/nuxt.config.ts
@@ -5,6 +5,10 @@ export default defineNuxtConfig({
     devtools: { enabled: false },
     css: ["~/assets/css/tailwind.css", "swiper/css"],
 
+    routeRules: {
+        "/products": { prerender: false, ssr: false },
+    },
+
     postcss: {
         plugins: {
             "@tailwindcss/postcss": {},

From 84ecac2980a2a94c656ede35e34705c8b5eea2cc Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:15:19 +0330
Subject: [PATCH 19/37] added skeleton component

---
 frontend/package-lock.json | 9 ++++++++-
 frontend/package.json      | 3 ++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 3f15c42..5c25343 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -24,7 +24,8 @@
         "universal-cookie": "^7.2.2",
         "vue": "latest",
         "vue-router": "latest",
-        "vue-scrollto": "^2.20.0"
+        "vue-scrollto": "^2.20.0",
+        "vue-skeletor": "^1.0.6"
       },
       "devDependencies": {
         "@tailwindcss/postcss": "^4.0.0-beta.5",
@@ -10774,6 +10775,12 @@
         "bezier-easing": "2.1.0"
       }
     },
+    "node_modules/vue-skeletor": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/vue-skeletor/-/vue-skeletor-1.0.6.tgz",
+      "integrity": "sha512-ER4vHlFSXCW3ixK2DlczUE6CZliHsn4d2TvZ9/26C6Oq8zoyEY23BsqweMPtF8QULSz1+G5m2New1BwKNVOZhQ==",
+      "license": "MIT"
+    },
     "node_modules/webidl-conversions": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index d014cba..8175128 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -29,7 +29,8 @@
     "universal-cookie": "^7.2.2",
     "vue": "latest",
     "vue-router": "latest",
-    "vue-scrollto": "^2.20.0"
+    "vue-scrollto": "^2.20.0",
+    "vue-skeletor": "^1.0.6"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4.0.0-beta.5",

From 18d51c994a99d18f58e40abe522e108b15d6b28d Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:15:38 +0330
Subject: [PATCH 20/37] removed multiple from combobox

---
 frontend/components/global/ComboBox.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/components/global/ComboBox.vue b/frontend/components/global/ComboBox.vue
index 176f192..0fbcd4f 100644
--- a/frontend/components/global/ComboBox.vue
+++ b/frontend/components/global/ComboBox.vue
@@ -46,7 +46,7 @@ watch(
 </script>
 
 <template>
-    <ComboboxRoot class="relative" dir="rtl" :multiple="true" v-model="value">
+    <ComboboxRoot class="relative" dir="rtl" v-model="value">
         <ComboboxAnchor
             class="w-full inline-flex items-center justify-between rounded-full border border-slate-200 hover:border-slate-300 focus:border-slate-800 px-[1rem] text-sm leading-none py-3.5 gap-[5px] bg-slate-50 text-black hover:bg-white/90 transition-all data-[placeholder]:text-black/80 typo-label-sm outline-none"
         >

From 4d8dccf2cc2ebb47b7b2c864f6d7e0faf081833d Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:16:08 +0330
Subject: [PATCH 21/37] added pagination

---
 frontend/components/global/Pagination.vue | 65 ++++++++++++++---------
 1 file changed, 41 insertions(+), 24 deletions(-)

diff --git a/frontend/components/global/Pagination.vue b/frontend/components/global/Pagination.vue
index a904a62..392a4ee 100644
--- a/frontend/components/global/Pagination.vue
+++ b/frontend/components/global/Pagination.vue
@@ -1,10 +1,12 @@
 <script setup lang="ts">
+import type { GetProductsFilters } from "~/composables/api/products/useGetProducts";
+
 // types
 
 type Props = {
     total: number;
     items: {
-        type: "page" | "not-page";
+        type: string;
         value: number;
     }[];
 };
@@ -12,34 +14,48 @@ type Props = {
 // props
 
 defineProps<Props>();
+
+// state
+
+const params: GetProductsFilters = inject("params");
+
+const page = ref(Number(params.page) ?? 1);
+
+// watch
+
+watch(
+    () => page.value,
+    (newPage) => {
+        params.page = newPage;
+    }
+);
 </script>
 
 <template>
     <PaginationRoot
-        :total="100"
+        :total="total"
         :sibling-count="1"
-        :items-per-page="10"
+        :items-per-page="9"
         show-edges
+        v-model:page="page"
     >
-        <PaginationList
-            v-slot="{ items }"
-            class="flex items-center gap-1 text-stone-700 dark:text-white"
-        >
-            <PaginationFirst
-                class="w-9 h-9 flex items-center justify-center bg-transparent hover:bg-white dark:hover:bg-stone-700/70 transition disabled:opacity-50 rounded-lg"
+        <PaginationList v-slot="{ items }" class="flex items-center gap-1">
+            <PaginationLast
+                class="w-9 h-9 flex items-center justify-center bg-transparent cursor-pointer hover:bg-stone-700/20 transition disabled:opacity-50 disabled:cursor-not-allowed rounded-lg"
             >
-                <Icon name="ci:double-arrow-left" />
-            </PaginationFirst>
-            <PaginationPrev
-                class="w-9 h-9 flex items-center justify-center bg-transparent hover:bg-white dark:hover:bg-stone-700/70 transition mr-4 disabled:opacity-50 rounded-lg"
+                <Icon name="bi:chevron-double-right" class="**:stroke-black" />
+            </PaginationLast>
+            <PaginationNext
+                class="w-9 h-9 ml-4 flex items-center justify-center cursor-pointer hover:bg-stone-700/20 transition disabled:opacity-50 disabled:cursor-not-allowed rounded-lg"
             >
-                <Icon name="ci:chevron-left" />
-            </PaginationPrev>
+                <Icon name="bi:chevron-right" class="**:stroke-black" />
+            </PaginationNext>
+
             <template v-for="(page, index) in items">
                 <PaginationListItem
                     v-if="page.type === 'page'"
                     :key="index"
-                    class="w-9 h-9 border dark:border-stone-800 rounded-lg data-[selected]:!bg-white data-[selected]:shadow-sm data-[selected]:text-blackA11 hover:bg-white dark:hover:bg-stone-700/70 transition"
+                    class="w-9 h-9 border border-stone-800 rounded-lg data-[selected]:!bg-black data-[selected]:text-white data-[selected]:shadow-sm hover:bg-stone-700/20 transition"
                     :value="page.value"
                 >
                     {{ page.value }}
@@ -53,16 +69,17 @@ defineProps<Props>();
                     &#8230;
                 </PaginationEllipsis>
             </template>
-            <PaginationNext
-                class="w-9 h-9 flex items-center justify-center bg-transparent hover:bg-white dark:hover:bg-stone-700/70 transition ml-4 disabled:opacity-50 rounded-lg"
+
+            <PaginationPrev
+                class="w-9 h-9 flex items-center justify-center bg-transparent cursor-pointer hover:bg-stone-700/20 transition mr-4 disabled:opacity-50 disabled:cursor-not-allowed rounded-lg"
             >
-                <Icon name="ci:chevron-right" />
-            </PaginationNext>
-            <PaginationLast
-                class="w-9 h-9 flex items-center justify-center bg-transparent hover:bg-white dark:hover:bg-stone-700/70 transition disabled:opacity-50 rounded-lg"
+                <Icon name="bi:chevron-left" class="**:stroke-black" />
+            </PaginationPrev>
+            <PaginationFirst
+                class="w-9 h-9 flex items-center justify-center bg-transparent cursor-pointer hover:bg-stone-700/20 transition disabled:opacity-50 disabled:cursor-not-allowed rounded-lg"
             >
-                <Icon name="ci:double-arrow-right" />
-            </PaginationLast>
+                <Icon name="bi:chevron-double-left" class="**:stroke-black" />
+            </PaginationFirst>
         </PaginationList>
     </PaginationRoot>
 </template>

From bcfda576ad4aad36d10c904a59efc38eb0ba70e8 Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:16:44 +0330
Subject: [PATCH 22/37] added v-show for filter side bar

---
 frontend/components/global/SideModal.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/components/global/SideModal.vue b/frontend/components/global/SideModal.vue
index 516e074..b1668f6 100644
--- a/frontend/components/global/SideModal.vue
+++ b/frontend/components/global/SideModal.vue
@@ -41,7 +41,7 @@ watch(
             </Transition>
             <Transition name="fade-right">
                 <div
-                    v-if="isSideShow"
+                    v-show="isSideShow"
                     id="side-content"
                     class="hidden md:flex w-1/3 bg-white h-full rounded-e-[1.5rem] overflow-hidden absolute top-0 min-md:flex-col"
                 >

From 23e5d29e7b05b8f995565f6dc78ae2c930ad0d87 Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:17:10 +0330
Subject: [PATCH 23/37] changed product card

---
 frontend/components/global/product/ProductCard.vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/frontend/components/global/product/ProductCard.vue b/frontend/components/global/product/ProductCard.vue
index 3b63c85..d4e18ab 100644
--- a/frontend/components/global/product/ProductCard.vue
+++ b/frontend/components/global/product/ProductCard.vue
@@ -42,23 +42,23 @@ defineProps<Props>();
             </Tag>
         </div>
         <div
-            class="absolute inset-x-0 bottom-0 pb-6 px-6 flex justify-between items-center"
+            class="absolute inset-x-0 bottom-0 pb-6 px-6 flex flex-row-reverse justify-between items-end"
         >
-            <span class="typo-p-md"> ${{ price }} </span>
-            <div class="flex flex-col gap-2 items-end">
+            <span class="typo-p-md"> {{ price }} </span>
+            <div class="flex flex-col gap-2 items-start">
                 <span class="typo-p-md">
                     {{ brand }}
                 </span>
                 <span class="typo-sub-h-md">
                     {{ title }}
                 </span>
-                <div class="flex items-center gap-2 mt-1">
+                <!-- <div class="flex items-center gap-2 mt-1">
                     <ColorCircle
                         v-for="color in colors"
                         :key="color"
                         :style="{ backgroundColor: color }"
                     />
-                </div>
+                </div> -->
             </div>
         </div>
     </div>

From 2748a024d84843b77137516e48a4f1a3fbaa0b7b Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:17:56 +0330
Subject: [PATCH 24/37] added skeleton plugin

---
 frontend/plugins/skeleton.client.ts | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 frontend/plugins/skeleton.client.ts

diff --git a/frontend/plugins/skeleton.client.ts b/frontend/plugins/skeleton.client.ts
new file mode 100644
index 0000000..998e6b3
--- /dev/null
+++ b/frontend/plugins/skeleton.client.ts
@@ -0,0 +1,6 @@
+import { Skeletor } from 'vue-skeletor';
+import 'vue-skeletor/dist/vue-skeletor.css';
+
+export default defineNuxtPlugin((nuxtApp) => {
+    nuxtApp.vueApp.component("Skeleton", Skeletor)
+})
\ No newline at end of file

From 02ca612716ad5e83a7c591ac68d9c649f4daba95 Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:19:16 +0330
Subject: [PATCH 25/37] added pagination

---
 frontend/pages/products.vue | 101 +++++++++++++++++++++++++-----------
 1 file changed, 72 insertions(+), 29 deletions(-)

diff --git a/frontend/pages/products.vue b/frontend/pages/products.vue
index 443a4c2..4561e8b 100644
--- a/frontend/pages/products.vue
+++ b/frontend/pages/products.vue
@@ -8,31 +8,48 @@ import { PRODUCT_RANGE } from "~/constants";
 
 // state
 
-const route = useRoute();
+const params: GetProductsFilters = useUrlSearchParams("history", {
+    initialValue: {
+        search: "",
+        sort: "newest",
+        price_gte: PRODUCT_RANGE.min,
+        price_lte: PRODUCT_RANGE.max,
+        in_stock: false,
+        has_discount: false,
+        category: "",
+        page: "1",
+    },
+});
 
-const params: GetProductsFilters & { page: number } =
-    useUrlSearchParams("history");
+const search = ref(params.search ?? "");
+const searchDebounced = refDebounced(search, 1000);
 
-// computed
+// provide / inject
 
-const page = computed(() => (route.query["page"] ? +route.query["page"] : 1));
+provide("params", params);
 
 // queries
 
-const { data: products, isLoading: productsIsLoading } = useGetProducts(
-    params,
-    page
-);
+const { data, isLoading: productsIsLoading } = useGetProducts(params);
 
-// life-cycle
-
-onMounted(() => {
-    if (!("range" in params)) {
-        params.range = [];
-        params.range[0] = PRODUCT_RANGE.min;
-        params.range[1] = PRODUCT_RANGE.max;
-    }
+const products = computed(() => {
+    return data.value?.results.flat();
 });
+
+const paginationData = computed(() => {
+    return data!.value?.results.map((_, i: number) => {
+        return { type: "page", value: i };
+    });
+});
+
+// watch
+
+watch(
+    () => searchDebounced.value,
+    (newValue) => {
+        params.search = newValue;
+    }
+);
 </script>
 
 <template>
@@ -54,24 +71,50 @@ onMounted(() => {
             <div class="w-full flex items-center justify-end gap-4">
                 <Input
                     placeholder="جست و جو محصول ..."
+                    v-model="search"
                     class="bg-slate-50 !border-slate-200 hover:border-slate-300 focus:!border-slate-800 !rounded-full w-8/12"
                 />
                 <FilterButton />
             </div>
         </div>
-        <ul class="w-full grid grid-cols-3 gap-[1.5rem]">
-            <li v-for="i in 9" :key="i">
-                <ProductCard
-                    brand="Samsung"
-                    title="Galaxy S20 Ultra"
-                    picture="/assets/img/product-1.jpg"
-                    :colors="['#0000ff', '#00ff00', 'red']"
-                    :price="599"
-                    :rate="2.4"
-                    tag="New"
-                />
-            </li>
+        <ul
+            v-if="productsIsLoading"
+            class="w-full grid grid-cols-3 gap-[1.5rem]"
+        >
+            <Skeleton
+                v-for="i in 9"
+                :key="i"
+                class="w-full !h-[31.25rem] !rounded-2xl"
+            />
         </ul>
+        <div v-else class="w-full h-max">
+            <div v-if="!products?.length" class="flex flex-grow px-5 w-full">
+                <div
+                    class="flex-col flex-grow py-[12rem] gap-6 border-2 border-slate-200 border-dashed size-full rounded-100 flex-center"
+                >
+                    <Icon name="bi:search" size="50" class="**:fill-gray-500" />
+                    <span class="text-lg text-gray-500">
+                        محصولی یافت نشد :(
+                    </span>
+                </div>
+            </div>
+            <ul v-else class="w-full grid grid-cols-3 gap-[1.5rem]">
+                <li v-for="(product, index) in products" :key="index">
+                    <ProductCard
+                        brand="Samsung"
+                        :title="product.name"
+                        picture="/assets/img/product-1.jpg"
+                        :colors="['#0000ff', '#00ff00', 'red']"
+                        :price="product.price"
+                        :rate="product.rating"
+                        tag="New"
+                    />
+                </li>
+            </ul>
+            <div class="w-full flex-center py-10">
+                <Pagination :items="paginationData" :total="data?.count" />
+            </div>
+        </div>
     </div>
 </template>
 

From 2c9f17cf48c7b012d769baa79a2c98f1e5ae50fe Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:19:29 +0330
Subject: [PATCH 26/37] changed get products

---
 .../api/products/useGetProducts.ts            | 67 ++++++++++++-------
 1 file changed, 43 insertions(+), 24 deletions(-)

diff --git a/frontend/composables/api/products/useGetProducts.ts b/frontend/composables/api/products/useGetProducts.ts
index 7828df4..adfa9a1 100644
--- a/frontend/composables/api/products/useGetProducts.ts
+++ b/frontend/composables/api/products/useGetProducts.ts
@@ -5,44 +5,53 @@ import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
 
 // types
 
-export type GetProductsResponse = Product[];
+export type GetProductsResponse = ApiPaginated<Product>;
 
 export type GetProductsFilters = {
-    search: string | undefined;
-    sort: string | undefined;
-    categories: string[] | undefined;
-    price_range: number[] | undefined;
-    has_discount: boolean | undefined;
-    in_stock: boolean | undefined;
+    search?: string | undefined;
+    sort?: string | undefined;
+    category?: string | undefined;
+    price_gte: number;
+    price_lte: number;
+    has_discount?: boolean | undefined;
+    in_stock?: boolean | undefined;
+    page: number;
 };
 
 // composable
 
-const useGetProducts = (
-    filters: GetProductsFilters,
-    page: ComputedRef<number>
-) => {
+const useGetProducts = (params?: GetProductsFilters) => {
     // state
 
     const { $axios: axios } = useNuxtApp();
 
+    const {
+        search,
+        sort,
+        in_stock,
+        has_discount,
+        category,
+        price_gte,
+        price_lte,
+        page,
+    } = toRefs(params as GetProductsFilters);
+
     // methods
 
-    const handleGetProducts = async ({
-        filters,
-        page,
-    }: {
-        filters: GetProductsFilters;
-        page: number;
-    }) => {
+    const handleGetProducts = async (params?: GetProductsFilters) => {
         const { data } = await axios.get<GetProductsResponse>(
             `${API_ENDPOINTS.products.get_all}`,
             {
                 params: {
-                    ...filters,
-                    page,
-                    offest: page * 10 - 10,
-                    limit: 10,
+                    sort: params?.sort,
+                    in_stock: params?.in_stock,
+                    search: params?.search,
+                    has_discount: params?.has_discount,
+                    category: params?.category,
+                    price_gte: params?.price_gte,
+                    price_lte: params?.price_lte,
+                    offest: params?.page! * 9 - 9,
+                    limit: 9,
                 },
             }
         );
@@ -52,8 +61,18 @@ const useGetProducts = (
 
     return useQuery({
         staleTime: 60 * 1000,
-        queryKey: [QUERY_KEYS.products, filters, page],
-        queryFn: () => handleGetProducts({ filters, page: page.value }),
+        queryKey: [
+            QUERY_KEYS.products,
+            search,
+            sort,
+            in_stock,
+            has_discount,
+            category,
+            price_gte,
+            price_lte,
+            page,
+        ],
+        queryFn: () => handleGetProducts(params),
     });
 };
 

From 5645f3aee3469f81159ff7ff6d6d9c2a140f3fb2 Mon Sep 17 00:00:00 2001
From: Mamalizz <mohammad.hosein.ghorbani82@gmail.com>
Date: Sun, 19 Jan 2025 19:20:52 +0330
Subject: [PATCH 27/37] synced filters with url

---
 .../global/products/FilterProducts.vue        | 97 ++++++++++++++-----
 1 file changed, 75 insertions(+), 22 deletions(-)

diff --git a/frontend/components/global/products/FilterProducts.vue b/frontend/components/global/products/FilterProducts.vue
index fb97c60..cf176e0 100644
--- a/frontend/components/global/products/FilterProducts.vue
+++ b/frontend/components/global/products/FilterProducts.vue
@@ -1,11 +1,15 @@
 <script setup lang="ts">
 // imports
 
+import useGetProducts, {
+    type GetProductsFilters,
+} from "~/composables/api/products/useGetProducts";
+import { useParams } from "~/composables/global/useParams";
 import { PRODUCT_RANGE } from "~/constants";
 
 // state
 
-const params = useUrlSearchParams("history");
+const params: GetProductsFilters = inject("params");
 
 const sort_filter = ref([
     { title: "جدیدترین ها", value: "newest" },
@@ -13,6 +17,13 @@ const sort_filter = ref([
     { title: "ارزان ترین ها", value: "-price" },
 ]);
 
+const sliderValue = ref([PRODUCT_RANGE.min, PRODUCT_RANGE.max]);
+
+const has_discount = ref(JSON.parse(params.has_discount) ?? false);
+const in_stock = ref(JSON.parse(params.in_stock) ?? false);
+
+const sliderValueDebounced = refDebounced(sliderValue, 1000);
+
 const options = [
     {
         name: "میوه",
@@ -42,15 +53,47 @@ const options = [
     },
 ];
 
+const { isPending: productsIsPending } = useGetProducts(params);
+
 // methods
 
 const resetFilters = () => {
-    params.sort = null;
-    params.categories = [];
-    params.range = [PRODUCT_RANGE.min, PRODUCT_RANGE.max];
-    params.has_discount = false;
-    params.in_stock = false;
+    params.search = "";
+    params.sort = "newest";
+    sliderValue.value = [PRODUCT_RANGE.min, PRODUCT_RANGE.max];
+    has_discount.value = false;
+    in_stock.value = false;
+    params.category = "";
 };
+
+// watch
+
+watch(
+    () => sliderValueDebounced.value,
+    (newValue) => {
+        params.price_gte = newValue[0];
+        params.price_lte = newValue[1];
+    }
+);
+
+watchOnce(
+    () => [params.price_gte, params.price_lte],
+    ([newGte, newLte]) => {
+        sliderValue.value[0] = newGte;
+        sliderValue.value[1] = newLte;
+    },
+    {
+        immediate: true,
+    }
+);
+
+watch(
+    () => [has_discount.value, in_stock.value],
+    ([newHasDiscount, newInStock]) => {
+        params.has_discount = newHasDiscount;
+        params.in_stock = newInStock;
+    }
+);
 </script>
 
 <template>
@@ -87,14 +130,15 @@ const resetFilters = () => {
                     <Icon name="ci:grid" size="24" />
                     دسته بندی
                 </div>
-                <ComboBox :options="options" v-model="params.categories" />
-                <div class="w-full flex flex-wrap gap-2 px-[1rem]">
+                <ComboBox :options="options" v-model="params.category" />
+                <div
+                    v-if="params.category"
+                    class="w-full flex flex-wrap gap-2 px-[1rem]"
+                >
                     <span
-                        v-for="(sort_param, index) in params.categories"
-                        :key="index"
                         class="py-1 px-3 cursor-pointer text-nowrap bg-slate-100 rounded-full text-sm"
                     >
-                        {{ sort_param }}
+                        {{ params.category }}
                     </span>
                 </div>
             </div>
@@ -107,12 +151,12 @@ const resetFilters = () => {
                     محدوده قیمت
                 </div>
                 <SliderRoot
-                    v-model="params.range"
+                    v-model="sliderValue"
                     class="relative flex items-center select-none touch-none h-5"
                     dir="rtl"
                     :min="PRODUCT_RANGE.min"
                     :max="PRODUCT_RANGE.max"
-                    :step="1"
+                    :step="1000"
                 >
                     <SliderTrack
                         class="bg-black/10 relative grow rounded-full h-[3px]"
@@ -132,8 +176,8 @@ const resetFilters = () => {
                         <span class="text-sm text-black">حداقل</span>
                         <span class="text-sm text-black">
                             {{
-                                "range" in params
-                                    ? params.range[0].toLocaleString()
+                                "price_gte" in params
+                                    ? params.price_gte.toLocaleString()
                                     : PRODUCT_RANGE.min
                             }}
                         </span>
@@ -142,8 +186,8 @@ const resetFilters = () => {
                         <span class="text-sm text-black">حداکثر</span>
                         <span class="text-sm text-black">
                             {{
-                                "range" in params
-                                    ? params.range[1].toLocaleString()
+                                "price_lte" in params
+                                    ? params.price_lte.toLocaleString()
                                     : PRODUCT_RANGE.max
                             }}
                         </span>
@@ -154,7 +198,7 @@ const resetFilters = () => {
             <div class="flex items-center justify-between w-full gap-5">
                 <span class="text-black">فقط کالاهای تخفیف دار</span>
                 <SwitchRoot
-                    v-model="params.has_discount"
+                    v-model="has_discount"
                     class="w-[3rem] h-[1.8rem] flex data-[state=unchecked]:bg-slate-200 data-[state=checked]:bg-stone-800 border border-slate-300 data-[state=checked]:border-stone-700 rounded-full relative transition-all focus-within:outline-none"
                 >
                     <SwitchThumb
@@ -167,7 +211,7 @@ const resetFilters = () => {
                 <span class="text-black">فقط کالاهای موجود</span>
 
                 <SwitchRoot
-                    v-model="params.in_stock"
+                    v-model="in_stock"
                     class="w-[3rem] h-[1.8rem] flex data-[state=unchecked]:bg-slate-200 data-[state=checked]:bg-stone-800 border border-slate-300 data-[state=checked]:border-stone-700 rounded-full relative transition-all focus-within:outline-none"
                 >
                     <SwitchThumb
@@ -178,12 +222,21 @@ const resetFilters = () => {
         </div>
 
         <Button
-            end-icon="ci:close"
+            :disabled="productsIsPending"
             variant="solid"
             @click="resetFilters"
-            class="rounded-full py-4 !cursor-pointer"
+            class="rounded-full py-4 !cursor-pointer disabled:pointer-events-none"
         >
-            بازنشانی به پیش‌ فرض
+            <Transition name="fade" mode="out-in">
+                <span v-if="productsIsPending" class="flex-center gap-3">
+                    در حال دریافت اطلاعات
+                    <Icon name="svg-spinners:3-dots-bounce" size="20" />
+                </span>
+                <span v-else class="flex-center gap-3">
+                    بازنشانی به پیش‌ فرض
+                    <Icon name="ci:close" size="20" />
+                </span>
+            </Transition>
         </Button>
     </div>
 </template>

From 6a48cb5a3de5d521dbd40cca025e3fb805245a05 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:52:41 +0330
Subject: [PATCH 28/37] Updated

---
 frontend/components/global/CategoryCard.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/components/global/CategoryCard.vue b/frontend/components/global/CategoryCard.vue
index 3e26b2c..7f7176d 100644
--- a/frontend/components/global/CategoryCard.vue
+++ b/frontend/components/global/CategoryCard.vue
@@ -47,7 +47,7 @@ const { colorObject } = useImageColor(`#category-image-${id.value}`);
                 class="flex flex-col gap-2"
             >
                 <div class="typo-s-h-md">
-                    تمام دسته ها
+                    {{ category }}
                     <span class="typo-p-xs -translate-y-1 inline-block mr-1">
                         24
                     </span>

From 95a91cbe4871c165bd1c3550a155d6a219da75e6 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:52:48 +0330
Subject: [PATCH 29/37] Updated

---
 frontend/components/global/Input.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/components/global/Input.vue b/frontend/components/global/Input.vue
index 9054835..7c2871c 100644
--- a/frontend/components/global/Input.vue
+++ b/frontend/components/global/Input.vue
@@ -28,7 +28,7 @@ const inputRef = ref<HTMLInputElement | null>(null);
 
 const classes = computed(() => {
     return [
-        "flex items-center cursor-text transition-all border-[1.5px] gap-3 typo-label-md px-4 py-3 rounded-100",
+        "flex items-center justify-between cursor-text transition-all border-[1.5px] gap-3 typo-label-md px-4 py-3 rounded-100",
         {
             "input-solid": variant.value === "solid",
             "input-outlined": variant.value === "outlined",
@@ -56,7 +56,7 @@ const onInput = (e: any) => {
             :value="modelValue"
             @input="onInput"
             ref="inputRef"
-            class="outline-none w-max"
+            class="outline-none flex-1"
             :placeholder="placeholder"
         />
 

From ea550737e38ea6cfb9aa48c86334b72bb2ae066f Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:52:58 +0330
Subject: [PATCH 30/37] Updated

---
 frontend/components/product/ChatBox/ChatInput.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/components/product/ChatBox/ChatInput.vue b/frontend/components/product/ChatBox/ChatInput.vue
index 206b075..69cfea4 100644
--- a/frontend/components/product/ChatBox/ChatInput.vue
+++ b/frontend/components/product/ChatBox/ChatInput.vue
@@ -4,6 +4,7 @@
 
 import AiLoading from "~/components/product/ChatBox/AiLoading.vue";
 import useCreateChatMessage from "~/composables/api/chat/useCreateChatMessage";
+import { useToast } from "~/composables/global/useToast";
 
 // state
 

From 285f66131aa85bd6223a495731dc636969aa53ed Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:53:08 +0330
Subject: [PATCH 31/37] Create categories composable

---
 .../api/product/useGetCategories.ts           | 29 +++++++++++++++++++
 1 file changed, 29 insertions(+)
 create mode 100644 frontend/composables/api/product/useGetCategories.ts

diff --git a/frontend/composables/api/product/useGetCategories.ts b/frontend/composables/api/product/useGetCategories.ts
new file mode 100644
index 0000000..7170bc2
--- /dev/null
+++ b/frontend/composables/api/product/useGetCategories.ts
@@ -0,0 +1,29 @@
+// imports
+
+import { useQuery } from "@tanstack/vue-query";
+import { API_ENDPOINTS, QUERY_KEYS } from "~/constants";
+
+// types
+
+export type GetCategoriesResponse = { categories: Category[] };
+
+const useGetCategories = () => {
+
+    // state
+
+    const { $axios: axios } = useNuxtApp();
+
+    // methods
+
+    const handleGetCategories = async () => {
+        const { data } = await axios.get<GetCategoriesResponse>(`${API_ENDPOINTS.products.categories}`);
+        return data.categories;
+    };
+
+    return useQuery({
+        queryKey: [QUERY_KEYS.categories],
+        queryFn: () => handleGetCategories()
+    });
+};
+
+export default useGetCategories;

From 8156dc0d47670e2b800fcce3321fd94501df3f9c Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:53:17 +0330
Subject: [PATCH 32/37] Updated

---
 frontend/constants/index.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/constants/index.ts b/frontend/constants/index.ts
index 60e2a1c..0049a18 100644
--- a/frontend/constants/index.ts
+++ b/frontend/constants/index.ts
@@ -18,6 +18,7 @@ export const API_ENDPOINTS = {
     },
     products: {
         get_all: "/products",
+        categories: "/products/categories",
     },
 };
 
@@ -26,6 +27,7 @@ export const QUERY_KEYS = {
     product: "product",
     products: "products",
     account: "account",
+    categories: "categories",
 };
 
 export const MUTATION_KEYS = {

From e0993866ecfbf5e369f77919e36fb54e1655fd36 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:53:20 +0330
Subject: [PATCH 33/37] Updated

---
 frontend/middleware/checkIsLoggedIn.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/middleware/checkIsLoggedIn.ts b/frontend/middleware/checkIsLoggedIn.ts
index e7f100b..b363f87 100644
--- a/frontend/middleware/checkIsLoggedIn.ts
+++ b/frontend/middleware/checkIsLoggedIn.ts
@@ -6,7 +6,6 @@ export default defineNuxtRouteMiddleware(() => {
     if (!!token.value) {
         return;
     } else {
-        logout();
         return navigateTo("/signin");
     }
 });

From b26ef79eb4b67418bd2fa82fbca0c7695bc6f2d8 Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:54:09 +0330
Subject: [PATCH 34/37] Updated functionality add ssr and rendering dynamic
 data

---
 frontend/pages/category/index.vue | 146 +++++++++++++++++-------------
 1 file changed, 83 insertions(+), 63 deletions(-)

diff --git a/frontend/pages/category/index.vue b/frontend/pages/category/index.vue
index 9fa1104..fbb945d 100644
--- a/frontend/pages/category/index.vue
+++ b/frontend/pages/category/index.vue
@@ -1,68 +1,88 @@
+<script lang="ts" setup>
+
+import useGetCategories from "~/composables/api/product/useGetCategories";
+
+// state
+
+const { data: categories, suspense } = useGetCategories();
+
+const search = ref("");
+const debouncedSearch = refDebounced(search, 300);
+
+// computed
+
+const filteredCategories = computed(() => {
+    if (debouncedSearch.value.length > 0) {
+        return categories.value!.filter(cat => cat.name.includes(debouncedSearch.value));
+    }
+
+    return categories.value!;
+});
+
+// lifecycle
+
+onServerPrefetch(async () => {
+    const response = await suspense();
+
+    if (response.isError) {
+        throw createError({
+            statusCode: 500,
+            statusMessage: `Error in categories page prefetch`
+        });
+    }
+});
+
+</script>
+
 <template>
     <div class="container">
-        <div class="mt-20">
+        <div class="mt-20 flex gap-6 justify-between items-center">
             <span class="typo-h-3 text-black">دسته بندی ها</span>
+            <Input
+                class="max-w-[400px] w-full"
+                variant="outlined"
+                placeholder="جستجو..."
+                v-model="search"
+            >
+                <template #endItem>
+                    <div class="flex items-center gap-1">
+                        <Icon class="translate-y-[-1px]" name="ci:search" size="24" />
+                    </div>
+                </template>
+            </Input>
         </div>
-        <div class="grid grid-cols-3 gap-4 w-full mt-12">
-            <CategoryCard
-                :id="1"
-                category="یک دسته بندی تست"
-                picture="/img/product-1.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-                dark-layer
-            />
-            <CategoryCard
-                :id="2"
-                category="یک دسته بندی تست"
-                picture="/img/product-2.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-            />
-            <CategoryCard
-                :id="3"
-                category="یک دسته بندی تست"
-                picture="/img/product-3.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-            />
-            <CategoryCard
-                :id="8"
-                category="یک دسته بندی تست"
-                picture="/img/product-4.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-            />
-            <CategoryCard
-                :id="4"
-                category="یک دسته بندی تست"
-                picture="/img/product-5.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-            />
-            <CategoryCard
-                :id="5"
-                category="یک دسته بندی تست"
-                picture="/img/product-1.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-            />
-            <CategoryCard
-                :id="6"
-                category="یک دسته بندی تست"
-                picture="/img/product-2.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-            />
-            <CategoryCard
-                :id="7"
-                category="یک دسته بندی تست"
-                picture="/img/product-3.jpg"
-                :count="20"
-                description="یک دسته بندی تستasdasd"
-            />
-        </div>
+        <Transition name="fade" mode="out-in">
+            <div
+                v-if="filteredCategories.length !== 0"
+                v-auto-animate
+                class="grid grid-cols-3 gap-4 w-full mt-12"
+            >
+                <CategoryCard
+                    v-for="category in filteredCategories"
+                    :key="category.id"
+                    :id="category.id"
+                    :category="category.name"
+                    picture="/img/product-1.jpg"
+                    :count="20"
+                    description="یک دسته بندی تستasdasd"
+                    dark-layer
+                />
+            </div>
+
+            <div
+                v-else
+                class="flex w-full mt-12"
+            >
+                <div
+                    class="flex-col flex-grow py-[12rem] gap-6 border-2 border-slate-200 border-dashed size-full rounded-100 flex-center"
+                >
+                    <Icon name="bi:search" size="50" class="**:fill-gray-500" />
+                    <span class="text-lg text-gray-500">
+                        دسته بندی یافت نشد :(
+                    </span>
+                </div>
+            </div>
+        </Transition>
+
     </div>
-</template>
-<script setup lang="ts">
-</script>
\ No newline at end of file
+</template>
\ No newline at end of file

From 733ab07d6145208d3244aa7551734cfab3fbc29d Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:54:16 +0330
Subject: [PATCH 35/37] Updated

---
 frontend/types/global.d.ts | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/frontend/types/global.d.ts b/frontend/types/global.d.ts
index ac13093..c0e1e48 100644
--- a/frontend/types/global.d.ts
+++ b/frontend/types/global.d.ts
@@ -32,4 +32,15 @@ declare global {
         "meta_rating": number | null
     }
 
+    type Category = {
+        "id": number,
+        "name": string,
+        "slug": string,
+        "icon": string,
+        "meta_title": string,
+        "meta_description": string,
+        "parent": number,
+        "children": "string"
+    }
+
 }

From 7f5ffb2698e6f0f21520c64328a15541c21e14cb Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:54:25 +0330
Subject: [PATCH 36/37] Add auto animate

---
 frontend/nuxt.config.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/nuxt.config.ts b/frontend/nuxt.config.ts
index bc534de..9d6ecc7 100644
--- a/frontend/nuxt.config.ts
+++ b/frontend/nuxt.config.ts
@@ -48,6 +48,7 @@ export default defineNuxtConfig({
         "@nuxt/icon",
         "reka-ui/nuxt",
         "@vueuse/nuxt",
+        "@formkit/auto-animate/nuxt"
     ],
 
     runtimeConfig: {

From f24eea6ca9a7aba8f80f876fb0dfc2d98d2fa11e Mon Sep 17 00:00:00 2001
From: marzban-dev <marzban.dev@gmail.com>
Date: Sun, 19 Jan 2025 19:54:31 +0330
Subject: [PATCH 37/37] Add auto animate

---
 frontend/package-lock.json | 7 +++++++
 frontend/package.json      | 1 +
 2 files changed, 8 insertions(+)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 5c25343..0f47a9a 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -7,6 +7,7 @@
       "name": "nuxt-app",
       "hasInstallScript": true,
       "dependencies": {
+        "@formkit/auto-animate": "^0.8.2",
         "@nuxt/icon": "^1.9.1",
         "@nuxtjs/google-fonts": "^3.2.0",
         "@tanstack/vue-query": "^5.62.2",
@@ -1008,6 +1009,12 @@
         }
       }
     },
+    "node_modules/@formkit/auto-animate": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/@formkit/auto-animate/-/auto-animate-0.8.2.tgz",
+      "integrity": "sha512-SwPWfeRa5veb1hOIBMdzI+73te5puUBHmqqaF1Bu7FjvxlYSz/kJcZKSa9Cg60zL0uRNeJL2SbRxV6Jp6Q1nFQ==",
+      "license": "MIT"
+    },
     "node_modules/@iconify/collections": {
       "version": "1.0.492",
       "resolved": "https://registry.npmjs.org/@iconify/collections/-/collections-1.0.492.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 8175128..62449d0 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -12,6 +12,7 @@
     "postinstall": "nuxt prepare"
   },
   "dependencies": {
+    "@formkit/auto-animate": "^0.8.2",
     "@nuxt/icon": "^1.9.1",
     "@nuxtjs/google-fonts": "^3.2.0",
     "@tanstack/vue-query": "^5.62.2",