Slight refactor

src/hooks/useCommonHooks.ts

@@ -0,0 +1,204 @@
+import { useLocalStorage } from '@mantine/hooks';
+import { appTheme } from 'contexts';
+import { useAtom } from 'jotai';
+import { useEffect, useState } from 'react';
+import { useQueryAPI, useWeatherAPI } from './useAPI';
+
+export function useCommonHooks() {
+	const isMobile = window.matchMedia('(max-width: 600px)').matches;
+	const {
+		data: apps,
+		isFetching: isAppsFetching,
+		isLoading: isAppsLoading,
+	} = useQueryAPI({ endpoint: 'api/apps' });
+	const { data: allThemes, isFetched: isAllThemesFetched } = useQueryAPI({
+		endpoint: 'api/themes',
+	});
+	const { data: backgrounds, isFetched: isBackgroundFetched } = useQueryAPI({
+		endpoint: 'api/backgrounds',
+	});
+	const {
+		data: messages,
+		isFetching: isMessagesFetching,
+		isFetched: isMessagesFetched,
+		isLoading: isMessagesLoading,
+	} = useQueryAPI({
+		endpoint: 'api/messages',
+	});
+	const {
+		data: linkData,
+		isFetched: linksIsFetched,
+		isFetching: linksIsFetching,
+		isLoading: linksIsLoading,
+	} = useQueryAPI({
+		endpoint: 'api/links',
+	});
+	const {
+		data: groupData,
+		isFetched: groupsIsFetched,
+		isFetching: groupsIsFetching,
+		isLoading: groupsIsLoading,
+	} = useQueryAPI({
+		endpoint: 'api/categories',
+	});
+	const {
+		data: personal,
+		isFetched: personalIsFetched,
+		isFetching: personalIsFetching,
+		isLoading: personalIsLoading,
+	} = useQueryAPI({
+		endpoint: 'api/personalData',
+	});
+	const {
+		data: providers,
+		isFetched: providersIsFetched,
+		isFetching: providersIsFetching,
+		isLoading: providersIsLoading,
+	} = useQueryAPI({ endpoint: 'api/providers' });
+	const { data: basicWeather } = useWeatherAPI({ endpoint: 'baseline' });
+	const { data: weather } = useWeatherAPI({ endpoint: 'current' });
+	const { data: forecast } = useWeatherAPI({ endpoint: 'forecast' });
+	const { data: hourly } = useWeatherAPI({ endpoint: 'hourly' });
+	const [theme, setTheme] = useAtom(appTheme);
+	const [themeName, setThemeName] = useLocalStorage<any>({
+		key: 'theme',
+		defaultValue: 'blackboard',
+	});
+	const [appFilter, setAppFilter] = useLocalStorage<[any]>({
+		key: 'appFilter',
+		defaultValue: ['All'],
+	});
+	const [bookmarkFilter, setBookmarkFilter] = useLocalStorage<[any]>({
+		key: 'bookmarkFilter',
+		defaultValue: ['All'],
+	});
+	const [currentTheme, setCurrentTheme] = useLocalStorage<any>({
+		key: 'theme',
+		defaultValue: 'blackboard',
+	});
+	const [searchValue, setSearchValue] = useState('');
+	const [providerLabel, setProviderLabel] = useState('Google Search');
+	const [providerURL, setProviderURL] = useState('https://www.google.com/search?q=');
+	const handleThemeChange = (themes: any, save: any) => {
+		const enabled = themes
+			.filter((t: any) => t.randomEnabled)
+			.filter((t: any) => t.name !== theme.name);
+		if (enabled.length === 0) {
+			setTheme(themes[0]);
+			save && setThemeName(themes[0].name);
+		} else {
+			const index = Math.floor(Math.random() * enabled.length);
+			setTheme(enabled[index]);
+			save && setThemeName(enabled[index].name);
+		}
+	};
+
+	const [applicationData, setApplicationData] = useState<any>([]);
+
+	useEffect(() => {
+		if (apps && !isAppsFetching) {
+			setApplicationData(apps);
+		}
+	}, [apps, isAppsFetching]);
+
+	const [bookmarkData, setBookmarkData] = useState<any>([]);
+
+	const [groups, setGroups] = useState([]);
+
+	useEffect(() => {
+		if (linkData && linksIsFetched) {
+			setBookmarkData(linkData);
+		}
+	}, [linksIsFetched, linkData]);
+
+	useEffect(() => {
+		if (groupData && groupsIsFetched) {
+			const groupList = groupData?.map((category: any) => {
+				return category.categoryName;
+			});
+			setGroups(groupList);
+		}
+	}, [groupData, groupsIsFetched]);
+
+	const [messageData, setMessageData] = useState<any>([]);
+
+	useEffect(() => {
+		if (messages && isMessagesFetched) {
+			setMessageData(messages);
+		}
+	}, [messages, isMessagesFetched]);
+
+	const [personalData, setPersonalData] = useState<any>([]);
+
+	useEffect(() => {
+		if (personal && personalIsFetched) {
+			setPersonalData(personal);
+		}
+	}, [personal, personalIsFetched]);
+
+	const [providerData, setProviderData] = useState<any>([]);
+
+	useEffect(() => {
+		if (providers && providersIsFetched) {
+			setProviderData(providers);
+		}
+	}, [providers, providersIsFetched]);
+
+	return {
+		isMobile,
+		theme,
+		setTheme,
+		allThemes,
+		backgrounds,
+		isBackgroundFetched,
+		isAllThemesFetched,
+		messages,
+		isMessagesFetching,
+		basicWeather,
+		weather,
+		forecast,
+		hourly,
+		handleThemeChange,
+		themeName,
+		setThemeName,
+		appFilter,
+		setAppFilter,
+		bookmarkFilter,
+		setBookmarkFilter,
+		currentTheme,
+		setCurrentTheme,
+		searchValue,
+		setSearchValue,
+		providerLabel,
+		setProviderLabel,
+		providerURL,
+		setProviderURL,
+		providers,
+		providerData,
+		providersIsFetched,
+		providersIsFetching,
+		providersIsLoading,
+		linkData,
+		linksIsFetched,
+		groupData,
+		groupsIsFetched,
+		apps,
+		isAppsFetching,
+		isAppsLoading,
+		applicationData,
+		bookmarkData,
+		groups,
+		linksIsFetching,
+		linksIsLoading,
+		groupsIsFetching,
+		groupsIsLoading,
+		messageData,
+		isMessagesFetched,
+		isMessagesLoading,
+		personal,
+		personalData,
+		personalIsFetched,
+		personalIsFetching,
+		personalIsLoading,
+	};
+}