import Image from 'next/image';
import { Inter } from 'next/font/google';
import { format } from 'timeago.js';
import { promises as fs } from 'fs';
import path from 'path';
import { NextSeo } from 'next-seo';
const inter = Inter({ subsets: ['latin'] });
export interface Article {
date: string;
title: string;
url: string;
}
export interface Dataset {
url: string;
name: string;
displayName: string;
articles: Article[];
files?: string[];
}
// Request a weekday along with a long date
const options = {
year: 'numeric',
month: 'long',
day: 'numeric',
} as const;
export function MobileItem({ dataset }: { dataset: Dataset }) {
return (
{dataset.name}
{dataset.articles.map((article) => (
{article.title}
{format(article.date).includes('years')
? new Date(article.date).toLocaleString('en-US', options)
: format(article.date)}
{' '}
))}
);
}
export function DesktopItem({ dataset }: { dataset: Dataset }) {
return (
<>
{dataset.articles.map((article, index) => (
{index === 0 ? dataset.name : ''}
{article.title}
{format(article.date).includes('years')
? new Date(article.date).toLocaleString('en-US', options)
: format(article.date)}
{index === 0 && (
info
)}
{/*
*/}
))}
);
}
export async function getStaticProps() {
const jsonDirectory = path.join(process.cwd(), '/datasets.json');
const datasetString = await fs.readFile(jsonDirectory, 'utf8');
const datasets = JSON.parse(datasetString);
return {
props: { datasets },
};
}
export default function Home({ datasets }: { datasets: Dataset[] }) {
return (
<>
Our Data
We’re sharing the data and code behind some of our articles and
graphics. We hope you’ll use it to check our work and to create
stories and visualizations of your own.
{datasets.map((dataset) => (
data set
related content
last updated
{datasets.map((dataset) => (
Unless otherwise noted, our data sets are available under the{' '}
Creative Commons Attribution 4.0 International license
, and the code is available under the{' '}
MIT license
. If you find this information useful, please{' '}
let us know
.
);
}