refactor logo, bottom bar and perks.js

- add new logo
- add tsconfig.json
- move logo to new component
- update bottombar
- remove props from hotkeys and progress bar
- convert perks.js -> perks.ts

src/components/shared/SongItem.vue

@@ -29,7 +29,7 @@
       <div class="ellip" v-if="props.song.artists[0] !== ''">
         <span
           class="artist"
-          v-for="artist in perks.putCommas(props.song.artists)"
+          v-for="artist in putCommas(props.song.artists)"
           :key="artist"
           >{{ artist }}</span
         >
@@ -53,13 +53,13 @@
       </div>
     </router-link>
     <div class="song-duration">
-      {{ perks.formatSeconds(props.song.length) }}
+      {{ formatSeconds(props.song.length) }}
     </div>
   </div>
 </template>
 
 <script setup lang="ts">
-import perks from "../../composables/perks.js";
+import { putCommas, formatSeconds } from "../../composables/perks";
 import useContextStore from "../../stores/context";
 import useModalStore from "../../stores/modal";
 import useQueueStore from "../../stores/queue";
@@ -67,7 +67,7 @@ import { ContextSrc } from "../../composables/enums";
 
 import { ref } from "vue";
 import trackContext from "../../contexts/track_context";
-import { Track } from "../../interfaces.js";
+import { Track } from "../../interfaces";
 import { paths } from "../../config";
 
 const contextStore = useContextStore();

src/components/shared/TrackItem.vue

@@ -36,7 +36,7 @@
 
 <script setup lang="ts">
 import { ref } from "vue";
-import perks from "../../composables/perks";
+import { putCommas } from "../../composables/perks";
 import trackContext from "../../contexts/track_context";
 import { Track } from "../../interfaces";
 import { ContextSrc } from "../../composables/enums";
@@ -46,9 +46,8 @@ import useModalStore from "../../stores/modal";
 import useQueueStore from "../../stores/queue";
 import { paths } from "../../config";
 
-
 const contextStore = useContextStore();
-const imguri = paths.images.thumb
+const imguri = paths.images.thumb;
 
 const props = defineProps<{
   track: Track;
@@ -78,9 +77,6 @@ const emit = defineEmits<{
   (e: "PlayThis", track: Track): void;
 }>();
 
-const current = ref(perks.current);
-const putCommas = perks.putCommas;
-
 const playThis = (track: Track) => {
   emit("PlayThis", track);
 };