feat: Show popular articles on widget home (#7604)

app/javascript/widget/components/ArticleHero.vue

@@ -1,13 +1,10 @@
 <template>
-  <div>
-    <h2 class="text-base font-bold leading-6 text-slate-800 mb-0">
-      {{ $t('PORTAL.POPULAR_ARTICLES') }}
-    </h2>
-    <category-card
-      :articles="articles.slice(0, 4)"
-      @view-all-articles="$emit('view-all-articles')"
-    />
-  </div>
+  <category-card
+    :title="$t('PORTAL.POPULAR_ARTICLES')"
+    :articles="articles.slice(0, 4)"
+    @view-all="$emit('view-all')"
+    @view="onArticleClick"
+  />
 </template>
 
 <script>
@@ -24,6 +21,11 @@ export default {
       default: '',
     },
   },
+  methods: {
+    onArticleClick(link) {
+      this.$emit('view', link);
+    },
+  },
 };
 </script>