From 62053e6b3662de0ceb2e3a178644e499496a4ad4 Mon Sep 17 00:00:00 2001
From: btzr-io <btzr.io@gmail.com>
Date: Sun, 8 Oct 2017 14:43:56 -0600
Subject: [PATCH] better format for dateTime component

---
 ui/js/component/dateTime/view.jsx | 12 +++++++++++-
 ui/js/page/file/view.jsx          |  6 +++---
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/ui/js/component/dateTime/view.jsx b/ui/js/component/dateTime/view.jsx
index 747286daa..b5dff1239 100644
--- a/ui/js/component/dateTime/view.jsx
+++ b/ui/js/component/dateTime/view.jsx
@@ -5,6 +5,14 @@ class DateTime extends React.PureComponent {
   static SHOW_TIME = "time";
   static SHOW_BOTH = "both";
 
+  static defaultProps = {
+    formatOptions: {
+      month: "long",
+      day: "numeric",
+      year: "numeric",
+    },
+  };
+
   componentWillMount() {
     this.refreshDate(this.props);
   }
@@ -23,16 +31,18 @@ class DateTime extends React.PureComponent {
   render() {
     const { date, formatOptions } = this.props;
     const show = this.props.show || DateTime.SHOW_BOTH;
+    const locale = app.i18n.getLocale();
 
     return (
       <span>
         {date &&
           (show == DateTime.SHOW_BOTH || show === DateTime.SHOW_DATE) &&
-          date.toLocaleDateString()}
+          date.toLocaleDateString([locale, "en-US"], formatOptions)}
         {show == DateTime.SHOW_BOTH && " "}
         {date &&
           (show == DateTime.SHOW_BOTH || show === DateTime.SHOW_TIME) &&
           date.toLocaleTimeString()}
+        {!date && "..."}
       </span>
     );
   }
diff --git a/ui/js/page/file/view.jsx b/ui/js/page/file/view.jsx
index 458a7165d..584271ae0 100644
--- a/ui/js/page/file/view.jsx
+++ b/ui/js/page/file/view.jsx
@@ -87,9 +87,9 @@ class FilePage extends React.PureComponent {
                   <h1>{title}</h1>
                   <div className="card__subtitle">
                     <UriIndicator uri={uri} link={true} />
-                    <span class="meta" style={{ margin: "10px" }}>&#9899;</span>
-                    <span class="meta">
-                      Published on <DateTime block={height} />
+                    <span style={{ margin: "10px" }}>&#9899;</span>
+                    <span>
+                      Published on <DateTime block={height} show="date" />
                     </span>
                   </div>
                 </div>