bests posts/topics

app/services/discourse_rewind/rewind/action/best_posts.rb

@@ -10,7 +10,7 @@ module DiscourseRewind
           .where(deleted_at: nil)
           .where("post_number > 1")
           .order("like_count DESC NULLS LAST")
-          .limit(5)
+          .limit(3)
           .pluck(:id, :topic_id, :like_count, :reply_count, :raw, :cooked)
 
       { data: best_posts, identifier: "best-posts" }

app/services/discourse_rewind/rewind/action/best_topics.rb

@@ -9,7 +9,7 @@ module DiscourseRewind
           .references(:topic)
           .where(topic: { deleted_at: nil, created_at: date, user_id: user.id })
           .order("yearly_score DESC NULLS LAST")
-          .limit(5)
+          .limit(3)
           .pluck(:topic_id, :title, :excerpt, :yearly_score)
           .map do |topic_id, title, excerpt, yearly_score|
             { topic_id: topic_id, title: title, excerpt: excerpt, yearly_score: yearly_score }

assets/javascripts/discourse/components/reports/best-posts.gjs

@@ -1,9 +1,22 @@
 import Component from "@glimmer/component";
+import { get } from "@ember/object";
+import { htmlSafe } from "@ember/template";
 
 export default class BestPosts extends Component {
   <template>
-    <div class="rewind-report-page">
+    <div class="rewind-report-page -best-posts">
-      Best posts
+      <h3 class="rewind-report-title">Your 3 best posts</h3>
+      <div class="rewind-report-container">
+        {{#each @report.data as |post|}}
+          <div class="rewind-card">
+            <div class="best-posts__post">{{htmlSafe (get post "5")}}</div>
+            <span class="best-posts__likes">Likes:
+              {{htmlSafe (get post "2")}}</span>
+            <span class="best-posts__replies">Replies:
+              {{htmlSafe (get post "3")}}</span>
+          </div>
+        {{/each}}
+      </div>
     </div>
   </template>
 }

assets/javascripts/discourse/components/reports/best-topics.gjs

@@ -1,9 +1,23 @@
 import Component from "@glimmer/component";
+import { concat } from "@ember/helper";
 
 export default class BestTopics extends Component {
   <template>
-    <div class="rewind-report-page">
+    <div class="rewind-report-page -best-topics">
-      BestTopics
+      <h3 class="rewind-report-title">Your 3 best topics</h3>
+      <div class="rewind-report-container">
+        {{log @report.data}}
+        {{#each @report.data as |topic|}}
+          <div class="rewind-card">
+            <a
+              href={{concat "/t/-/" topic.topic_id}}
+              class="best-topics__title"
+            >
+              {{topic.title}}
+            </a>
+          </div>
+        {{/each}}
+      </div>
     </div>
   </template>
 }

assets/javascripts/discourse/components/rewind.gjs

@@ -115,6 +115,10 @@ export default class Rewind extends Component {
                   <Reactions @report={{report}} />
                 {{else if (eq report.identifier "word-cloud")}}
                   <WordCloud @report={{report}} />
+                {{else if (eq report.identifier "best-posts")}}
+                  <BestPosts @report={{report}} />
+                {{else if (eq report.identifier "best-topics")}}
+                  <BestTopics @report={{report}} />
                 {{else if (eq report.identifier "activity-calendar")}}
                   <ActivityCalendar @report={{report}} />
                 {{/if}}

assets/stylesheets/common/best-posts.scss

@@ -0,0 +1,6 @@
+.-best-posts {
+  .rewind-report-container {
+    flex-direction: column;
+    gap: 1em;
+  }
+}

assets/stylesheets/common/best-topics.scss

@@ -0,0 +1,6 @@
+.-best-topics {
+  .rewind-report-container {
+    flex-direction: column;
+    gap: 1em;
+  }
+}

assets/stylesheets/common/index.scss

@@ -4,4 +4,6 @@
 @import "post-received-reactions";
 @import "post-used-reactions";
 @import "activity-calendar";
+@import "best-posts";
+@import "best-topics";
 @import "blobs";