Browse Source

Add checkboxes to state

- dynamic background
- highlight on row hover
master
jeffvli 3 years ago
committed by Jeff
parent
commit
b9e1a338f9
  1. 22
      src/components/settings/ConfigPanels/LookAndFeelConfig.tsx

22
src/components/settings/ConfigPanels/LookAndFeelConfig.tsx

@ -35,6 +35,12 @@ const LookAndFeelConfig = () => {
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const [currentLAFTab, setCurrentLAFTab] = useState('songList'); const [currentLAFTab, setCurrentLAFTab] = useState('songList');
const [resizableColumn, setResizableColumn] = useState(false); const [resizableColumn, setResizableColumn] = useState(false);
const [dynamicBackgroundChk, setDynamicBackgroundChk] = useState(
Boolean(settings.getSync('dynamicBackground'))
);
const [highlightOnRowHoverChk, setHighlightOnRowHoverChk] = useState(
Boolean(settings.getSync('highlightOnRowHover'))
);
const songCols: any = settings.getSync('musicListColumns'); const songCols: any = settings.getSync('musicListColumns');
const albumCols: any = settings.getSync('albumListColumns'); const albumCols: any = settings.getSync('albumListColumns');
@ -68,10 +74,12 @@ const LookAndFeelConfig = () => {
<br /> <br />
<StyledCheckbox <StyledCheckbox
defaultChecked={settings.getSync('dynamicBackground')} defaultChecked={dynamicBackgroundChk}
checked={dynamicBackgroundChk}
onChange={() => { onChange={() => {
settings.setSync('dynamicBackground', !settings.getSync('dynamicBackground')); settings.setSync('dynamicBackground', !dynamicBackgroundChk);
dispatch(setDynamicBackground(Boolean(settings.getSync('dynamicBackground')))); dispatch(setDynamicBackground(!dynamicBackgroundChk));
setDynamicBackgroundChk(!dynamicBackgroundChk);
}} }}
> >
Enable dynamic background Enable dynamic background
@ -118,15 +126,17 @@ const LookAndFeelConfig = () => {
<br /> <br />
<ConfigPanel header="List-View" bordered> <ConfigPanel header="List-View" bordered>
<StyledCheckbox <StyledCheckbox
defaultChecked={settings.getSync('highlightOnRowHover')} defaultChecked={highlightOnRowHoverChk}
checked={highlightOnRowHoverChk}
onChange={() => { onChange={() => {
settings.setSync('highlightOnRowHover', !settings.getSync('highlightOnRowHover')); settings.setSync('highlightOnRowHover', !highlightOnRowHoverChk);
dispatch( dispatch(
setMiscSetting({ setMiscSetting({
setting: 'highlightOnRowHover', setting: 'highlightOnRowHover',
value: Boolean(settings.getSync('highlightOnRowHover')), value: !highlightOnRowHoverChk,
}) })
); );
setHighlightOnRowHoverChk(!highlightOnRowHoverChk);
}} }}
> >
Show highlight on row hover Show highlight on row hover

Loading…
Cancel
Save