diff --git a/frontend/src/components/routes/dashboard/dashboard.container.ts b/frontend/src/components/routes/dashboard/dashboard.container.ts index b830096..8206dea 100644 --- a/frontend/src/components/routes/dashboard/dashboard.container.ts +++ b/frontend/src/components/routes/dashboard/dashboard.container.ts @@ -16,6 +16,10 @@ const mapStateToProps = (state: State): DashboardStateProps => ({ isInitialDataLoading: state.dashboard.latestReport.step === "loading" || state.dashboard.accumulatedValues.step === "loading", + lastReportUpdate: + state.dashboard.latestReport.step !== "successful" + ? undefined + : state.dashboard.latestReport.result.timestamp, }); const mapDispatchToProps = ( diff --git a/frontend/src/components/routes/dashboard/dashboard.styles.ts b/frontend/src/components/routes/dashboard/dashboard.styles.ts index 3b33d51..535d2a5 100644 --- a/frontend/src/components/routes/dashboard/dashboard.styles.ts +++ b/frontend/src/components/routes/dashboard/dashboard.styles.ts @@ -6,6 +6,9 @@ const useStyles = makeStyles((theme: Theme) => ({ height: "100%", width: "100%", }, + lastReportUpdate: { + paddingBottom: theme.spacing(6), + }, widget: { paddingBottom: theme.spacing(6), "&:last-of-type": { diff --git a/frontend/src/components/routes/dashboard/dashboard.view.tsx b/frontend/src/components/routes/dashboard/dashboard.view.tsx index bdd3a6d..8ce24aa 100644 --- a/frontend/src/components/routes/dashboard/dashboard.view.tsx +++ b/frontend/src/components/routes/dashboard/dashboard.view.tsx @@ -4,9 +4,11 @@ import useStyles from "./dashboard.styles"; import AccumulatedValuesWidgetContainer from "./components/accumulated-values-widget/accumulated-values-widget.container"; import ChoroplethWidgetContainer from "./components/choropleth-widget/choropleth-widget.container"; import LoadingSpinner from "../../shared/loading-spinner/loading-spinner.view"; +import { Typography } from "@material-ui/core"; export interface DashboardStateProps { readonly isInitialDataLoading: boolean; + readonly lastReportUpdate: string | undefined; } export interface DashboardHandlerProps { @@ -18,6 +20,7 @@ type DashboardProps = DashboardStateProps & DashboardHandlerProps; const Dashboard: React.FC = ({ isInitialDataLoading, + lastReportUpdate, onLoadData, onAbortDataLoading, }: DashboardProps) => { @@ -29,12 +32,18 @@ const Dashboard: React.FC = ({ return () => onAbortDataLoading(); }, [onLoadData, onAbortDataLoading]); - if (isInitialDataLoading) { + if (isInitialDataLoading || !lastReportUpdate) { return ; } return (
+
+ + Date of the last published report:  + {new Date(lastReportUpdate).toLocaleDateString()} + +