fix layout shift caused by scrollbar

+ append search query to url (to support reload)
+ fix right sidebar search tabs bug
+ redesign the load more button on the search page

src/components/LeftSidebar/Navigation.vue

@@ -3,7 +3,11 @@
     <router-link
       v-for="menu in menus"
       :key="menu.name"
-      :to="{ name: menu.route_name, params: menu?.params }"
+      :to="{
+        name: menu.route_name,
+        params: menu?.params,
+        query: menu.query && menu.query(),
+      }"
     >
       <div
         v-if="menu.separator"
@@ -34,6 +38,7 @@ import QueueSvg from "../../assets/icons/queue.svg";
 import SearchSvg from "../../assets/icons/search.svg";
 import SettingsSvg from "../../assets/icons/settings.svg";
 import HeartSvg from "../../assets/icons/heart.svg";
+import useSearchStore from "@/stores/search";
 
 const menus = [
   {
@@ -65,6 +70,7 @@ const menus = [
     name: "search",
     route_name: Routes.search,
     params: { page: "tracks" },
+    query: () => ({ q: useSearchStore().query }),
     icon: SearchSvg,
   },
   {

src/components/RightSideBar/Search/Main.vue

@@ -40,6 +40,8 @@ function switchTab(tab: string) {
   overflow: hidden;
   height: 100%;
   width: 100%;
+  display: grid;
+  grid-template-rows: max-content 1fr;
 
   .heading {
     padding: $medium;

src/components/nav/Titles/SearchTitle.vue

@@ -1,11 +1,13 @@
 <template>
   <div class="nav-search-input">
     <SearchInput :on_nav="true" />
-    <TabsWrapper
+    <Tabs
       :tabs="tabs"
       :currentTab="($route.params.page as string)"
       @switchTab="(tab: string) => {
-        $router.push({ name: Routes.search, params: { page: tab } });
+        $router.replace({ name: Routes.search, params: { page: tab }, query: {
+          q: search.query,
+        } });
         search.switchTab(tab);
       }"
     />
@@ -13,7 +15,7 @@
 </template>
 
 <script setup lang="ts">
-import TabsWrapper from "@/components/RightSideBar/Search/TabsWrapper.vue";
+import Tabs from "@/components/RightSideBar/Search/TabsWrapper.vue";
 import SearchInput from "@/components/RightSideBar/SearchInput.vue";
 import { Routes } from "@/router/routes";