Localize dates, counts (#5027)
* refactor: consistent localized formatting * refactor: localized date time * refactor: localize relative time with strings * chore: fix typo from copy-paste * Clean up useTimeAgo * Remove old ago * Const * Reuse * Prettier --------- Co-authored-by: Mary <git@mary.my.id>
This commit is contained in:
parent
d5a7618374
commit
8651f31ebb
21 changed files with 375 additions and 186 deletions
|
|
@ -1,19 +1,18 @@
|
|||
import React, {useState, useCallback} from 'react'
|
||||
import React, {useCallback, useState} from 'react'
|
||||
import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native'
|
||||
import DatePicker from 'react-native-date-picker'
|
||||
import {
|
||||
FontAwesomeIcon,
|
||||
FontAwesomeIconStyle,
|
||||
} from '@fortawesome/react-native-fontawesome'
|
||||
import {isIOS, isAndroid} from 'platform/detection'
|
||||
import {Button, ButtonType} from './Button'
|
||||
import {Text} from '../text/Text'
|
||||
import {useLingui} from '@lingui/react'
|
||||
|
||||
import {usePalette} from 'lib/hooks/usePalette'
|
||||
import {TypographyVariant} from 'lib/ThemeContext'
|
||||
import {useTheme} from 'lib/ThemeContext'
|
||||
import {usePalette} from 'lib/hooks/usePalette'
|
||||
import {getLocales} from 'expo-localization'
|
||||
import DatePicker from 'react-native-date-picker'
|
||||
|
||||
const LOCALE = getLocales()[0]
|
||||
import {isAndroid, isIOS} from 'platform/detection'
|
||||
import {Text} from '../text/Text'
|
||||
import {Button, ButtonType} from './Button'
|
||||
|
||||
interface Props {
|
||||
testID?: string
|
||||
|
|
@ -30,16 +29,11 @@ interface Props {
|
|||
}
|
||||
|
||||
export function DateInput(props: Props) {
|
||||
const {i18n} = useLingui()
|
||||
const [show, setShow] = useState(false)
|
||||
const theme = useTheme()
|
||||
const pal = usePalette('default')
|
||||
|
||||
const formatter = React.useMemo(() => {
|
||||
return new Intl.DateTimeFormat(LOCALE.languageTag, {
|
||||
timeZone: props.handleAsUTC ? 'UTC' : undefined,
|
||||
})
|
||||
}, [props.handleAsUTC])
|
||||
|
||||
const onChangeInternal = useCallback(
|
||||
(date: Date) => {
|
||||
setShow(false)
|
||||
|
|
@ -74,7 +68,9 @@ export function DateInput(props: Props) {
|
|||
<Text
|
||||
type={props.buttonLabelType}
|
||||
style={[pal.text, props.buttonLabelStyle]}>
|
||||
{formatter.format(props.value)}
|
||||
{i18n.date(props.value, {
|
||||
timeZone: props.handleAsUTC ? 'UTC' : undefined,
|
||||
})}
|
||||
</Text>
|
||||
</View>
|
||||
</Button>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue