added computed

frontend/components/global/Pagination.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-
 // types
 
 type Props = {
@@ -16,18 +15,14 @@ defineProps<Props>();
 
 // state
 
-const params : any = inject("params");
+const params: any = inject("params");
 
-const page = ref(params?.page ? Number(params.page) : 1);
+// computed
 
-// watch
-
-watch(
-    () => page.value,
-    (newPage) => {
-        params.page = newPage;
-    }
-);
+const page = computed({
+    get: () => (params?.page ? Number(params.page) : 1),
+    set: (value: number) => (params.page = value),
+});
 </script>
 
 <template>
@@ -47,7 +42,11 @@ watch(
             <PaginationNext
                 class="w-9 h-9 ml-4 flex items-center justify-center cursor-pointer hover:bg-slate-100 transition disabled:opacity-50 disabled:cursor-not-allowed rounded-lg"
             >
-                <Icon name="ci:chevron-right" class="**:fill-back" size="18px" />
+                <Icon
+                    name="ci:chevron-right"
+                    class="**:fill-back"
+                    size="18px"
+                />
             </PaginationNext>
 
             <template v-for="(page, index) in items">
@@ -81,4 +80,4 @@ watch(
             </PaginationFirst>
         </PaginationList>
     </PaginationRoot>
-</template>
+</template>