DEV: fixes

Author: keegangeorge

assets/javascripts/discourse/components/admin-report-sentiment-analysis.gjs

@@ -20,8 +20,8 @@ import { clipboardCopy } from "discourse/lib/utilities";
 import Post from "discourse/models/post";
 import closeOnClickOutside from "discourse/modifiers/close-on-click-outside";
 import { i18n } from "discourse-i18n";
-import DoughnutChart from "discourse/plugins/discourse-ai/discourse/components/doughnut-chart";
 import DTooltip from "float-kit/components/d-tooltip";
+import DoughnutChart from "discourse/plugins/discourse-ai/discourse/components/doughnut-chart";
 
 export default class AdminReportSentimentAnalysis extends Component {
   @service router;
@@ -326,12 +326,6 @@ export default class AdminReportSentimentAnalysis extends Component {
             @action={{this.backToAllCharts}}
           />
 
-          {{!-- <DButton
-            @title="discourse_ai.sentiments.sentiment_analysis.share_chart"
-            @icon={{this.shareIcon}}
-            @action={{this.shareChart}}
-            class="share btn-flat"
-          /> --}}
           <DTooltip
             class="share btn-flat"
             @icon={{this.shareIcon}}
@@ -348,6 +342,8 @@ export default class AdminReportSentimentAnalysis extends Component {
           @data={{this.selectedChart.scores}}
           @totalScore={{this.selectedChart.total_score}}
           @doughnutTitle={{this.selectedChart.title}}
+          @skipCanvasResize={{true}}
+          @displayLegend={{true}}
           @radius={{100}}
         />
 

assets/javascripts/discourse/components/doughnut-chart.gjs

@@ -33,6 +33,7 @@ export default class DoughnutChart extends Component {
 
   get config() {
     const totalScore = this.args.totalScore || "";
+    const skipCanvasResize = this.args.skipCanvasResize || false;
     const radius = this.getRadius();
 
     const paddingTop = 30;
@@ -66,7 +67,8 @@ export default class DoughnutChart extends Component {
         },
         plugins: {
           legend: {
-            display: false,
+            display: this.args.displayLegend || false,
+            position: "bottom",
           },
         },
       },
@@ -104,6 +106,9 @@ export default class DoughnutChart extends Component {
         {
           id: "resizeCanvas",
           afterDraw: function (chart) {
+            if (skipCanvasResize) {
+              return;
+            }
             const size = `${canvasSize}px`;
             chart.canvas.style.width = size;
             chart.canvas.style.height = size;

assets/stylesheets/modules/sentiment/common/dashboard.scss

@@ -102,13 +102,15 @@
       text-align: center;
       margin-top: 0.3rem;
       padding-top: 2rem;
-      border-top: 1px solid var(--primary-low);
     }
   }
 
   &__selected-chart-actions {
     display: flex;
     align-items: center;
+    padding-bottom: 0.35rem;
+    border-bottom: 1px solid var(--primary-low);
+
     .share {
       margin-left: auto;