Update event post API

- Use more appropriate component class name
- Allow username to be moved in translation

js/forum/src/components/DiscussionRenamedPost.js

@@ -13,15 +13,18 @@ export default class DiscussionRenamedPost extends EventPost {
     return 'pencil';
   }
 
-  description() {
+  descriptionKey() {
+    return 'core.discussion_renamed_post';
+  }
+
+  descriptionData() {
     const post = this.props.post;
     const oldTitle = post.content()[0];
     const newTitle = post.content()[1];
 
-    return app.trans('core.discussion_renamed', {
-      user: this.props.post.user(),
+    return {
       old: <strong className="DiscussionRenamedPost-old">{oldTitle}</strong>,
       new: <strong className="DiscussionRenamedPost-new">{newTitle}</strong>
-    });
+    };
   }
 }

js/forum/src/components/EventPost.js

@@ -1,4 +1,5 @@
 import Post from 'flarum/components/Post';
+import { ucfirst } from 'flarum/utils/string';
 import usernameHelper from 'flarum/helpers/username';
 import icon from 'flarum/helpers/icon';
 
@@ -16,19 +17,24 @@ import icon from 'flarum/helpers/icon';
 export default class EventPost extends Post {
   attrs() {
     return {
-      className: 'EventPost EventPost--' + this.props.post.contentType()
+      className: 'EventPost ' + ucfirst(this.props.post.contentType()) + 'Post'
     };
   }
 
   content() {
     const user = this.props.post.user();
     const username = usernameHelper(user);
+    const data = Object.assign(this.descriptionData(), {
+      user,
+      username: user
+        ? <a className="EventPost-user" href={app.route.user(user)} config={m.route}>{username}</a>
+        : username
+    });
 
     return [
       icon(this.icon(), {className: 'EventPost-icon'}),
       <div class="EventPost-info">
-        {user ? <a className="EventPost-user" href={app.route.user(user)} config={m.route}>{username}</a> : username}{' '}
-        {this.description()}
+        {app.trans(this.descriptionKey(), data)}
       </div>
     ];
   }
@@ -39,13 +45,24 @@ export default class EventPost extends Post {
    * @return {String}
    */
   icon() {
+    return '';
   }
 
   /**
-   * Get the description of the event.
+   * Get the translation key for the description of the event.
    *
-   * @return {VirtualElement}
+   * @return {String}
    */
-  description() {
+  descriptionKey() {
+    return '';
+  }
+
+  /**
+   * Get the translation data for the description of the event.
+   *
+   * @return {Object}
+   */
+  descriptionData() {
+    return {};
   }
 }

js/lib/utils/string.js

@@ -36,3 +36,13 @@ export function slug(string) {
 export function getPlainContent(string) {
   return $('<div/>').html(string.replace(/(<\/p>|<br>)/g, '$1 ')).text();
 }
+
+/**
+ * Make a string's first character uppercase.
+ *
+ * @param {String} string
+ * @return {String}
+ */
+export function ucfirst(string) {
+  return string.substr(0, 1).toUpperCase() + string.substr(1);
+}

locale/en/translations.yml

@@ -25,7 +25,7 @@ core:
   delete_forever: Delete Forever
   deleted: "[deleted]"
   disclose_online: Allow others to see when I am online
-  discussion_renamed: "changed the title from {old} to {new}"
+  discussion_renamed_post: "{username} changed the title from {old} to {new}."
   discussion_renamed_notification: "{username} changed the title"
   discussion_replied: "{username} replied {ago}"
   discussion_started: "{username} started {ago}"