✨ Add "trusted" and "source" to Timetable

src/views/TimetableView.vue

@@ -1,5 +1,6 @@
 <script setup>
 import {
+  timetable,
   parsedTimetable,
   classFilter,
   classList,
@@ -11,7 +12,7 @@ import { getSubstitutionColor } from "../util";
 import { computed } from "vue";
 import TimetableSetup from "../components/initial-setup.vue";
 
-const timetable = computed(() => {
+const linkedTimetable = computed(() => {
   const currentDay = parsedTimetable.value[selectedDay.value];
   if (!currentDay) return [];
   const newDay = currentDay.map((e, index) => {
@@ -59,7 +60,14 @@ function isCancelled(substitution) {
     v-model="classFilter"
   />
   <div class="timetable">
-    <template v-for="(lesson, index) in timetable" :key="index">
+    <div class="container">
+      <div class="trust-warning" v-if="!timetable.trusted">
+        <b>Warning:</b> The Data source of the Timetable data
+        <b>({{ timetable.source }})</b> is not trustworthy, which means the
+        timetable may be incorrect!
+      </div>
+    </div>
+    <template v-for="(lesson, index) in linkedTimetable" :key="index">
       <div class="lesson" :style="getSubstitutionColor(lesson.substitution)">
         <span class="hour">{{ index + 1 }}</span>
         <div class="infos">
@@ -104,6 +112,19 @@ function isCancelled(substitution) {
   padding: 0px 10px 80px 10px;
 }
 
+.container {
+  display: flex;
+  justify-content: center;
+}
+.trust-warning {
+  border: 1px solid #b71c1c;
+  background-color: #412727;
+  border-radius: 4px;
+  padding: 3px 10px;
+  margin-top: 10px;
+  width: max-content;
+}
+
 .lesson {
   display: grid;
   background-color: var(--substitution-background-unchanged);