chore: Use prettier to format code

.pre-commit-config.yaml

@@ -34,6 +34,13 @@ repos:
           - "--locale"
           - "en-GB,de-CH"
 
+  - repo: https://github.com/prettier/pre-commit
+    rev: main
+    hooks:
+      - id: prettier
+        additional_dependencies:
+          - prettier@3.5.3
+
   - repo: local
     hooks:
       - id: install-frontend

eslint.config.js

@@ -2,11 +2,13 @@ import js from "@eslint/js";
 import eslintPluginVue from "eslint-plugin-vue";
 import ts from "typescript-eslint";
 import globals from "globals";
+import prettier from "eslint-config-prettier";
 
 export default ts.config(
   js.configs.recommended,
   ...ts.configs.recommended,
   ...eslintPluginVue.configs["flat/recommended"],
+  prettier,
   {
     files: ["*.vue", "**/*.vue"],
     languageOptions: {
@@ -17,5 +19,5 @@ export default ts.config(
         ...globals.browser,
       },
     },
-  }
+  },
 );

src/components/general/ClassFilter.vue

@@ -7,33 +7,13 @@
       name="searchType"
       @change="filterTypeChanged"
     >
-      <option
-        :value="ClassSelectorColumn.Module"
-        default
-      >
-        Modul
-      </option>
-      <option
-        :value="ClassSelectorColumn.Degree"
-        default
-      >
-        Studiengang
-      </option>
-      <option :value="ClassSelectorColumn.Room">
-        Raum
-      </option>
-      <option :value="ClassSelectorColumn.Class">
-        Klasse
-      </option>
-      <option :value="ClassSelectorColumn.Lecturer">
-        Dozent
-      </option>
-      <option :value="ClassSelectorColumn.Time">
-        Zeit
-      </option>
-      <option :value="ClassSelectorColumn.TeachingType">
-        Art
-      </option>
+      <option :value="ClassSelectorColumn.Module" default>Modul</option>
+      <option :value="ClassSelectorColumn.Degree" default>Studiengang</option>
+      <option :value="ClassSelectorColumn.Room">Raum</option>
+      <option :value="ClassSelectorColumn.Class">Klasse</option>
+      <option :value="ClassSelectorColumn.Lecturer">Dozent</option>
+      <option :value="ClassSelectorColumn.Time">Zeit</option>
+      <option :value="ClassSelectorColumn.TeachingType">Art</option>
     </select>
 
     <div class="w-full justify-center">
@@ -71,12 +51,7 @@
             )
         "
       >
-        <option
-          default
-          value=""
-        >
-          Alle
-        </option>
+        <option default value="">Alle</option>
         <option
           v-for="name in classesStore.degreePrograms"
           :key="name"
@@ -92,17 +67,8 @@
         v-model="ruleset.filterData.teachingType"
         class="w-full capitalize"
       >
-        <option
-          default
-          value=""
-        >
-          Alle
-        </option>
-        <option
-          v-for="name in TeachingType"
-          :key="name"
-          :value="name"
-        >
+        <option default value="">Alle</option>
+        <option v-for="name in TeachingType" :key="name" :value="name">
           {{ name }}
         </option>
       </select>
@@ -115,13 +81,10 @@
         type="text"
         :placeholder="searchPlaceholderText"
         autocomplete="off"
-      >
+      />
     </div>
 
-    <div
-      v-if="showAddRemove"
-      class="w-32 flex justify-center items-center"
-    >
+    <div v-if="showAddRemove" class="w-32 flex justify-center items-center">
       <button
         class="action-button"
         title="Neuen Filter nach diesem einfügen"
@@ -146,7 +109,7 @@
           v-model="ruleset.enabled"
           type="checkbox"
           @change="filterEnabledClick(true)"
-        >
+        />
       </div>
     </div>
   </div>

src/components/general/ClassInfo.vue

@@ -11,11 +11,7 @@
         class="py-2 text-xl"
         icon="fa-solid fa-plus"
       />
-      <font-awesome-icon
-        v-else
-        class="py-2 text-xl"
-        icon="fa-solid fa-minus"
-      />
+      <font-awesome-icon v-else class="py-2 text-xl" icon="fa-solid fa-minus" />
     </button>
 
     <button
@@ -24,10 +20,7 @@
       :disabled="!module"
       @click="stateStore.inspectingModule = module"
     >
-      <font-awesome-icon
-        class="py-2 text-xl"
-        icon="fa-solid fa-puzzle-piece"
-      />
+      <font-awesome-icon class="py-2 text-xl" icon="fa-solid fa-puzzle-piece" />
     </button>
 
     <a
@@ -45,10 +38,7 @@
       class="action-button"
       :class="[!module ? 'action-button-disabled' : '']"
     >
-      <font-awesome-icon
-        class="py-2 text-xl"
-        icon="fa-solid fa-info"
-      />
+      <font-awesome-icon class="py-2 text-xl" icon="fa-solid fa-info" />
     </a>
 
     <a
@@ -57,10 +47,7 @@
       target="_blank"
       class="action-button"
     >
-      <font-awesome-icon
-        class="py-2 text-xl"
-        icon="fa-solid fa-file-pdf"
-      />
+      <font-awesome-icon class="py-2 text-xl" icon="fa-solid fa-file-pdf" />
     </a>
   </div>
 
@@ -75,11 +62,11 @@
             class="list-inside"
             :class="[lecturers.length > 1 ? 'list-disc' : '']"
           >
-            <li
-              v-for="lecturer in lecturers"
-              :key="lecturer.short"
-            >
-              <span><b>{{ lecturer.short }}</b>: {{ lecturer.firstname }} {{ lecturer.surname }}</span>
+            <li v-for="lecturer in lecturers" :key="lecturer.short">
+              <span
+                ><b>{{ lecturer.short }}</b
+                >: {{ lecturer.firstname }} {{ lecturer.surname }}</span
+              >
             </li>
           </ul>
         </td>
@@ -101,10 +88,7 @@
             class="list-inside"
             :class="[cls.rooms.length > 1 ? 'list-disc' : '']"
           >
-            <li
-              v-for="room in cls.rooms"
-              :key="room"
-            >
+            <li v-for="room in cls.rooms" :key="room">
               <span>{{ room }}</span>
             </li>
           </ul>
@@ -123,8 +107,10 @@
           <span>Durchführung</span>
         </td>
         <td>
-          <span v-if="cls.weekday !== null">{{ dayMap[cls.weekday] }}, {{ toTime(cls.from) }} -
-            {{ toTime(cls.to) }}</span>
+          <span v-if="cls.weekday !== null"
+            >{{ dayMap[cls.weekday] }}, {{ toTime(cls.from) }} -
+            {{ toTime(cls.to) }}</span
+          >
           <span v-else>Blockmodul</span>
         </td>
       </tr>
@@ -145,10 +131,7 @@
         </td>
       </tr>
       <tr>
-        <td
-          :colspan="moduleClasses.length == 0 ? 1 : 2"
-          class="font-bold"
-        >
+        <td :colspan="moduleClasses.length == 0 ? 1 : 2" class="font-bold">
           <span>Weitere Durchführungen</span>
         </td>
         <td>
@@ -156,10 +139,7 @@
         </td>
       </tr>
       <tr v-if="moduleClasses.length > 0">
-        <td
-          colspan="2"
-          class="pb-5"
-        >
+        <td colspan="2" class="pb-5">
           <CurrentModuleExecutions
             :module-classes="moduleClasses"
             :highlight-class="cls"
@@ -241,7 +221,7 @@ export default {
     },
     hasCompletedModule(): boolean {
       return this.studenthubStore.hasCompletedModule(
-        this.module?.module_id ?? null
+        this.module?.module_id ?? null,
       );
     },
     module(): Module | null {
@@ -252,7 +232,7 @@ export default {
       return (
         Object.values(this.module.dependencies).reduce(
           (sum, dep) => sum + dep.length,
-          0
+          0,
         ) > 0
       );
     },

src/components/general/ClassRemovedRow.vue

@@ -15,14 +15,8 @@
         :title="isOpen ? 'Schliessen' : 'Öffnen'"
         @click="isOpen = !isOpen"
       >
-        <font-awesome-icon
-          v-if="isOpen"
-          icon="fa-solid fa-chevron-down"
-        />
-        <font-awesome-icon
-          v-else
-          icon="fa-solid fa-chevron-right"
-        />
+        <font-awesome-icon v-if="isOpen" icon="fa-solid fa-chevron-down" />
+        <font-awesome-icon v-else icon="fa-solid fa-chevron-right" />
       </button>
 
       <span class="font-bold">{{ taughtClass.name }}</span>
@@ -39,35 +33,18 @@
       </span>
     </div>
 
-    <hr
-      v-if="isOpen"
-      class="-mt-2"
-    >
-    <div
-      v-if="isOpen"
-      class="bg-white dark:bg-gray-800 w-full rounded-b-lg"
-    >
-      <table
-        v-if="alternatives.length > 0"
-        class="w-full upgrade-module-table"
-      >
+    <hr v-if="isOpen" class="-mt-2" />
+    <div v-if="isOpen" class="bg-white dark:bg-gray-800 w-full rounded-b-lg">
+      <table v-if="alternatives.length > 0" class="w-full upgrade-module-table">
         <thead>
           <tr>
-            <td class="pl-5">
-              Modul
-            </td>
+            <td class="pl-5">Modul</td>
             <td>Durchführung</td>
             <td>Klasse</td>
-            <td class="hidden md:table-cell">
-              Dozent
-            </td>
-            <td class="hidden md:table-cell">
-              Raum
-            </td>
+            <td class="hidden md:table-cell">Dozent</td>
+            <td class="hidden md:table-cell">Raum</td>
             <td>Art</td>
-            <td class="hidden md:table-cell">
-              MSP
-            </td>
+            <td class="hidden md:table-cell">MSP</td>
             <td class="w-24" />
           </tr>
         </thead>

src/components/general/ClassRow.vue

@@ -1,8 +1,5 @@
 <template>
-  <tr
-    class="row"
-    :class="[rowStyling]"
-  >
+  <tr class="row" :class="[rowStyling]">
     <td @click="showModuleInformation">
       <span class="class-name">{{ cls.name }}</span>
     </td>
@@ -12,37 +9,20 @@
     <td @click="showModuleInformation">
       <span>{{ cls.class }}</span>
     </td>
-    <td
-      class="hidden md:table-cell"
-      @click="showModuleInformation"
-    >
-      <span
-        v-for="teacher in cls.teachers"
-        :key="teacher"
-        class="block"
-      >{{
+    <td class="hidden md:table-cell" @click="showModuleInformation">
+      <span v-for="teacher in cls.teachers" :key="teacher" class="block">{{
         teacher
       }}</span>
     </td>
-    <td
-      class="hidden md:table-cell"
-      @click="showModuleInformation"
-    >
-      <span
-        v-for="room in cls.rooms"
-        :key="room"
-        class="block"
-      >{{
+    <td class="hidden md:table-cell" @click="showModuleInformation">
+      <span v-for="room in cls.rooms" :key="room" class="block">{{
         room
       }}</span>
     </td>
     <td @click="showModuleInformation">
       <TeachingTypeIcon :teaching-type="cls.teaching_type" />
     </td>
-    <td
-      class="hidden xl:table-cell"
-      @click="showModuleInformation"
-    >
+    <td class="hidden xl:table-cell" @click="showModuleInformation">
       <span>{{ cls.module?.hasMSP === true ? "Ja" : "" }}</span>
     </td>
     <td class="cursor-default">
@@ -52,14 +32,8 @@
         :disabled="cls.module?.hasCompleted || cls.module?.maxAttemptsReached"
         @click="toggleClassState"
       >
-        <font-awesome-icon
-          v-if="addable"
-          icon="fa-solid fa-plus"
-        />
-        <font-awesome-icon
-          v-else
-          icon="fa-solid fa-minus"
-        />
+        <font-awesome-icon v-if="addable" icon="fa-solid fa-plus" />
+        <font-awesome-icon v-else icon="fa-solid fa-minus" />
       </button>
       <a
         title="Klassen PDF in einem neuem Tab öffnen"

src/components/general/CurrentModuleExecutionsRow.vue

@@ -3,28 +3,16 @@
     class="row"
     :class="[highlight ? 'italic bg-gray-300 dark:bg-gray-900' : '']"
   >
-    <td
-      class="cursor-pointer"
-      @click="clickedRow"
-    >
+    <td class="cursor-pointer" @click="clickedRow">
       {{ cls.executionTime }}
     </td>
-    <td
-      class="cursor-pointer"
-      @click="clickedRow"
-    >
+    <td class="cursor-pointer" @click="clickedRow">
       {{ cls.class }}
     </td>
-    <td
-      class="cursor-pointer"
-      @click="clickedRow"
-    >
+    <td class="cursor-pointer" @click="clickedRow">
       {{ cls.teachers.join(", ") }}
     </td>
-    <td
-      class="cursor-pointer"
-      @click="clickedRow"
-    >
+    <td class="cursor-pointer" @click="clickedRow">
       <span class="mr-2">{{ cls.rooms.join(", ") }}</span>
       <TeachingTypeIcon :teaching-type="cls.teaching_type" />
     </td>
@@ -35,14 +23,8 @@
         :disabled="cls.module?.hasCompleted || cls.module?.maxAttemptsReached"
         @click="toggleClassState"
       >
-        <font-awesome-icon
-          v-if="addable"
-          icon="fa-solid fa-plus"
-        />
-        <font-awesome-icon
-          v-else
-          icon="fa-solid fa-minus"
-        />
+        <font-awesome-icon v-if="addable" icon="fa-solid fa-plus" />
+        <font-awesome-icon v-else icon="fa-solid fa-minus" />
       </button>
       <a
         title="Klassen PDF in einem neuem Tab öffnen"

src/components/general/DependencyTree.vue

@@ -35,10 +35,7 @@
         {{ dep }}
       </button>
     </div>
-    <div
-      v-else
-      class="flex justify-center flex-wrap gap-3"
-    >
+    <div v-else class="flex justify-center flex-wrap gap-3">
       <span class="text-gray-500">Keine Nachfolgemodule</span>
     </div>
 
@@ -76,10 +73,7 @@
         {{ dep }}
       </button>
     </div>
-    <div
-      v-else
-      class="flex justify-center flex-wrap gap-3 mt-3"
-    >
+    <div v-else class="flex justify-center flex-wrap gap-3 mt-3">
       <span class="text-gray-500">Keine Abhängigkeiten</span>
     </div>
   </div>

src/components/general/ModuleInfo.vue

@@ -23,10 +23,7 @@
         </td>
         <td>
           <ul class="list-disc ml-4">
-            <li
-              v-for="degree in module.for_degrees"
-              :key="degree"
-            >
+            <li v-for="degree in module.for_degrees" :key="degree">
               {{ degree }}
             </li>
           </ul>
@@ -83,10 +80,7 @@
       </tr>
 
       <tr>
-        <td
-          :colspan="moduleClasses.length == 0 ? 1 : 2"
-          class="font-bold"
-        >
+        <td :colspan="moduleClasses.length == 0 ? 1 : 2" class="font-bold">
           <span>Nächste Durchführungen</span>
         </td>
         <td>
@@ -94,25 +88,19 @@
         </td>
       </tr>
       <tr v-if="moduleClasses.length > 0">
-        <td
-          colspan="2"
-          class="pb-5"
-        >
+        <td colspan="2" class="pb-5">
           <CurrentModuleExecutions :module-classes="moduleClasses" />
         </td>
       </tr>
 
       <tr>
-        <td
-          class="font-bold"
-          :colspan="previousClasses.length == 0 ? 1 : 2"
-        >
+        <td class="font-bold" :colspan="previousClasses.length == 0 ? 1 : 2">
           <button
             v-if="previousClasses.length > 0"
             class="action-button mr-2"
             :title="
               'Vergangene Durchführungen ' +
-                (showingPastClasses ? 'ausblenden' : 'einblenden')
+              (showingPastClasses ? 'ausblenden' : 'einblenden')
             "
             @click="() => (showingPastClasses = !showingPastClasses)"
           >
@@ -120,28 +108,20 @@
               v-if="showingPastClasses"
               icon="fa-solid fa-chevron-down"
             />
-            <font-awesome-icon
-              v-else
-              icon="fa-solid fa-chevron-right"
-            />
+            <font-awesome-icon v-else icon="fa-solid fa-chevron-right" />
           </button>
 
           <span>Vergangene Durchführungen</span>
-          <span
-            v-if="previousClasses.length > 0"
-            class="font-bold"
+          <span v-if="previousClasses.length > 0" class="font-bold">
+            ({{ previousClasses.length }})</span
           >
-            ({{ previousClasses.length }})</span>
         </td>
         <td>
           <span v-if="previousClasses.length == 0">Keine</span>
         </td>
       </tr>
       <tr v-if="previousClasses.length > 0 && showingPastClasses">
-        <td
-          colspan="2"
-          class="pb-5"
-        >
+        <td colspan="2" class="pb-5">
           <PreviousModuleExecutions :previous-classes="previousClasses" />
         </td>
       </tr>
@@ -222,7 +202,7 @@ export default {
   computed: {
     hasCompletedModule(): boolean {
       return this.studenthubStore.hasCompletedModule(
-        this.module?.module_id ?? null
+        this.module?.module_id ?? null,
       );
     },
     hasModuleDeps(): boolean {
@@ -230,7 +210,7 @@ export default {
       return (
         Object.values(this.module.dependencies).reduce(
           (sum, dep) => sum + dep.length,
-          0
+          0,
         ) > 0
       );
     },

src/components/general/ModulesetManager.vue

@@ -1,9 +1,6 @@
 <template>
   <div class="flex justify-center items-center">
-    <label
-      class="mr-2"
-      for="planSelector"
-    >Plan:</label>
+    <label class="mr-2" for="planSelector">Plan:</label>
     <select
       id="planSelector"
       v-model="planningStore.currentPlanName"
@@ -32,11 +29,7 @@
     >
       <font-awesome-icon icon="fa-solid fa-plus" />
     </button>
-    <button
-      title="Planung löschen"
-      class="action-button"
-      @click="deletePlan"
-    >
+    <button title="Planung löschen" class="action-button" @click="deletePlan">
       <font-awesome-icon icon="fa-solid fa-trash-can" />
     </button>
     <button
@@ -47,9 +40,7 @@
       <font-awesome-icon icon="fa-solid fa-share" />
     </button>
 
-    <div class="ml-2 border-l border-gray-500 h-full">
-&nbsp;
-    </div>
+    <div class="ml-2 border-l border-gray-500 h-full">&nbsp;</div>
 
     <button
       title="Alle Module durchsuchen"
@@ -67,7 +58,7 @@
       <font-awesome-icon icon="fa-solid fa-cog" />
     </button>
   </div>
-  <hr class="my-2 border-gray-300 dark:border-zinc-600">
+  <hr class="my-2 border-gray-300 dark:border-zinc-600" />
 
   <ModuleSetEdit
     :moduleset-name="editingModuleSet"

src/components/general/NumberedPagination.vue

@@ -28,7 +28,8 @@
           <span
             v-if="idx == null"
             class="px-3 md:px-4 text-gray-600 dark:text-gray-400"
-          >&middot;&middot;&middot;</span>
+            >&middot;&middot;&middot;</span
+          >
           <!-- class="cursor-pointer py-1.5 px-3 md:px-4 rounded-sm border-0 outline-hidden transition-all duration-300 hover:bg-gray-200 dark:hover:bg-gray-700 focus:shadow-none" -->
           <button
             v-else

src/components/general/OrderingControl.vue

@@ -1,23 +1,19 @@
 <template>
-  <div
-    class="w-full text-center cursor-pointer"
-    @click="nextOrdering"
-  >
-    <span>{{ title }}
+  <div class="w-full text-center cursor-pointer" @click="nextOrdering">
+    <span
+      >{{ title }}
       <span class="ml-2 w-10">
         <font-awesome-icon
           v-if="ordering == Ordering.None"
           class="text-gray-400"
-          icon="fa-solid fa-sort"
-        />
+          icon="fa-solid fa-sort" />
         <font-awesome-icon
           v-if="ordering == Ordering.Asc"
-          icon="fa-solid fa-sort-up"
-        />
+          icon="fa-solid fa-sort-up" />
         <font-awesome-icon
           v-if="ordering == Ordering.Desc"
-          icon="fa-solid fa-sort-down"
-        /></span></span>
+          icon="fa-solid fa-sort-down" /></span
+    ></span>
   </div>
 </template>
 

src/components/general/PreviousModuleExecutionsRow.vue

@@ -1,12 +1,6 @@
 <template>
-  <tr
-    v-if="additionalSpacing"
-    class="border-b-2"
-  >
-    <td
-      colspan="5"
-      class="pt-4"
-    >
+  <tr v-if="additionalSpacing" class="border-b-2">
+    <td colspan="5" class="pt-4">
       <span class="font-black">{{ cls.semester }}</span>
     </td>
   </tr>

src/components/general/WeekdayTimePicker.vue

@@ -1,12 +1,7 @@
 <template>
   <div class="flex gap-2">
-    <select
-      v-model="weekday"
-      @change="emitChange"
-    >
-      <option :value="null">
-        -
-      </option>
+    <select v-model="weekday" @change="emitChange">
+      <option :value="null">-</option>
       <option
         v-for="(wd, key) in dayMap"
         :key="key"
@@ -16,11 +11,7 @@
         {{ wd }}
       </option>
     </select>
-    <input
-      v-model="time"
-      type="time"
-      @change="emitChange"
-    >
+    <input v-model="time" type="time" @change="emitChange" />
   </div>
 </template>
 

src/components/layout/HeaderBar.vue

@@ -7,11 +7,15 @@
         width="45"
         height="45"
         class="mr-3 inline"
-      >
+      />
       <div>
-        <span class="font-bold text-2xl block">{{ SCHOOL_NAME }} Modulplaner</span>
-        <span class="text-xs text-gray-400 block">Made with <font-awesome-icon icon="fa-solid fa-heart" /> by Sean
-          Blackburn</span>
+        <span class="font-bold text-2xl block"
+          >{{ SCHOOL_NAME }} Modulplaner</span
+        >
+        <span class="text-xs text-gray-400 block"
+          >Made with <font-awesome-icon icon="fa-solid fa-heart" /> by Sean
+          Blackburn</span
+        >
       </div>
     </div>
   </div>
@@ -36,11 +40,15 @@
         width="42"
         height="42"
         class="mr-3"
-      >
+      />
       <div class="hidden md:block">
-        <span class="font-bold text-2xl block">{{ SCHOOL_NAME }} Modulplaner</span>
-        <span class="text-xs text-gray-400 block">Made with <font-awesome-icon icon="fa-solid fa-heart" /> by Sean
-          Blackburn</span>
+        <span class="font-bold text-2xl block"
+          >{{ SCHOOL_NAME }} Modulplaner</span
+        >
+        <span class="text-xs text-gray-400 block"
+          >Made with <font-awesome-icon icon="fa-solid fa-heart" /> by Sean
+          Blackburn</span
+        >
       </div>
     </div>
 
@@ -53,7 +61,8 @@
           target="_blank"
           rel="noreferrer noopener"
           :href="URLS.GITLAB_REPO_TICKET"
-        >Ticket</a>
+          >Ticket</a
+        >
       </p>
       <p>
         <span class="hidden md:inline">PDF Version:</span>
@@ -77,25 +86,23 @@
                 : 'Aktuellste Version'
             "
             @click="showClassUpgrader"
-          >{{ currentVersionStr }}
+            >{{ currentVersionStr }}
           </span>
           <template #content>
             <span
               v-if="!classVersionStore.isLatestSemesterVersion"
               class="p-3 m-2 font-bold block dark:bg-orange-700 bg-orange-500 text-white rounded-md cursor-pointer"
               @click="showClassUpgrader"
-            >Veraltete Stundenplan-Version!</span>
-            Export: {{ configStore.config.export_date }}<br>
+              >Veraltete Stundenplan-Version!</span
+            >
+            Export: {{ configStore.config.export_date }}<br />
             Parse: {{ configStore.config.parse_date }}
           </template>
         </Popper>
       </p>
     </div>
 
-    <div
-      class="flex items-center justify-end"
-      style="width: 42px"
-    >
+    <div class="flex items-center justify-end" style="width: 42px">
       <AdditionalInfo />
     </div>
   </div>

src/components/modals/AdditionalInfo.vue

@@ -1,12 +1,6 @@
 <template>
-  <button
-    class="text-gray-200"
-    @click="toggleVisibility"
-  >
-    <font-awesome-icon
-      icon="fa-solid fa-bars"
-      class="text-2xl"
-    />
+  <button class="text-gray-200" @click="toggleVisibility">
+    <font-awesome-icon icon="fa-solid fa-bars" class="text-2xl" />
   </button>
 
   <RightDrawer
@@ -20,44 +14,24 @@
         width="35"
         height="35"
         class="mr-3"
-      >
-      <h1 class="text-3xl font-bold">
-        Modulplaner
-      </h1>
+      />
+      <h1 class="text-3xl font-bold">Modulplaner</h1>
     </div>
 
     <div class="mt-5">
-      <h2 class="text-2xl mb-2 mr-5">
-        Ansicht
-      </h2>
+      <h2 class="text-2xl mb-2 mr-5">Ansicht</h2>
       <div class="flex gap-4">
-        <router-link
-          to="/"
-          class="view-button"
-          @click="toggleVisibility"
-        >
-          <font-awesome-icon
-            class="text-2xl"
-            icon="fa-solid fa-calendar-day"
-          />
+        <router-link to="/" class="view-button" @click="toggleVisibility">
+          <font-awesome-icon class="text-2xl" icon="fa-solid fa-calendar-day" />
         </router-link>
-        <router-link
-          to="/tree"
-          class="view-button"
-          @click="toggleVisibility"
-        >
-          <font-awesome-icon
-            class="text-2xl"
-            icon="fa-solid fa-sitemap"
-          />
+        <router-link to="/tree" class="view-button" @click="toggleVisibility">
+          <font-awesome-icon class="text-2xl" icon="fa-solid fa-sitemap" />
         </router-link>
       </div>
     </div>
 
     <div class="mt-5">
-      <h2 class="text-2xl">
-        Quick-links
-      </h2>
+      <h2 class="text-2xl">Quick-links</h2>
       <ul class="list-disc ml-7 my-1">
         <li>
           <a
@@ -66,11 +40,11 @@
             :href="URLS.ALL_TIMETABLES"
             target="_blank"
             rel="noreferrer noopener"
-          >Stundenpläne
+            >Stundenpläne
             <font-awesome-icon
               class="ml-2"
               icon="fa-solid fa-arrow-up-right-from-square"
-            /></a>
+          /></a>
         </li>
         <li>
           <a
@@ -79,11 +53,11 @@
             :href="URLS.STUDENTHUB"
             target="_blank"
             rel="noreferrer noopener"
-          >Studenthub
+            >Studenthub
             <font-awesome-icon
               class="ml-2"
               icon="fa-solid fa-arrow-up-right-from-square"
-            /></a>
+          /></a>
         </li>
         <li>
           <a
@@ -92,19 +66,17 @@
             :href="URLS.MODULE_SIGNUP"
             target="_blank"
             rel="noreferrer noopener"
-          >ESPortal
+            >ESPortal
             <font-awesome-icon
               class="ml-2"
               icon="fa-solid fa-arrow-up-right-from-square"
-            /></a>
+          /></a>
         </li>
       </ul>
     </div>
 
     <div class="mt-10">
-      <h2 class="text-2xl">
-        Über
-      </h2>
+      <h2 class="text-2xl">Über</h2>
       <p class="text-gray-600 dark:text-gray-400 py-1">
         Der Modulplaner ist ein privat entwickeltes Projekt. Es haben diverse
         Studenten sowie Dozenten zum Inhalt dieser Seite beigetragen -
@@ -113,15 +85,11 @@
       <table class="w-full">
         <tbody>
           <tr>
-            <td class="font-bold">
-              Entwicklung
-            </td>
+            <td class="font-bold">Entwicklung</td>
             <td>Sean Blackburn</td>
           </tr>
           <tr>
-            <td class="font-bold">
-              Icon
-            </td>
+            <td class="font-bold">Icon</td>
             <td>Claire Smits</td>
           </tr>
         </tbody>
@@ -129,18 +97,14 @@
     </div>
 
     <div class="mt-10">
-      <h2 class="text-2xl inline-block mr-5">
-        Mitentwickeln
-      </h2>
+      <h2 class="text-2xl inline-block mr-5">Mitentwickeln</h2>
       <a
         title="Modulplaner GitLab Repo"
         :href="URLS.GITLAB_REPO"
         target="_blank"
         rel="noreferrer noopener"
         class="text-orange-600 hover:text-orange-400 transition-all duration-200"
-      ><font-awesome-icon
-        icon="fa-brands fa-gitlab"
-        class="text-2xl"
+        ><font-awesome-icon icon="fa-brands fa-gitlab" class="text-2xl"
       /></a>
       <p class="text-gray-600 dark:text-gray-400 py-1">
         Der Modulplaner ist ein open-source Projekt, welches unter der
@@ -153,11 +117,11 @@
         :href="URLS.GITLAB_REPO"
         target="_blank"
         rel="noreferrer noopener"
-      >GitLab Repo
+        >GitLab Repo
         <font-awesome-icon
           class="ml-2"
           icon="fa-solid fa-arrow-up-right-from-square"
-        /></a>
+      /></a>
     </div>
 
     <div class="mt-10 hidden">
@@ -165,7 +129,7 @@
         class="action-button mr-2"
         :title="
           'Stundenplanänderungen ' +
-            (showingTimetableChanges ? 'ausblenden' : 'einblenden')
+          (showingTimetableChanges ? 'ausblenden' : 'einblenden')
         "
         @click="() => (showingTimetableChanges = !showingTimetableChanges)"
       >
@@ -173,21 +137,12 @@
           v-if="showingTimetableChanges"
           icon="fa-solid fa-chevron-down"
         />
-        <font-awesome-icon
-          v-else
-          icon="fa-solid fa-chevron-right"
-        />
+        <font-awesome-icon v-else icon="fa-solid fa-chevron-right" />
       </button>
 
-      <h2 class="text-2xl inline-block mb-2">
-        Stundenplanänderungen
-      </h2>
+      <h2 class="text-2xl inline-block mb-2">Stundenplanänderungen</h2>
 
-      <div
-        v-if="showingTimetableChanges"
-        id="timetable-changelog"
-        class="ml-5"
-      >
+      <div v-if="showingTimetableChanges" id="timetable-changelog" class="ml-5">
         <div
           v-for="entry in timetableChangelog.reverse()"
           :key="entry.name"
@@ -210,7 +165,7 @@
         class="action-button mr-2"
         :title="
           'Stundenplanänderungen ' +
-            (showingChangelog ? 'ausblenden' : 'einblenden')
+          (showingChangelog ? 'ausblenden' : 'einblenden')
         "
         @click="() => (showingChangelog = !showingChangelog)"
       >
@@ -218,14 +173,9 @@
           v-if="showingChangelog"
           icon="fa-solid fa-chevron-down"
         />
-        <font-awesome-icon
-          v-else
-          icon="fa-solid fa-chevron-right"
-        />
+        <font-awesome-icon v-else icon="fa-solid fa-chevron-right" />
       </button>
-      <h2 class="text-2xl inline-block mb-2">
-        Changelog
-      </h2>
+      <h2 class="text-2xl inline-block mb-2">Changelog</h2>
 
       <!-- eslint-disable vue/no-v-html -->
       <div

src/components/modals/BaseModal.vue

@@ -26,11 +26,7 @@
           data-name="modal"
         >
           <div class="bg-white dark:bg-gray-800 px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
-            <button
-              title="Schliessen"
-              class="close-button"
-              @click="close()"
-            >
+            <button title="Schliessen" class="close-button" @click="close()">
               <font-awesome-icon icon="fa-solid fa-xmark" />
             </button>
 

src/components/modals/ClassModuleDetails.vue

@@ -1,8 +1,5 @@
 <template>
-  <BaseModal
-    :show="isInspecting"
-    @close="close"
-  >
+  <BaseModal :show="isInspecting" @close="close">
     <h3 class="text-lg font-medium leading-6 text-gray-900 dark:text-white">
       <span class="font-bold text-3xl mr-5 block">{{
         module?.short ?? insCls?.name ?? "-"
@@ -10,33 +7,28 @@
       <span class="font-light">{{ module?.name ?? "-" }}</span>
     </h3>
 
-    <ModuleInfo
-      v-if="insModule !== null"
-      :module="insModule"
-    />
-    <ClassInfo
-      v-else-if="insCls"
-      :cls="insCls"
-    />
-    <div
-      v-else
-      class="my-10 mx-5 text-center"
-    >
-      <span class="inline-block">Well, something went wrong here :S And the error message isn't even in
-        German! Heeeeeelp!</span>
-      <span class="pt-5 inline-block">Or you could just open a ticket, as you should never see this message
-        :)</span>
+    <ModuleInfo v-if="insModule !== null" :module="insModule" />
+    <ClassInfo v-else-if="insCls" :cls="insCls" />
+    <div v-else class="my-10 mx-5 text-center">
+      <span class="inline-block"
+        >Well, something went wrong here :S And the error message isn't even in
+        German! Heeeeeelp!</span
+      >
+      <span class="pt-5 inline-block"
+        >Or you could just open a ticket, as you should never see this message
+        :)</span
+      >
       <a
         title="Modulplaner GitLab Repo"
         :href="URLS.GITLAB_REPO_TICKET"
         target="_blank"
         rel="noreferrer noopener"
         class="external-link mt-5 inline-block"
-      >Open a new ticket here
+        >Open a new ticket here
         <font-awesome-icon
           class="ml-2"
           icon="fa-solid fa-arrow-up-right-from-square"
-        /></a>
+      /></a>
     </div>
 
     <DependencyTree

src/components/modals/ClassUpdateModal.vue

@@ -1,15 +1,10 @@
 <template>
-  <BaseModal
-    :show="stateStore.showingClassUpgradeModal"
-    @close="close"
-  >
+  <BaseModal :show="stateStore.showingClassUpgradeModal" @close="close">
     <h1 class="text-3xl font-bold leading-6 text-gray-900 dark:text-white">
       Planungs-Update
     </h1>
 
-    <p class="my-9">
-      Es gibt ein neues Update für deine Planung.
-    </p>
+    <p class="my-9">Es gibt ein neues Update für deine Planung.</p>
 
     <div class="w-full flex justify-center my-9">
       <h1
@@ -17,16 +12,18 @@
       >
         <span
           class="bg-orange-300 dark:bg-orange-600 rounded-md sm:rounded-xl py-2 px-2 sm:px-5"
-        >{{ classVersionStore.semester }} /
-          {{ classVersionStore.version }}</span>
+          >{{ classVersionStore.semester }} /
+          {{ classVersionStore.version }}</span
+        >
         <font-awesome-icon
           class="px-5 sm:px-5"
           icon="fa-solid fa-arrow-right"
         />
         <span
           class="bg-blue-300 dark:bg-blue-600 rounded-md sm:rounded-xl py-2 px-2 sm:px-5"
-        >{{ classVersionStore.latestSemester?.semester }} /
-          {{ classVersionStore.latestSemester?.versions[0] }}</span>
+          >{{ classVersionStore.latestSemester?.semester }} /
+          {{ classVersionStore.latestSemester?.versions[0] }}</span
+        >
       </h1>
     </div>
 
@@ -44,11 +41,12 @@
             v-model="doNotRemindState"
             type="checkbox"
             class="w-auto inline mr-2 cursor-pointer"
-          >
+          />
           <label
             class="text-gray-500 select-none cursor-pointer"
             for="do-not-remind-me-upgrade"
-          >Nicht mehr erinnern</label>
+            >Nicht mehr erinnern</label
+          >
         </div>
 
         <button

src/components/modals/ModuleSearchModal.vue

@@ -1,8 +1,5 @@
 <template>
-  <RightDrawer
-    :show="stateStore.showingModuleSearch"
-    @close="close"
-  >
+  <RightDrawer :show="stateStore.showingModuleSearch" @close="close">
     <h3 class="text-lg font-medium leading-6 text-gray-900 dark:text-white">
       <span class="font-bold text-3xl mr-5 block">Modulsuche</span>
     </h3>
@@ -48,10 +45,7 @@
         class="scale-90 sm:scale-75"
       />
     </div>
-    <div
-      v-else
-      class="w-full text-center text-gray-500"
-    >
+    <div v-else class="w-full text-center text-gray-500">
       <span>Leider keine Module gefunden!</span>
     </div>
   </RightDrawer>

src/components/modals/ModulesetEdit.vue

@@ -1,8 +1,5 @@
 <template>
-  <BaseModal
-    :show="shouldShow"
-    @close="close(null)"
-  >
+  <BaseModal :show="shouldShow" @close="close(null)">
     <h3 class="text-lg font-medium leading-6 text-gray-900 dark:text-white">
       <span class="font-bold text-3xl mr-5 block">{{
         isNew ? "Neue Modulplanung" : "Modulplanung bearbeiten"
@@ -10,17 +7,14 @@
     </h3>
 
     <div class="mt-5">
-      <label
-        for="calendarSetName"
-        class="text-lg mr-5 w-full"
-      >Name: </label>
+      <label for="calendarSetName" class="text-lg mr-5 w-full">Name: </label>
       <input
         id="calendarSetName"
         v-model="currentName"
         type="text"
         class="w-full mb-5"
         autofocus
-      >
+      />
     </div>
 
     <div class="flex w-2/3 float-right justify-end my-5">

src/components/modals/OldSemesterReminderModal.vue

@@ -1,8 +1,5 @@
 <template>
-  <BaseModal
-    :show="stateStore.showingOldPlanReminderModal"
-    @close="close"
-  >
+  <BaseModal :show="stateStore.showingOldPlanReminderModal" @close="close">
     <h1 class="text-3xl font-bold leading-6 text-gray-900 dark:text-white">
       Altes Semester
     </h1>
@@ -10,7 +7,8 @@
     <p class="mt-10 mb-10">
       Deine Planung liegt in einem vergangenen Semester (<span
         class="font-bold"
-      >{{ classesVersionStore.semester }}</span>)!
+        >{{ classesVersionStore.semester }}</span
+      >)!
     </p>
 
     <p class="mt-10 mb-10">
@@ -27,10 +25,7 @@
     </p>
 
     <div class="flex justify-end mt-10 gap-4">
-      <button
-        class="bg-green-500 text-white py-2 px-5 rounded"
-        @click="close"
-      >
+      <button class="bg-green-500 text-white py-2 px-5 rounded" @click="close">
         Verstanden
       </button>
     </div>

src/components/modals/PersonalEventEdit.vue

@@ -5,9 +5,7 @@ import BaseModal from './BaseModal.vue';
     :show="stateStore.inspectingPersonalEvent != null"
     @close="stateStore.inspectingPersonalEvent = null"
   >
-    <h1 class="text-3xl mb-5">
-      Persönlicher Event
-    </h1>
+    <h1 class="text-3xl mb-5">Persönlicher Event</h1>
 
     <form
       @submit.prevent="updateEntry"
@@ -20,30 +18,19 @@ import BaseModal from './BaseModal.vue';
           type="text"
           placeholder="Verein, Musik, ..."
           required
-        >
+        />
       </div>
 
       <div class="mb-5">
         <label>ECTS</label>
-        <input
-          v-model="ects"
-          type="number"
-          required
-        >
+        <input v-model="ects" type="number" required />
       </div>
 
       <div class="flex items-end w-full gap-4">
         <div class="w-2/3">
           <label>Wochentag</label>
-          <select
-            v-model="weekday"
-            class="h-10 w-full"
-          >
-            <option
-              v-for="(day, idx) in dayMap"
-              :key="day"
-              :value="idx"
-            >
+          <select v-model="weekday" class="h-10 w-full">
+            <option v-for="(day, idx) in dayMap" :key="day" :value="idx">
               {{ day }}
             </option>
           </select>
@@ -51,12 +38,7 @@ import BaseModal from './BaseModal.vue';
 
         <div class="w-2/3">
           <label>Von</label>
-          <input
-            v-model="from"
-            type="time"
-            class="h-10"
-            required
-          >
+          <input v-model="from" type="time" class="h-10" required />
         </div>
 
         <div class="w-2/3">
@@ -67,7 +49,7 @@ import BaseModal from './BaseModal.vue';
             class="h-10"
             required
             :class="[toTimeValid ? '' : 'border-red-500']"
-          >
+          />
         </div>
       </div>
 
@@ -83,7 +65,7 @@ import BaseModal from './BaseModal.vue';
           type="submit"
           class="bg-green-500 text-white py-2 px-5 rounded-sm active:bg-green-600"
           :value="isNew ? 'Einfügen' : 'Speichern'"
-        >
+        />
       </div>
     </form>
   </BaseModal>

src/components/modals/RightDrawer.vue

@@ -23,11 +23,7 @@
       tabindex="-1"
     >
       <div class="flex-grow p-4 overflow-y-auto">
-        <button
-          title="Schliessen"
-          class="close-button"
-          @click="close()"
-        >
+        <button title="Schliessen" class="close-button" @click="close()">
           <font-awesome-icon icon="fa-solid fa-xmark" />
         </button>
 

src/components/modals/SettingsModal.vue

@@ -1,21 +1,13 @@
 <template>
-  <BaseModal
-    :show="stateStore.showingSettings"
-    @close="close"
-  >
+  <BaseModal :show="stateStore.showingSettings" @close="close">
     <h1 class="text-3xl font-bold leading-6 text-gray-900 dark:text-white">
       Einstellungen
     </h1>
 
-    <h2 class="mt-5 text-lg font-bold">
-      Klassen PDF Version
-    </h2>
+    <h2 class="mt-5 text-lg font-bold">Klassen PDF Version</h2>
 
     <div>
-      <select
-        ref="classVersionSelect"
-        v-model="selectedClassVersion"
-      >
+      <select ref="classVersionSelect" v-model="selectedClassVersion">
         <option
           v-for="ver in semesterVersions"
           :key="ver.key.join('/')"
@@ -27,20 +19,21 @@
       </select>
     </div>
 
-    <h2 class="mt-5 text-lg font-bold">
-      Studenthub
-    </h2>
+    <h2 class="mt-5 text-lg font-bold">Studenthub</h2>
 
     <div>
       <ul class="text-gray-600 dark:text-gray-400 list-decimal ml-5 md:ml-0">
         <li>
           Um die Studenthub-Daten zu verwenden, musst du dich zuerst einloggen
-          <span class="italic">(auch wenn der Modulteppich für dich noch nicht funktioniert)</span>:
+          <span class="italic"
+            >(auch wenn der Modulteppich für dich noch nicht funktioniert)</span
+          >:
           <span
             class="external-link"
             @click="openURLInNewWindow('https://studenthub.technik.fhnw.ch/')"
-          >Login
-            <font-awesome-icon icon="fa-solid fa-arrow-up-right-from-square" /></span>
+            >Login
+            <font-awesome-icon icon="fa-solid fa-arrow-up-right-from-square"
+          /></span>
         </li>
         <li>
           Danach kann die Ausgabe der APIs jeweils in das textfeld darunter
@@ -58,7 +51,7 @@
           type="checkbox"
           class="inline w-auto ml-2"
           :disabled="!studenthubStore.hasSomeStudenthubData"
-        >
+        />
       </div>
 
       <div class="mb-1">
@@ -70,8 +63,9 @@
               'https://studenthub.technik.fhnw.ch/api/studenthub/student',
             )
           "
-        >API öffnen
-          <font-awesome-icon icon="fa-solid fa-arrow-up-right-from-square" /></span>
+          >API öffnen
+          <font-awesome-icon icon="fa-solid fa-arrow-up-right-from-square"
+        /></span>
       </div>
       <textarea
         :onchange="studenthubStudentChanged"
@@ -95,8 +89,9 @@
               'https://studenthub.technik.fhnw.ch/api/studenthub/anmeldungen',
             )
           "
-        >API öffnen
-          <font-awesome-icon icon="fa-solid fa-arrow-up-right-from-square" /></span>
+          >API öffnen
+          <font-awesome-icon icon="fa-solid fa-arrow-up-right-from-square"
+        /></span>
       </div>
       <textarea
         :onchange="studenthubApplicationsChanged"

src/components/pages/404Page.vue

@@ -5,7 +5,9 @@
         <h1 class="text-3xl font-extrabold">
           You found the swallow that carries coconuts!
         </h1>
-        <span class="text-gray-500">But probably not the page you are looking for...</span>
+        <span class="text-gray-500"
+          >But probably not the page you are looking for...</span
+        >
       </div>
       <a
         href="https://www.youtube.com/watch?v=w8Rn_f75UHs"
@@ -19,20 +21,14 @@
           width="300"
           height="500"
           class="mb-10 mx-auto"
-        >
+        />
       </a>
       <h1 class="mx-10 md:text-2xl font-medium mb-10">
         {{ randomQuote }}
       </h1>
-      <router-link
-        class="action-button text-xl"
-        to="/"
-      >
+      <router-link class="action-button text-xl" to="/">
         Zum Modulplaner
-        <font-awesome-icon
-          class="ml-2"
-          icon="fa-solid fa-arrow-right"
-        />
+        <font-awesome-icon class="ml-2" icon="fa-solid fa-arrow-right" />
       </router-link>
     </div>
   </div>

src/components/pages/PlannerPage.vue

@@ -24,8 +24,10 @@
   <!-- <HelpWantedModal /> -->
 
   <div class="visible-in-print w-full text-center">
-    <span>Diese Planung basiert auf dem `{{ configStore.config.pdf_version }}`
-      Klassen PDF</span><br>
+    <span
+      >Diese Planung basiert auf dem `{{ configStore.config.pdf_version }}`
+      Klassen PDF</span
+    ><br />
   </div>
 </template>
 

src/components/views/CalendarView.vue

@@ -1,14 +1,8 @@
 <template>
-  <div
-    v-if="planningStore.usingModulesFromURL"
-    class="grid grid-cols-3 mb-5"
-  >
+  <div v-if="planningStore.usingModulesFromURL" class="grid grid-cols-3 mb-5">
     <div />
     <div class="text-center">
-      <h1
-        v-if="planningStore.sharedDisplayName"
-        class="text-3xl font-bold"
-      >
+      <h1 v-if="planningStore.sharedDisplayName" class="text-3xl font-bold">
         {{ planningStore.sharedDisplayName }}
       </h1>
     </div>
@@ -29,24 +23,12 @@
       <tbody>
         <tr class="border-t">
           <td class="border-x w-14 md:w-20 bg-gray-300 dark:bg-gray-800" />
-          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">
-            Mo
-          </td>
-          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">
-            Di
-          </td>
-          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">
-            Mi
-          </td>
-          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">
-            Do
-          </td>
-          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">
-            Fr
-          </td>
-          <td class="border-r w-1/7 bg-gray-200 dark:bg-gray-700">
-            Sa
-          </td>
+          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">Mo</td>
+          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">Di</td>
+          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">Mi</td>
+          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">Do</td>
+          <td class="border-r w-1/7 bg-gray-300 dark:bg-gray-800">Fr</td>
+          <td class="border-r w-1/7 bg-gray-200 dark:bg-gray-700">Sa</td>
         </tr>
       </tbody>
     </table>
@@ -60,8 +42,8 @@
             <table class="w-full">
               <tr
                 v-for="row in planningStore.hourEnd -
-                  planningStore.hourStart +
-                  1"
+                planningStore.hourStart +
+                1"
                 :key="`hours-row-${row}`"
                 class="border-t"
               >
@@ -79,7 +61,8 @@
                         2,
                         "0",
                       )
-                    }}:00</span>
+                    }}:00</span
+                  >
                 </td>
               </tr>
             </table>
@@ -93,7 +76,7 @@
                     v-for="row in (planningStore.hourEnd -
                       planningStore.hourStart +
                       1) *
-                      planningStore.hourDivisions"
+                    planningStore.hourDivisions"
                     :key="`timecell-row-${row}`"
                     class="border-t"
                   >
@@ -157,7 +140,7 @@
                               <p
                                 v-if="
                                   ce.taughtClass.teaching_type ==
-                                    TeachingType.Online
+                                  TeachingType.Online
                                 "
                               >
                                 <TeachingTypeIcon
@@ -207,7 +190,8 @@
                   top: 3%;
                   transform: translate(-50%, -50%);
                 "
-              >{{ classVersionStore.semester }}</span>
+                >{{ classVersionStore.semester }}</span
+              >
             </div>
           </td>
         </tr>
@@ -228,53 +212,45 @@
       </div>
 
       <div>
-        <Popper
-          :arrow="true"
-          :hover="true"
-        >
-          <span class="mr-5 cursor-help">MSP: {{ planningStore.modulesWithMSP.length }}</span>
+        <Popper :arrow="true" :hover="true">
+          <span class="mr-5 cursor-help"
+            >MSP: {{ planningStore.modulesWithMSP.length }}</span
+          >
           <template #content>
             Module mit einer MSP:
             <ul
               v-if="planningStore.modulesWithMSP.length > 0"
               class="list-disc list-inside ml-5"
             >
-              <li
-                v-for="mod in planningStore.modulesWithMSP"
-                :key="mod.short"
-              >
-                <span class="font-bold">{{ mod.short }}</span>:
+              <li v-for="mod in planningStore.modulesWithMSP" :key="mod.short">
+                <span class="font-bold">{{ mod.short }}</span
+                >:
                 <span class="text-gray-700 dark:text-gray-300">{{
                   mod.name
                 }}</span>
               </li>
             </ul>
-            <span
-              v-else
-              class="font-bold block text-center mt-3"
-            >Keine 🎉</span>
+            <span v-else class="font-bold block text-center mt-3"
+              >Keine 🎉</span
+            >
           </template>
         </Popper>
 
-        <Popper
-          :arrow="true"
-          :hover="true"
-        >
+        <Popper :arrow="true" :hover="true">
           <span
             class="cursor-help"
             :class="[hasUnsureModules ? 'text-red-500' : '']"
-          >ECTS:
+            >ECTS:
             {{
               (hasUnsureModules ? "~" : "") + planningStore.totalECTSCount.ects
-            }}</span>
+            }}</span
+          >
           <template #content>
             <table class="ml-2">
               <tbody>
                 <tr>
                   <td />
-                  <td class="float-right font-bold">
-                    ECTS
-                  </td>
+                  <td class="float-right font-bold">ECTS</td>
                 </tr>
                 <tr>
                   <td><span class="font-bold mr-5">VT Klassen</span></td>
@@ -319,16 +295,10 @@
               </tbody>
             </table>
 
-            <div
-              v-if="hasUnsureModules"
-              class="mt-5"
-            >
+            <div v-if="hasUnsureModules" class="mt-5">
               <span>Die folgenden Module haben keine Credits eingetragen:</span>
               <ul class="list-disc list-inside ml-5">
-                <li
-                  v-for="m in unsureModules"
-                  :key="m"
-                >
+                <li v-for="m in unsureModules" :key="m">
                   {{ m }}
                 </li>
               </ul>
@@ -338,10 +308,7 @@
 
         <Popper :arrow="true">
           <div class="ml-4">
-            <button
-              title="Module hervorheben"
-              class="action-button"
-            >
+            <button title="Module hervorheben" class="action-button">
               <font-awesome-icon icon="fa-solid fa-eye" />
             </button>
           </div>
@@ -355,7 +322,7 @@
                   v-model="stateStore.highlightBBModules"
                   class="inline-block w-auto mr-2"
                   type="checkbox"
-                >
+                />
                 <label for="only-bb-modules">BB Module</label>
               </li>
               <li>
@@ -364,7 +331,7 @@
                   v-model="stateStore.highlightVTModules"
                   class="inline-block w-auto mr-2"
                   type="checkbox"
-                >
+                />
                 <label for="only-vt-modules">VT Module</label>
               </li>
               <li>
@@ -373,7 +340,7 @@
                   v-model="stateStore.highlightContextModules"
                   class="inline-block w-auto mr-2"
                   type="checkbox"
-                >
+                />
                 <label for="only-context-modules">Kontext Module</label>
               </li>
               <li>
@@ -382,8 +349,10 @@
                   v-model="stateStore.highlightFirstPhaseModules"
                   class="inline-block w-auto mr-2"
                   type="checkbox"
+                />
+                <label for="only-first-phase-modules"
+                  >Module der 1. Einschreibphase</label
                 >
-                <label for="only-first-phase-modules">Module der 1. Einschreibphase</label>
               </li>
               <li>
                 <input
@@ -391,7 +360,7 @@
                   v-model="stateStore.highlightEnglishModules"
                   class="inline-block w-auto mr-2"
                   type="checkbox"
-                >
+                />
                 <label for="only-english-modules">Module in Englisch</label>
               </li>
               <li>
@@ -400,7 +369,7 @@
                   v-model="stateStore.highlightMSPModules"
                   class="inline-block w-auto mr-2"
                   type="checkbox"
-                >
+                />
                 <label for="only-msp-modules">Module mit MSP</label>
               </li>
             </ul>
@@ -414,9 +383,7 @@
     v-if="planningStore.eventsByDay[BLOCKCOURSE_DAY_IDX].length > 0"
     class="mt-5"
   >
-    <h2 class="font-bold text-xl mb-2">
-      Blockmodule
-    </h2>
+    <h2 class="font-bold text-xl mb-2">Blockmodule</h2>
     <div class="flex flex-wrap gap-3">
       <div
         v-for="ce in planningStore.eventsByDay[BLOCKCOURSE_DAY_IDX]"
@@ -435,17 +402,12 @@
               {{ ce.taughtClass.name }}
             </p>
             <p>{{ ce.taughtClass.class }}</p>
-            <p
-              class="absolute right-2 bottom-1 font-bold"
-              title="MSP"
-            >
+            <p class="absolute right-2 bottom-1 font-bold" title="MSP">
               {{ ce.taughtClass.module?.hasMSP ? "M" : "" }}
             </p>
           </div>
         </div>
-        <div v-else>
-          Invalid
-        </div>
+        <div v-else>Invalid</div>
       </div>
     </div>
   </div>

src/components/views/ClassUpdateView.vue

@@ -1,7 +1,5 @@
 <template>
-  <h1 class="text-3xl font-bold">
-    Stundenplanänderung
-  </h1>
+  <h1 class="text-3xl font-bold">Stundenplanänderung</h1>
 
   <div class="w-full flex justify-center py-12">
     <h1
@@ -10,10 +8,7 @@
       <span class="bg-orange-300 dark:bg-orange-600 rounded-xl py-2 px-5">{{
         changes?.oldVersion
       }}</span>
-      <font-awesome-icon
-        class="px-5 md:px-12"
-        icon="fa-solid fa-arrow-right"
-      />
+      <font-awesome-icon class="px-5 md:px-12" icon="fa-solid fa-arrow-right" />
       <span class="bg-blue-300 dark:bg-blue-600 rounded-xl py-2 px-5">{{
         changes?.newVersion
       }}</span>
@@ -21,13 +16,8 @@
   </div>
 
   <div v-if="changes && hasChanges">
-    <div
-      v-if="changes.removals.length > 0"
-      class="mb-5"
-    >
-      <h2 class="text-xl font-bold mb-2">
-        Moduländerungen
-      </h2>
+    <div v-if="changes.removals.length > 0" class="mb-5">
+      <h2 class="text-xl font-bold mb-2">Moduländerungen</h2>
       <ClassRemovedRow
         v-for="major in changes.removals"
         :key="major.id"
@@ -36,9 +26,7 @@
     </div>
 
     <div v-if="changes.minorChanges.length > 0">
-      <h2 class="mt-5 text-xl font-bold mb-2">
-        Anpassungen
-      </h2>
+      <h2 class="mt-5 text-xl font-bold mb-2">Anpassungen</h2>
 
       <ul class="w-full text-xs xl:text-base">
         <li
@@ -50,10 +38,7 @@
             minor.name
           }}</span>
           <table class="block md:inline-block align-top">
-            <tr
-              v-for="change in minor.changes"
-              :key="change.difference"
-            >
+            <tr v-for="change in minor.changes" :key="change.difference">
               <td class="w-32 md:w-52">
                 <span>{{ change.difference }}</span>
               </td>
@@ -81,21 +66,13 @@
     v-else
     class="w-full flex justify-center py-10 text-gray-800 dark:text-gray-200"
   >
-    <h1 class="text-3xl">
-      Es gibt keine Änderungen an deiner Planung!
-    </h1>
+    <h1 class="text-3xl">Es gibt keine Änderungen an deiner Planung!</h1>
   </div>
   <div class="flex justify-end mt-10 gap-4">
-    <button
-      class="bg-orange-500 text-white py-2 px-5 rounded"
-      @click="cancel"
-    >
+    <button class="bg-orange-500 text-white py-2 px-5 rounded" @click="cancel">
       Abbrechen
     </button>
-    <button
-      class="bg-blue-500 text-white py-2 px-5 rounded"
-      @click="upgrade"
-    >
+    <button class="bg-blue-500 text-white py-2 px-5 rounded" @click="upgrade">
       Upgrade
     </button>
   </div>

src/components/views/FullDependencyTree.vue

@@ -4,10 +4,7 @@
     <div
       class="bg-white dark:bg-gray-700 drop-shadow-xl px-5 w-full pb-10 pt-1 md:w-160 md:order-1"
     >
-      <div
-        v-if="stateStore.inspectingModule != null"
-        class="mt-5"
-      >
+      <div v-if="stateStore.inspectingModule != null" class="mt-5">
         <h3 class="text-lg font-medium leading-6 text-gray-900 dark:text-white">
           <span class="font-bold text-3xl mr-5 block">{{
             stateStore.inspectingModule.short
@@ -22,18 +19,9 @@
         />
       </div>
 
-      <div
-        v-else
-        class="mt-5 dark:text-gray-300 text-gray-700"
-      >
-        <label
-          class="block"
-          for="degree-select"
-        >Studiengang</label>
-        <select
-          id="degree-select"
-          v-model="degreeProgram"
-        >
+      <div v-else class="mt-5 dark:text-gray-300 text-gray-700">
+        <label class="block" for="degree-select">Studiengang</label>
+        <select id="degree-select" v-model="degreeProgram">
           <option
             v-for="name in classesStore.degreePrograms"
             :key="name"
@@ -42,10 +30,7 @@
             {{ name }}
           </option>
         </select>
-        <label
-          class="block mt-5"
-          for="language-select"
-        >Sprache </label>
+        <label class="block mt-5" for="language-select">Sprache </label>
         <div class="flex gap-4">
           <button
             v-for="lang in ModuleLanguages"
@@ -60,20 +45,11 @@
       </div>
     </div>
 
-    <div
-      class="w-full h-full"
-      @click="deselect"
-    >
+    <div class="w-full h-full" @click="deselect">
       <!-- eslint-disable vue/no-v-html -->
-      <div
-        ref="svgTxt"
-        class="m-10 hidden"
-      />
+      <div ref="svgTxt" class="m-10 hidden" />
       <!--eslint-enable-->
-      <div
-        id="map"
-        class="h-full w-full z-0"
-      />
+      <div id="map" class="h-full w-full z-0" />
     </div>
   </div>
 </template>

src/components/views/ModuleSelector.vue

@@ -1,10 +1,7 @@
 <template>
   <LoadSaveView />
 
-  <form
-    @submit.prevent=""
-    @keydown.enter.prevent=""
-  >
+  <form @submit.prevent="" @keydown.enter.prevent="">
     <ul>
       <li
         v-for="(filterSet, idx) in classesStore.filterRules"
@@ -89,11 +86,7 @@
       </tr>
     </thead>
 
-    <ClassRow
-      v-for="cls in paginatedClasses"
-      :key="cls.id"
-      :cls="cls"
-    />
+    <ClassRow v-for="cls in paginatedClasses" :key="cls.id" :cls="cls" />
   </table>
 
   <div
@@ -102,7 +95,8 @@
   >
     <span
       class="text-2xl text-gray-400 dark:text-gray-600 no-results-text font-mono w-full"
-    >Schade, leider gibt es keine Resultate...</span>
+      >Schade, leider gibt es keine Resultate...</span
+    >
     <button
       title="Module durchsuchen"
       class="action-button mt-5"

src/helpers.ts

@@ -12,7 +12,7 @@ export function toTime(t: number): string {
   const minutes = (t - 3600 * hours) / 60;
   return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(
     2,
-    "0"
+    "0",
   )}`;
 }
 
@@ -47,7 +47,7 @@ export function openURLInNewWindow(url: string) {
   window.open(
     url,
     "_blank",
-    "resizable=yes, scrollbars=yes, titlebar=yes, width=800, height=600"
+    "resizable=yes, scrollbars=yes, titlebar=yes, width=800, height=600",
   );
 }
 
@@ -59,7 +59,7 @@ export const contextClassRe = /^\dK/;
 export function classesPDFLink(
   cls: TaughtClass | HistoricClassEntry,
   semester: string | null = null,
-  version: string | null = null
+  version: string | null = null,
 ): string {
   let semesterFolder;
   let semVerFolder;
@@ -92,7 +92,7 @@ export function getSemVerFolder(semester: string, version: string): string {
 
 export function addRemoveClassTitle(
   module: Module | null,
-  isChosen: boolean
+  isChosen: boolean,
 ): string {
   if (module?.hasCompleted) return "Modul bereits bestanden";
   if (module?.maxAttemptsReached)
@@ -155,7 +155,7 @@ export function parsePDFVersion(versionStr: string | null): {
 
 export function samePDFVersion(
   vers1: string | null,
-  vers2: string | null
+  vers2: string | null,
 ): boolean {
   const parsed1 = parsePDFVersion(vers1);
   const parsed2 = parsePDFVersion(vers2);
@@ -167,14 +167,14 @@ export function samePDFVersion(
 
 export function semesterVersionString(
   semester: string,
-  version: string
+  version: string,
 ): string {
   return `${semester}|${version}`;
 }
 
 export function semesterVersionStringC(
   semVer: SemesterVersion | null,
-  versionIdx = 0
+  versionIdx = 0,
 ): string | null {
   if (semVer == null) return null;
   return `${semVer.semester}|${semVer.versions[versionIdx]}`;

src/stores/classes.ts

@@ -106,7 +106,7 @@ export const useClassesStore = defineStore("classes", {
 
         if (column == ClassSelectorColumn.Time) {
           transformedRules[column].forEach((rule) =>
-            foundClasses.push(...filterTimeColumn(classes, rule))
+            foundClasses.push(...filterTimeColumn(classes, rule)),
           );
           classes = [...new Set(foundClasses)];
           return;
@@ -122,7 +122,7 @@ export const useClassesStore = defineStore("classes", {
             }
             didFilter = true;
             foundClasses.push(
-              ...classes.filter((c) => c.degree_prg == rule.filterData.degree)
+              ...classes.filter((c) => c.degree_prg == rule.filterData.degree),
             );
           });
 
@@ -142,8 +142,8 @@ export const useClassesStore = defineStore("classes", {
                   (c) =>
                     c.name.toLowerCase().includes(term) ||
                     (checkName &&
-                      c.module?.name.toLocaleLowerCase().includes(term))
-                )
+                      c.module?.name.toLocaleLowerCase().includes(term)),
+                ),
               );
             });
             break;
@@ -167,7 +167,7 @@ export const useClassesStore = defineStore("classes", {
               if (term.length == 0) return;
               didFilter = true;
               foundClasses.push(
-                ...classes.filter((c) => c.class.toLowerCase().includes(term))
+                ...classes.filter((c) => c.class.toLowerCase().includes(term)),
               );
             });
             break;
@@ -179,8 +179,8 @@ export const useClassesStore = defineStore("classes", {
               didFilter = true;
               foundClasses.push(
                 ...classes.filter((c) =>
-                  c.teachers.join().toLowerCase().includes(term)
-                )
+                  c.teachers.join().toLowerCase().includes(term),
+                ),
               );
             });
             break;
@@ -192,8 +192,8 @@ export const useClassesStore = defineStore("classes", {
               didFilter = true;
               foundClasses.push(
                 ...classes.filter(
-                  (c) => c.teaching_type == rule.filterData.teachingType
-                )
+                  (c) => c.teaching_type == rule.filterData.teachingType,
+                ),
               );
             });
             break;
@@ -357,7 +357,7 @@ export const useClassesStore = defineStore("classes", {
       });
 
       this.data[version].degreePrograms.sort((a, b) =>
-        a.toLowerCase().localeCompare(b.toLowerCase())
+        a.toLowerCase().localeCompare(b.toLowerCase()),
       );
     },
     getById(module_id: string): TaughtClass | null {
@@ -467,7 +467,7 @@ export const useClassesStore = defineStore("classes", {
 
 function filterTimeColumn(
   modules: TaughtClass[],
-  filterset: FilterRule
+  filterset: FilterRule,
 ): TaughtClass[] {
   const timeData = filterset.filterData as Record<string, number>;
   const start = timeData.startTime;
@@ -485,7 +485,7 @@ function filterTimeColumn(
       modules = modules.filter(
         (m) =>
           ((m.weekday ?? 0) == startingDay && m.from >= startingTime) ||
-          (m.weekday ?? 0) > startingDay
+          (m.weekday ?? 0) > startingDay,
       );
     }
   }
@@ -498,7 +498,7 @@ function filterTimeColumn(
         modules = modules.filter(
           (m) =>
             (m.weekday ?? 0) == startingDay &&
-            (endingTime == 0 || m.to <= endingTime)
+            (endingTime == 0 || m.to <= endingTime),
         );
       } else {
         aEnd *= -1;
@@ -511,7 +511,7 @@ function filterTimeColumn(
         (m) =>
           (m.weekday ?? 0) < endingDay ||
           ((m.weekday ?? 0) == endingDay &&
-            (endingTime == 0 || m.to <= endingTime))
+            (endingTime == 0 || m.to <= endingTime)),
       );
     }
   }

src/stores/planning.ts

@@ -190,7 +190,7 @@ export const usePlanningStore = defineStore("planning", {
           if (!found) seen.push(moduleName);
           return found;
         })
-        .reduce((sum, c) => sum + (c.isEnglish ? c.module?.ects ?? 0 : 0), 0);
+        .reduce((sum, c) => sum + (c.isEnglish ? (c.module?.ects ?? 0) : 0), 0);
     },
     ectsInContextClasses(): number {
       const seen = [] as string[];
@@ -201,7 +201,7 @@ export const usePlanningStore = defineStore("planning", {
           if (!found) seen.push(moduleName);
           return found;
         })
-        .reduce((sum, c) => sum + (c.isContext ? c.module?.ects ?? 0 : 0), 0);
+        .reduce((sum, c) => sum + (c.isContext ? (c.module?.ects ?? 0) : 0), 0);
     },
     ectsWithMSP(): number {
       const seen = [] as string[];
@@ -213,7 +213,7 @@ export const usePlanningStore = defineStore("planning", {
           return found;
         })
         .reduce(
-          (sum, c) => sum + (c.module?.hasMSP ? c.module?.ects ?? 0 : 0),
+          (sum, c) => sum + (c.module?.hasMSP ? (c.module?.ects ?? 0) : 0),
           0,
         );
     },
@@ -370,7 +370,7 @@ export const usePlanningStore = defineStore("planning", {
       classVersionStore.useFromPDFString(
         useSavedVersion
           ? data.version
-          : useClassVersionStore().semVer ?? data.version,
+          : (useClassVersionStore().semVer ?? data.version),
       );
       modulesStore.fetchData();