Styled Homepage

src/pages/homepage/Homepage.tsx

@@ -6,16 +6,14 @@ import Header from './components/Header';
 import Applications from './components/Applications';
 import Bookmarks from './components/Bookmarks';
 import SettingsButton from './components/SettingsButton';
-import { useAtom } from 'jotai';
-import { HomepageFilters } from '../../contexts/HomepageFilters';
 import { useEffect, useState } from 'react';
+import '../../index.css';
+import { useLocalStorage } from '@mantine/hooks';
 
-
-export default function Homepage() {
+export default function Homepage({theme}:any) {
 	const { data, isFetching } = useQueryAPI({ endpoint: 'api/messages' });
 	const [displayedGreeting, setDisplayedGreeting] = useState('');
-	const [homepageFilter, setHomepageFilter] = useAtom<any>(HomepageFilters);
-	
+	const [contentType, setContentType] = useLocalStorage<any>({ key: 'contenttype', defaultValue: 'All' });
 	function date() {
 		const currentDate = new Date();
 		const dateOptions: Intl.DateTimeFormatOptions = {
@@ -27,7 +25,6 @@ export default function Homepage() {
 		const date = currentDate.toLocaleDateString('en-GB', dateOptions);
 		return date;
 	}
-
 	function greet(list: any) {
 		const currentTime = new Date();
 		const greet = Math.floor(currentTime.getHours() / 6);
@@ -54,12 +51,12 @@ export default function Homepage() {
 	}, [isFetching]);
 
 	return (
-		<Stack className={stackClasses.containerStack}>
+		<Stack gap={0} className={stackClasses.containerStack} justify='center'>
 			<Search />
 			<Header date={date()} greet={displayedGreeting} />
-			<Applications />
-			<Bookmarks />
-			<SettingsButton />
+			<Applications contentType={contentType}/>
+			<Bookmarks contentType={contentType}/>
+			<SettingsButton theme={theme} contentType={contentType} setContentType={setContentType}/>
 		</Stack>
 	);
 }