feat: Improve OrderDetails component with localized date formatting
- Added dayjs localization support using current language - Separated order title and creation date into distinct elements - Simplified date display format - Imported Russian and English dayjs locales
This commit is contained in:
parent
e5fa3b7802
commit
b87d012e34
@ -10,8 +10,10 @@ import {
|
||||
} from '@chakra-ui/react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import dayjs from 'dayjs';
|
||||
import localizedFormat from "dayjs/plugin/localizedFormat";
|
||||
import localizedFormat from 'dayjs/plugin/localizedFormat';
|
||||
dayjs.extend(localizedFormat);
|
||||
import 'dayjs/locale/ru';
|
||||
import 'dayjs/locale/en';
|
||||
|
||||
import { Order } from '../../../models/landing';
|
||||
import { formatDatetime } from '../../../lib';
|
||||
@ -43,26 +45,28 @@ export const OrderDetails: FC<OrderDetailsProps> = ({
|
||||
location,
|
||||
startWashTime,
|
||||
endWashTime,
|
||||
created
|
||||
created,
|
||||
}) => {
|
||||
const { t } = useTranslation('~', {
|
||||
const { t, i18n } = useTranslation('~', {
|
||||
keyPrefix: 'dry-wash.order-view.details',
|
||||
});
|
||||
dayjs.locale(i18n.language);
|
||||
const { t: tCarBody } = useTranslation('~', {
|
||||
keyPrefix: 'dry-wash.order-create.car-body-select.options',
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<Heading as='h2' size='lg' marginInline='auto'>
|
||||
{t('title', { number: orderNumber })}
|
||||
</Heading>
|
||||
<HStack
|
||||
width='full'
|
||||
flexWrap='wrap'
|
||||
justifyContent='space-between'
|
||||
gap={2}
|
||||
>
|
||||
<Heading as='h2' size='lg'>
|
||||
{t('title', { number: orderNumber })} ({dayjs(created).format('LLLL')})
|
||||
</Heading>
|
||||
<Text>{dayjs(created).format('LLL')}</Text>
|
||||
<OrderStatus value={status} />
|
||||
</HStack>
|
||||
<UnorderedList styleType='none'>
|
||||
|
Loading…
x
Reference in New Issue
Block a user