Save complete tracks and albums to the db for faster startup

- refactor function locations
- add logger
- check for new tracks instead of re-processing all files

src/App.vue

@@ -25,11 +25,8 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
 import Navigation from "./components/LeftSidebar/Navigation.vue";
 
-import perks from "@/composables/perks.js";
-
 import Main from "./components/RightSideBar/Main.vue";
 import nowPlaying from "./components/LeftSidebar/nowPlaying.vue";
 import NavBar from "./components/nav/NavBar.vue";
@@ -40,19 +37,16 @@ import ContextMenu from "./components/contextMenu.vue";
 import Modal from "./components/modal.vue";
 import Notification from "./components/Notification.vue";
 import useQStore from "./stores/queue";
-import shortcuts from "./composables/keyboard";
-
-const context_store = useContextStore();
-const queue = useQStore();
-
-queue.readQueueFromLocalStorage();
+import listenForKeyboardEvents from "./composables/keyboard";
 
 const RightSideBar = Main;
-
-shortcuts(queue);
-
+const context_store = useContextStore();
+const queue = useQStore();
 const app_dom = document.getElementById("app");
 
+queue.readQueueFromLocalStorage();
+listenForKeyboardEvents(queue);
+
 app_dom.addEventListener("click", (e) => {
   if (context_store.visible) {
     context_store.hideContextMenu();

src/components/AlbumView/Header.vue

@@ -12,7 +12,7 @@
       <div class="info">
         <div class="top">
           <div class="h">Album</div>
-          <div class="title ellip">{{ props.album.album }}</div>
+          <div class="title ellip">{{ props.album.title }}</div>
         </div>
         <div class="bottom">
           <div class="stats">

src/interfaces.ts

@@ -25,7 +25,7 @@ interface Folder {
 }
 
 interface AlbumInfo {
-  album: string;
+  title: string;
   artist: string;
   count: number;
   duration: number;