fix fuzzy search: FuseTrackOptions

+ reduce width required to hide sidebar automatically
+ move ArtistAlbumsFetcher.vue to components folder
+ escape ALT button in keyboard shortcuts
+ use elem.dispatchEvent to toggle page search

src/components/AlbumView/GenreBanner.vue

@@ -36,10 +36,11 @@ onMounted(async () => {
 .genres-banner.nocontrast {
   color: $black;
 }
+
 .genres-banner {
   display: flex;
   gap: 1rem;
-  margin-top: 1rem;
+  margin-top: 2rem;
   font-size: 0.9rem;
   padding-left: $medium;
   text-transform: capitalize;

src/components/ArtistView/ArtistAlbumsFetcher.vue

@@ -0,0 +1,18 @@
+<template><div style="height: 1px;"></div></template>
+
+<script setup lang="ts">
+import { onMounted } from "vue";
+import useArtistPageStore from "@/stores/pages/artist";
+import { onBeforeRouteUpdate } from "vue-router";
+
+const store = useArtistPageStore();
+
+onMounted(async () => {
+  await store.getArtistAlbums();
+});
+
+onBeforeRouteUpdate(async (to) => {
+  store.resetAlbums();
+  await store.getArtistAlbums();
+});
+</script>

src/components/shared/NavSearchInput.vue

@@ -2,6 +2,7 @@
   <div class="header-input-wrapper rounded-sm" :class="{ showInput: clicked }">
     <button
       class="search-btn circular"
+      id="page-search-trigger"
       :class="{ 'btn-active': clicked }"
       @click="handleFocus"
     >

src/components/shared/SongItem.vue

@@ -21,8 +21,15 @@
         ></div>
       </div>
       <div v-tooltip class="song-title">
-        <div class="title ellip" @click.prevent="emitUpdate" ref="artisttitle">
-          {{ track.title }}
+        <div class="with-flag">
+          <span
+            class="title ellip"
+            @click.prevent="emitUpdate"
+            ref="artisttitle"
+          >
+            {{ track.title }}
+          </span>
+          <span v-if="(track.bitrate > 1024)" class="master-flag"><b>M</b> </span>
         </div>
         <div class="isSmallArtists" style="display: none">
           <ArtistName
@@ -71,7 +78,6 @@ import HeartSvg from "@/assets/icons/heart.svg";
 import OptionSvg from "@/assets/icons/more.svg";
 import ArtistName from "./ArtistName.vue";
 
-const context_on = ref(false);
 const imguri = paths.images.thumb.small;
 const context_menu_showing = ref(false);
 
@@ -110,7 +116,27 @@ function showMenu(e: MouseEvent) {
   padding-left: $small;
 
   .song-title {
+    .with-flag {
+      display: flex;
+      align-items: center;
+    }
+
+    .master-flag {
+      font-size: 10px;
+      margin-left: $smaller;
+      background-color: rgba(184, 108, 21, 0.281);
+      color: rgb(255, 153, 0);
+      padding: 2px 5px;
+      border-radius: 5px;
+      opacity: .75;
+    }
+
     cursor: pointer;
+    // outline: solid 1px;
+
+    .title {
+      margin-bottom: 2px;
+    }
   }
 
   &:hover {