SheWhoReignsSupreme/GoonCord
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: use Checkboxes for Options menu in Themes page

Browse source
This commit is contained in:
kmmiio99o 2026-01-16 18:34:14 +01:00
parent 92f35554ab
commit 53f2425f65
No known key found for this signature in database
GPG key ID: 163FE39F7772D2EC
1 changed files with 18 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
src/core/ui/settings/pages/Themes/index.tsx
View file

@ -19,7 +19,7 @@ import {
BottomSheetTitleHeader,
Button,
TableRowGroup,
TableSwitchRow,
TableCheckboxRow,
TableRowIcon,
} from "@metro/common/components";
import { View } from "react-native";
@ -74,14 +74,12 @@ export default function Themes() {
{/* Changed from TableRadioGroup to individual TableSwitchRow components
for better UX - users can now toggle options individually */}
<TableRowGroup title="Override Theme Type">
<TableSwitchRow
<TableCheckboxRow
label="Auto"
icon={<TableRowIcon source={findAssetId("RobotIcon")} />}
value={!colorsPref.type}
onValueChange={(enabled: boolean) => {
if (enabled) {
colorsPref.type = undefined;
} else {
checked={!colorsPref.type}
onPress={() => {
if (!colorsPref.type) {
colorsPref.type = "dark";
}
getCurrentTheme()?.data &&
@ -90,24 +88,24 @@ export default function Themes() {
});
}}
/>
<TableSwitchRow
<TableCheckboxRow
label="Dark"
icon={<TableRowIcon source={findAssetId("ThemeDarkIcon")} />}
value={colorsPref.type === "dark"}
onValueChange={(enabled: boolean) => {
colorsPref.type = enabled ? "dark" : undefined;
checked={colorsPref.type === "dark"}
onPress={() => {
colorsPref.type = colorsPref.type === "dark" ? undefined : "dark";
getCurrentTheme()?.data &&
updateBunnyColor(getCurrentTheme()!.data!, {
update: true,
});
}}
/>
<TableSwitchRow
<TableCheckboxRow
label="Light"
icon={<TableRowIcon source={findAssetId("ThemeLightIcon")} />}
value={colorsPref.type === "light"}
onValueChange={(enabled: boolean) => {
colorsPref.type = enabled ? "light" : undefined;
checked={colorsPref.type === "light"}
onPress={() => {
colorsPref.type = colorsPref.type === "light" ? undefined : "light";
getCurrentTheme()?.data &&
updateBunnyColor(getCurrentTheme()!.data!, {
update: true,
@ -116,20 +114,13 @@ export default function Themes() {
/>
</TableRowGroup>
<TableRowGroup title="Chat Background">
<TableSwitchRow
<TableCheckboxRow
label="Show Background"
subLabel="Enable or disable themes background on chat"
icon={<TableRowIcon source={findAssetId("ImageIcon")} />}
value={!colorsPref.customBackground}
onValueChange={(enabled: boolean) => {
colorsPref.customBackground = enabled ? null : "hidden";
}}
/>
<TableSwitchRow
label="Hide Background"
icon={<TableRowIcon source={findAssetId("DenyIcon")} />}
value={colorsPref.customBackground === "hidden"}
onValueChange={(enabled: boolean) => {
colorsPref.customBackground = enabled ? "hidden" : null;
checked={!colorsPref.customBackground}
onPress={() => {
colorsPref.customBackground = !colorsPref.customBackground ? "hidden" : null;
}}
/>
</TableRowGroup>