闭社主体 forked from https://github.com/tootsuite/mastodon
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

40 lines
1015 B

  1. import React from 'react';
  2. import { injectIntl, FormattedRelative } from 'react-intl';
  3. import PropTypes from 'prop-types';
  4. const dateFormatOptions = {
  5. hour12: false,
  6. year: 'numeric',
  7. month: 'short',
  8. day: '2-digit',
  9. hour: '2-digit',
  10. minute: '2-digit',
  11. };
  12. @injectIntl
  13. export default class RelativeTimestamp extends React.Component {
  14. static propTypes = {
  15. intl: PropTypes.object.isRequired,
  16. timestamp: PropTypes.string.isRequired,
  17. };
  18. shouldComponentUpdate (nextProps) {
  19. // As of right now the locale doesn't change without a new page load,
  20. // but we might as well check in case that ever changes.
  21. return this.props.timestamp !== nextProps.timestamp ||
  22. this.props.intl.locale !== nextProps.intl.locale;
  23. }
  24. render () {
  25. const { timestamp, intl } = this.props;
  26. const date = new Date(timestamp);
  27. return (
  28. <time dateTime={timestamp} title={intl.formatDate(date, dateFormatOptions)}>
  29. <FormattedRelative value={date} />
  30. </time>
  31. );
  32. }
  33. }