handle comment time display correctly immediately after posting

ui/component/comment/view.jsx

@@ -177,9 +177,9 @@ function Comment(props: Props) {
                 className="button--uri-indicator"
                 navigate={`${uri}?lc=${commentId}`}
                 label={
-                  <time className="comment__time" dateTime={timePosted}>
-                    {DateTime.getTimeAgoStr(timePosted)}
-                  </time>
+                  <span className="comment__time">
+                    <DateTime date={timePosted} timeAgo />
+                  </span>
                 }
               />
             </div>

ui/component/dateTime/view.jsx

@@ -35,7 +35,12 @@ class DateTime extends React.PureComponent<Props> {
     // Strip off the 's' for the singular suffix, construct the string ID,
     // then load the localized version.
     const suffix = duration === 1 ? suffixList[i].substr(0, suffixList[i].length - 1) : suffixList[i];
-    const strId = '%duration% ' + suffix + ' ago';
+    let strId = '%duration% ' + suffix + ' ago';
+
+    if (!suffix) {
+      strId = 'Just now';
+    }
+
     return __(strId, { duration });
   }
 

ui/scss/component/_comments.scss

@@ -151,7 +151,7 @@ $thumbnailWidthSmall: 1.5rem;
 }
 
 .comment__time {
-  opacity: 0.3;
+  opacity: 0.5;
   white-space: nowrap;
   height: 100%;
 }