-
Notifications
You must be signed in to change notification settings - Fork 97
/
index.js
71 lines (64 loc) 路 2.28 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
import React from 'react';
import moment from 'moment';
import Tooltip from 'react-toolbox/lib/tooltip';
import theme from 'react-toolbox/lib/tooltip/theme.css';
import { translate } from 'react-i18next';
import i18n from '../../i18n';
const _convertTimeFromFirstBlock = value =>
new Date((((Date.UTC(2016, 4, 24, 17, 0, 0, 0) / 1000) + value) * 1000));
/**
* Remove an array of keys from object
* @param {object} obj - an object that we want to remove some properties from that
* @param {array} arr - list of name of properties that we want to remove them
* @return {object} list - an object that hasn't any of items in arr
*/
const _remove = (obj, arr) => {
let list = []; // eslint-disable-line
const temp = Object.keys(obj)
.filter(key => !arr.includes(key));
temp.forEach((item) => {
list[item] = obj[item];
});
return list;
};
const Div = (props) => {
const rest = _remove(props, ['theme', 'tooltip', 'tooltipDelay', 'tooltipHideOnClick']);
return (<div {...rest} />);
};
/**
* This wrapper add theme style and default delay, and disable tooltip when `tooltip` is empty.
* @param props
*/
export const TooltipWrapper = (props) => {
const Tip = Tooltip(Div); // eslint-disable-line
if (props.tooltip) {
return (<Tip
tooltipPosition="top"
tooltipDelay={350}
{...props}
theme={Object.assign({}, theme, props.theme || {})} />);
}
return <Div {...props} />;
};
export const Time = translate()((props) => {
moment.locale(i18n.language);
const time = moment(_convertTimeFromFirstBlock(props.label));
return <span>{time.fromNow(true)}</span>;
});
export const DateFromTimestamp = translate()((props) => {
moment.locale(i18n.language);
const day = moment(_convertTimeFromFirstBlock(props.time));
return (<span className={'date'}>{day.format('ll')}</span>);
});
export const TimeFromTimestamp = translate()((props) => {
moment.locale(i18n.language);
const day = moment(_convertTimeFromFirstBlock(props.time));
return (<span>{day.format('LTS')}</span>);
});
export const TooltipTime = translate()((props) => {
moment.locale(i18n.language);
const time = moment(_convertTimeFromFirstBlock(props.label));
return (<TooltipWrapper tooltip={time.format('LL LTS')} >
<Time label={props.label} lang={props.lang}></Time>
</TooltipWrapper>);
});