app/components/post-history.tsx

Functions

Imports

It imports no other module of this repo. Imported by app/routes/blog.$slug.tsx.

Source

1// No `dt-` class on these dates: the rail already publishes `dt-published` and `dt-updated`,
2// and a second set in the same tree would tell a parser the post has many update times.
3type ChangelogEntry = { date: string; note: string };
4
5export function PostHistory({
6  entries,
7  publishedAt,
8  sourceHash,
9}: {
10  entries: ChangelogEntry[];
11  publishedAt: string | null;
12  sourceHash: string | null;
13}) {
14  if (entries.length === 0) return null;
15
16  // Dates are YYYY-MM-DD, so a string compare is a date compare.
17  const ordered = [...entries].sort((a, b) => a.date.localeCompare(b.date));
18
19  // Date and note stay separate nodes so the date alone takes the mono face.
20  const facts = [
21    ...(publishedAt ? [{ date: publishedAt, note: "first published" }] : []),
22    ...ordered,
23  ];
24
25  return (
26    <p className="post-history">
27      <span className="post-history-label">Post history</span>
28      {facts.map((fact, i) => (
29        <span key={`${fact.date} ${fact.note}`}>
30          {i > 0 ? " · " : null}
31          <time className="post-history-value" dateTime={fact.date}>
32            {fact.date}
33          </time>{" "}
34          {fact.note}
35        </span>
36      ))}
37      {/* Absent on a row written before the column existed. */}
38      {sourceHash ? (
39        <>
40          {" · rendered from source hash "}
41          <span className="post-history-value">{sourceHash.slice(0, 7)}</span>
42        </>
43      ) : null}
44    </p>
45  );
46}