From 9e6a4c0c3f783ffe51e429a21f84abcd9d2fab05 Mon Sep 17 00:00:00 2001 From: Stefano Pigozzi <256895@studenti.unimore.it> Date: Fri, 23 Apr 2021 01:29:51 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=A7=B9=20Refactor=20setAndSaveTheme=20in?= =?UTF-8?q?=20its=20own=20hook?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- code/frontend/src/App.js | 43 +-------------------- code/frontend/src/hooks/useSavedTheme.js | 48 ++++++++++++++++++++++++ 2 files changed, 50 insertions(+), 41 deletions(-) create mode 100644 code/frontend/src/hooks/useSavedTheme.js diff --git a/code/frontend/src/App.js b/code/frontend/src/App.js index e8761a3..607b8ab 100644 --- a/code/frontend/src/App.js +++ b/code/frontend/src/App.js @@ -10,50 +10,11 @@ import PageRepositories from "./routes/PageRepositories" import PageAlerts from "./routes/PageAlerts" import PageSettings from "./routes/PageSettings" import PageSandbox from "./routes/PageSandbox" +import useSavedTheme from "./hooks/useSavedTheme" export default function App() { - const loadTheme = () => { - if(localStorage) { - console.debug(`Loading theme from localStorage...`) - let value = localStorage.getItem("theme") - - if(value) { - console.debug(`Loaded theme ${value}!`) - return value - } - else { - console.debug(`There is no theme stored in the localStorage; setting to "ThemeDark"...`) - return "ThemeDark" - } - } - else { - console.warn(`Can't load theme; localStorage doesn't seem to be available; setting to "ThemeDark"...`) - return "ThemeDark" - } - } - - const [theme, _setTheme] = useState(loadTheme()); - - const setTheme = (value) => { - console.debug(`Changing theme to ${value}...`) - _setTheme(value) - } - - const saveTheme = (value) => { - if(localStorage) { - console.debug(`Saving theme ${value} to localStorage...`) - localStorage.setItem("theme", value) - } - else { - console.warn(`Can't save theme; localStorage doesn't seem to be available...`) - } - } - - const setAndSaveTheme = (value) => { - setTheme(value) - saveTheme(value) - } + const [theme, setAndSaveTheme] = useSavedTheme(); return ( diff --git a/code/frontend/src/hooks/useSavedTheme.js b/code/frontend/src/hooks/useSavedTheme.js new file mode 100644 index 0000000..aa67f00 --- /dev/null +++ b/code/frontend/src/hooks/useSavedTheme.js @@ -0,0 +1,48 @@ +import { useState } from "react" + + +export default function useSavedTheme() { + const loadTheme = () => { + if(localStorage) { + console.debug(`Loading theme from localStorage...`) + let value = localStorage.getItem("theme") + + if(value) { + console.debug(`Loaded theme ${value}!`) + return value + } + else { + console.debug(`There is no theme stored in the localStorage; setting to "ThemeDark"...`) + return "ThemeDark" + } + } + else { + console.warn(`Can't load theme; localStorage doesn't seem to be available; setting to "ThemeDark"...`) + return "ThemeDark" + } + } + + const [theme, _setTheme] = useState(loadTheme()); + + const setTheme = (value) => { + console.debug(`Changing theme to ${value}...`) + _setTheme(value) + } + + const saveTheme = (value) => { + if(localStorage) { + console.debug(`Saving theme ${value} to localStorage...`) + localStorage.setItem("theme", value) + } + else { + console.warn(`Can't save theme; localStorage doesn't seem to be available...`) + } + } + + const setAndSaveTheme = (value) => { + setTheme(value) + saveTheme(value) + } + + return [theme, setAndSaveTheme] +} \ No newline at end of file