A few cake day fixes. #916

5 files changed, 32 insertions, 36 deletions

diff --git a/ui/src/components/cake-day.tsx b/ui/src/components/cake-day.tsx
index be807184..f28be33c 100644
--- a/ui/src/components/cake-day.tsx
+++ b/ui/src/components/cake-day.tsx
@@ -2,20 +2,15 @@ import { Component } from 'inferno';
 import { i18n } from '../i18next';
 
 interface CakeDayProps {
-  creator_name: string;
-  is_post_creator?: boolean;
+  creatorName: string;
 }
 
 export class CakeDay extends Component<CakeDayProps, any> {
   render() {
-    const { creator_name, is_post_creator } = this.props;
-
     return (
       <div
-        className={`mr-lg-2 d-inline-block unselectable pointer${
-          is_post_creator ? ' mx-2' : ''
-        }`}
-        data-tippy-content={this.cakeDayTippy(creator_name)}
+        className={`mx-2 d-inline-block unselectable pointer`}
+        data-tippy-content={this.cakeDayTippy()}
       >
         <svg class="icon icon-inline">
           <use xlinkHref="#icon-cake"></use>
@@ -24,7 +19,7 @@ export class CakeDay extends Component<CakeDayProps, any> {
     );
   }
 
-  cakeDayTippy(creator_name: string): string {
-    return i18n.t('cake_day_info', { creator_name });
+  cakeDayTippy(): string {
+    return i18n.t('cake_day_info', { creator_name: this.props.creatorName });
   }
 }
diff --git a/ui/src/components/comment-node.tsx b/ui/src/components/comment-node.tsx
index 0e2d1d94..8e976e7c 100644
--- a/ui/src/components/comment-node.tsx
+++ b/ui/src/components/comment-node.tsx
@@ -26,7 +26,6 @@ import {
   isMod,
   setupTippy,
   colorList,
-  isCakeDay,
 } from '../utils';
 import moment from 'moment';
 import { MomentTime } from './moment-time';
@@ -34,7 +33,6 @@ import { CommentForm } from './comment-form';
 import { CommentNodes } from './comment-nodes';
 import { UserListing } from './user-listing';
 import { i18n } from '../i18next';
-import { CakeDay } from './cake-day';
 
 interface CommentNodeState {
   showReply: boolean;
@@ -160,14 +158,11 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
                     id: node.comment.creator_id,
                     local: node.comment.creator_local,
                     actor_id: node.comment.creator_actor_id,
+                    published: node.comment.creator_published,
                   }}
                 />
               </span>
 
-              {isCakeDay(node.comment.creator_published) && (
-                <CakeDay creator_name={node.comment.creator_name} />
-              )}
-
               {this.isMod && (
                 <div className="badge badge-light d-none d-sm-inline mr-2">
                   {i18n.t('mod')}
diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index 92a2f9cb..fa2a078e 100644
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -33,10 +33,8 @@ import {
   setupTippy,
   hostname,
   previewLines,
-  isCakeDay,
 } from '../utils';
 import { i18n } from '../i18next';
-import { CakeDay } from './cake-day';
 
 interface PostListingState {
   showEdit: boolean;
@@ -436,13 +434,10 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
                       id: post.creator_id,
                       local: post.creator_local,
                       actor_id: post.creator_actor_id,
+                      published: post.creator_published,
                     }}
                   />
 
-                  {isCakeDay(post.creator_published) && (
-                    <CakeDay creator_name={post.creator_name} is_post_creator />
-                  )}
-
                   {this.isMod && (
                     <span className="mx-1 badge badge-light">
                       {i18n.t('mod')}
diff --git a/ui/src/components/user-listing.tsx b/ui/src/components/user-listing.tsx
index 0e150b94..58475d3e 100644
--- a/ui/src/components/user-listing.tsx
+++ b/ui/src/components/user-listing.tsx
@@ -1,7 +1,13 @@
 import { Component } from 'inferno';
 import { Link } from 'inferno-router';
 import { UserView } from '../interfaces';
-import { pictrsAvatarThumbnail, showAvatars, hostname } from '../utils';
+import {
+  pictrsAvatarThumbnail,
+  showAvatars,
+  hostname,
+  isCakeDay,
+} from '../utils';
+import { CakeDay } from './cake-day';
 
 interface UserOther {
   name: string;
@@ -9,6 +15,7 @@ interface UserOther {
   avatar?: string;
   local?: boolean;
   actor_id?: string;
+  published?: string;
 }
 
 interface UserListingProps {
@@ -35,17 +42,21 @@ export class UserListing extends Component<UserListingProps, any> {
     }
 
     return (
-      <Link className="text-body font-weight-bold" to={link}>
-        {user.avatar && showAvatars() && (
-          <img
-            height="32"
-            width="32"
-            src={pictrsAvatarThumbnail(user.avatar)}
-            class="rounded-circle mr-2"
-          />
-        )}
-        <span>{name_}</span>
-      </Link>
+      <>
+        <Link className="text-body font-weight-bold" to={link}>
+          {user.avatar && showAvatars() && (
+            <img
+              height="32"
+              width="32"
+              src={pictrsAvatarThumbnail(user.avatar)}
+              class="rounded-circle mr-2"
+            />
+          )}
+          <span>{name_}</span>
+        </Link>
+
+        {isCakeDay(user.published) && <CakeDay creatorName={name_} />}
+      </>
     );
   }
 }
diff --git a/ui/src/utils.ts b/ui/src/utils.ts
index e38834aa..22536043 100644
--- a/ui/src/utils.ts
+++ b/ui/src/utils.ts
@@ -502,10 +502,10 @@ export function showAvatars(): boolean {
   );
 }
 
-export function isCakeDay(creator_published: string): boolean {
+export function isCakeDay(published: string): boolean {
   // moment(undefined) or moment.utc(undefined) returns the current date/time
   // moment(null) or moment.utc(null) returns null
-  const userCreationDate = moment.utc(creator_published || null).local();
+  const userCreationDate = moment.utc(published || null).local();
   const currentDate = moment(new Date());
 
   return (