// "base" component.
import ReactTimeAgo from 'react-time-ago'
 
// "custom-tooltip" component.
// Requires React >= 16.
import ReactTimeAgo from 'react-time-ago/tooltip'

import JavascriptTimeAgo from 'javascript-time-ago'
 
// The desired locales.
import en from 'javascript-time-ago/locale/en'
import ru from 'javascript-time-ago/locale/ru'
 
// Initialize the desired locales.
JavascriptTimeAgo.locale(en)
JavascriptTimeAgo.locale(ru)

import React from 'react'
import ReactTimeAgo from 'react-time-ago'
 
export default function LastSeen({ date }) {
  return (
    <div>
      Last seen: <ReactTimeAgo date={date}/>
    </div>
  )
}

// Displays relative time in Russian.
<ReactTimeAgo date={date} locale="ru"/>

import ReactTimeAgo from 'react-time-ago/tooltip'
 
// Include tooltip CSS:
import 'react-time-ago/Tooltip.css'
// Also make sure that `document.body` has no `margin`
// otherwise tooltip `left` and `top` positions will be slightly off.
 
// Shows a verbose date tooltip on mouse over and on touch down.
<ReactTimeAgo date={date}/>

// The `date` (or `timestamp`).
// E.g. `new Date()` or `1355972400000`.
date : PropTypes.oneOfType([
  PropTypes.instanceOf(Date),
  PropTypes.number
]).isRequired,
 
// Preferred locale.
// Is 'en' by default.
// E.g. 'ru-RU'.
locale : PropTypes.string,
 
// Preferred locales (ordered).
// Will choose the first suitable locale from this list.
// (the one that has been initialized)
// E.g. `['ru-RU', 'en-GB']`.
locales : PropTypes.arrayOf(PropTypes.string),
 
// Date/time formatting style.
// E.g. 'twitter', 'time', or an object.
// See `javascript-time-ago` docs for more info.
timeStyle,
 
// Whether HTML `tooltip` attribute should be set
// to verbosely formatted date (is `true` by default).
// Set to `false` to disable the native HTML `tooltip`.
tooltip : PropTypes.bool.isRequired,
 
// An optional function returning what will be output in the HTML `title` tooltip attribute.
// (by default it's `(date) => new Intl.DateTimeFormat(locale, {…}).format(date)`)
formatVerboseDate : PropTypes.func,
 
// `Intl.DateTimeFormat` format for the HTML `title` tooltip attribute.
// Is used when `formatVerboseDate` is not specified.
// By default outputs a verbose date.
verboseDateFormat : PropTypes.object,
 
// How often to update all `<ReactTimeAgo/>` elements on a page.
// (is once in a minute by default)
updateInterval : PropTypes.number,
 
// Set to `false` to disable automatic refresh of
// `<ReactTimeAgo/>` elements on a page as time goes by.
// (is `true` by default)
tick : PropTypes.bool,
 
// (advanced)
// React Component to wrap the resulting `<time/>` React Element.
// Receives `verboseDate` and `children` properties.
// `verboseDate` can be used for displaying verbose date label
// in an "on mouse over" (or "on touch") tooltip.
// See "./source/ReactTimeAgoWithTooltip.js" for usage example.
container : PropTypes.func,
 
// CSS `style` object.
// E.g. `{ color: white }`.
style : PropTypes.object,
 
// CSS class name.
className : PropTypes.string