From ef66fa987620484b3655af4875355cab702a842b Mon Sep 17 00:00:00 2001
From: Nicolas CARON <nicolas.caron@coopgo.fr>
Date: Mon, 16 Dec 2024 12:38:28 +0100
Subject: [PATCH] Add BookingsCreateDiag

---
 config.yaml                                   |   8 +-
 .../_partials/beneficiary-diags.html          |  20 +--
 web/layouts/beneficiaries/create-diag.html    |   8 +-
 web/layouts/beneficiaries/display.html        |   9 +-
 web/layouts/diags/display-diag.html           |  12 +-
 web/layouts/diags/home.html                   |  11 +-
 .../_partials/booking-diags.html              |  49 ++++++++
 .../_partials/vehicle-diags.html              |   6 +-
 .../vehicles_management/booking-display.html  |   3 +
 .../create-booking-diag.html                  | 116 ++++++++++++++++++
 ...ate-diag.html => create-vehicle-diag.html} |   8 +-
 11 files changed, 218 insertions(+), 32 deletions(-)
 create mode 100644 web/layouts/vehicles_management/_partials/booking-diags.html
 create mode 100644 web/layouts/vehicles_management/create-booking-diag.html
 rename web/layouts/vehicles_management/{create-diag.html => create-vehicle-diag.html} (97%)

diff --git a/config.yaml b/config.yaml
index ebbd5d7..1e1083a 100644
--- a/config.yaml
+++ b/config.yaml
@@ -95,12 +95,16 @@ views:
     booking_display: 
       files: 
         - web/layouts/vehicles_management/booking-display.html
+        - web/layouts/vehicles_management/_partials/booking-diags.html
     delete_booking: 
       files: 
         - web/layouts/vehicles_management/delete-booking.html
-    create_diag:
+    create_vehicle_diag:
       files:
-        - web/layouts/vehicles_management/create-diag.html
+        - web/layouts/vehicles_management/create-vehicle-diag.html
+    create_booking_diag:
+      files:
+        - web/layouts/vehicles_management/create-booking-diag.html
   agenda: 
     list: 
       files: 
diff --git a/web/layouts/beneficiaries/_partials/beneficiary-diags.html b/web/layouts/beneficiaries/_partials/beneficiary-diags.html
index 13cf9d7..e80c560 100644
--- a/web/layouts/beneficiaries/_partials/beneficiary-diags.html
+++ b/web/layouts/beneficiaries/_partials/beneficiary-diags.html
@@ -3,14 +3,16 @@
 {{ $carIcon := .IconSet.Icon "tabler-icons:car" "h-6 w-6"}}
 <div class="bg-white shadow sm:rounded-lg">
     <div class="px-4 py-5 sm:px-6">
-        <h2 id="timeline-title" class="text-lg font-medium text-gray-900">Diagnostiques réalisés</h2>
-        <a href="{{.ViewState.beneficiary.ID}}/create-diag">
-            <button type="button"
-            class="inline-flex items-center justify-center rounded-2xl border border-transparent bg-co-blue px-4 py-2 text-sm font-medium text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-ci-blue focus:ring-offset-2 sm:w-auto">
-            {{$.IconSet.Icon "hero:outline/plus-circle" "h-5 w-5 mr-3"}}
-            Créer un dignostque
-            </button>
-        </a>
+        <div class="flex items-center space-x-5">
+            <h2 id="timeline-title" class="text-lg font-medium text-gray-900">Diagnostics réalisés</h2>
+            <a href="{{.ViewState.beneficiary.ID}}/create-diag">
+                <button type="button"
+                class="flex justify-around rounded-2xl border border-transparent bg-co-blue px-4 py-2 text-sm font-medium text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-ci-blue focus:ring-offset-2 sm:w-auto">
+                {{$.IconSet.Icon "hero:outline/plus-circle" "h-5 w-5 mr-3"}}
+                Créer un diagnostic
+                </button>
+            </a>
+        </div>
     </div>
     <div class="border-t border-gray-200">
         {{ $diagCount := len .ViewState.diags }}
@@ -37,7 +39,7 @@
                                 <p class="mt-1 text-sm text-gray-900">{{.Name}}</p>
                             </div>
                         <div class="flex-1 ml-3">
-                            <p class="mt-1 text-sm text-gray-900">Ce diagnostique a été retiré</p>
+                            <p class="mt-1 text-sm text-gray-900">Ce diagnostic a été retiré</p>
                         </div>
                     </li>
                 {{end}}
diff --git a/web/layouts/beneficiaries/create-diag.html b/web/layouts/beneficiaries/create-diag.html
index 90d5c2e..175968a 100644
--- a/web/layouts/beneficiaries/create-diag.html
+++ b/web/layouts/beneficiaries/create-diag.html
@@ -1,7 +1,7 @@
 {{define "content"}}
 
 <div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8">
-    <h1 class="text-2xl font-semibold text-gray-900">Ajouter un diagnostique</h1>
+    <h1 class="text-2xl font-semibold text-gray-900">Ajouter un diagnostic</h1>
 </div>
 
 <div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 mt-8"
@@ -48,7 +48,7 @@
                 <div class="md:col-span-1">
                     <h3 class="text-lg font-medium leading-6 text-gray-900">Informations obligatoires</h3>
                     <p class="mt-1 text-sm text-gray-500">Informations obligatoires
-                        pour créer un diagnostique dans PARCOURSMOB</p>
+                        pour créer un diagnostic dans PARCOURSMOB</p>
                 </div>
                 <div class="mt-5 md:mt-0 md:col-span-2">
                     <div class="grid grid-cols-6 gap-6">
@@ -68,7 +68,7 @@
             <div class="md:grid md:grid-cols-3 md:gap-6">
                 <div class="md:col-span-1">
                     <h3 class="text-lg font-medium leading-6 text-gray-900">Schéma JSON</h3>
-                    <p class="mt-1 text-sm text-gray-500">Schéma JSON pour le diagnostique</p>
+                    <p class="mt-1 text-sm text-gray-500">Schéma JSON pour le diagnostic</p>
                 </div>
                 <div class="mt-5 md:mt-0 md:col-span-2">
                     <div class="grid grid-cols-6 gap-6">
@@ -87,7 +87,7 @@
             <div class="md:grid md:grid-cols-3 md:gap-6">
                 <div class="md:col-span-1">
                     <h3 class="text-lg font-medium leading-6 text-gray-900">Schéma UI</h3>
-                    <p class="mt-1 text-sm text-gray-500">Schéma UI pour le diagnostique</p>
+                    <p class="mt-1 text-sm text-gray-500">Schéma UI pour le diagnostic</p>
                 </div>
                 <div class="mt-5 md:mt-0 md:col-span-2">
                     <div class="grid grid-cols-6 gap-6">
diff --git a/web/layouts/beneficiaries/display.html b/web/layouts/beneficiaries/display.html
index d6d55c6..141e8a4 100644
--- a/web/layouts/beneficiaries/display.html
+++ b/web/layouts/beneficiaries/display.html
@@ -137,6 +137,11 @@
                                             class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm"
                                             :class="tab == 'organizations' ? 'border-co-blue text-co-blue' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'">
                                             Gestionnaires </a>
+
+                                        <a href="#" @click="tab = 'diags'"
+                                            class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm"
+                                            :class="tab == 'diags' ? 'border-co-blue text-co-blue' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'">
+                                            Diagnostics </a>
                                     </nav>
                                 </div>
                             </div>
@@ -145,6 +150,7 @@
                         <div x-show="tab == 'documents'">{{template "beneficiary_files" .}}</div>
                         <div x-show="tab == 'notes'">{{template "beneficiary_notes" .}}</div>
                         <div x-show="tab == 'organizations'">{{template "beneficiary_organizations" .}}</div>
+                        <div x-show="tab == 'diags'">{{template "beneficiary_diags" .}}</div>
                     </div>
                 </div>
             </section>
@@ -152,9 +158,6 @@
 
         <section aria-labelledby="timeline-title" class="lg:col-start-3 lg:col-span-1">
         {{template "beneficiary_events" .}}
-        <div class="mt-6">
-        {{template "beneficiary_diags" .}}
-        </div>
         </section>
     </div>
 </main>
diff --git a/web/layouts/diags/display-diag.html b/web/layouts/diags/display-diag.html
index 52ccf15..39bf8cf 100644
--- a/web/layouts/diags/display-diag.html
+++ b/web/layouts/diags/display-diag.html
@@ -22,20 +22,26 @@
                 <div class="bg-white shadow sm:rounded-lg">
                     <div class="px-4 py-5 sm:px-6">
                         <h2 id="diag" class="text-lg leading-6 font-medium text-gray-900">Informations</h2>
-                        <p class="mt-1 max-w-2xl text-sm text-gray-500">Informations sur le diagnostique.</p>
+                        <p class="mt-1 max-w-2xl text-sm text-gray-500">Informations sur le diagnostic.</p>
                     </div>
                     <div class="border-t border-gray-200 px-4 py-5 sm:px-6">
                         <dl class="grid grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2">
                             {{if eq .ViewState.diag.Namespace "parcoursmob_beneficiaries"}}
                             <div class="sm:col-span-1">
                                 <dt class="text-sm font-medium text-gray-500">Type</dt>
-                                <dd class="mt-1 text-sm text-gray-900">Diagnostique personnelle</dd>
+                                <dd class="mt-1 text-sm text-gray-900">Diagnostic personnelle</dd>
                             </div>
                             {{end}}
                             {{if eq .ViewState.diag.Namespace "parcoursmob_vehicles"}}
                             <div class="sm:col-span-1">
                                 <dt class="text-sm font-medium text-gray-500">Type</dt>
-                                <dd class="mt-1 text-sm text-gray-900">Diagnostique automobile</dd>
+                                <dd class="mt-1 text-sm text-gray-900">Diagnostic automobile</dd>
+                            </div>
+                            {{end}}
+                            {{if eq .ViewState.diag.Namespace "parcoursmob_bookings"}}
+                            <div class="sm:col-span-1">
+                                <dt class="text-sm font-medium text-gray-500">Type</dt>
+                                <dd class="mt-1 text-sm text-gray-900">Diagnostic véhicule réservé</dd>
                             </div>
                             {{end}}
                             {{if .ViewState.diag.Json_schema}}
diff --git a/web/layouts/diags/home.html b/web/layouts/diags/home.html
index 57213fb..451c096 100644
--- a/web/layouts/diags/home.html
+++ b/web/layouts/diags/home.html
@@ -1,6 +1,6 @@
 {{define "content"}}
 <div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8">
-    <h1 class="text-2xl font-semibold text-gray-900">Diagnostiques effectués</h1>
+    <h1 class="text-2xl font-semibold text-gray-900">Diagnostics effectués</h1>
 
     <div class="sm:flex sm:items-center">
         <div class="sm:flex-auto">
@@ -27,7 +27,7 @@
                         <thead class="bg-gray-50">
                             <tr>
                                 <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900 sm:pl-6">
-                                    Nom du diagnostique
+                                    Nom du diagnostic
                                 </th>
                                 <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900 sm:pl-6">
                                     Type
@@ -47,10 +47,13 @@
                                     </td>
                                     <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6">
                                         {{if eq .Namespace "parcoursmob_beneficiaries"}}
-                                        <div class="text-gray-500">Diagnostique personnelle</div>
+                                        <div class="text-gray-500">Diagnostic personnelle</div>
                                         {{end}}
                                         {{if eq .Namespace "parcoursmob_vehicles"}}
-                                        <div class="text-gray-500">Diagnostique automobile</div>
+                                        <div class="text-gray-500">Diagnostic automobile</div>
+                                        {{end}}
+                                        {{if eq .Namespace "parcoursmob_bookings"}}
+                                        <div class="text-gray-500">Diagnostic véhicule réservé</div>
                                         {{end}}
                                     </td>
                                     <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm sm:pl-6">
diff --git a/web/layouts/vehicles_management/_partials/booking-diags.html b/web/layouts/vehicles_management/_partials/booking-diags.html
new file mode 100644
index 0000000..2e1ad05
--- /dev/null
+++ b/web/layouts/vehicles_management/_partials/booking-diags.html
@@ -0,0 +1,49 @@
+{{define "booking_diags"}}
+{{ $calendarIcon := .IconSet.Icon "hero:outline/calendar" "h-6 w-6" }}
+{{ $carIcon := .IconSet.Icon "tabler-icons:car" "h-6 w-6"}}
+<div class="bg-white shadow sm:rounded-lg">
+    <div class="px-4 py-5 flex items-center space-x-5 sm:px-6">
+        <h2 id="timeline-title" class="text-lg font-medium text-gray-900">Diagnostics réalisés</h2>
+        <a href="{{.ViewState.booking.ID}}/create-diag">
+            <button type="button"
+            class="inline-flex items-center justify-center rounded-2xl border border-transparent bg-co-blue px-4 py-2 text-sm font-medium text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-ci-blue focus:ring-offset-2 sm:w-auto">
+            {{$.IconSet.Icon "hero:outline/plus-circle" "h-5 w-5 mr-3"}}
+            Créer un diagnostic
+            </button>
+        </a>
+    </div>
+    <div class="border-t border-gray-200">
+        {{ $diagCount := len .ViewState.diags }}
+        <ul role="list" class="divide-y divide-gray-200 flex-1">
+            {{if eq $diagCount 0}}
+                <li class="py-2 px-4">
+                    <p class="py-5 mt-1 max-w-2xl text-sm text-gray-500">Aucun diagnostique effectué pour le moment.</p>
+                </li>
+            {{else}}
+                {{range .ViewState.diags}}
+                {{ $diags := .ID }}
+                {{if eq .Deleted false}}
+                    <li class="py-5 px-4 flex">
+                            <div class="flex-1 ml-3">
+                                <a href="app/diags/{{$diags}}" class="mt-1 text-sm text-gray-900">{{.Name}}</a>
+                            </div>
+                        <a href="/app/diags/{{$diags}}/delete" class="inline-flex"><button type="button"
+                            class="w-full px-4 py-2 border border-transparent text-sm font-medium rounded-2xl shadow-sm text-white bg-co-red hover:bg-co-red focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-co-blue">Retirer</button></a>
+                    </li>
+                {{end}}
+                {{if eq .Deleted true}}
+                    <li class="py-5 px-4 flex">
+                            <div class="flex-1 ml-3">
+                                <p class="mt-1 text-sm text-gray-900">{{.Name}}</p>
+                            </div>
+                        <div class="flex-1 ml-3">
+                            <p class="mt-1 text-sm text-gray-900">Ce diagnostique a été retiré</p>
+                        </div>
+                    </li>
+                {{end}}
+                {{end}}
+            {{end}}
+        </ul>
+    </div>
+</div>
+{{end}}
\ No newline at end of file
diff --git a/web/layouts/vehicles_management/_partials/vehicle-diags.html b/web/layouts/vehicles_management/_partials/vehicle-diags.html
index 69d4d3a..0b3b42d 100644
--- a/web/layouts/vehicles_management/_partials/vehicle-diags.html
+++ b/web/layouts/vehicles_management/_partials/vehicle-diags.html
@@ -2,13 +2,13 @@
 {{ $calendarIcon := .IconSet.Icon "hero:outline/calendar" "h-6 w-6" }}
 {{ $carIcon := .IconSet.Icon "tabler-icons:car" "h-6 w-6"}}
 <div class="bg-white shadow sm:rounded-lg">
-    <div class="px-4 py-5 sm:px-6">
-        <h2 id="timeline-title" class="text-lg font-medium text-gray-900">Diagnostiques réalisés</h2>
+    <div class="px-4 py-5 flex items-center space-x-5 sm:px-6">
+        <h2 id="timeline-title" class="text-lg font-medium text-gray-900">Diagnostics réalisés</h2>
         <a href="{{.ViewState.vehicle.ID}}/create-diag">
             <button type="button"
             class="inline-flex items-center justify-center rounded-2xl border border-transparent bg-co-blue px-4 py-2 text-sm font-medium text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-ci-blue focus:ring-offset-2 sm:w-auto">
             {{$.IconSet.Icon "hero:outline/plus-circle" "h-5 w-5 mr-3"}}
-            Créer un dignostque
+            Créer un diagnostic
             </button>
         </a>
     </div>
diff --git a/web/layouts/vehicles_management/booking-display.html b/web/layouts/vehicles_management/booking-display.html
index 027a940..d0cdd0f 100644
--- a/web/layouts/vehicles_management/booking-display.html
+++ b/web/layouts/vehicles_management/booking-display.html
@@ -103,6 +103,9 @@
                     </div>
                 </div>
             </div>
+            <div>
+                {{template "booking_diags" .}}
+            </div>
         </div>
         <div class="lg:col-start-2 lg:col-span-2">
             <div class="bg-white  shadow sm:rounded-2xl sm:px-6">
diff --git a/web/layouts/vehicles_management/create-booking-diag.html b/web/layouts/vehicles_management/create-booking-diag.html
new file mode 100644
index 0000000..8285297
--- /dev/null
+++ b/web/layouts/vehicles_management/create-booking-diag.html
@@ -0,0 +1,116 @@
+{{define "content"}}
+
+<div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8">
+    <h1 class="text-2xl font-semibold text-gray-900">Ajouter un diagnostic</h1>
+</div>
+
+<div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 mt-8"
+    x-data="{
+        fields: {
+            name: null,
+            namespace: 'parcoursmob_bookings',
+            json_schema: null,
+            ui_schema: null,
+        },
+        rules: {
+            name: ['required']
+            namespace: ['required']
+            json_schema: ['required']
+            ui_schema: ['required']
+        },
+        formValidation: {
+            valid: false,
+            fields: {
+                name: {valid: null},
+                json_schema: {valid: null},
+                ui_schema: {valid: null},
+            }
+        },
+        isFormValid: true,
+        validate() {
+            this.formValidation = Iodine.assert(this.fields, this.rules)
+        },
+        validateField(field) {
+            this.formValidation.fields[field] = Iodine.assert(this.fields[field], this.rules[field])
+        },
+        submit(event) {
+            this.validate()
+            if(!this.formValidation.valid) {
+                this.isFormValid = false
+                event.preventDefault()
+            }
+            return this.formValidation.valid
+        }
+    }">
+    <form class="space-y-6" method="POST" @submit="submit">
+        <div class="bg-white shadow px-4 py-5 sm:rounded-lg sm:p-6">
+            <div class="md:grid md:grid-cols-3 md:gap-6">
+                <div class="md:col-span-1">
+                    <h3 class="text-lg font-medium leading-6 text-gray-900">Informations obligatoires</h3>
+                    <p class="mt-1 text-sm text-gray-500">Informations obligatoires
+                        pour créer un diagnostic dans PARCOURSMOB</p>
+                </div>
+                <div class="mt-5 md:mt-0 md:col-span-2">
+                    <div class="grid grid-cols-6 gap-6">
+                        <div class="col-span-6 sm:col-span-3">
+                            <label for="name" class="block text-sm font-medium text-gray-700">Nom</label>
+                            <input type="text" name="name" id="name" autocomplete="given-name"
+                                class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm  rounded-2xl"
+                                x-model="fields.name" @blur="validateField('name')"
+                                :class="formValidation.fields.name.valid == false ? 'border-co-red border-2' : 'border-gray-300'">
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <input type="hidden" name="namespace" value="parcoursmob_bookings" />
+        <div class="bg-white shadow px-4 py-5 sm:rounded-lg sm:p-6 mt-6">
+            <div class="md:grid md:grid-cols-3 md:gap-6">
+                <div class="md:col-span-1">
+                    <h3 class="text-lg font-medium leading-6 text-gray-900">Schéma JSON</h3>
+                    <p class="mt-1 text-sm text-gray-500">Schéma JSON pour le diagnostic</p>
+                </div>
+                <div class="mt-5 md:mt-0 md:col-span-2">
+                    <div class="grid grid-cols-6 gap-6">
+                        <div class="col-span-6 sm:col-span-3">
+                            <label for="json_schema" class="block text-sm font-medium text-gray-700">Schéma JSON</label>
+                            <textarea name="json_schema" id="json_schema" autocomplete="json_schema"
+                                class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm  rounded-2xl"
+                                x-model="fields.json_schema" @blur="validateField('json_schema')"
+                                :class="formValidation.fields.json_schema.valid == false ? 'border-co-red border-2' : 'border-gray-300'"></textarea>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="bg-white shadow px-4 py-5 sm:rounded-lg sm:p-6 mt-6">
+            <div class="md:grid md:grid-cols-3 md:gap-6">
+                <div class="md:col-span-1">
+                    <h3 class="text-lg font-medium leading-6 text-gray-900">Schéma UI</h3>
+                    <p class="mt-1 text-sm text-gray-500">Schéma UI pour le diagnostic</p>
+                </div>
+                <div class="mt-5 md:mt-0 md:col-span-2">
+                    <div class="grid grid-cols-6 gap-6">
+                        <div class="col-span-6 sm:col-span-3">
+                            <label for="ui_schema" class="block text-sm font-medium text-gray-700">Schéma UI</label>
+                            <textarea name="ui_schema" id="ui_schema" autocomplete="ui_schema"
+                                class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm  rounded-2xl"
+                                x-model="fields.ui_schema" @blur="validateField('ui_schema')"
+                                :class="formValidation.fields.ui_schema.valid == false ? 'border-co-red border-2' : 'border-gray-300'"></textarea>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="flex justify-end">
+            <p x-show="! isFormValid" class="px-4 py-2 text-sm text-co-red">Certains champs de sont pas valides.</p>
+            <a href="/app/vehicles-management/bookings/{{.ViewState.booking}}">
+                <button type="button"
+                    class="bg-white py-2 px-4 border border-gray-300 rounded-2xl shadow-sm text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-co-blue">Annuler</button>
+            </a>
+            <button type="submit"
+                class="ml-3 inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-2xl text-white bg-co-blue hover:bg-co-blue focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-co-blue">Créer le diagnostique</button>
+        </div>
+    </form>
+</div>
+{{end}}
\ No newline at end of file
diff --git a/web/layouts/vehicles_management/create-diag.html b/web/layouts/vehicles_management/create-vehicle-diag.html
similarity index 97%
rename from web/layouts/vehicles_management/create-diag.html
rename to web/layouts/vehicles_management/create-vehicle-diag.html
index bb347ea..0f335c1 100644
--- a/web/layouts/vehicles_management/create-diag.html
+++ b/web/layouts/vehicles_management/create-vehicle-diag.html
@@ -1,7 +1,7 @@
 {{define "content"}}
 
 <div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8">
-    <h1 class="text-2xl font-semibold text-gray-900">Ajouter un diagnostique</h1>
+    <h1 class="text-2xl font-semibold text-gray-900">Ajouter un diagnostic</h1>
 </div>
 
 <div class="max-w-7xl mx-auto px-4 sm:px-6 md:px-8 mt-8"
@@ -48,7 +48,7 @@
                 <div class="md:col-span-1">
                     <h3 class="text-lg font-medium leading-6 text-gray-900">Informations obligatoires</h3>
                     <p class="mt-1 text-sm text-gray-500">Informations obligatoires
-                        pour créer un diagnostique dans PARCOURSMOB</p>
+                        pour créer un diagnostic dans PARCOURSMOB</p>
                 </div>
                 <div class="mt-5 md:mt-0 md:col-span-2">
                     <div class="grid grid-cols-6 gap-6">
@@ -68,7 +68,7 @@
             <div class="md:grid md:grid-cols-3 md:gap-6">
                 <div class="md:col-span-1">
                     <h3 class="text-lg font-medium leading-6 text-gray-900">Schéma JSON</h3>
-                    <p class="mt-1 text-sm text-gray-500">Schéma JSON pour le diagnostique</p>
+                    <p class="mt-1 text-sm text-gray-500">Schéma JSON pour le diagnostic</p>
                 </div>
                 <div class="mt-5 md:mt-0 md:col-span-2">
                     <div class="grid grid-cols-6 gap-6">
@@ -87,7 +87,7 @@
             <div class="md:grid md:grid-cols-3 md:gap-6">
                 <div class="md:col-span-1">
                     <h3 class="text-lg font-medium leading-6 text-gray-900">Schéma UI</h3>
-                    <p class="mt-1 text-sm text-gray-500">Schéma UI pour le diagnostique</p>
+                    <p class="mt-1 text-sm text-gray-500">Schéma UI pour le diagnostic</p>
                 </div>
                 <div class="mt-5 md:mt-0 md:col-span-2">
                     <div class="grid grid-cols-6 gap-6">