78 lines
2.3 KiB
JavaScript
78 lines
2.3 KiB
JavaScript
/**
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*/
|
|
import React from 'react';
|
|
import Translate from '@docusaurus/Translate';
|
|
import {ThemeClassNames} from '@docusaurus/theme-common';
|
|
import {useDateTimeFormat} from '@docusaurus/theme-common/internal';
|
|
function LastUpdatedAtDate({lastUpdatedAt}) {
|
|
const atDate = new Date(lastUpdatedAt);
|
|
const dateTimeFormat = useDateTimeFormat({
|
|
day: 'numeric',
|
|
month: 'short',
|
|
year: 'numeric',
|
|
timeZone: 'UTC',
|
|
});
|
|
const formattedLastUpdatedAt = dateTimeFormat.format(atDate);
|
|
return (
|
|
<Translate
|
|
id="theme.lastUpdated.atDate"
|
|
description="The words used to describe on which date a page has been last updated"
|
|
values={{
|
|
date: (
|
|
<b>
|
|
<time dateTime={atDate.toISOString()} itemProp="dateModified">
|
|
{formattedLastUpdatedAt}
|
|
</time>
|
|
</b>
|
|
),
|
|
}}>
|
|
{' on {date}'}
|
|
</Translate>
|
|
);
|
|
}
|
|
function LastUpdatedByUser({lastUpdatedBy}) {
|
|
return (
|
|
<Translate
|
|
id="theme.lastUpdated.byUser"
|
|
description="The words used to describe by who the page has been last updated"
|
|
values={{
|
|
user: <b>{lastUpdatedBy}</b>,
|
|
}}>
|
|
{' by {user}'}
|
|
</Translate>
|
|
);
|
|
}
|
|
export default function LastUpdated({lastUpdatedAt, lastUpdatedBy}) {
|
|
return (
|
|
<span className={ThemeClassNames.common.lastUpdated}>
|
|
<Translate
|
|
id="theme.lastUpdated.lastUpdatedAtBy"
|
|
description="The sentence used to display when a page has been last updated, and by who"
|
|
values={{
|
|
atDate: lastUpdatedAt ? (
|
|
<LastUpdatedAtDate lastUpdatedAt={lastUpdatedAt} />
|
|
) : (
|
|
''
|
|
),
|
|
byUser: lastUpdatedBy ? (
|
|
<LastUpdatedByUser lastUpdatedBy={lastUpdatedBy} />
|
|
) : (
|
|
''
|
|
),
|
|
}}>
|
|
{'Last updated{atDate}{byUser}'}
|
|
</Translate>
|
|
{process.env.NODE_ENV === 'development' && (
|
|
<div>
|
|
{/* eslint-disable-next-line @docusaurus/no-untranslated-text */}
|
|
<small> (Simulated during dev for better perf)</small>
|
|
</div>
|
|
)}
|
|
</span>
|
|
);
|
|
}
|