ui/src/components/moment-time.tsx

   1 import { Component } from 'inferno';
   2 import moment from 'moment';
   3 import { getMomentLanguage, setupTippy } from '../utils';
   4 import { i18n } from '../i18next';
   5
   6 interface MomentTimeProps {
   7   data: {
   8     published?: string;
   9     when_?: string;
  10     updated?: string;
  11   };
  12 }
  13
  14 export class MomentTime extends Component<MomentTimeProps, any> {
  15   constructor(props: any, context: any) {
  16     super(props, context);
  17
  18     let lang = getMomentLanguage();
  19
  20     moment.locale(lang);
  21   }
  22
  23   componentDidMount() {
  24     setupTippy();
  25   }
  26
  27   render() {
  28     if (this.props.data.updated) {
  29       return (
  30         <span
  31           data-tippy-content={this.format(this.props.data.updated)}
  32           className="font-italics pointer unselectable"
  33         >
  34           {i18n.t('modified')} {moment.utc(this.props.data.updated).fromNow()}
  35         </span>
  36       );
  37     } else {
  38       let str = this.props.data.published || this.props.data.when_;
  39       return (
  40         <span
  41           className="pointer unselectable"
  42           data-tippy-content={this.format(str)}
  43         >
  44           {moment.utc(str).fromNow()}
  45         </span>
  46       );
  47     }
  48   }
  49
  50   format(input: string): string {
  51     return moment
  52       .utc(input)
  53       .local()
  54       .format('LLLL');
  55   }
  56 }