folder-top: prevent UI glitch when switching to timeline view

Signed-off-by: Varun Patil <radialapps@gmail.com>

src/components/top-matter/FolderDynamicTopMatter.vue

@@ -20,6 +20,7 @@ export default defineComponent({
 
   data: () => ({
     folders: [] as IFolder[],
+    currentFolder: '<none>',
   }),
 
   components: {
@@ -30,11 +31,15 @@ export default defineComponent({
 
   methods: {
     async refresh(): Promise<boolean> {
-      // Clear folders
+      const folder = utils.getFolderRoutePath(this.config.folders_path);
+
+      // Clear folders if switching to a different folder, otherwise just refresh
+      if (this.currentFolder === folder) {
+        this.currentFolder = folder;
         this.folders = [];
+      }
 
       // Get subfolders URL
-      const folder = utils.getFolderRoutePath(this.config.folders_path);
       const url = API.Q(API.FOLDERS_SUB(), { folder });
 
       // Make API call to get subfolders

src/components/top-matter/FolderTopMatter.vue

@@ -84,7 +84,7 @@ export default defineComponent({
     },
 
     recursive(): boolean {
-      return this.$route.query.recursive === '1';
+      return !!this.$route.query.recursive;
     },
   },
 
@@ -94,7 +94,12 @@ export default defineComponent({
     },
 
     toggleRecursive() {
-      this.$router.replace({ query: this.recursive ? {} : { recursive: '1' } });
+      this.$router.replace({
+        query: {
+          ...this.$router.currentRoute.query,
+          recursive: this.recursive ? undefined : String(1),
+        },
+      });
     },
   },
 });