TimeAgo + SSR somewhat problematic

[adamschwartz]

Our use of <TimeAgo/> is slightly wonky with SSR:

cloudflare-docs-engine/src/components/docs-tutorials.js

Lines 89 to 93 in 6faa9d1

	<TimeAgo date={tutorial.updated} formatter={(value, unit) => (
	<React.Fragment>
	{value} {unit}{value > 1 ? "s" : ""}<span className="DocsTutorials--ago-text"> ago</span>
	</React.Fragment>
	)} minPeriod={60}/>

It can flash "N hours ago" and then switch to "3 days ago" on page load for example. This is because the SSR time will be locked in at the last time it was built, but upon hydration it will be from now.

We could potentially use HTMLRewriter to set on the fly.

[kristianfreeman]

@adamschwartz and i synced up on this in chat, we're leaning towards:

1. hiding this element via a CSS data attribute
2. refreshing the text content via an initial render
3. removing the data attribute once the initial render has completed

in the situation where the user isn't running javascript, we can use noscript to just show the SSR time:

<style>[data-hide-ssr] { display: none }</style>
<noscript><style>[data-hide-ssr] { display: unset }</style></noscript>

[adamschwartz]

Also re noscript, maybe the SSR time should then just be more like 10/13/2020 (as opposed to 2 months ago)?