Show time since last render.

package.json

@@ -4,6 +4,7 @@
   "private": true,
   "dependencies": {
     "babel-loader": "8.0.6",
+    "moment": "^2.24.0",
     "react": "^16.10.2",
     "react-bulma-components": "3.1.3",
     "react-dom": "^16.10.2",

src/App.css

@@ -17,7 +17,15 @@
   color: #fff;
 }
 
+.subtitle {
+  color: #aaa;
+}
+
 .value {
   text-align: center;
   border: 1px solid #888;
 }
+
+.menu {
+  margin: .5em;
+}

src/App.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import moment from 'moment';
 import './App.css';
 import {
   Columns,
@@ -186,7 +187,7 @@ class App extends React.Component {
 
       images = imageMetadata.map((metadata) => {
         let {name, ratio, image} = metadata;
-        let width = 256;
+        let width = 384;
         let height = (ratio * width).toFixed();
         let url = ROOT + image + '?t=' + timestamp;
         const mouseMove = (e) => {
@@ -217,9 +218,13 @@ class App extends React.Component {
             <p className="name">{name}</p>
         </div>)
       });
+      let time = moment.unix(timestamp);
       mainContent = <div>
         <Heading>
-          Run @ {new Date(timestamp * 1000).toLocaleString()}
+          Run @ {time.format("llll")}
+        </Heading>
+        <Heading subtitle>
+          {time.fromNow()}
         </Heading>
         {images}
       </div>;

yarn.lock

@@ -5522,6 +5522,10 @@ mkdirp@0.5.1, mkdirp@0.5.x, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.1:
   dependencies:
     minimist "0.0.8"
 
+moment@^2.24.0:
+  version "2.24.0"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
+
 move-concurrently@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"