better dates on filelist

3 files changed, 25 insertions, 2 deletions

diff --git a/app/client/common/fileList.component.js b/app/client/common/fileList.component.js
index f932274..8f79148 100644
--- a/app/client/common/fileList.component.js
+++ b/app/client/common/fileList.component.js
@@ -122,7 +122,14 @@ export const FileRow = props => {
         <div className={"date " + util.carbon_date(date)}>{moment(date).format("YYYY-MM-DD")}</div>
       }
       {fields.has('datetime') &&
-        <div className={"datetime " + util.carbon_date(date)}>{moment(date).format("YYYY-MM-DD h:mm a")}</div>
+        <div className={"datetime"}>
+          <span class={'date ' + util.carbon_date(date)}>
+            {moment(date).format("YYYY-MM-DD")}
+          </span>
+          <span class={'time ' + util.carbon_time(date)}>
+            {moment(date).format("H:mm")}
+          </span>
+        </div>
       }
       {fields.has('size') &&
         <div className={"size " + size[0]}>{size[1]}</div>
diff --git a/app/client/dashboard/dashboard.component.js b/app/client/dashboard/dashboard.component.js
index cbfdd33..8f47049 100644
--- a/app/client/dashboard/dashboard.component.js
+++ b/app/client/dashboard/dashboard.component.js
@@ -48,7 +48,7 @@ class Dashboard extends Component {
           linkFiles
           files={renders[key]}
           orderBy='date desc'
-          fields={'name date epoch size'}
+          fields={'name datetime epoch size'}
           onClick={key === 'samplernn' ? (file, e) => {
             e.preventDefault()
             e.stopPropagation()
diff --git a/app/client/util/format.js b/app/client/util/format.js
index c8e8f3f..ee1f47f 100644
--- a/app/client/util/format.js
+++ b/app/client/util/format.js
@@ -38,6 +38,22 @@ export function carbon_date (date, no_bold) {
     { color = "quiet" }
   return color
 }
+export function carbon_time (date, no_bold) {
+  var span = (+new Date() - new Date(date)) / 1000, color
+  if (! no_bold && span < 3600) // modified this hour
+    { color = "new" }
+  else if (span < 3 * 3600) // modifed last 3 hours
+    { color = "recent" }
+  else if (span < 12 * 3600) // modifed last 12 hours
+    { color = "med" }
+  else if (span < 24 * 3600) // modifed last day
+    { color = "old" }
+  else if (span < 48 * 3600) // modifed last two days
+    { color = "older" }
+  else
+    { color = "quiet" }
+  return color
+}
 export function hush_views (n, bias, no_bold) {
   var txt = commatize(n, 1000)
   bias = bias || 1