fix: inital eslint errors

components/LibraryDirectory.vue

@@ -7,14 +7,14 @@
     <!-- Search bar -->
     <div class="mt-5 relative">
       <input
+        id="search"
+        v-model="searchQuery"
         type="text"
         name="search"
-        id="search"
         autocomplete="off"
         class="block w-full rounded-md bg-zinc-900 py-2 pl-9 pr-2 text-sm text-zinc-100 outline outline-1 -outline-offset-1 outline-zinc-700 placeholder:text-gray-400 focus:outline focus:outline-2 focus:-outline-offset-2 focus:outline-blue-600"
         placeholder="Search library..."
-        v-model="searchQuery"
-      />
+      >
       <MagnifyingGlassIcon
         class="pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-zinc-400"
         aria-hidden="true"
@@ -22,11 +22,11 @@
     </div>
 
     <TransitionGroup
+      v-if="filteredLibrary.length > 0"
       name="list"
       tag="ul"
       role="list"
       class="mt-2 space-y-0.5"
-      v-if="filteredLibrary.length > 0"
     >
       <li v-for="game in filteredLibrary" :key="game.id" class="flex">
         <NuxtLink
@@ -37,7 +37,7 @@
             :src="useObject(game.mCoverId)"
             class="h-9 w-9 flex-shrink-0 rounded transition-all duration-300 group-hover:scale-105 hover:rotate-[-2deg] hover:shadow-lg"
             alt=""
-          />
+          >
           <div class="min-w-0 flex-1 pl-2.5">
             <p class="text-sm font-semibold text-display text-zinc-200 truncate text-left">
               {{ game.mName }}