New attributes into reservation.

src/components/Dashboard/ReservationPage/Reservation/InsertReservationProps.ts

-export type Location = {
+export type LocationType = {
   address: string;
 };
 
+export type TripStageType = {
+  location: Location;
+  number: number;
+  estimatedBeAt: Date;
+};
+
 export type InsertReservationProps = {
   senior: number | undefined;
   insertedBy: number;
-  tripStages: string[];
-  driverShift: string;
-  number: number;
+  tripStages: TripStageType[];
+  driverShift: string | null;
   estimatedBeAt: Date;
 };

src/components/Dashboard/ReservationPage/Reservation/TripStage.tsx

 /* eslint-disable react/jsx-props-no-spreading */
 import React, { FC, useState } from 'react';
-import { Button, TextField } from '@material-ui/core';
+import { Button, TextField, Typography } from '@material-ui/core';
 import { Control, Controller } from 'react-hook-form';
-import { InsertReservationProps } from './InsertReservationProps';
+import { InputField } from 'components/Auth/InputField/InputField';
+import {
+  InsertReservationProps,
+  TripStageType,
+} from './InsertReservationProps';
 
 type TripStageProps = {
   control: Control<InsertReservationProps>;
@@ -14,8 +18,9 @@ type TripStageProps = {
 // https://codesandbox.io/s/usefieldarray-virtual-input-v9wyw
 // https://codesandbox.io/s/react-hook-form-usefieldarray-7bpmk
 export const TripStage: FC<TripStageProps> = ({ control }: TripStageProps) => {
-  const [stage, setStage] = useState<string[]>([]);
+  const [stage, setStage] = useState<string[]>(['']);
   const [value, setValue] = useState<string>('');
+  console.log(control);
 
   const addStage = (): void => {
     setStage([...stage, value]);
@@ -24,12 +29,23 @@ export const TripStage: FC<TripStageProps> = ({ control }: TripStageProps) => {
   return (
     <>
       {stage.map((field, index) => (
-        <Controller
-          as={<TextField />}
-          name={`tripStages[${index}].address`}
-          control={control}
-          defaultValue={field}
-        />
+        <>
+          <Typography variant="h3" component="h3">
+            Stage {index}
+          </Typography>
+          <Controller
+            as={<TextField variant="outlined" fullWidth label="Location" />}
+            name={`tripStages[${index}].address`}
+            control={control}
+            defaultValue={field}
+          />
+          <InputField
+            name={`tripStages[${index}].estimatedBeAt`}
+            label="Predicted time"
+            type="date"
+            control={control}
+          />
+        </>
       ))}
       <Button variant="outlined" onClick={addStage} type="button">
         Add stage