From 97089b795b8fb8c1545e864d272cb601fcb9c461 Mon Sep 17 00:00:00 2001
From: Victor Lin <13424970+victorlin@users.noreply.github.com>
Date: Mon, 11 Dec 2023 16:36:33 -0800
Subject: [PATCH 1/3] Hide "Data updated" for invalid dates
A bad value could show as an inaccuracy such as "Data updated today",
which shouldn't be allowed. I discovered this upon looking at the mers
example dataset provided by get-data.sh.
---
bundlesize.config.json | 2 +-
package-lock.json | 14 ++++++++++++++
package.json | 1 +
src/components/framework/fine-print.js | 3 ++-
src/components/info/byline.js | 3 ++-
webpack.config.js | 1 +
6 files changed, 21 insertions(+), 3 deletions(-)
diff --git a/bundlesize.config.json b/bundlesize.config.json
index dae3c6ef9..f356d72b4 100644
--- a/bundlesize.config.json
+++ b/bundlesize.config.json
@@ -10,7 +10,7 @@
},
{
"path": "./dist/auspice.?(chunk.)core-vendors.bundle.*.js",
- "maxSize": "220 kB"
+ "maxSize": "250 kB"
},
{
"path": "./dist/auspice.?(chunk.)other-vendors.bundle.*.js",
diff --git a/package-lock.json b/package-lock.json
index 57293b22d..7e4749472 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -59,6 +59,7 @@
"linspace": "^1.0.0",
"lodash": "^4.17.21",
"lodash-webpack-plugin": "^0.11.6",
+ "luxon": "^3.4.4",
"marked": "^0.7.0",
"mousetrap": "^1.6.2",
"null-loader": "^4.0.0",
@@ -10787,6 +10788,14 @@
"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
"integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g=="
},
+ "node_modules/luxon": {
+ "version": "3.4.4",
+ "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.4.4.tgz",
+ "integrity": "sha512-zobTr7akeGHnv7eBOXcRgMeCP6+uyYsczwmeRCauvpvaAltgNyTbLH/+VaEAPUeWBT+1GuNmz4wC/6jtQzbbVA==",
+ "engines": {
+ "node": ">=12"
+ }
+ },
"node_modules/make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
@@ -22579,6 +22588,11 @@
}
}
},
+ "luxon": {
+ "version": "3.4.4",
+ "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.4.4.tgz",
+ "integrity": "sha512-zobTr7akeGHnv7eBOXcRgMeCP6+uyYsczwmeRCauvpvaAltgNyTbLH/+VaEAPUeWBT+1GuNmz4wC/6jtQzbbVA=="
+ },
"make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
diff --git a/package.json b/package.json
index c826d9d01..f67c6b79c 100644
--- a/package.json
+++ b/package.json
@@ -89,6 +89,7 @@
"linspace": "^1.0.0",
"lodash": "^4.17.21",
"lodash-webpack-plugin": "^0.11.6",
+ "luxon": "^3.4.4",
"marked": "^0.7.0",
"mousetrap": "^1.6.2",
"null-loader": "^4.0.0",
diff --git a/src/components/framework/fine-print.js b/src/components/framework/fine-print.js
index 0ae7c0e9d..ab2f2e563 100644
--- a/src/components/framework/fine-print.js
+++ b/src/components/framework/fine-print.js
@@ -3,6 +3,7 @@ import { connect } from "react-redux";
import styled from 'styled-components';
import { withTranslation } from "react-i18next";
import { FaDownload } from "react-icons/fa";
+import { DateTime } from "luxon";
import { dataFont, medGrey, materialButton } from "../../globalStyles";
import { TRIGGER_DOWNLOAD_MODAL } from "../../actions/types";
import Flex from "./flex";
@@ -72,7 +73,7 @@ class FinePrint extends React.Component {
getUpdated() {
const { t } = this.props;
- if (this.props.metadata.updated) {
+ if (DateTime.fromISO(this.props.metadata.updated).isValid) {
return ({t("Data updated")} {this.props.metadata.updated});
}
return null;
diff --git a/src/components/info/byline.js b/src/components/info/byline.js
index 83f136611..0dc9d17a6 100644
--- a/src/components/info/byline.js
+++ b/src/components/info/byline.js
@@ -2,6 +2,7 @@ import React from "react";
import { connect } from "react-redux";
import { withTranslation } from 'react-i18next';
import styled from 'styled-components';
+import { DateTime } from "luxon";
import { headerFont } from "../../globalStyles";
/**
@@ -107,7 +108,7 @@ function renderMaintainers(t, metadata) {
* Renders a containing "Data updated X", where X derives from `metadata.updated`
*/
function renderDataUpdated(t, metadata) {
- if (metadata.updated) {
+ if (DateTime.fromISO(metadata.updated).isValid) {
return (
{`${t("Data updated")} ${metadata.updated}. `}
diff --git a/webpack.config.js b/webpack.config.js
index cf332a42d..e9020ee51 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -133,6 +133,7 @@ const generateConfig = ({extensionPath, devMode=false, customOutputPath, analyze
"style-loader",
"@hot-loader/react-dom",
"react(-(redux|select|helmet|i18next))?",
+ "luxon",
"leaflet",
"redux",
"leaflet(-gesture-handling)?",
From ba52ef5f14e08b1b2c5c5d83b672617b9666d84e Mon Sep 17 00:00:00 2001
From: Victor Lin <13424970+victorlin@users.noreply.github.com>
Date: Mon, 11 Dec 2023 16:40:19 -0800
Subject: [PATCH 2/3] Render "Data updated" as a relative date
To us humans, "Data updated 3 years ago" is more interpretable than
"Data updated 2020-12-11". Time flies!
---
src/components/info/byline.js | 12 +++++++-----
1 file changed, 7 insertions(+), 5 deletions(-)
diff --git a/src/components/info/byline.js b/src/components/info/byline.js
index 0dc9d17a6..1da00d57d 100644
--- a/src/components/info/byline.js
+++ b/src/components/info/byline.js
@@ -12,7 +12,8 @@ import { headerFont } from "../../globalStyles";
*/
@connect((state) => {
return {
- metadata: state.metadata
+ metadata: state.metadata,
+ language: state.general.language
};
})
class Byline extends React.Component {
@@ -23,7 +24,7 @@ class Byline extends React.Component {
{renderAvatar(t, this.props.metadata)}
{renderBuildInfo(t, this.props.metadata)}
{renderMaintainers(t, this.props.metadata)}
- {renderDataUpdated(t, this.props.metadata)}
+ {renderDataUpdated(t, this.props.metadata, this.props.language)}
{renderDataProvenance(t, this.props.metadata)}
);
@@ -107,11 +108,12 @@ function renderMaintainers(t, metadata) {
* Returns a React component detailing the date the data was last updated.
* Renders a containing "Data updated X", where X derives from `metadata.updated`
*/
-function renderDataUpdated(t, metadata) {
- if (DateTime.fromISO(metadata.updated).isValid) {
+function renderDataUpdated(t, metadata, language) {
+ const date = DateTime.fromISO(metadata.updated);
+ if (date.isValid) {
return (
- {`${t("Data updated")} ${metadata.updated}. `}
+ {`${t("Data updated")} ${date.toRelativeCalendar({locale: language})}. `}
);
}
From c826b5a490ffa96ece8fc4b20a37c095ee3370f4 Mon Sep 17 00:00:00 2001
From: Victor Lin <13424970+victorlin@users.noreply.github.com>
Date: Tue, 12 Dec 2023 11:44:25 -0800
Subject: [PATCH 3/3] Update changelog
---
CHANGELOG.md | 1 +
1 file changed, 1 insertion(+)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index fe29b7f63..bc375106e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,7 @@
# Changelog
* Added a link to this changelog from the Auspice view. ([#1727](https://github.com/nextstrain/auspice/pull/1727))
+* Updated the "Data updated" date under the dataset title to be a relative date. ([#1731](https://github.com/nextstrain/auspice/pull/1731))
## version 2.51.0 - 2023/11/16