replace redux with zustand

2025-07-25 01:03:11 +02:00
parent 5448285211
commit 3bcd2e16a2
30 changed files with 510 additions and 534 deletions
--- a/biome.json
+++ b/biome.json
@@ -0,0 +1,34 @@
+{
+	"$schema": "https://biomejs.dev/schemas/2.1.2/schema.json",
+	"vcs": {
+		"enabled": false,
+		"clientKind": "git",
+		"useIgnoreFile": false
+	},
+	"files": {
+		"ignoreUnknown": false
+	},
+	"formatter": {
+		"enabled": true,
+		"indentStyle": "tab"
+	},
+	"linter": {
+		"enabled": true,
+		"rules": {
+			"recommended": true
+		}
+	},
+	"javascript": {
+		"formatter": {
+			"quoteStyle": "double"
+		}
+	},
+	"assist": {
+		"enabled": true,
+		"actions": {
+			"source": {
+				"organizeImports": "on"
+			}
+		}
+	}
+}
--- a/bun.lock
+++ b/bun.lock
@@ -12,8 +12,10 @@
        "react-dom": "^19.1.0",
        "react-redux": "^9.2.0",
        "redux-persist": "^6.0.0",
+        "zustand": "^5.0.6",
      },
      "devDependencies": {
+        "@biomejs/biome": "2.1.2",
        "@eslint/js": "^9.31.0",
        "@types/react": "^19.1.8",
        "@types/react-dom": "^19.1.6",
@@ -36,6 +38,24 @@
    },
  },
  "packages": {
+    "@biomejs/biome": ["@biomejs/biome@2.1.2", "", { "optionalDependencies": { "@biomejs/cli-darwin-arm64": "2.1.2", "@biomejs/cli-darwin-x64": "2.1.2", "@biomejs/cli-linux-arm64": "2.1.2", "@biomejs/cli-linux-arm64-musl": "2.1.2", "@biomejs/cli-linux-x64": "2.1.2", "@biomejs/cli-linux-x64-musl": "2.1.2", "@biomejs/cli-win32-arm64": "2.1.2", "@biomejs/cli-win32-x64": "2.1.2" }, "bin": { "biome": "bin/biome" } }, "sha512-yq8ZZuKuBVDgAS76LWCfFKHSYIAgqkxVB3mGVVpOe2vSkUTs7xG46zXZeNPRNVjiJuw0SZ3+J2rXiYx0RUpfGg=="],
+
+    "@biomejs/cli-darwin-arm64": ["@biomejs/cli-darwin-arm64@2.1.2", "", { "os": "darwin", "cpu": "arm64" }, "sha512-leFAks64PEIjc7MY/cLjE8u5OcfBKkcDB0szxsWUB4aDfemBep1WVKt0qrEyqZBOW8LPHzrFMyDl3FhuuA0E7g=="],
+
+    "@biomejs/cli-darwin-x64": ["@biomejs/cli-darwin-x64@2.1.2", "", { "os": "darwin", "cpu": "x64" }, "sha512-Nmmv7wRX5Nj7lGmz0FjnWdflJg4zii8Ivruas6PBKzw5SJX/q+Zh2RfnO+bBnuKLXpj8kiI2x2X12otpH6a32A=="],
+
+    "@biomejs/cli-linux-arm64": ["@biomejs/cli-linux-arm64@2.1.2", "", { "os": "linux", "cpu": "arm64" }, "sha512-NWNy2Diocav61HZiv2enTQykbPP/KrA/baS7JsLSojC7Xxh2nl9IczuvE5UID7+ksRy2e7yH7klm/WkA72G1dw=="],
+
+    "@biomejs/cli-linux-arm64-musl": ["@biomejs/cli-linux-arm64-musl@2.1.2", "", { "os": "linux", "cpu": "arm64" }, "sha512-qgHvafhjH7Oca114FdOScmIKf1DlXT1LqbOrrbR30kQDLFPEOpBG0uzx6MhmsrmhGiCFCr2obDamu+czk+X0HQ=="],
+
+    "@biomejs/cli-linux-x64": ["@biomejs/cli-linux-x64@2.1.2", "", { "os": "linux", "cpu": "x64" }, "sha512-Km/UYeVowygTjpX6sGBzlizjakLoMQkxWbruVZSNE6osuSI63i4uCeIL+6q2AJlD3dxoiBJX70dn1enjQnQqwA=="],
+
+    "@biomejs/cli-linux-x64-musl": ["@biomejs/cli-linux-x64-musl@2.1.2", "", { "os": "linux", "cpu": "x64" }, "sha512-xlB3mU14ZUa3wzLtXfmk2IMOGL+S0aHFhSix/nssWS/2XlD27q+S6f0dlQ8WOCbYoXcuz8BCM7rCn2lxdTrlQA=="],
+
+    "@biomejs/cli-win32-arm64": ["@biomejs/cli-win32-arm64@2.1.2", "", { "os": "win32", "cpu": "arm64" }, "sha512-G8KWZli5ASOXA3yUQgx+M4pZRv3ND16h77UsdunUL17uYpcL/UC7RkWTdkfvMQvogVsAuz5JUcBDjgZHXxlKoA=="],
+
+    "@biomejs/cli-win32-x64": ["@biomejs/cli-win32-x64@2.1.2", "", { "os": "win32", "cpu": "x64" }, "sha512-9zajnk59PMpjBkty3bK2IrjUsUHvqe9HWwyAWQBjGLE7MIBjbX2vwv1XPEhmO2RRuGoTkVx3WCanHrjAytICLA=="],
+
    "@esbuild/aix-ppc64": ["@esbuild/aix-ppc64@0.25.8", "", { "os": "aix", "cpu": "ppc64" }, "sha512-urAvrUedIqEiFR3FYSLTWQgLu5tb+m0qZw0NBEasUeo6wuqatkMDaRT+1uABiGXEu5vqgPd7FGE1BhsAIy9QVA=="],

    "@esbuild/android-arm": ["@esbuild/android-arm@0.25.8", "", { "os": "android", "cpu": "arm" }, "sha512-RONsAvGCz5oWyePVnLdZY/HHwA++nxYWIX1atInlaW6SEkwq6XkP3+cb825EUcRs5Vss/lGh/2YxAb5xqc07Uw=="],
@@ -740,6 +760,8 @@

    "yocto-queue": ["yocto-queue@0.1.0", "", {}, "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="],

+    "zustand": ["zustand@5.0.6", "", { "peerDependencies": { "@types/react": ">=18.0.0", "immer": ">=9.0.6", "react": ">=18.0.0", "use-sync-external-store": ">=1.2.0" }, "optionalPeers": ["@types/react", "immer", "react", "use-sync-external-store"] }, "sha512-ihAqNeUVhe0MAD+X8M5UzqyZ9k3FFZLBTtqo6JLPwV53cbRB/mJwBI0PxcIgqhBBHlEs8G45OTDTMq3gNcLq3A=="],
+
    "@eslint-community/eslint-utils/eslint-visitor-keys": ["eslint-visitor-keys@3.4.3", "", {}, "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag=="],

    "@eslint/eslintrc/globals": ["globals@14.0.0", "", {}, "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ=="],
--- a/package.json
+++ b/package.json
@@ -17,9 +17,11 @@
 		"react": "^19.1.0",
 		"react-dom": "^19.1.0",
 		"react-redux": "^9.2.0",
-        "redux-persist": "^6.0.0"
+		"redux-persist": "^6.0.0",
+		"zustand": "^5.0.6"
 	},
 	"devDependencies": {
+		"@biomejs/biome": "2.1.2",
 		"@eslint/js": "^9.31.0",
 		"@types/react": "^19.1.8",
 		"@types/react-dom": "^19.1.6",
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,19 +1,8 @@
-import "./App.css";
-import Timetable from "./components/Timetable/Timetable";
-import { useDispatch } from "react-redux";
-import { fetchTimetable } from "./store/index";
-import { useEffect } from "react";
-import { type AppDispatch } from "./store/index";
-import Flatastic from "./components/Flatastic/Flatastic";
-import fetchFlatasticChores from "./store/thunks/fetchFlatasticChores";
+import "@/App.css";
+import Timetable from "@/components/Timetable/Timetable";
+import Flatastic from "@/components/Flatastic/Flatastic";

 function App() {
-    const dispatch = useDispatch<AppDispatch>();
-    // Fetch the timetable data when the app loads
-    useEffect(() => {
-        dispatch(fetchTimetable());
-        dispatch(fetchFlatasticChores());
-    }, [dispatch]);
 	return (
 		<>
 			<Timetable />
--- a/src/api/api.ts
+++ b/src/api/api.ts
@@ -1,13 +0,0 @@
-async function callApi(stopId: number) {
-    const API_URL = `https://projekte.kvv-efa.de/sl3-alone/XSLT_DM_REQUEST?outputFormat=JSON&coordOutputFormat=WGS84[dd.ddddd]&depType=stopEvents&locationServerActive=1&mode=direct&name_dm=${stopId}&type_dm=stop&useOnlyStops=1&useRealtime=1&limit=6&line=kvv:22301:E:H:s25&line=kvv:21012:E:H:s25&line=kvv:21012:E:R:s25&line=kvv:22305:E:H:s25`;
-
-    const data = await fetch(API_URL, {
-        method: "GET",
-    });
-    if (!data.ok) {
-        throw new Error(`HTTP error! status: ${data.status}`);
-    }
-    return data;
-}
-
-export { callApi };
--- a/src/api/flatastic.ts
+++ b/src/api/flatastic.ts
@@ -1,4 +1,3 @@
-
 class Flatastic {
 	private apikey: string;

@@ -6,10 +5,11 @@ class Flatastic {
 		this.apikey = apikey;
 	}

-    async request(url: string, option: any, cb: (info: any) => void) {
+	async request(url: string, option: any) {
 		const headers = {
-            "accept": "application/json, text/plain, */*",
-            "accept-language": "de-CH,de;q=0.9,en-US;q=0.8,en-CH;q=0.7,en;q=0.6,ar-JO;q=0.5,ar;q=0.4,de-DE;q=0.3",
+			accept: "application/json, text/plain, */*",
+			"accept-language":
+				"de-CH,de;q=0.9,en-US;q=0.8,en-CH;q=0.7,en;q=0.6,ar-JO;q=0.5,ar;q=0.4,de-DE;q=0.3",
 			// "cache-control": "no-cache",
 			// "pragma": "no-cache",
 			// "sec-fetch-dest": "empty",
@@ -17,37 +17,37 @@ class Flatastic {
 			// "sec-fetch-site": "same-site",
 			"x-api-key": this.apikey,
 			"x-api-version": "2.0.0",
-            "x-client-version": "2.3.20"
+			"x-client-version": "2.3.20",
 		};
-        try {
 		const response = await fetch(url, {
-                method: 'GET',
-                headers: headers
+			...option,
+			headers: {
+				...headers,
+				...option.headers,
+			},
 		});
 		if (!response.ok) {
 			throw new Error(`HTTP error! status: ${response.status}`);
 		}
-            const info = await response.json();
-            cb(info);
-        } catch (error) {
-            let message = 'Unknown error';
-            if (error instanceof Error) {
-                message = error.message;
-            }
-            cb({ error: message });
-        }
+		return await response.json();
 	}

-    getShoppingList(callback: (info: any) => void) {
-        this.request('https://api.flatastic-app.com/index.php/api/shoppinglist', {}, callback);
+	getShoppingList() {
+		return this.request(
+			"https://api.flatastic-app.com/index.php/api/shoppinglist",
+			{},
+		);
 	}

-    getTaskList(callback: (info: any) => void) {
-        this.request('https://api.flatastic-app.com/index.php/api/chores', {}, callback);
+	getTaskList() {
+		return this.request(
+			"https://api.flatastic-app.com/index.php/api/chores",
+			{},
+		);
 	}

-    getInformation(callback: (info: any) => void) {
-        this.request('https://api.flatastic-app.com/index.php/api/wg', {}, callback);
+	getInformation() {
+		this.request("https://api.flatastic-app.com/index.php/api/wg", {});
 	}
 }

--- a/src/api/kvv.ts
+++ b/src/api/kvv.ts
@@ -0,0 +1,13 @@
+async function fetchKvvDepartures(stopId: number) {
+	const API_URL = `https://projekte.kvv-efa.de/sl3-alone/XSLT_DM_REQUEST?outputFormat=JSON&coordOutputFormat=WGS84[dd.ddddd]&depType=stopEvents&locationServerActive=1&mode=direct&name_dm=${stopId}&type_dm=stop&useOnlyStops=1&useRealtime=1&limit=6&line=kvv:22301:E:H:s25&line=kvv:21012:E:H:s25&line=kvv:21012:E:R:s25&line=kvv:22305:E:H:s25`;
+
+	const data = await fetch(API_URL, {
+		method: "GET",
+	});
+	if (!data.ok) {
+		throw new Error(`HTTP error! status: ${data.status}`);
+	}
+	return data;
+}
+
+export { fetchKvvDepartures };
--- a/src/components/Flatastic/Flatastic.tsx
+++ b/src/components/Flatastic/Flatastic.tsx
@@ -1,21 +1,38 @@
-import fetchFlatasticChores from "@/store/thunks/fetchFlatasticChores";
+import { useFlatasticStore } from "@/store/flatastic";
 import { useEffect } from "react";
-import { useDispatch } from "react-redux";
-import { type AppDispatch } from "@/store/index";
+
+import type { FlatasticChore } from "@/types/flatasticChore";
+
+const idToNameMap: Record<number, string> = {
+	1836104: "Gruber",
+	1836101: "Darius",
+	1593610: "Arif",
+	1860060: "Rishab",
+};

 export default function Flatastic() {
-    const dispatch = useDispatch<AppDispatch>();
-    useEffect(() => {
-        const intervalID = setInterval(() => {
-            dispatch(fetchFlatasticChores());
-        }, 60000); // Fetch every 60 seconds
+	const fetchChores = useFlatasticStore((state) => state.fetch);
+	const chores = useFlatasticStore((state) => state.chores);

-        return () => clearInterval(intervalID);
-    }, []);
+	useEffect(() => {
+		fetchChores();
+		const interval = setInterval(() => {
+			fetchChores();
+		}, 60000);
+		return () => clearInterval(interval);
+	}, [fetchChores]);

 	return (
-        <p>
-            Flatastic API Key: {import.meta.env.VITE_FLATTASTIC_API_KEY || "Not set"}
-        </p>
-    )
+		<div>
+			<h1>Flatastic Chores</h1>
+			<ul>
+				{chores.map((chore: FlatasticChore) => (
+					<li key={chore.id} style={{ textAlign: "left" }}>
+						{idToNameMap[chore.currentUser]}: {chore.title} - Points:{" "}
+						{chore.points}
+					</li>
+				))}
+			</ul>
+		</div>
+	);
 }
--- a/src/components/Timetable/Timetable.tsx
+++ b/src/components/Timetable/Timetable.tsx
@@ -1,16 +1,12 @@
 import { useEffect } from "react";
-import { useDispatch, useSelector } from "react-redux";
-import {
-    fetchTimetable,
-    type AppDispatch,
-    type AppState,
-} from "../../store/index";
-import { type DepartureList } from "../../types/types";
+
 import TimetableRow from "../TimetableRow/TimetableRow";

 import _ from "lodash";
+import { useKVVStore } from "@/store/kvv";
+import type { DepartureType } from "@/types/departureType";

-function parseTimetableData(data: DepartureList[]) {
+function parseTimetableData(data: DepartureType[]) {
 	const result = data.map((item) => {
 		return {
 			...item,
@@ -21,23 +17,20 @@ function parseTimetableData(data: DepartureList[]) {
 }

 export default function Timetable() {
-    const dispatch = useDispatch<AppDispatch>();
+	const fetchTimetable = useKVVStore((state) => state.fetch);
+	const pStreet = useKVVStore((state) => state.pStreet);
+	const hStreet = useKVVStore((state) => state.hStreet);
+
 	useEffect(() => {
-        const intervalID = setInterval(() => {
-            dispatch(fetchTimetable());
-        }, 60000); // Fetch every 60 seconds
+		fetchTimetable();
+		const interval = setInterval(() => {
+			fetchTimetable();
+		}, 60000);
+		return () => clearInterval(interval);
+	}, [fetchTimetable]);

-        return () => clearInterval(intervalID);
-    }, []);
-    const pStreet = useSelector((state: AppState) => state.timetable.pStreet);
-    const hStreet = useSelector((state: AppState) => state.timetable.hStreet);
-
-    const hStreetData = hStreet
-        ? parseTimetableData(hStreet.departureList)
-        : [];
-    const pStreetData = pStreet
-        ? parseTimetableData(pStreet.departureList)
-        : [];
+	const hStreetData = parseTimetableData(hStreet.departureList || []);
+	const pStreetData = parseTimetableData(pStreet.departureList || []);

 	return (
 		<div>
--- a/src/components/TimetableRow/TimetableRow.tsx
+++ b/src/components/TimetableRow/TimetableRow.tsx
@@ -1,23 +1,22 @@
-import { type DepartureList } from "../../types/types";
+import type { DepartureType } from "@/types/departureType";

 import styles from "./style.module.css";

 export default function TimetableRow({
 	departure,
 }: {
-    departure: DepartureList;
+	departure: DepartureType;
 }) {
 	const hour = String(departure.dateTime.hour).padStart(2, "0");
 	const minute = String(departure.dateTime.minute).padStart(2, "0");
 	const dateTimeString = `${hour}:${minute}`;
+
 	return (
-        <>
 		<tr className={styles.timetableRow}>
 			<td>{dateTimeString}</td>
 			<td>{departure.servingLine.name}</td>
 			<td>{departure.servingLine.number}</td>
 			<td>({departure.servingLine.direction})</td>
 		</tr>
-        </>
 	);
 }
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,21 +1,11 @@
 import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
-import { Provider } from "react-redux";
-import { PersistGate } from 'redux-persist/integration/react'
-import { persistStore } from 'redux-persist'

 import "./index.css";
 import App from "./App.tsx";
-import store from "./store/index.ts";
-
-let persistor = persistStore(store)

 createRoot(document.getElementById("root")!).render(
 	<StrictMode>
-        <Provider store={store}>
-            <PersistGate loading={null} persistor={persistor}>
 		<App />
-            </PersistGate>
-        </Provider>
 	</StrictMode>,
 );
--- a/src/store/flatastic.ts
+++ b/src/store/flatastic.ts
@@ -0,0 +1,26 @@
+import { create } from "zustand";
+import Flatastic from "@/api/flatastic";
+import type { FlatasticChore } from "@/types/flatasticChore";
+
+interface FlatasticStore {
+	chores: FlatasticChore[];
+	fetch: () => Promise<void>;
+}
+
+const useFlatasticStore = create<FlatasticStore>(
+	(set: (state: Partial<FlatasticStore>) => void) => ({
+		chores: [],
+		fetch: async () => {
+			if (!import.meta.env.VITE_FLATTASTIC_API_KEY) {
+				throw new Error("Flatastic API Key is not set");
+			}
+			const flatastic = new Flatastic(import.meta.env.VITE_FLATTASTIC_API_KEY);
+			const data = await flatastic.getTaskList();
+
+			console.log("Flatastic chores fetched:", data);
+			set({ chores: data as FlatasticChore[] });
+		},
+	}),
+);
+
+export { useFlatasticStore };
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -1,43 +0,0 @@
-import { configureStore } from "@reduxjs/toolkit";
-import { persistReducer } from "redux-persist";
-import timetableSlice from "./slices/timetableSlice";
-import flatasticChoresSlice from "./slices/flatastiucChoresSlice";
-import fetchTimetable from "./thunks/fetchTimetable";
-import persistConfig from "./persist/persistConfig";
-
-const persistedTimetableReducer = persistReducer(
-    persistConfig,
-    timetableSlice.reducer
-);
-
-const persistedFlatasticChoresReducer = persistReducer(
-    persistConfig,
-    flatasticChoresSlice.reducer
-);
-
-const store = configureStore({
-    reducer: {
-        timetable: persistedTimetableReducer,
-        flatasticChores: persistedFlatasticChoresReducer
-    },
-    middleware: (getDefaultMiddleware) =>
-        getDefaultMiddleware({
-            serializableCheck: {
-                ignoredActions: [
-                    "persist/PERSIST",
-                    "persist/REHYDRATE",
-                    "persist/PAUSE",
-                    "persist/FLUSH",
-                    "persist/REGISTER",
-                    "persist/PURGE",
-                ],
-            },
-        }),
-});
-
-export { store, fetchTimetable };
-export default store;
-export type RootState = ReturnType<typeof store.getState>;
-export type AppState = ReturnType<typeof store.getState>;
-export type AppDispatch = typeof store.dispatch;
-export type ThunkDispatch = typeof store.dispatch;
--- a/src/store/kvv.ts
+++ b/src/store/kvv.ts
@@ -0,0 +1,25 @@
+import { create } from "zustand";
+import { fetchKvvDepartures } from "@/api/kvv";
+import type { DepartureType } from "@/types/departureType";
+import { devtools } from "zustand/middleware";
+
+const useKVVStore = create(
+	devtools((set) => ({
+		pStreet: [] as DepartureType[],
+		hStreet: [] as DepartureType[],
+		fetch: async () => {
+			const hStreetStopId = 7000044;
+			const pStreetStopId = 7000045;
+			const hStreetData = await fetchKvvDepartures(hStreetStopId);
+			const pStreetData = await fetchKvvDepartures(pStreetStopId);
+			const hStreetJson = await hStreetData.json();
+			const pStreetJson = await pStreetData.json();
+			set({
+				hStreet: hStreetJson as DepartureType[],
+				pStreet: pStreetJson as DepartureType[],
+			});
+		},
+	})),
+);
+
+export { useKVVStore };
--- a/src/store/persist/persistConfig.ts
+++ b/src/store/persist/persistConfig.ts
@@ -1,8 +0,0 @@
-import storage from 'redux-persist/lib/storage';
-
-const persistConfig = {
-    key: 'root',
-    storage,
-};
-
-export default persistConfig;
--- a/src/store/slices/flatastiucChoresSlice.ts
+++ b/src/store/slices/flatastiucChoresSlice.ts
@@ -1,20 +0,0 @@
-import { createSlice } from "@reduxjs/toolkit";
-import fetchFlatasticChores from "../thunks/fetchFlatasticChores";
-
-const timetableSlice = createSlice({
-    name: "chores",
-    initialState: {
-        chores: [] as any[],
-    },
-    reducers: {},
-    extraReducers: (builder) => {
-        builder.addCase(fetchFlatasticChores.fulfilled, (state, action) => {
-            // Filter out timetable-related entries
-            state.chores = Array.isArray(action.payload)
-                ? action.payload.filter((item) => item.name !== "hstreeet" && item.name !== "pstreet")
-                : [];
-        });
-    },
-});
-
-export default timetableSlice;
--- a/src/store/slices/timetableSlice.ts
+++ b/src/store/slices/timetableSlice.ts
@@ -1,24 +0,0 @@
-import { createSlice } from "@reduxjs/toolkit";
-import fetchTimetable from "@thunks/fetchTimetable";
-import { type DepartureList } from "@/types/types";
-
-const timetableSlice = createSlice({
-    name: "timetable",
-    initialState: {
-        hStreet: {
-            departureList: [] as DepartureList[],
-        },
-        pStreet: {
-            departureList: [] as DepartureList[],
-        },
-    },
-    reducers: {},
-    extraReducers: (builder) => {
-        builder.addCase(fetchTimetable.fulfilled, (state, action) => {
-            state.hStreet = action.payload.hStreet;
-            state.pStreet = action.payload.pStreet;
-        });
-    },
-});
-
-export default timetableSlice;
--- a/src/store/thunks/fetchFlatasticChores.ts
+++ b/src/store/thunks/fetchFlatasticChores.ts
@@ -1,22 +0,0 @@
-import { createAsyncThunk } from "@reduxjs/toolkit";
-import { Flatastic } from "@/api/flatastic";
-
-const fetchFlatasticChores = createAsyncThunk("flatastic/chores", async () => {
-    if (!import.meta.env.VITE_FLATTASTIC_API_KEY) {
-        throw new Error("Flatastic API Key is not set");
-    }
-    const flatastic = new Flatastic(import.meta.env.VITE_FLATTASTIC_API_KEY);
-    const data = await new Promise((resolve, reject) => {
-        flatastic.getTaskList((info) => {
-            if (info.error) {
-                reject(new Error(info.error));
-            } else {
-                resolve(info);
-            }
-        });
-    });
-
-    return data;
-});
-
-export default fetchFlatasticChores;
--- a/src/store/thunks/fetchTimetable.ts
+++ b/src/store/thunks/fetchTimetable.ts
@@ -1,18 +0,0 @@
-import { createAsyncThunk } from "@reduxjs/toolkit";
-import { callApi } from "@/api/api";
-
-const fetchTimetable = createAsyncThunk("timetable/fetchTimeTable", async () => {
-    const hStreetStopId = 7000044;
-    const pStreetStopId = 7000045;
-    const hStreetData = await callApi(hStreetStopId);
-    const pStreetData = await callApi(pStreetStopId);
-    const hStreetJson = await hStreetData.json();
-    const pStreetJson = await pStreetData.json();
-
-    return {
-        hStreet: hStreetJson,
-        pStreet: pStreetJson,
-    };
-});
-
-export default fetchTimetable;
--- a/src/types/departureType.ts
+++ b/src/types/departureType.ts
@@ -0,0 +1,15 @@
+export type DepartureType = {
+	dateTime: {
+		year: number;
+		month: number;
+		day: number;
+		hour: number;
+		minute: number;
+	};
+	servingLine: {
+		number: string;
+		name: string;
+		direction: string;
+	};
+	stopID: number;
+};
--- a/src/types/flatasticChore.ts
+++ b/src/types/flatasticChore.ts
@@ -0,0 +1,13 @@
+interface FlatasticChore {
+	id: number;
+	title: string;
+	details: string | null;
+	users: Array<number>;
+	points: number;
+	rotationTime: number;
+	currentUser: number;
+	lastDoneDate: string;
+	timeLeftNext: number;
+}
+
+export type { FlatasticChore };
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -1,14 +0,0 @@
-export type DepartureList = {
-    dateTime: {
-        year: number;
-        month: number;
-        day: number;
-        hour: number;
-        minute: number;
-    };
-    servingLine: {
-        number: string;
-        name: string;
-        direction: string;
-    };
-};
--- a/tsconfig.app.json
+++ b/tsconfig.app.json
@@ -22,7 +22,7 @@
 			"@api/*": ["src/api/*"],
 			"@types/*": ["src/types/*"],
 			"@thunks/*": ["src/store/thunks/*"],
-            "@slices/*": ["src/store/slices/*"],
+			"@slices/*": ["src/store/slices/*"]
 		},

 		/* Linting */