Cleaned / JSDoc for calendar search

src/components/calendar/search/CalendarSearch.vue

@@ -1,33 +1,27 @@
 <script lang="ts" setup>
 import {
+  characterCategories,
   isCharacter,
   type Character,
-  characterCategories,
   type CharacterCategory
 } from '@/models/Characters'
 import type { LeimDateOrder } from '@/models/Date'
 import {
+  calendarEventCategories,
   isCalendarEvent,
   type CalendarEvent,
-  calendarEventCategories,
   type CalendarEventCategory
 } from '@/models/Events'
-import { capitalize } from '@/utils/Strings'
 import { useCharacters } from '@/stores/CharacterStore'
 import { useCalendarEvents } from '@/stores/EventStore'
+import { capitalize } from '@/utils/Strings'
 import { useMagicKeys, useStorage, whenever } from '@vueuse/core'
 import { computed, ref } from 'vue'
 import { searchUnifier, type SearchMode } from '../Search'
 
 import { Button } from '@/components/ui/button'
 import { CommandEmpty, CommandGroup, CommandItem, CommandList } from '@/components/ui/command'
-import {
+import { Dialog, DialogContent, DialogDescription, DialogTitle } from '@/components/ui/dialog'
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogTitle,
-  DialogTrigger
-} from '@/components/ui/dialog'
 import { Input } from '@/components/ui/input'
 import {
   Pagination,
@@ -87,6 +81,9 @@ const itemsPerPage: number = 20
 const startOfList = computed<number>(() => (currentPage.value - 1) * itemsPerPage)
 const endOfList = computed<number>(() => startOfList.value + itemsPerPage)
 
+/**
+ * Resets the pagination
+ */
 function resetPage() {
   currentPage.value = 1
 }
@@ -186,20 +183,32 @@ const searchResults = computed<(Character | CalendarEvent)[]>(() => {
   return results
 })
 
+/**
+ * Removes the search query, resets the pagination and removes all selected categories
+ */
 function resetSearch() {
   searchQuery.value = ''
   resetPage()
   selectedCategories.value = []
 }
 
+/**
+ * Opens the search dialog
+ */
 function openDialog() {
   modalOpen.value = true
 }
 
+/**
+ * Closes the search dialog
+ */
 function closeDialog() {
   modalOpen.value = false
 }
 
+/**
+ * Switches the selectedEntity
+ */
 function handleEntitySwitch() {
   resetPage()
   selectedCategories.value = []
@@ -212,7 +221,7 @@ whenever(keys.control_period, () => {
   openDialog()
 })
 
-// Categories
+// Compute categories based on current selectedEntity
 const currentCategories = computed(() => {
   if (selectedEntity.value === 'characters') {
     return [...characterCategories]
@@ -225,17 +234,22 @@ const selectedCategories = ref<(CharacterCategory | CalendarEventCategory)[]>([]
 const categoryFilterOpened = ref<boolean>(false)
 const searchCategory = ref<string>('')
 
-const filteredFrameworks = computed(() =>
+const filteredCategories = computed(() =>
   currentCategories.value.filter((i) => !selectedCategories.value.includes(i))
 )
 
+/**
+ * Handles the category selections from the TagInput component
+ *
+ * @param e Radix Change Event
+ */
 function handleCategorySelect(e: any) {
   if (typeof e.detail.value === 'string') {
     searchCategory.value = ''
     selectedCategories.value.push(e.detail.value)
   }
 
-  if (filteredFrameworks.value.length === 0) {
+  if (filteredCategories.value.length === 0) {
     categoryFilterOpened.value = false
   }
 }
@@ -325,7 +339,7 @@ function handleCategorySelect(e: any) {
                     <CommandEmpty />
                     <CommandGroup>
                       <CommandItem
-                        v-for="framework in filteredFrameworks"
+                        v-for="framework in filteredCategories"
                         :key="framework"
                         :value="framework"
                         @select.prevent="handleCategorySelect"