Correctif typage + ajout section supplémentaire si le film n'est pas retrouvé.

 <script lang="ts" setup>
 <script lang="ts" setup>
 //#region --import--.
 //#region --import--.
-import { ArrowLeftIcon } from "lucide-vue-next";
+import { AlertTriangleIcon, ArrowLeftIcon } from "lucide-vue-next";
 import { useTMDB } from "~/composables/tMDB";
 import { useTMDB } from "~/composables/tMDB";
 import { computed, onMounted, ref } from "vue";
 import { computed, onMounted, ref } from "vue";
 import { Movie } from "~/models/movie";
 import { Movie } from "~/models/movie";
@@ -12,6 +12,7 @@ import { MovieComment } from "~/models/movieComment";
 // Infos sur le composable date de Vuetify : https://vuetifyjs.com/en/features/dates/
 // Infos sur le composable date de Vuetify : https://vuetifyjs.com/en/features/dates/
 // Et l'api date : https://vuetifyjs.com/en/api/use-date/#exposed
 // Et l'api date : https://vuetifyjs.com/en/api/use-date/#exposed
 import { useDate } from "vuetify";
 import { useDate } from "vuetify";
+import { WhereSecondaryClosure } from "pinia-orm";
 //#endregion
 //#endregion
 
 
 //#region --Declaration--.
 //#region --Declaration--.
@@ -47,8 +48,11 @@ const movieId = computed(() => {
 
 
 const movie = computed(() => {
 const movie = computed(() => {
   if (unref(movieId)) {
   if (unref(movieId)) {
-    // Todo : revoir ici.
-    return useRepo(Movie).query().where("id", movieId.value).withAll().first() as unknown as MovieInterface;
+    return useRepo(Movie)
+      .query()
+      .where("id", movieId.value as WhereSecondaryClosure<never> | null | undefined)
+      .withAll()
+      .first() as unknown as MovieInterface;
   } else {
   } else {
     return null;
     return null;
   }
   }
@@ -69,10 +73,14 @@ const director = computed(() => {
  * Retourne les commentaires liés au film, du plus récent au plus ancien.
  * Retourne les commentaires liés au film, du plus récent au plus ancien.
  */
  */
 const comments = computed(() => {
 const comments = computed(() => {
-  return useRepo(MovieComment).query().where(comment => {
+  return useRepo(MovieComment)
+    .query()
+    .where((comment) => {
       const searched = comment as unknown as MovieCommentInterface;
       const searched = comment as unknown as MovieCommentInterface;
-    return searched.movie_id === unref(movieId)
-  }).orderBy('createdAt', 'desc').get();
+      return searched.movie_id === unref(movieId);
+    })
+    .orderBy("createdAt", "desc")
+    .get();
 });
 });
 //#endregion
 //#endregion
 
 
@@ -123,7 +131,7 @@ async function fetchCredits(id: number | string) {
 function handleSubmitEvent(event: MovieCommentInterface) {
 function handleSubmitEvent(event: MovieCommentInterface) {
   isSubmitting.value = true;
   isSubmitting.value = true;
   event.movie_id = unref(movieId);
   event.movie_id = unref(movieId);
-  event.createdAt = `${new Date(Date.now())}`
+  event.createdAt = `${new Date(Date.now())}`;
   useRepo(MovieComment).save(event);
   useRepo(MovieComment).save(event);
   isSubmitting.value = false;
   isSubmitting.value = false;
 }
 }
@@ -212,6 +220,19 @@ onMounted(() => {
         </div>
         </div>
       </div>
       </div>
     </div>
     </div>
+
+    <!-- Erreur -->
+    <section v-else class="container mx-auto px-4 py-16 text-center">
+      <AlertTriangleIcon :size="64" class="mx-auto mb-4 text-red-500" />
+      <h2 class="text-2xl font-bold mb-2">Film non trouvé</h2>
+      <p class="text-gray-400 mb-6">Nous n'avons pas pu trouver le film que vous cherchez.</p>
+      <button
+        class="px-6 py-2 bg-primary text-white font-bold rounded-md hover:bg-primary-dark transition-colors"
+        @click="navigateTo('/')"
+      >
+        Retour à l'accueil
+      </button>
+    </section>
   </section>
   </section>
 </template>
 </template>