Merge pull request #466 from IvanIFChen/tma904-moment-comment-revamp

[TMA-904] Moment Comment Revamp

3 files changed, 44 insertions, 17 deletions

diff --git a/src/utils/comments.tsx b/src/utils/comments.tsx
index 5c17cefe..910b44e7 100644
--- a/src/utils/comments.tsx
+++ b/src/utils/comments.tsx
@@ -79,8 +79,8 @@ export const renderTextWithMentions: React.FC<RenderProps> = ({
   );
 };
 
-export const mentionPartTypes: (style: 'blue' | 'white') => PartType[] = (
-  style,
+export const mentionPartTypes: (theme: 'blue' | 'white') => PartType[] = (
+  theme,
 ) => {
   return [
     {
@@ -88,17 +88,26 @@ export const mentionPartTypes: (style: 'blue' | 'white') => PartType[] = (
       renderSuggestions: (props) => <TaggTypeahead {...props} />,
       allowedSpacesCount: 0,
       isInsertSpaceAfterMention: true,
-      textStyle:
-        style === 'blue'
-          ? {
-              color: TAGG_LIGHT_BLUE,
-              top: normalize(3),
-            }
-          : {
-              color: 'white',
-              fontWeight: '800',
-              top: normalize(7.5),
-            },
+      textStyle: _textStyle(theme),
     },
   ];
 };
+
+const _textStyle: (theme: 'blue' | 'white') => StyleProp<TextStyle> = (
+  theme,
+) => {
+  switch (theme) {
+    case 'blue':
+      return {
+        color: TAGG_LIGHT_BLUE,
+        top: normalize(3),
+      };
+    case 'white':
+    default:
+      return {
+        color: 'white',
+        fontWeight: '800',
+        top: normalize(3),
+      };
+  }
+};
diff --git a/src/utils/moments.ts b/src/utils/moments.ts
index 90d69519..9e8cc332 100644
--- a/src/utils/moments.ts
+++ b/src/utils/moments.ts
@@ -19,21 +19,21 @@ export const getTimePosted = (date_time: string) => {
   // 1 minute to less than 1 hour
   else if (difference >= 60 && difference < 60 * 60) {
     difference = now.diff(datePosted, 'minutes');
-    time = difference + (difference === 1 ? ' minute' : ' minutes');
+    time = difference + 'm ago';
   }
   // 1 hour to less than 1 day
   else if (difference >= 60 * 60 && difference < 24 * 60 * 60) {
     difference = now.diff(datePosted, 'hours');
-    time = difference + (difference === 1 ? ' hour' : ' hours');
+    time = difference + 'h ago';
   }
   // Any number of days
   else if (difference >= 24 * 60 * 60 && difference < 24 * 60 * 60 * 3) {
     difference = now.diff(datePosted, 'days');
-    time = difference + (difference === 1 ? ' day' : ' days');
+    time = difference + 'd ago';
   }
   // More than 3 days
   else if (difference >= 24 * 60 * 60 * 3) {
-    time = datePosted.format('MMMM D, YYYY');
+    time = datePosted.format('M-D-YYYY');
   }
   return time;
 };
diff --git a/src/utils/users.ts b/src/utils/users.ts
index 64ad10e9..c1c3b8bc 100644
--- a/src/utils/users.ts
+++ b/src/utils/users.ts
@@ -306,3 +306,21 @@ export const patchProfile = async (
       return false;
     });
 };
+
+/**
+ * Returns the logged-in user's info in ProfilePreviewType from redux store.
+ * @param state the current state of the redux store
+ * @returns logged-in user in ProfilePreviewType
+ */
+export const getLoggedInUserAsProfilePreview: (
+  state: RootState,
+) => ProfilePreviewType = (state) => {
+  const nameSplit = state.user.profile.name.split(' ');
+  return {
+    id: state.user.user.userId,
+    username: state.user.user.username,
+    first_name: nameSplit[0],
+    last_name: nameSplit[1],
+    thumbnail_url: state.user.avatar ?? '', // in full res
+  };
+};