yolokube/dashboard
yolokube/dashboard
2
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages 1 Wiki Activity

Merge branch 'master' into feature/defaultsearchprovider

Browse source
This commit is contained in:
phntxx 2021-06-21 20:16:40 +02:00
commit 0ce5d3aea6
53 changed files with 2934 additions and 1856 deletions
Download patch file Download diff file Expand all files Collapse all files

32
src/lib/fetcher.d.ts vendored Normal file
View file

@ -0,0 +1,32 @@
import { ISearchProps } from "../components/searchBar";
import { IBookmarkGroupProps } from "../components/bookmarkGroup";
import { IAppCategoryProps } from "../components/appCategory";
import { IAppProps } from "../components/app";
import { IThemeProps } from "./theme";
import { IImprintProps } from "../components/imprint";
import { IGreeterProps } from "../components/greeter";
declare module "../data/apps.json" {
export const categories: IAppCategoryProps[];
export const apps: IAppProps[];
}
declare module "../data/search.json" {
export const search: ISearchProps;
}
declare module "../data/bookmarks.json" {
export const groups: IBookmarkGroupProps[];
}
declare module "../data/themes.json" {
export const themes: IThemeProps[];
}
declare module "../data/imprint.json" {
export const imprint: IImprintProps;
}
declare module "../data/greeter.json" {
export const greeter: IGreeterProps;
}

126
src/lib/fetcher.tsx
View file

@ -1,7 +1,7 @@
import { useCallback, useEffect, useState } from "react";
import { ISearchProps } from "../components/searchBar";
import { IBookmarkGroupProps } from "../components/bookmarkGroup";
import { IBookmarkGroupProps } from "../components/bookmarks";
import { IAppCategoryProps } from "../components/appCategory";
import { IAppProps } from "../components/app";
import { IThemeProps } from "./theme";
@ -17,7 +17,7 @@ const inProduction = process.env.NODE_ENV === "production";
* @returns - The response in JSON
* @throws - Error with given error message if request failed
*/
const handleResponse = (response: Response) => {
export const handleResponse = (response: Response) => {
if (response.ok) return response.json();
throw new Error(errorMessage);
};
@ -56,7 +56,7 @@ export interface IGreeterDataProps {
/**
* Default values for the respective state variables
*/
const defaults = {
export const defaults = {
app: {
categories: [],
apps: [],
@ -102,7 +102,7 @@ const defaults = {
"September",
"October",
"November",
"December"
"December",
],
days: [
"Sunday",
@ -111,34 +111,34 @@ const defaults = {
"Wednesday",
"Thursday",
"Friday",
"Saturday"
"Saturday",
],
greetings: [
{
greeting: "Good night!",
start: 0,
end: 6
end: 6,
},
{
greeting: "Good morning!",
start: 6,
end: 12
end: 12,
},
{
greeting: "Good afternoon!",
start: 12,
end: 18
end: 18,
},
{
greeting: "Good evening!",
start: 18,
end: 0
}
end: 0,
},
],
dateformat: "%wd, %m %d%e %y"
dateformat: "%wd, %m %d%e %y",
},
error: false,
}
},
};
/**
@ -146,47 +146,59 @@ const defaults = {
* @param {string} type - The type of fetch request that threw an error
* @param {Error} error - The error itself
*/
const handleError = (status: string, error: Error) => {
export const handleError = (status: string, error: Error) => {
switch (status) {
case "apps":
return { ...defaults.app, error: error.message }
return { ...defaults.app, error: error.message };
case "bookmark":
return { ...defaults.bookmark, error: error.message }
return { ...defaults.bookmark, error: error.message };
case "searchProvider":
return { ...defaults.search, error: error.message }
return { ...defaults.search, error: error.message };
case "theme":
return { ...defaults.theme, error: error.message }
return { ...defaults.theme, error: error.message };
case "imprint":
return { ...defaults.imprint, error: error.message }
return { ...defaults.imprint, error: error.message };
case "greeter":
return { ...defaults.greeter, error: error.message }
return { ...defaults.greeter, error: error.message };
default:
break;
}
}
};
/**
* Fetches all of the data by doing fetch requests (only available in production)
*/
const fetchProduction = Promise.all([
fetch("/data/apps.json").then(handleResponse).catch((error: Error) => handleError("apps", error)),
fetch("/data/bookmarks.json").then(handleResponse).catch((error: Error) => handleError("bookmark", error)),
fetch("/data/search.json").then(handleResponse).catch((error: Error) => handleError("searchProvider", error)),
fetch("/data/themes.json").then(handleResponse).catch((error: Error) => handleError("theme", error)),
fetch("/data/imprint.json").then(handleResponse).catch((error: Error) => handleError("imprint", error)),
fetch("/data/greeter.json").then(handleResponse).catch((error: Error) => handleError("greeter", error))
export const fetchProduction = Promise.all([
fetch("/data/apps.json")
.then(handleResponse)
.catch((error: Error) => handleError("apps", error)),
fetch("/data/bookmarks.json")
.then(handleResponse)
.catch((error: Error) => handleError("bookmark", error)),
fetch("/data/search.json")
.then(handleResponse)
.catch((error: Error) => handleError("searchProvider", error)),
fetch("/data/themes.json")
.then(handleResponse)
.catch((error: Error) => handleError("theme", error)),
fetch("/data/imprint.json")
.then(handleResponse)
.catch((error: Error) => handleError("imprint", error)),
fetch("/data/greeter.json")
.then(handleResponse)
.catch((error: Error) => handleError("greeter", error)),
]);
/**
* Fetches all of the data by importing it (only available in development)
*/
const fetchDevelopment = Promise.all([
export const fetchDevelopment = Promise.all([
import("../data/apps.json"),
import("../data/bookmarks.json"),
import("../data/search.json"),
import("../data/themes.json"),
import("../data/imprint.json"),
import("../data/greeter.json")
import("../data/greeter.json"),
]);
/**
@ -196,32 +208,56 @@ export const useFetcher = () => {
const [appData, setAppData] = useState<IAppDataProps>(defaults.app);
const [bookmarkData, setBookmarkData] = useState<IBookmarkDataProps>(
defaults.bookmark
defaults.bookmark,
);
const [
searchProviderData,
setSearchProviderData,
] = useState<ISearchDataProps>(defaults.search);
const [searchProviderData, setSearchProviderData] =
useState<ISearchDataProps>(defaults.search);
const [themeData, setThemeData] = useState<IThemeDataProps>(defaults.theme);
const [imprintData, setImprintData] = useState<IImprintDataProps>(
defaults.imprint
defaults.imprint,
);
const [greeterData, setGreeterData] = useState<IGreeterDataProps>(defaults.greeter);
const [greeterData, setGreeterData] = useState<IGreeterDataProps>(
defaults.greeter,
);
const callback = useCallback(() => {
(inProduction ? fetchProduction : fetchDevelopment).then(
([appData, bookmarkData, searchData, themeData, imprintData, greeterData]: [IAppDataProps, IBookmarkDataProps, ISearchDataProps, IThemeDataProps, IImprintDataProps, IGreeterDataProps]) => {
setAppData((appData.error) ? appData : { ...appData, error: false });
setBookmarkData((bookmarkData.error) ? bookmarkData : { ...bookmarkData, error: false });
setSearchProviderData((searchData.error) ? searchData : { ...searchData, error: false });
setThemeData((themeData.error) ? themeData : { ...themeData, error: false });
setImprintData((imprintData.error) ? imprintData : { ...imprintData, error: false });
setGreeterData((greeterData.error) ? greeterData : { ...greeterData, error: false });
}
([
appData,
bookmarkData,
searchData,
themeData,
imprintData,
greeterData,
]: [
IAppDataProps,
IBookmarkDataProps,
ISearchDataProps,
IThemeDataProps,
IImprintDataProps,
IGreeterDataProps,
]) => {
setAppData(appData.error ? appData : { ...appData, error: false });
setBookmarkData(
bookmarkData.error ? bookmarkData : { ...bookmarkData, error: false },
);
setSearchProviderData(
searchData.error ? searchData : { ...searchData, error: false },
);
setThemeData(
themeData.error ? themeData : { ...themeData, error: false },
);
setImprintData(
imprintData.error ? imprintData : { ...imprintData, error: false },
);
setGreeterData(
greeterData.error ? greeterData : { ...greeterData, error: false },
);
},
);
}, []);
@ -234,7 +270,7 @@ export const useFetcher = () => {
themeData,
imprintData,
greeterData,
callback
callback,
};
};

13
src/lib/theme.tsx
View file

@ -6,7 +6,7 @@ export interface IThemeProps {
backgroundColor: string;
}
const defaultTheme: IThemeProps = {
export const defaultTheme: IThemeProps = {
label: "Classic",
value: 0,
mainColor: "#000000",
@ -18,8 +18,8 @@ const defaultTheme: IThemeProps = {
* Writes a given theme into localStorage
* @param {string} theme - the theme that shall be saved (in stringified JSON)
*/
export const setTheme = (theme: string) => {
if (theme !== undefined) localStorage.setItem("theme", theme);
export const setTheme = (theme: IThemeProps) => {
localStorage.setItem("theme", JSON.stringify(theme));
window.location.reload();
};
@ -27,12 +27,11 @@ export const setTheme = (theme: string) => {
* Function that gets the saved theme from localStorage or returns the default
* @returns {IThemeProps} the saved theme or the default theme
*/
const getTheme = (): IThemeProps => {
export const getTheme = (): IThemeProps => {
let selectedTheme = defaultTheme;
if (localStorage.getItem("theme") !== null) {
selectedTheme = JSON.parse(localStorage.getItem("theme") || "{}");
}
let theme = localStorage.getItem("theme");
if (theme !== null) selectedTheme = JSON.parse(theme || "{}");
return selectedTheme;
};