123 lines
3.9 KiB
TypeScript
123 lines
3.9 KiB
TypeScript
'use client'
|
|
|
|
import { useEffect, useState } from 'react'
|
|
import { Setting } from '../componets/Setting'
|
|
import { writeNormalConfig } from '../util/BazookaManager'
|
|
import { useGlobal } from '../GlobalProvider'
|
|
|
|
export default function Settings () {
|
|
const [allowNotifications, setAllowNotifications] = useState(false)
|
|
const [alwaysShowGamesInSidebar, setAlwaysShowGamesInSidebar] =
|
|
useState(false)
|
|
const [theme, setTheme] = useState(0)
|
|
|
|
const [loaded, setLoaded] = useState(false)
|
|
const { normalConfig, setNormalConfig } = useGlobal()
|
|
|
|
useEffect(() => {
|
|
;(async () => {
|
|
while (normalConfig != null) {
|
|
setAllowNotifications(normalConfig.settings.allowNotifications)
|
|
setAlwaysShowGamesInSidebar(
|
|
normalConfig.settings.alwaysShowGamesInSidebar
|
|
)
|
|
setTheme(normalConfig.settings.theme)
|
|
setLoaded(true)
|
|
break
|
|
}
|
|
})()
|
|
}, [normalConfig])
|
|
|
|
return (
|
|
<>
|
|
<p className='text-3xl ml-4 mt-4'>Settings</p>
|
|
{loaded && (
|
|
<div className='ml-4 mt-4 bg-(--col1) border border-(--col3) rounded-lg p-4 w-fit h-fit'>
|
|
<Setting
|
|
label='Allow sending notifications'
|
|
value={allowNotifications}
|
|
onChange={async () => {
|
|
while (normalConfig != null) {
|
|
setAllowNotifications(!allowNotifications)
|
|
setNormalConfig({
|
|
...normalConfig,
|
|
settings: {
|
|
...normalConfig.settings,
|
|
allowNotifications: !allowNotifications
|
|
}
|
|
})
|
|
writeNormalConfig({
|
|
...normalConfig,
|
|
settings: {
|
|
...normalConfig.settings,
|
|
allowNotifications: !allowNotifications
|
|
}
|
|
})
|
|
break
|
|
}
|
|
}}
|
|
/>
|
|
<Setting
|
|
label='Always show games in sidebar'
|
|
value={alwaysShowGamesInSidebar}
|
|
onChange={async () => {
|
|
while (normalConfig != null) {
|
|
setAlwaysShowGamesInSidebar(!alwaysShowGamesInSidebar)
|
|
setNormalConfig({
|
|
...normalConfig,
|
|
settings: {
|
|
...normalConfig.settings,
|
|
alwaysShowGamesInSidebar: !alwaysShowGamesInSidebar
|
|
}
|
|
})
|
|
writeNormalConfig({
|
|
...normalConfig,
|
|
settings: {
|
|
...normalConfig.settings,
|
|
alwaysShowGamesInSidebar: !alwaysShowGamesInSidebar
|
|
}
|
|
})
|
|
break
|
|
}
|
|
}}
|
|
/>
|
|
<div>
|
|
<label className='text-lg'>Theme:</label>
|
|
<select
|
|
className='ml-2 bg-(--col2) border border-(--col4) rounded-md'
|
|
value={theme}
|
|
onChange={async e => {
|
|
const newTheme = parseInt(e.target.value)
|
|
while (normalConfig != null) {
|
|
setTheme(newTheme)
|
|
setNormalConfig({
|
|
...normalConfig,
|
|
settings: {
|
|
...normalConfig.settings,
|
|
theme: newTheme
|
|
}
|
|
})
|
|
writeNormalConfig({
|
|
...normalConfig,
|
|
settings: {
|
|
...normalConfig.settings,
|
|
theme: newTheme
|
|
}
|
|
})
|
|
break
|
|
}
|
|
}}
|
|
>
|
|
<option value={0}>Dark (default)</option>
|
|
<option value={1}>Red</option>
|
|
<option value={2}>Green</option>
|
|
<option value={3}>Blue</option>
|
|
<option value={4}>Purple</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</>
|
|
)
|
|
}
|