use InterpolatedTranslation

2026-09-17 06:52:14 -04:00 · 2025-06-24 14:20:36 +08:00
parent 1e7ab52678
commit af72d13faf
3 changed files with 96 additions and 49 deletions
@@ -5,12 +5,13 @@ import { action } from "@ember/object";
 import { service } from "@ember/service";
 import { htmlSafe } from "@ember/template";
 import AsyncContent from "discourse/components/async-content";
+import InterpolatedTranslation from "discourse/components/interpolated-translation";
 import PostCookedHtml from "discourse/components/post/cooked-html";
+import UserLink from "discourse/components/user-link";
 import concatClass from "discourse/helpers/concat-class";
 import icon from "discourse/helpers/d-icon";
 import { ajax } from "discourse/lib/ajax";
 import escape from "discourse/lib/escape";
-import { iconHTML } from "discourse/lib/icon-library";
 import { formatUsername } from "discourse/lib/utilities";
 import { i18n } from "discourse-i18n";

@@ -40,10 +41,6 @@ export default class SolvedAcceptedAnswer extends Component {
    const username = this.acceptedAnswer.accepter_username;
    const name = this.acceptedAnswer.accepter_name;

-    if (!this.siteSettings.show_who_marked_solved) {
-      return;
-    }
-
    const formattedUsername =
      this.siteSettings.display_name_on_posts && name
        ? escape(name)
@@ -57,30 +54,45 @@ export default class SolvedAcceptedAnswer extends Component {
    );
  }

-  get htmlSolvedBy() {
+  get showMarkedBy() {
+    return this.siteSettings.show_who_marked_solved;
+  }
+
+  get showSolvedBy() {
+    return !(!this.acceptedAnswer.username || !this.acceptedAnswer.post_number);
+  }
+
+  get postNumber() {
+    return i18n("solved.accepted_answer_post_number", {
+      post_number: this.acceptedAnswer.post_number,
+    });
+  }
+
+  get solverUsername() {
+    return this.acceptedAnswer.username;
+  }
+
+  get accepterUsername() {
+    return this.acceptedAnswer.accepter_username;
+  }
+
+  get solverDisplayName() {
    const username = this.acceptedAnswer.username;
    const name = this.acceptedAnswer.name;
+
+    return this.siteSettings.display_name_on_posts && name ? name : username;
+  }
+
+  get accepterDisplayName() {
+    const username = this.acceptedAnswer.accepter_username;
+    const name = this.acceptedAnswer.accepter_name;
+
+    return this.siteSettings.display_name_on_posts && name ? name : username;
+  }
+
+  get postPath() {
    const postNumber = this.acceptedAnswer.post_number;
-
-    if (!username || !postNumber) {
-      return;
-    }
-
-    const displayedUser =
-      this.siteSettings.display_name_on_posts && name
-        ? escape(name)
-        : formatUsername(username);
-
-    const data = {
-      icon: iconHTML("square-check", { class: "accepted" }),
-      username_lower: username.toLowerCase(),
-      username: displayedUser,
-      post_path: `${this.topic.url}/${postNumber}`,
-      post_number: postNumber,
-      user_path: this.store.createRecord("user", { username }).path,
-    };
-
-    return htmlSafe(i18n("solved.accepted_html", data));
+    return `${this.topic.url}/${postNumber}`;
  }

  @action
@@ -119,10 +131,38 @@ export default class SolvedAcceptedAnswer extends Component {
      >
        <div class="accepted-answer--solver-accepter">
          <div class="accepted-answer--solver">
-            {{this.htmlSolvedBy}}
+            {{#if this.showSolvedBy}}
+              {{icon "square-check" class="accepted"}}
+              <InterpolatedTranslation
+                @key="solved.accepted_answer_solver_info"
+                as |Placeholder|
+              >
+                <Placeholder @name="user">
+                  <UserLink
+                    @username={{this.solverUsername}}
+                  >{{this.solverDisplayName}}</UserLink>
+                </Placeholder>
+                <Placeholder @name="post">
+                  <a href={{this.postPath}}>{{this.postNumber}}</a>
+                </Placeholder>
+              </InterpolatedTranslation>
+              <br />
+            {{/if}}
+
          </div>
          <div class="accepted-answer--accepter">
-            {{this.htmlAccepter}}
+            {{#if this.showMarkedBy}}
+              <InterpolatedTranslation
+                @key="solved.marked_solved_by"
+                as |Placeholder|
+              >
+                <Placeholder @name="user">
+                  <UserLink
+                    @username={{this.accepterUsername}}
+                  >{{this.accepterDisplayName}}</UserLink>
+                </Placeholder>
+              </InterpolatedTranslation>
+            {{/if}}
          </div>
        </div>
        {{#if this.hasExcerpt}}
@@ -1,13 +1,12 @@
 import Component from "@glimmer/component";
 import { action } from "@ember/object";
 import { service } from "@ember/service";
-import { htmlSafe } from "@ember/template";
 import DButton from "discourse/components/d-button";
+import InterpolatedTranslation from "discourse/components/interpolated-translation";
+import UserLink from "discourse/components/user-link";
 import icon from "discourse/helpers/d-icon";
 import { ajax } from "discourse/lib/ajax";
 import { popupAjaxError } from "discourse/lib/ajax-error";
-import escape from "discourse/lib/escape";
-import { formatUsername } from "discourse/lib/utilities";
 import { i18n } from "discourse-i18n";
 import DTooltip from "float-kit/components/d-tooltip";

@@ -49,29 +48,27 @@ export default class SolvedUnacceptAnswerButton extends Component {
    });
  }

-  get solvedBy() {
-    if (!this.siteSettings.show_who_marked_solved) {
-      return;
-    }
+  get showAcceptedBy() {
+    return !(
+      !this.siteSettings.show_who_marked_solved ||
+      !this.args.post.topic.accepted_answer.accepter_username
+    );
+  }

+  get acceptedByUsername() {
+    return this.args.post.topic.accepted_answer.accepter_username;
+  }
+
+  get acceptedByDisplayName() {
    const username = this.args.post.topic.accepted_answer.accepter_username;
    const name = this.args.post.topic.accepted_answer.accepter_name;
-    const displayedName =
-      this.siteSettings.display_name_on_posts && name
-        ? escape(name)
-        : formatUsername(username);
-    if (this.args.post.topic.accepted_answer.accepter_username) {
-      return i18n("solved.marked_solved_by", {
-        username: displayedName,
-        username_lower: username,
-      });
-    }
+    return this.siteSettings.display_name_on_posts && name ? name : username;
  }

  <template>
    <span class="extra-buttons">
      {{#if @post.can_unaccept_answer}}
-        {{#if this.solvedBy}}
+        {{#if this.showAcceptedBy}}
          <DTooltip @identifier="post-action-menu__solved-accepted-tooltip">
            <:trigger>
              <DButton
@@ -84,7 +81,16 @@ export default class SolvedUnacceptAnswerButton extends Component {
              />
            </:trigger>
            <:content>
-              {{htmlSafe this.solvedBy}}
+              <InterpolatedTranslation
+                @key="solved.marked_solved_by"
+                as |Placeholder|
+              >
+                <Placeholder @name="user">
+                  <UserLink @username={{this.acceptedByUsername}}>
+                    {{this.acceptedByDisplayName}}
+                  </UserLink>
+                </Placeholder>
+              </InterpolatedTranslation>
            </:content>
          </DTooltip>
        {{else}}