From d4f54a21b444e045652582aecf175dda99d3cc2c Mon Sep 17 00:00:00 2001
From: geoffrey45 <geoffreymungai45@gmail.com>
Date: Wed, 21 Sep 2022 15:09:51 +0300
Subject: [PATCH] clean components

---
 src/layouts/HeaderAndVList.vue |  3 ++-
 src/views/album/Content.vue    | 11 +++++++++--
 src/views/album/index.vue      | 23 +++++++++++++++--------
 3 files changed, 26 insertions(+), 11 deletions(-)

diff --git a/src/layouts/HeaderAndVList.vue b/src/layouts/HeaderAndVList.vue
index 95a68c61..f5f24293 100644
--- a/src/layouts/HeaderAndVList.vue
+++ b/src/layouts/HeaderAndVList.vue
@@ -40,11 +40,12 @@
 </template>
 
 <script setup lang="ts">
-import { useElementSize, useVirtualList } from "@vueuse/core";
 import { computed, ref } from "vue";
+import { useElementSize, useVirtualList } from "@vueuse/core";
 
 import { Track } from "@/interfaces";
 import useQStore from "@/stores/queue";
+
 import SongItem from "@/components/shared/SongItem.vue";
 
 const props = defineProps<{
diff --git a/src/views/album/Content.vue b/src/views/album/Content.vue
index a39ee1f6..be2085f3 100644
--- a/src/views/album/Content.vue
+++ b/src/views/album/Content.vue
@@ -14,11 +14,18 @@
 </template>
 
 <script setup lang="ts">
-import { Track } from "@/interfaces";
-import SongList from "@/components/FolderView/SongList.vue";
+// @stores
 import useQueueStore from "@/stores/queue";
 import useAlbumStore from "@/stores/pages/album";
 
+// @utils
+import { Track } from "@/interfaces";
+
+// @components
+import SongList from "@/components/FolderView/SongList.vue";
+
+// @setup
+
 const props = defineProps<{
   discs: {
     [key: string]: Track[];
diff --git a/src/views/album/index.vue b/src/views/album/index.vue
index dee32cca..0ba0d5ac 100644
--- a/src/views/album/index.vue
+++ b/src/views/album/index.vue
@@ -7,20 +7,33 @@
 </template>
 
 <script setup lang="ts">
-import useAStore from "@/stores/pages/album";
+// @libs
 import {
   onBeforeRouteLeave,
   onBeforeRouteUpdate,
   RouteLocationNormalized,
 } from "vue-router";
 
+// @stores
+import useQueueStore from "@/stores/queue";
+import useAStore from "@/stores/pages/album";
+
+// @components
 import Header from "./Header.vue";
 import Layout from "@/layouts/HeaderAndVList.vue";
-import useQueueStore from "@/stores/queue";
 
+// @vars
 const album = useAStore();
 const queue = useQueueStore();
 
+// @methods
+function playFromAlbum(index: number) {
+  const { title, artist, hash } = album.info;
+  queue.playFromAlbum(title, artist, hash, album.allTracks);
+  queue.play(index);
+}
+
+// @hooks
 onBeforeRouteUpdate(async (to: RouteLocationNormalized) => {
   await album
     .fetchTracksAndArtists(to.params.hash.toString())
@@ -32,10 +45,4 @@ onBeforeRouteLeave(() => {
     album.resetQuery();
   }, 500);
 });
-
-function playFromAlbum(index: number) {
-  const { title, artist, hash } = album.info;
-  queue.playFromAlbum(title, artist, hash, album.allTracks);
-  queue.play(index);
-}
 </script>