1 | import PropTypes from 'prop-types';
|
2 | import React, { Component } from 'react';
|
3 | import { StyleSheet, Text, View } from 'react-native';
|
4 | import dayjs from 'dayjs';
|
5 | import Color from './Color';
|
6 | import { TIME_FORMAT } from './Constant';
|
7 | import { StylePropType } from './utils';
|
8 | const containerStyle = {
|
9 | marginLeft: 10,
|
10 | marginRight: 10,
|
11 | marginBottom: 5,
|
12 | };
|
13 | const textStyle = {
|
14 | fontSize: 10,
|
15 | backgroundColor: 'transparent',
|
16 | textAlign: 'right',
|
17 | };
|
18 | const styles = {
|
19 | left: StyleSheet.create({
|
20 | container: {
|
21 | ...containerStyle,
|
22 | },
|
23 | text: {
|
24 | color: Color.timeTextColor,
|
25 | ...textStyle,
|
26 | },
|
27 | }),
|
28 | right: StyleSheet.create({
|
29 | container: {
|
30 | ...containerStyle,
|
31 | },
|
32 | text: {
|
33 | color: Color.white,
|
34 | ...textStyle,
|
35 | },
|
36 | }),
|
37 | };
|
38 | export default class Time extends Component {
|
39 | render() {
|
40 | const { position, containerStyle, currentMessage, timeFormat, timeTextStyle, } = this.props;
|
41 | if (!!currentMessage) {
|
42 | return (<View style={[
|
43 | styles[position].container,
|
44 | containerStyle && containerStyle[position],
|
45 | ]}>
|
46 | <Text style={[
|
47 | styles[position].text,
|
48 | timeTextStyle && timeTextStyle[position],
|
49 | ]}>
|
50 | {dayjs(currentMessage.createdAt)
|
51 | .locale(this.context.getLocale())
|
52 | .format(timeFormat)}
|
53 | </Text>
|
54 | </View>);
|
55 | }
|
56 | return null;
|
57 | }
|
58 | }
|
59 | Time.contextTypes = {
|
60 | getLocale: PropTypes.func,
|
61 | };
|
62 | Time.defaultProps = {
|
63 | position: 'left',
|
64 | currentMessage: {
|
65 | createdAt: null,
|
66 | },
|
67 | containerStyle: {},
|
68 | timeFormat: TIME_FORMAT,
|
69 | timeTextStyle: {},
|
70 | };
|
71 | Time.propTypes = {
|
72 | position: PropTypes.oneOf(['left', 'right']),
|
73 | currentMessage: PropTypes.object,
|
74 | containerStyle: PropTypes.shape({
|
75 | left: StylePropType,
|
76 | right: StylePropType,
|
77 | }),
|
78 | timeFormat: PropTypes.string,
|
79 | timeTextStyle: PropTypes.shape({
|
80 | left: StylePropType,
|
81 | right: StylePropType,
|
82 | }),
|
83 | };
|
84 |
|
\ | No newline at end of file |