remove bottom content

src/components/RightSideBar/Search/ArtistGrid.vue

@@ -11,7 +11,14 @@
         :alt="true"
       />
     </div>
-    <LoadMore v-if="search.artists.more" @loadMore="loadMore" />
+    <LoadMore
+      v-if="album_grid && search.albums.more"
+      :loader="search.loadAlbums"
+    />
+    <LoadMore
+      v-if="!album_grid && search.artists.more"
+      :loader="search.loadArtists"
+    />
   </div>
 </template>
 
@@ -28,10 +35,10 @@ defineProps<{
   album_grid?: boolean;
 }>();
 
-function loadMore() {
-  search.updateLoadCounter("artists");
-  search.loadArtists(search.loadCounter.artists);
-}
+// function loadMore() {
+//   search.updateLoadCounter("artists");
+//   search.loadArtists(search.loadCounter.artists);
+// }
 </script>
 
 <style lang="scss">

src/components/RightSideBar/Search/LoadMore.vue

@@ -1,19 +1,17 @@
 <template>
   <div class="morexx">
-    <button @click="loadMore" class="btn">
+    <button class="btn" @click="loader">
       <div class="text">Load More</div>
     </button>
   </div>
 </template>
 
 <script setup lang="ts">
-const emit = defineEmits<{
-  (e: "loadMore"): void;
+defineProps<{
+  loader: () => void;
 }>();
 
-function loadMore() {
-  emit("loadMore");
-}
+
 </script>
 
 <style lang="scss">

src/components/RightSideBar/Search/TracksGrid.vue

@@ -11,7 +11,7 @@
         @PlayThis="updateQueue(index)"
       />
     </TransitionGroup>
-    <LoadMore v-if="search.tracks.more" @loadMore="loadMore" />
+    <LoadMore v-if="search.tracks.more" :loader="search.loadTracks" />
   </div>
 </template>
 
@@ -24,11 +24,6 @@ import useSearchStore from "../../../stores/search";
 const queue = useQStore();
 const search = useSearchStore();
 
-function loadMore() {
-  search.updateLoadCounter("tracks");
-  search.loadTracks(search.loadCounter.tracks);
-}
-
 function updateQueue(index: number) {
   queue.playFromSearch(search.query, search.tracks.value);
   queue.play(index);