unimore/pds-2021-g2-nest
unimore/pds-2021-g2-nest
1
Fork 0
mirror of https://github.com/pds-nest/nest.git synced 2024-11-25 06:24:19 +00:00
Code Activity

🧹 Refactor setAndSaveTheme in its own hook

Browse source
This commit is contained in:
Stefano Pigozzi 2021-04-23 01:29:51 +02:00
parent 9f341b2401
commit 9e6a4c0c3f
Signed by untrusted user who does not match committer: steffo
GPG key ID: 6965406171929D01
2 changed files with 50 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
code/frontend/src/App.js
View file

@ -10,50 +10,11 @@ import PageRepositories from "./routes/PageRepositories"
import PageAlerts from "./routes/PageAlerts" import PageAlerts from "./routes/PageAlerts"
import PageSettings from "./routes/PageSettings" import PageSettings from "./routes/PageSettings"
import PageSandbox from "./routes/PageSandbox" import PageSandbox from "./routes/PageSandbox"
import useSavedTheme from "./hooks/useSavedTheme"
export default function App() { export default function App() {
const loadTheme = () => { const [theme, setAndSaveTheme] = useSavedTheme();
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 ( return (
<ContextTheme.Provider value={[theme, setAndSaveTheme]}> <ContextTheme.Provider value={[theme, setAndSaveTheme]}>

48
code/frontend/src/hooks/useSavedTheme.js Normal file
View file

@ -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]
}