✨ Add profile management

- Save class filter, timetable and timetable groups in profiles
- Easily switch between profiles
- Rename profiles
- Export/Import/Duplicate profiles

src/store.js

@@ -9,31 +9,50 @@ export const loadingProgress = ref(0);
 export const loadingFailed = ref(false);
 
 /* Preferences */
-export const classFilter = ref(localStorage.getItem("classFilter") || "none");
-export const timetableId = ref(localStorage.getItem("timetableId") || "none");
-export const timetableGroups = ref(
-  JSON.parse(localStorage.getItem("timetableGroups") || "[]"),
+export const profiles = ref(
+  JSON.parse(localStorage.getItem("profiles")) || [
+    {
+      id: 0,
+      name: "Default Profile",
+      classFilter: "none",
+      timetableId: "none",
+      timetableGroups: [],
+    },
+  ],
 );
+export const activeProfile = computed(() => {
+  return (
+    profiles.value.find((e) => e.id == activeProfileId.value) ||
+    profiles.value[0]
+  );
+});
+export const activeProfileId = ref(
+  localStorage.getItem("activeProfile") || profiles.value[0].id,
+);
+
+watch(
+  () => activeProfile.value.classFilter,
+  () => {
+    fetchData(getNextAndPrevDay(selectedDate.value), false);
+  },
+);
+
 export const localTimetables = ref(
   JSON.parse(localStorage.getItem("timetables")) || [],
 );
 
 export const theme = ref(localStorage.getItem("theme") || "auto");
 
-watch(classFilter, (newValue) => {
-  localStorage.setItem("classFilter", newValue);
-  fetchData(getNextAndPrevDay(selectedDate.value), false);
-});
-watch(timetableId, (newValue) => {
-  localStorage.setItem("timetableId", newValue);
-});
 watch(
-  timetableGroups,
+  profiles,
   (newValue) => {
-    localStorage.setItem("timetableGroups", JSON.stringify(newValue));
+    localStorage.setItem("profiles", JSON.stringify(newValue));
   },
   { deep: true },
 );
+watch(activeProfileId, (newValue) => {
+  localStorage.setItem("activeProfile", newValue);
+});
 watch(
   localTimetables,
   (newValue) => {
@@ -63,10 +82,10 @@ export const changeDate = ref(new Date());
 /* Data store */
 export const timetable = computed(() => {
   const localTimetable = localTimetables.value.find(
-    (e) => e.id == timetableId.value,
+    (e) => e.id == activeProfile.value.timetableId,
   );
   const remoteTimetable = timetables.value.find(
-    (e) => e.id == timetableId.value,
+    (e) => e.id == activeProfile.value.timetableId,
   );
   return (
     localTimetable || remoteTimetable || { trusted: true, source: "", data: [] }
@@ -154,7 +173,7 @@ export async function fetchClassList() {
 
 export async function fetchTimetables() {
   const timetableResponse = await fetch(
-    `${baseUrl}/timetable?class=${classFilter.value}`,
+    `${baseUrl}/timetable?class=${activeProfile.value.classFilter}`,
   );
   const timetableData = await timetableResponse.json();
   if (timetableData.error) {
@@ -169,9 +188,9 @@ export async function fetchTimetables() {
 export async function fetchSubstitutions(day) {
   const requestDate = `?date=${day}`;
   const substitutionResponse = await fetch(
-    classFilter.value == "none"
+    activeProfile.value.classFilter == "none"
       ? `${baseUrl}/substitutions${requestDate}`
-      : `${baseUrl}/substitutions${requestDate}&class=${classFilter.value}`,
+      : `${baseUrl}/substitutions${requestDate}&class=${activeProfile.value.classFilter}`,
   );
   const substitutionData = await substitutionResponse.json();
   substitutions.value[day] = substitutionData;
@@ -180,9 +199,9 @@ export async function fetchSubstitutions(day) {
 export async function fetchHistory(day) {
   const requestDate = `?date=${day}`;
   const historyResponse = await fetch(
-    classFilter.value == "none"
+    activeProfile.value.classFilter == "none"
       ? `${baseUrl}/history${requestDate}`
-      : `${baseUrl}/history${requestDate}&class=${classFilter.value}`,
+      : `${baseUrl}/history${requestDate}&class=${activeProfile.value.classFilter}`,
   );
   const historyData = await historyResponse.json();
   if (historyData.error) console.warn("API Error: " + historyData.error);
@@ -201,7 +220,7 @@ export const parsedTimetable = computed(() => {
       // (timetable groups)
       if (Array.isArray(lesson) && lesson.length > 1) {
         let matchingLesson = lesson.find((e) =>
-          timetableGroups.value.includes(e.group),
+          activeProfile.value.timetableGroups.includes(e.group),
         );
         // If no valid timetable group is configured
         // add a dummy lesson showing a notice