闭社主体 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.

41 lines
1.0 KiB

  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. class RelativeTimestamp extends React.Component {
  13. static propTypes = {
  14. intl: PropTypes.object.isRequired,
  15. timestamp: PropTypes.string.isRequired,
  16. };
  17. shouldComponentUpdate (nextProps) {
  18. // As of right now the locale doesn't change without a new page load,
  19. // but we might as well check in case that ever changes.
  20. return this.props.timestamp !== nextProps.timestamp ||
  21. this.props.intl.locale !== nextProps.intl.locale;
  22. }
  23. render () {
  24. const { timestamp, intl } = this.props;
  25. const date = new Date(timestamp);
  26. return (
  27. <time dateTime={timestamp} title={intl.formatDate(date, dateFormatOptions)}>
  28. <FormattedRelative value={date} />
  29. </time>
  30. );
  31. }
  32. }
  33. export default injectIntl(RelativeTimestamp);