diff --git a/src/components/Forms/Form-Arret-Proche.tsx b/src/components/Forms/Form-Arret-Proche.tsx
index 6c2519c212d986e07eb9d47cbafcdb1849ecbd52..93a8f84e859e0a67e3fa548a1021d961d01700de 100644
--- a/src/components/Forms/Form-Arret-Proche.tsx
+++ b/src/components/Forms/Form-Arret-Proche.tsx
@@ -81,7 +81,10 @@ const FormArretProche = () => {
className="mt-1"
variant="primary"
type="reset"
- onClick={() => setShowResult(false)}
+ onClick={() => {
+ setFilter("");
+ setShowResult(false);
+ }}
>
Clear
</Button>
diff --git a/src/components/Forms/Form-Arret.tsx b/src/components/Forms/Form-Arret.tsx
index 7b2b4b92c8490d62a12df5011477c38499551477..09bf3bb013bc64d6e5f4540dee3cac3bd45c5260 100644
--- a/src/components/Forms/Form-Arret.tsx
+++ b/src/components/Forms/Form-Arret.tsx
@@ -47,7 +47,10 @@ const FormArret = () => {
className="mt-1"
variant="primary"
type="reset"
- onClick={() => setShowResult(false)}
+ onClick={() => {
+ setFilter("");
+ setShowResult(false);
+ }}
>
Clear
</Button>
diff --git a/src/components/Forms/Form-Waiting-Time.tsx b/src/components/Forms/Form-Waiting-Time.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..586114f7c03e651a34dff4cbeeb97f2fc2f9af7b
--- /dev/null
+++ b/src/components/Forms/Form-Waiting-Time.tsx
@@ -0,0 +1,71 @@
+import { useQuery } from "@tanstack/react-query";
+import { getWaitingTime } from "../../utils";
+import { useState } from "react";
+import { Button, Col, Form, Spinner } from "react-bootstrap";
+
+const FormWaitingTime = () => {
+ const [showResult, setShowResult] = useState(false);
+ const [codeArret, setCodeArret] = useState("HBLI");
+
+ const { isPending, isError, error, data } = useQuery({
+ queryKey: ["tempsAttente", { codeArret }],
+ enabled: showResult,
+ queryFn: async () => getWaitingTime(codeArret),
+ });
+
+ return (
+ <>
+ <Form
+ onSubmit={(e) => {
+ e.preventDefault();
+ setShowResult(true);
+ }}
+ >
+ <h1>Temps d'attente par rapport à un arrêt</h1>
+ <Col xs={4}>
+ <Form.Group className="mb-3" controlId="formCodeArret">
+ <Form.Label>Code Arrêt</Form.Label>
+ <Form.Control
+ type="text"
+ defaultValue="HBLI"
+ onChange={(e) => setCodeArret(e.target.value)}
+ required
+ />
+ </Form.Group>
+ </Col>
+ <Button className="mt-1" variant="primary" type="submit">
+ Submit
+ </Button>
+ <Button
+ className="mt-1"
+ variant="primary"
+ type="reset"
+ onClick={() => setShowResult(false)}
+ >
+ Clear
+ </Button>
+ </Form>
+ {!showResult ? (
+ <></>
+ ) : isPending ? (
+ <Spinner animation="border" role="status">
+ <span className="visually-hidden">Loading...</span>
+ </Spinner>
+ ) : isError ? (
+ <p>
+ An error has occured: {error.name} - {error.message}
+ </p>
+ ) : (
+ <Col md={4} className="mt-3">
+ {data.map((time) => (
+ <p key={time.id}>
+ Ligne: {time.ligne.numLigne} - Sens: {time.sens} - Temps: {time.temps}
+ </p>
+ ))}
+ </Col>
+ )}
+ </>
+ );
+};
+
+export default FormWaitingTime;
diff --git a/src/components/Formulaire.tsx b/src/components/Formulaire.tsx
index 813486564a0e472df02873b47bc51203a3991e8b..e9ba065a289f27db6564c8b5caddd6801d11191d 100644
--- a/src/components/Formulaire.tsx
+++ b/src/components/Formulaire.tsx
@@ -1,7 +1,8 @@
-import { Col, Container, Form, Row } from "react-bootstrap";
+import { Container, Row } from "react-bootstrap";
import FormArret from "./Forms/Form-Arret";
import FormArretProche from "./Forms/Form-Arret-Proche";
import FormHoraire from "./Forms/Form-Horaire";
+import FormWaitingTime from "./Forms/Form-Waiting-Time";
type FormulaireProps = {
selection: number;
@@ -17,17 +18,7 @@ const Formulaire = ({ selection }: FormulaireProps) => {
case 2:
return <FormHoraire />;
case 3:
- return (
- <>
- <h1>Temps d'attente par rapport à un arrêt</h1>
- <Col xs={4}>
- <Form.Group className="mb-3" controlId="formCodeArret">
- <Form.Label>Code Arrêt</Form.Label>
- <Form.Control type="text" defaultValue="HBLI" required />
- </Form.Group>
- </Col>
- </>
- );
+ return <FormWaitingTime />;
default:
return <div>{selection}</div>;
}
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index b168d9e94cb0ab287a1b9e3c6cf20844f6581eb1..97decf79f9a78451ad5fb519f857c05c576f2b40 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -13,7 +13,7 @@ const Sidebar = ({ setSelection }: SidebarProps) => {
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="flex-row">
<NavDropdown
- title="Temps d'attente"
+ title="Arrêts"
id="temps-dattente-dropdown"
className="flex-column"
>
diff --git a/src/models/Horaire.model.ts b/src/models/Horaire.model.ts
index 8f54dfe59fc1999fcc7fe97fea81d6f0f1c50a5d..2d108d6d1fd465d1c269ec053a3aa4c85d024040 100644
--- a/src/models/Horaire.model.ts
+++ b/src/models/Horaire.model.ts
@@ -1,16 +1,16 @@
export type Horaire = {
"ligne": {
"numLigne": string,
- "typeligne": 0,
+ "typeligne": number,
"directionSens1": string,
"directionSens2": string,
"accessible": string,
- "etatTrafic": 0
+ "etatTrafic": number
},
"arret": {
"codeArret": string,
"libelle": string,
- "accessible": true
+ "accessible": boolean
},
"codeCouleur": string,
"notes": [
diff --git a/src/models/RemainingTime.model.ts b/src/models/RemainingTime.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..b4cf0e87f5a548c7b513af7b9385452a1b846993
--- /dev/null
+++ b/src/models/RemainingTime.model.ts
@@ -0,0 +1,16 @@
+export type RemainingTime = {
+ id: number,
+ "sens": number,
+ "terminus": string,
+ "infotrafic": boolean,
+ "temps": string,
+ "dernierDepart": string,
+ "tempsReel": string,
+ "ligne": {
+ "numLigne": string,
+ "typeLigne": number
+ },
+ "arret": {
+ "codeArret": string
+ }
+}
\ No newline at end of file
diff --git a/src/utils.ts b/src/utils.ts
index 9bb050393431ba6def13b912f241d243170cefa7..97fbf1d0b1b51ca72f9a3ba80859964726bfc48b 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -1,6 +1,7 @@
import axios from "axios";
import { Arret } from "./models/Arret.model";
import { Horaire } from "./models/Horaire.model";
+import { RemainingTime } from "./models/RemainingTime.model";
const URL = `https://hackathon-login.osc-fr1.scalingo.io`;
@@ -38,4 +39,9 @@ export const getHoraires = async (codeArret: string, numLigne: string, sense: "1
}
const result = await axios.get<Horaire>(`${URL}/get_timetable_by_date/${codeArret}/${numLigne}/${sense}/${date}`);
return result.data;
+}
+
+export const getWaitingTime = async (codeArret: string) => {
+ const result = await axios.get<Omit<RemainingTime, "id">[]>(`${URL}/get_waitingtime_by_station/${codeArret}`);
+ return result.data.map((time, i) => { return { ...time, id: i } as RemainingTime });
}
\ No newline at end of file