From 4e496ea6627b991bf81e34c87b7c35fa5b112d45 Mon Sep 17 00:00:00 2001
From: Alberto Defendi <1369-ahl-berto@users.noreply.gitlab.inf.unibz.it>
Date: Wed, 9 Jun 2021 08:23:23 +0200
Subject: [PATCH] Todo element to add tripstage.
---
.../ReservationPage/Reservation/TripStage.tsx | 48 +++++++++++++++++++
1 file changed, 48 insertions(+)
create mode 100644 src/components/Dashboard/ReservationPage/Reservation/TripStage.tsx
diff --git a/src/components/Dashboard/ReservationPage/Reservation/TripStage.tsx b/src/components/Dashboard/ReservationPage/Reservation/TripStage.tsx
new file mode 100644
index 0000000..5f194d8
--- /dev/null
+++ b/src/components/Dashboard/ReservationPage/Reservation/TripStage.tsx
@@ -0,0 +1,48 @@
+/* eslint-disable react/jsx-props-no-spreading */
+import { Button, Input, TextField } from '@material-ui/core';
+import Timeline from '@material-ui/lab/Timeline';
+import TimelineItem from '@material-ui/lab/TimelineItem';
+import TimelineSeparator from '@material-ui/lab/TimelineSeparator';
+import TimelineConnector from '@material-ui/lab/TimelineConnector';
+import TimelineContent from '@material-ui/lab/TimelineContent';
+import TimelineDot from '@material-ui/lab/TimelineDot';
+import { InputField } from 'components/Auth/InputField/InputField';
+import React, { FC, useState } from 'react';
+import { useFormContext } from 'react-hook-form';
+
+export const TripStage: FC = () => {
+ const [stage, setStage] = useState<string[]>([]);
+ const [value, setValue] = useState<string>('');
+
+ const addStage = (): void => {
+ setStage([...stage, value]);
+ };
+
+ return (
+ <>
+ <Timeline>
+ {stage.map((el, key) => (
+ <TimelineItem>
+ <TimelineSeparator>
+ <TimelineDot />
+ <TimelineConnector />
+ </TimelineSeparator>
+ <TimelineContent>{el}</TimelineContent>
+ </TimelineItem>
+ ))}
+ </Timeline>
+ <div>
+ <TextField
+ id="address"
+ label="address"
+ type="text"
+ variant="outlined"
+ onChange={(e) => setValue(e.target.value)}
+ />
+ <Button variant="outlined" type="button" onClick={addStage}>
+ Add
+ </Button>
+ </div>
+ </>
+ );
+};
--
GitLab