Merge pull request 'feature/stubsArm' (#40) from feature/stubsArm into main

Reviewed-on: #40
Reviewed-by: Primakov Alexandr Alexandrovich <primakovpro@gmail.com>

src/components/MasterItem/MasterItem.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Badge, Link, Stack, Td, Tr } from '@chakra-ui/react';
 
 import MasterActionsMenu from '../MasterActionsMenu';
+import { getTimeSlot } from '../../lib/date-helpers';
 
 const MasterItem = ({ name, schedule, phone }) => {
   return (
@@ -9,9 +10,9 @@ const MasterItem = ({ name, schedule, phone }) => {
       <Td>{name}</Td>
       <Td>
         <Stack direction='row'>
-          {schedule.map((time, index) => (
+          {schedule.map(({ startWashTime, endWashTime }, index) => (
             <Badge colorScheme={'green'} key={index}>
-              {time}
+              {getTimeSlot(startWashTime, endWashTime)}
             </Badge>
           ))}
         </Stack>

src/components/Masters/Masters.tsx

@@ -13,9 +13,9 @@ import {
 } from '@chakra-ui/react';
 import { useTranslation } from 'react-i18next';
 
-import { mastersData } from '../../mocks';
 import MasterItem from '../MasterItem';
 import MasterDrawer from '../MasterDrawer';
+import data from '../../../stubs/json/arm-masters/success.json';
 
 const TABLE_HEADERS = [
   'name' as const,
@@ -48,7 +48,7 @@ const Masters = () => {
           </Tr>
         </Thead>
         <Tbody>
-          {mastersData.map((master, index) => (
+          {data.body.map((master, index) => (
             <MasterItem key={index} {...master} />
           ))}
         </Tbody>

src/components/OrderItem/OrderItem.tsx

@@ -1,6 +1,9 @@
 import React, { useState } from 'react';
 import { Td, Tr, Link, Select } from '@chakra-ui/react';
 import { useTranslation } from 'react-i18next';
+import dayjs from 'dayjs';
+
+import { getTimeSlot } from '../../lib/date-helpers';
 
 const statuses = [
   'pending' as const,
@@ -15,7 +18,8 @@ type GetArrItemType<ArrType> =
 
 export type OrderProps = {
   carNumber?: string;
-  washTime?: string;
+  startWashTime?: string;
+  endWashTime?: string;
   orderDate?: string;
   status?: GetArrItemType<typeof statuses>;
   phone?: string;
@@ -24,7 +28,8 @@ export type OrderProps = {
 
 const OrderItem = ({
   carNumber,
-  washTime,
+  startWashTime,
+  endWashTime,
   orderDate,
   status,
   phone,
@@ -39,8 +44,8 @@ const OrderItem = ({
   return (
     <Tr>
       <Td>{carNumber}</Td>
-      <Td>{washTime}</Td>
-      <Td>{orderDate}</Td>
+      <Td>{getTimeSlot(startWashTime, endWashTime)}</Td>
+      <Td>{dayjs(orderDate).format('DD.MM.YYYY')}</Td>
       <Td>
         <Select
           value={statusSelect}

src/components/Orders/Orders.tsx

@@ -2,9 +2,9 @@ import React from 'react';
 import { Box, Heading, Table, Thead, Tbody, Tr, Th } from '@chakra-ui/react';
 import { useTranslation } from 'react-i18next';
 
-import { ordersData } from '../../mocks';
 import OrderItem from '../OrderItem';
 import { OrderProps } from '../OrderItem/OrderItem';
+import data from '../../../stubs/json/arm-orders/success.json';
 
 const Orders = () => {
   const { t } = useTranslation('~', {
@@ -34,7 +34,7 @@ const Orders = () => {
           </Tr>
         </Thead>
         <Tbody>
-          {ordersData.map((order, index) => (
+          {data.body.map((order, index) => (
             <OrderItem
               key={index}
               {...order}