From e1986b699148a5e3c14f5beedadc940a878ab33c Mon Sep 17 00:00:00 2001
From: Varun Patil <radialapps@gmail.com>
Date: Fri, 28 Apr 2023 22:13:32 -0700
Subject: [PATCH] topmatter: refactor

Signed-off-by: Varun Patil <radialapps@gmail.com>
---
 src/components/top-matter/TopMatter.vue | 24 +++++++++++++++++++-----
 1 file changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/components/top-matter/TopMatter.vue b/src/components/top-matter/TopMatter.vue
index 5d90d753..9a7ab3ed 100644
--- a/src/components/top-matter/TopMatter.vue
+++ b/src/components/top-matter/TopMatter.vue
@@ -1,9 +1,6 @@
 <template>
-  <div class="top-matter-container" v-if="type">
-    <FolderTopMatter v-if="type === 1" />
-    <ClusterTopMatter v-else-if="type === 2" />
-    <FaceTopMatter v-else-if="type === 3" />
-    <AlbumTopMatter v-else-if="type === 4" />
+  <div class="top-matter-container" v-if="currentmatter">
+    <component :is="currentmatter" />
   </div>
 </template>
 
@@ -40,6 +37,23 @@ export default defineComponent({
     this.setTopMatter();
   },
 
+  computed: {
+    currentmatter() {
+      switch (this.type) {
+        case TopMatterType.FOLDER:
+          return FolderTopMatter;
+        case TopMatterType.ALBUM:
+          return AlbumTopMatter;
+        case TopMatterType.CLUSTER:
+          return ClusterTopMatter;
+        case TopMatterType.FACE:
+          return FaceTopMatter;
+        default:
+          return null;
+      }
+    },
+  },
+
   methods: {
     /** Create top matter */
     setTopMatter() {