Work on favorites

Work on library show

apis/hadithaApi.js

@@ -4,6 +4,7 @@ export default {
     show: "repo/public/get/byid/@index_key/@id",
     synonym: "synonym/get/words",
     prevNextHadith: "monir/next/@index_key/@vol_id/@parag_order/@step",
+    getDataTree: "@appname/book/tree/@offset/@limit/@vol_id/@q"
   },
   favorite: {
     add: "favorite/add/{{data_type}}/{{ref_key}}",
@@ -17,7 +18,7 @@ export default {
     setCategories: "favorite/tags/@data_type/set",
     getCounts: "favorite/tags/@data_type/counts",
 
-    getList: "favorite/list/@data_type/@offset/@limit",
+    getList: "favorite/list/@data_type/@time_key/@source/@offset/@limit/@q",
   },
   library: {
     list: "monir/book/volume/@field_collapsed/@offset/@limit/@q",

components/haditha/AutoComplation.vue

@@ -42,7 +42,7 @@ const searchTerm = useStorage<string>("searchPhrase", "");
 const route = useRoute();
 if (route.query.q) {
   searchTerm.value = route.query.q;
-  route.query.q = undefined
+  route.query.q = undefined;
 }
 
 const open = ref(false);
@@ -81,12 +81,12 @@ const state = reactive({
         label: "جستجو در همه",
         value: "normal",
         class: "",
-        onSelect(e: Event) {
+        // onSelect(e: Event) {
-          search_type.value = "normal";
+        //   search_type.value = "normal";
-          state.type.label = e.explicitOriginalTarget?.innerText;
+        //   state.type.label = e.explicitOriginalTarget?.innerText;
-          sendQuery();
+        //   sendQuery();
-          state.type.items[0].class = "active";
+        //   state.type.items[0].class = "active";
-        },
+        // },
       },
       {
         label: "فقط در متن عربی حدیث",
@@ -94,38 +94,38 @@ const state = reactive({
         valueFa: "عربی",
 
         class: "",
-        onSelect(e: Event) {
+        // onSelect(e: Event) {
-          search_type.value = "arabic";
+        //   search_type.value = "arabic";
-          state.type.label = e.explicitOriginalTarget?.innerText;
+        //   state.type.label = e.explicitOriginalTarget?.innerText;
-          state.type.items[0].class = "active";
+        //   state.type.items[0].class = "active";
 
-          sendQuery();
+        //   sendQuery();
-        },
+        // },
       },
       {
         label: "فقط در ترجمه ها",
         value: "translations",
         valueFa: "ترجمه",
 
-        onSelect(e: Event) {
+        // onSelect(e: Event) {
-          search_type.value = "translations";
+        //   search_type.value = "translations";
-          state.type.label = e.explicitOriginalTarget?.innerText;
+        //   state.type.label = e.explicitOriginalTarget?.innerText;
-          state.type.items[0].class = "active";
+        //   state.type.items[0].class = "active";
 
-          sendQuery();
+        //   sendQuery();
-        },
+        // },
       },
       {
         label: "فقط در شروح",
         value: "descriptions",
         valueFa: "شروح",
 
-        onSelect(e: Event) {
+        // onSelect(e: Event) {
-          search_type.value = "descriptions";
+        //   search_type.value = "descriptions";
-          state.type.label = e.explicitOriginalTarget?.innerText;
+        //   state.type.label = e.explicitOriginalTarget?.innerText;
-          state.type.items[0].class = "active";
+        //   state.type.items[0].class = "active";
-          sendQuery();
+        //   sendQuery();
-        },
+        // },
       },
     ],
   },
@@ -162,9 +162,9 @@ const clearSimilar = () => {
   console.info("clearSimilar");
 };
 
-const onUpdateModel = (newVal: boolean | InputMenuItem | any) => {
+// const onUpdateModel = (newVal: boolean | InputMenuItem | any) => {
-  console.info("onUpdateModel", newVal);
+//   console.info("onUpdateModel", newVal);
-};
+// };
 
 const onKeyDown = () => {
   clearTimeout(typingTimer.value);
@@ -180,10 +180,10 @@ const setType = (type: string) => {
   search_type.value = type;
   sendQuery();
 };
-const setKey = (type: string) => {
+// const setKey = (type: string) => {
-  type_key.value = type;
+//   type_key.value = type;
-  sendQuery();
+//   sendQuery();
-};
+// };
 
 const sendQuery = async (payload = {}) => {
   if (loading.value) return;
@@ -225,6 +225,7 @@ const sendQuery = async (payload = {}) => {
       emit("response-ready", {
         res: res,
         searchQuery: searchTerm.value,
+        disableAutoRedirect:true
       });
 
       loading.value = false;
@@ -400,12 +401,12 @@ onMounted(() => {
           @focus="open = true"
           @blur="open = false"
           @change="sendQuery"
-          @update:modelValue="onUpdateModel"
-          @update:searchTerm="onUpdateModel"
           @keydown="onKeyDown"
           @keyup="onKeyUp"
           @keydown.enter="sendQuery"
         >
+          <!-- @update:modelValue="onUpdateModel" -->
+          <!-- @update:searchTerm="onUpdateModel" -->
         </UInputMenu>
       </div>
       <UButton
@@ -654,7 +655,7 @@ onMounted(() => {
       background: linear-gradient(137.41deg, #ffffff -42.82%, #e5e0ff 87.9%);
       filter: blur(60px);
       max-width: 626px;
-      width:100%;
+      width: 100%;
       height: 68px;
       z-index: 0;
     }

components/haditha/hero-page/SectionOne.vue

@@ -4,14 +4,16 @@ const router = useRouter();
 import { useStorage } from "@vueuse/core";
 
 const backgroundImageStyle = computed(() => {
-  // Use $img to generate an optimized image URL
+  // // Use $img to generate an optimized image URL
-  const optimizedImageUrl = img("/img/haditha/background.webp", {
+  // const optimizedImageUrl = img("/img/haditha/background.webp", {
-    quality: 80,
+  //   quality: 80,
-    fit: "auto",
+  //   fit: "auto",
-  });
+  // });
-
+  // return {
+  //   backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
+  // };
   return {
-    backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
+    backgroundImage: `url(/img/haditha/background.webp), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
   };
 });
 

components/haditha/hero-page/SectionThree.vue

@@ -3,13 +3,15 @@ const img = useImage();
 
 const backgroundImageStyle = computed(() => {
   // Use $img to generate an optimized image URL
-  const optimizedImageUrl = img("/img/haditha/section-three-bgi.webp", {
+  // const optimizedImageUrl = img("/img/haditha/section-three-bgi.webp", {
-    quality: 30,
+  //   quality: 30,
-    fit: "auto",
+  //   fit: "auto",
-  });
+  // });
-
+  // return {
+  //   backgroundImage: `url(${optimizedImageUrl})`,
+  // };
   return {
-    backgroundImage: `url(${optimizedImageUrl})`,
+    backgroundImage: `url(/img/haditha/section-three-bgi.webp)`,
   };
 });
 </script>

pages/haditha/chat-bot.vue

@@ -8,10 +8,94 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | جستجو`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 
 const state = reactive({

pages/haditha/favorites/index.vue

@@ -10,10 +10,94 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | ذخیره ها`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 
 // #region refs
@@ -28,6 +112,12 @@ const state = reactive({
   list: [],
   counts: [],
   totalCounts: [],
+  pagination: {
+    page: 1,
+    pages: 1,
+    offset: 0,
+    limit: 10,
+  },
 });
 // #endregion reactive
 
@@ -40,40 +130,44 @@ const getCategories = async (dataType = "bookmark") => {
 
   let url = repoUrl() + hadithaApi.favorite.getList;
   url = url.replace("@data_type", dataType);
-  url = url.replace("@offset", 0);
+  url = url.replace("@time_key", "all");
-  url = url.replace("@limit", 20);
+  url = url.replace("@source", "main");
-  // url = url.replace("@filter", "get");
+  url = url.replace("@offset", state.pagination.offset);
+  url = url.replace("@limit", state.pagination.limit);
+  url = url.replace("@q", "none");
 
   return await httpService
     .getRequest(url)
     .then((res) => {
       state.list = res.hits.hits;
-      getCounts();
-    })
-    .catch((err) => {
-      console.info(err);
-      loading.value = false;
-    });
-};
-
-const getCounts = async () => {
-  let url = repoUrl() + hadithaApi.favorite.getCounts;
-  url = url.replace("@data_type", "bookmark");
-
-  await httpService
-    .getRequest(url)
-    .then((res) => {
       state.totalCounts = res.hits.total.value;
-      state.counts = res.aggregations.result.buckets;
       loading.value = false;
+      // getCounts();
     })
     .catch((err) => {
       console.info(err);
-    })
-    .finally(() => {
       loading.value = false;
     });
 };
+
+// const getCounts = async () => {
+//   let url = repoUrl() + hadithaApi.favorite.getCounts;
+//   url = url.replace("@data_type", "bookmark");
+
+//   await httpService
+//     .getRequest(url)
+//     .then((res) => {
+//       state.totalCounts = res.hits.total.value;
+//       state.counts = res.aggregations.result.buckets;
+//       loading.value = false;
+//     })
+//     .catch((err) => {
+//       console.info(err);
+//     })
+//     .finally(() => {
+//       loading.value = false;
+//     });
+// };
 // #endregion methods
 
 // #region hooks
@@ -106,6 +200,7 @@ const SearchList = defineAsyncComponent(() =>
               no-data-text="هنوز چیزی ذخیره نکرده‌اید!"
               no-data-icon="/img/haditha/save.png"
               :list="state.list"
+              :total="state.totalCounts"
             ></search-list>
           </div>
         </div>

pages/haditha/library/[id]/[slug]/index.vue

@@ -14,6 +14,7 @@ const router = useRouter();
 // #region imports
 import hadithaApi from "@haditha/apis/hadithaApi";
 import type { HadithResponseModel, Hits } from "@haditha/types/hadithType";
+import type { Hit } from "~/systems/hadith_ui/types/hadithType";
 // #endregion imports
 
 // #region meta
@@ -27,10 +28,94 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | ${route.params.slug}`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 // #endregion imports
 // #region props
@@ -52,25 +137,6 @@ const props = defineProps({
 
 // #region refs and reactives
 
-const prevIsDisabled = computed(() => {
-  console.info("prevIsDisabled");
-  let isDisabled = true;
-  if (state.selectedItem[0]._source.address.page_num)
-    return !(state.selectedItem[0]._source.address.page_num - 1 > 1);
-  return isDisabled;
-});
-const nextIsDisabled = computed(() => {
-  console.info("prevIsDisabled");
-
-  let isDisabled = true;
-  if (state.selectedItem[0]._source.address.page_num)
-    return !(
-      state.selectedItem[0]._source.address.page_num + 1 <
-      +route.query.page_count
-    );
-  return isDisabled;
-});
-
 // const page_num = computed({
 //   // getter
 //   get() {
@@ -86,66 +152,88 @@ const nextIsDisabled = computed(() => {
 //   },
 // });
 
-const treeItems = [
-  {
-    title: "فصل اول",
-    icon: "lucide:plus",
-    children: [
-      { title: "useAuth.ts", icon: "vscode-icons:file-type-typescript" },
-      { title: "useUser.ts", icon: "vscode-icons:file-type-typescript" },
-    ],
-  },
-  {
-    title: "فصل دوم",
-    icon: "lucide:plus",
-    children: [
-      { title: "useAuth.ts", icon: "vscode-icons:file-type-typescript" },
-      { title: "useUser.ts", icon: "vscode-icons:file-type-typescript" },
-    ],
-  },
-  {
-    title: "فصل سوم",
-    icon: "lucide:plus",
-    children: [
-      {
-        title: "بخش اول",
-        icon: "lucide:plus",
-        children: [
-          { title: "بخش اول-یک", icon: "vscode-icons:file-type-vue" },
-          {
-            title: "بخش اول-دو",
-            icon: "vscode-icons:file-type-vue",
-            children: [
-              { title: "بخش اول-یک-یک", icon: "vscode-icons:file-type-vue" },
-              { title: "بخش اول-یک-دو", icon: "vscode-icons:file-type-vue" },
-            ],
-          },
-        ],
-      },
-      {
-        title: "بخش دوم",
-        icon: "lucide:plus",
-        children: [
-          { title: "Card.vue", icon: "vscode-icons:file-type-vue" },
-          {
-            title: "Button.vue",
-            icon: "vscode-icons:file-type-vue",
-          },
-        ],
-      },
-    ],
-  },
-  { title: "فصل چهارم", icon: "vscode-icons:file-type-vue" },
-  { title: "فصل پنجم", icon: "vscode-icons:file-type-nuxt" },
-];
 const isModalOpen = ref(false);
 const loading = ref(false);
 const httpService = useNuxtApp()["$http"];
 
 const state = reactive({
-  selectedItem: {} as Hits,
+  selectedItem: [] as Hit[],
+  treeItems: [
+    {
+      title: "فصل اول",
+      icon: "lucide:plus",
+      children: [
+        { title: "useAuth.ts", icon: "vscode-icons:file-type-typescript" },
+        { title: "useUser.ts", icon: "vscode-icons:file-type-typescript" },
+      ],
+    },
+    {
+      title: "فصل دوم",
+      icon: "lucide:plus",
+      children: [
+        { title: "useAuth.ts", icon: "vscode-icons:file-type-typescript" },
+        { title: "useUser.ts", icon: "vscode-icons:file-type-typescript" },
+      ],
+    },
+    {
+      title: "فصل سوم",
+      icon: "lucide:plus",
+      children: [
+        {
+          title: "بخش اول",
+          icon: "lucide:plus",
+          children: [
+            { title: "بخش اول-یک", icon: "vscode-icons:file-type-vue" },
+            {
+              title: "بخش اول-دو",
+              icon: "vscode-icons:file-type-vue",
+              children: [
+                { title: "بخش اول-یک-یک", icon: "vscode-icons:file-type-vue" },
+                { title: "بخش اول-یک-دو", icon: "vscode-icons:file-type-vue" },
+              ],
+            },
+          ],
+        },
+        {
+          title: "بخش دوم",
+          icon: "lucide:plus",
+          children: [
+            { title: "Card.vue", icon: "vscode-icons:file-type-vue" },
+            {
+              title: "Button.vue",
+              icon: "vscode-icons:file-type-vue",
+            },
+          ],
+        },
+      ],
+    },
+    { title: "فصل چهارم", icon: "vscode-icons:file-type-vue" },
+    { title: "فصل پنجم", icon: "vscode-icons:file-type-nuxt" },
+  ],
 });
 
+const pageIsLessThanOne = computed(() => {
+  console.info("pageIsLessThanOne");
+  let isDisabled = true;
+  if (state.selectedItem.length)
+    return state.selectedItem[0]._source.address.page_num <= 1;
+  return isDisabled;
+});
+const pageIsBiggerThanTotal = computed(() => {
+  console.info("pageIsBiggerThanTotal");
+
+  let isDisabled = true;
+  if (
+    state.selectedItem.length &&
+    state.selectedItem[0]._source.address.page_num
+  )
+    return (
+      state.selectedItem?.[0]._source.address.page_num + 1 >=
+      +route.query.page_count
+    );
+
+  return isDisabled;
+});
 const page_num = ref(1);
 // #endregion refs and reactives
 
@@ -167,7 +255,7 @@ const fetchData = async () => {
     });
 
   if (status.value == "success") {
-    state.selectedItem = <Hits>data.value.hits.hits;
+    state.selectedItem = <Hit[]>data.value.hits.hits;
   }
 
   loading.value = false;
@@ -187,8 +275,8 @@ const onOpenList = () => {
 const onSearch = () => {
   // console.info("onSearch");
   router.push({
-    name:'hadithaSearch'
+    name: "hadithaSearch",
-  })
+  });
 };
 const onClose = () => {
   console.info("onClose");
@@ -198,34 +286,36 @@ const onClose = () => {
 };
 
 const handlePagination = (
-  prevNextIndicator: number | string,
+  prevNextIndicator: number,
-  pageNumber: number | string | undefined = undefined
+  pageNumber: number | undefined = undefined
 ) => {
   if (loading.value) return;
   loading.value = true;
 
-  if (
+  if (state.selectedItem?.length) {
-    !(
+    const isPageBiggerThanOne =
-      state.selectedItem[0]._source.address.page_num + prevNextIndicator > 1 &&
+      state.selectedItem[0]._source.address.page_num + prevNextIndicator > 0;
+    const isPageLessThanTotal =
       state.selectedItem[0]._source.address.page_num + prevNextIndicator <
-        +route.query.page_count
+      +route.query.page_count;
-    )
+
-  )
+    if (!(isPageBiggerThanOne && isPageLessThanTotal)) return;
-    return;
+  }
 
   let url = repoUrl() + hadithaApi.library.prevNextHadith;
   url = url.replace("@index_key", "dhparag");
-  url = url.replace("@vol_id", state.selectedItem[0]._source.address.vol_id);
+  url = url.replace("@vol_id", state.selectedItem?.[0]._source.address.vol_id);
   url = url.replace(
     "@page_num",
-    pageNumber ?? state.selectedItem[0]._source.address.page_num
+    (pageNumber ?? state.selectedItem?.[0]._source.address.page_num).toString()
   );
-  url = url.replace("@step", <string>prevNextIndicator);
+  url = url.replace("@step", prevNextIndicator.toString());
 
   httpService
     .getRequest(url)
     .then((res: HadithResponseModel) => {
       state.selectedItem = res.hits.hits;
+      page_num.value = res.hits.hits[0]._source.address.page_num ?? 1;
     })
     .finally(() => (loading.value = false));
 };
@@ -233,6 +323,33 @@ const handlePageChange = () => {
   handlePagination(1, page_num.value);
 };
 
+const getDataTree = () => {
+  let id = route.params.id;
+
+  let url = repoUrl() + hadithaApi.search.getDataTree;
+  url = url.replace("@appname", "monir");
+  url = url.replace("@offset", 0);
+  url = url.replace("@limit", 10000);
+  url = url.replace("@vol_id", id);
+  url = url.replace("@q", "none");
+
+  httpService.getRequest(url).then((res) => {
+    state.treeItems = prepareTreeData(res.hits.hits);
+  });
+};
+
+const prepareTreeData = (data) => {
+  return data.map((item) => {
+    return {
+      ...item,
+      ...item._source,
+      title: item._source.content,
+    };
+  });
+};
+
+getDataTree();
+
 // #endregion methods
 
 // components declaration
@@ -295,6 +412,7 @@ const UTree = defineAsyncComponent(
         <div class="page-content py-14 p-2">
           <!-- <h2></h2> -->
           <p
+            v-if="state.selectedItem?.length"
             v-for="(parag, index) in state.selectedItem"
             :key="index"
             v-html="parag?._source?.content"
@@ -307,11 +425,11 @@ const UTree = defineAsyncComponent(
               <UButton
                 @click="handlePagination(-1)"
                 class="prev-haditha"
-                label="حدیث قبل"
+                label="صفحه قبل"
                 color=""
                 variant="soft"
                 icon="i-haditha-chevron-right"
-                :disabled="prevIsDisabled"
+                :disabled="pageIsLessThanOne"
               />
               <div class="flex items-center">
                 <span class="total-pages">{{ route.query.page_count }}</span>
@@ -337,11 +455,11 @@ const UTree = defineAsyncComponent(
               <UButton
                 @click="handlePagination(1)"
                 class="next-haditha"
-                label="حدیث بعد"
+                label="صفحه بعد"
                 color=""
                 variant="soft"
                 trailing-icon="i-haditha-chevron-left"
-                :disabled="nextIsDisabled"
+                :disabled="pageIsBiggerThanTotal"
               />
             </div>
           </div>
@@ -357,7 +475,6 @@ const UTree = defineAsyncComponent(
         overlay: 'modal-overlay',
         content: 'modal-content accordion-menu h-10',
         header: 'modal-header',
-        wrapper: 'modal-wrapper',
         body: 'modal-body',
         title: 'modal-title',
         description: 'modal-description',
@@ -373,7 +490,7 @@ const UTree = defineAsyncComponent(
       <!-- <template #header></template> -->
       <!-- <template #content></template> -->
       <template #body>
-        <UTree :items="treeItems" />
+        <UTree :items="state.treeItems" />
         <!-- <accordion-menu @close="isModalOpen = !isModalOpen"></accordion-menu> -->
       </template>
       <!-- <template #footer></template> -->

pages/haditha/library/index.vue

@@ -10,10 +10,94 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | کتابخانه`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 
 // #region refs

pages/haditha/login.vue

@@ -7,10 +7,94 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | ورود`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 
 const stepOne = ref(true);

pages/haditha/public-pages/index.vue

@@ -10,10 +10,94 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | در باره حدیثا`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 const componentName = ref("");
 

pages/haditha/search/[id]/[slug]/index.vue

@@ -24,10 +24,94 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE}`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 // #endregion imports
 
@@ -89,16 +173,16 @@ const goToTheChatbot = () => {
   });
 };
 
-const handleFavorite = async (item = {}) => {
+const handleFavorite = async () => {
-  addToFavorites();
+  addToFavorites(state.selectedItem);
 
   // // add
-  // if (!item._source.tbookmark) {
+  // if (!state.selectedItem._source.tbookmark) {
-  //   addToFavorites();
+  //   addToFavorites(state.selectedItem);
   // }
   // // delete
   // else {
-  //   removeToFavorites();
+  //   removeFromFavorites(state.selectedItem);
   // }
 };
 
@@ -107,10 +191,8 @@ const addToFavorites = async (item = {}) => {
   url = url.replace("{{data_type}}", "bookmark");
   url = url.replace("{{ref_key}}", "dhparag");
   const formData = {
-    // ref_id: item._id,
+    ref_id: item._id,
-    ref_id: "pdh388_2113",
+    title: item._source.content,
-    title: "عنوان تست_حدیثا بوک مارک",
-    // title: item._source.title,
   };
   httpService.postRequest(url, formData).then((res) => {
     // this.updateListAnswer(index, "tbookmark", 1);
@@ -121,7 +203,7 @@ const removeFromFavorites = async (item = {}, index = 0) => {
   let url = repoUrl() + hadithaApi.favorite.deleteByRefid;
   url = url.replace("{{data_type}}", "bookmark");
   url = url.replace("{{index_key}}", "dhparag");
-  url = url.replace("{{ref_id}}", "pdh388_2113");
+  url = url.replace("{{ref_id}}", item._id);
 
   const formData = {
     ref_id: item._id,
@@ -173,12 +255,13 @@ const localCopyTextToClipboard = (text: string) => {
       <div class="body-header">
         <span class="top-left-bgi z-0"></span>
         <div class="modal-title flex justify-between">
-          <img
+          <ULink
-            fit="auto"
+            raw
-            quality="80"
+            :to="{ name: 'haditha' }"
-            placeholder
+            class="flex justify-center items-center me-3"
-            src="/img/haditha/haditha-title.svg"
+          >
-          />
+            <img fit="auto" quality="80" src="/img/haditha/haditha-title.svg" />
+          </ULink>
 
           <UButton
             icon="i-haditha-close"

pages/haditha/search/index.vue

@@ -8,12 +8,98 @@ useHead({
   title: `${import.meta.env.VITE_HADITH_PAGE_TITLE} | جستجو`,
   meta: [
     { name: "description", content: "کاوش با هوش مصنوعی در احادیث اسلامی" },
+    { name: "msapplication-TileColor", content: "#ffffff" },
+    {
+      name: "msapplication-TileImage",
+      content: "/img/haditha/fav-icons/ms-icon-144x144.png",
+    },
+    { name: "theme-color", content: "#ffffff" },
   ],
   bodyAttrs: {
     class: import.meta.env.VITE_HADITH_SYSTEM,
   },
+  link: [
+    {
+      rel: "icon",
+      type: "image/x-icon",
+      href: "/img/haditha/fav-icons/favicon.ico",
+    },
+    { rel: "manifest", href: "/img/haditha/fav-icons/manifest.json" },
+    // rel: icon
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "16x16",
+      href: "/img/haditha/fav-icons/favicon-16x16.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "32x32",
+      href: "/img/haditha/fav-icons/favicon-32x32.png",
+    },
+    {
+      rel: "icon",
+      type: "image/png",
+      sizes: "96x96",
+      href: "/img/haditha/fav-icons/favicon-96x96.png",
+    },
+    {
+      rel: "icon",
+      sizes: "192x192",
+      type: "image/png",
+      href: "/img/haditha/fav-icons/android-icon-192x192.png",
+    },
+    // rel: apple
+    {
+      rel: "apple-touch-icon",
+      sizes: "57x57",
+      href: "/img/haditha/fav-icons/apple-icon-57x57.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "60x60",
+      href: "/img/haditha/fav-icons/android-icon-60x60.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "72x72",
+      href: "/img/haditha/fav-icons/android-icon-72x72.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "76x76",
+      href: "/img/haditha/fav-icons/android-icon-76x76.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "114x114",
+      href: "/img/haditha/fav-icons/android-icon-114x114.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "120x120",
+      href: "/img/haditha/fav-icons/android-icon-120x120.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "144x144",
+      href: "/img/haditha/fav-icons/android-icon-144x144.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "152x152",
+      href: "/img/haditha/fav-icons/android-icon-152x152.png",
+    },
+    {
+      rel: "apple-touch-icon",
+      sizes: "180x180",
+      href: "/img/haditha/fav-icons/android-icon-180x180.png",
+    },
+  ],
 });
 
+const route = useRoute();
 const img = useImage();
 const searchQuery = ref("");
 const total = ref(0);
@@ -23,14 +109,16 @@ const state = reactive({
 
 const backgroundImageStyle = computed(() => {
   // Use $img to generate an optimized image URL
-  let optimizedImageUrl = img("/img/haditha/background.webp", {
+  // let optimizedImageUrl = img("/img/haditha/background.webp", {
-    quality: 40,
+  //   quality: 40,
-  });
+  // });
+  let optimizedImageUrl = "/img/haditha/background.webp";
 
   if (searchQuery.value?.length) {
-    optimizedImageUrl = img("/img/haditha/sub-header-bgi.webp", {
+    // optimizedImageUrl = img("/img/haditha/sub-header-bgi.webp", {
-      quality: 80,
+    //   quality: 80,
-    });
+    // });
+    optimizedImageUrl = "/img/haditha/sub-header-bgi.webp";
 
     return {
       backgroundImage: `url(${optimizedImageUrl}), linear-gradient(199.05deg, #ffffff 9.99%, #e4fff7 42.07%, #ffffff 97.12%)`,
@@ -72,7 +160,7 @@ const SearchList = defineAsyncComponent(() =>
         <div class="logo-container">
           <div
             class="search-box-container flex justify-center"
-            :class="{ 'pb-0': state.searchList.length }"
+            :class="{ 'pb-0': route.name == 'hadithaSearch' }"
           >
             <auto-complation
               :showFilter="true"
@@ -110,7 +198,7 @@ const SearchList = defineAsyncComponent(() =>
             <p class="no-data-text">نتیجه‌ای یافت نشد!</p>
           </no-data> -->
           <div
-            v-if="searchQuery?.length && state.searchList?.length"
+            v-if="searchQuery?.length"
             class="search-box-container pb-0 bg-white flex justify-center"
           >
             <search-list

types/hadithType.ts

@@ -65,8 +65,8 @@ export interface Source {
   lang: string;
   tocs: string[];
   xml: string;
-  ai_embeddings: number[];
+  ai_embeddings?: number[];
-  ai_classes: AiClass[];
+  ai_classes?: AiClass[];
 }
 
 export interface Address {
@@ -350,3 +350,12 @@ export interface Fields {
 }
 
 export interface GeneratedType {}
+
+
+export interface Root {
+  _index: string
+  _id: string
+  _score: any
+  _source: Source
+  sort: number[]
+}