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