diff --git a/components/inputs/Stepper.tsx b/components/inputs/Stepper.tsx index eb5032cf..86a4ffa9 100644 --- a/components/inputs/Stepper.tsx +++ b/components/inputs/Stepper.tsx @@ -1,8 +1,10 @@ import {TouchableOpacity, View} from "react-native"; import {Text} from "@/components/common/Text"; +import DisabledSetting from "@/components/settings/DisabledSetting"; interface StepperProps { value: number, + disabled?: boolean, step: number, min: number, max: number, @@ -12,6 +14,7 @@ interface StepperProps { export const Stepper: React.FC = ({ value, + disabled, step, min, max, @@ -19,7 +22,11 @@ export const Stepper: React.FC = ({ appendValue }) => { return ( - + onUpdate(Math.max(min, value - step))} className="w-8 h-8 bg-neutral-800 rounded-l-lg flex items-center justify-center" @@ -39,6 +46,6 @@ export const Stepper: React.FC = ({ > + - + ) } \ No newline at end of file diff --git a/components/settings/MediaToggles.tsx b/components/settings/MediaToggles.tsx index 7e4c4346..6283cb03 100644 --- a/components/settings/MediaToggles.tsx +++ b/components/settings/MediaToggles.tsx @@ -1,72 +1,61 @@ -import React from "react"; -import { TouchableOpacity, View, ViewProps } from "react-native"; +import React, {useMemo} from "react"; +import { ViewProps } from "react-native"; import { useSettings } from "@/utils/atoms/settings"; import { ListGroup } from "../list/ListGroup"; import { ListItem } from "../list/ListItem"; -import { Text } from "../common/Text"; +import DisabledSetting from "@/components/settings/DisabledSetting"; +import {Stepper} from "@/components/inputs/Stepper"; interface Props extends ViewProps {} export const MediaToggles: React.FC = ({ ...props }) => { - const [settings, updateSettings] = useSettings(); + const [settings, updateSettings, pluginSettings] = useSettings(); if (!settings) return null; - const renderSkipControl = ( - value: number, - onDecrease: () => void, - onIncrease: () => void - ) => ( - - - - - - - {value}s - - - + - - - ); + const disabled = useMemo(() => ( + pluginSettings?.forwardSkipTime?.locked === true && + pluginSettings?.rewindSkipTime?.locked === true + ), + [pluginSettings] + ) return ( - + - - {renderSkipControl( - settings.forwardSkipTime, - () => - updateSettings({ - forwardSkipTime: Math.max(0, settings.forwardSkipTime - 5), - }), - () => - updateSettings({ - forwardSkipTime: Math.min(60, settings.forwardSkipTime + 5), - }) - )} + + updateSettings({forwardSkipTime})} + /> - - {renderSkipControl( - settings.rewindSkipTime, - () => - updateSettings({ - rewindSkipTime: Math.max(0, settings.rewindSkipTime - 5), - }), - () => - updateSettings({ - rewindSkipTime: Math.min(60, settings.rewindSkipTime + 5), - }) - )} + + updateSettings({rewindSkipTime})} + /> - + ); }; diff --git a/utils/atoms/settings.ts b/utils/atoms/settings.ts index 0ed9199b..993c722d 100644 --- a/utils/atoms/settings.ts +++ b/utils/atoms/settings.ts @@ -223,11 +223,16 @@ export const useSettings = () => { ) // We do not want to save over users pre-existing settings in case admin ever removes/unlocks a setting. + // If admin sets locked to false but provides a value, + // use user settings first and fallback on admin setting if required. const settings: Settings = useMemo(() => { const overrideSettings = Object.entries(pluginSettings || {}) - .reduce((acc, [key, value]) => { - if (value) { - acc = Object.assign(acc, {[key]: value.value}) + .reduce((acc, [key, setting]) => { + if (setting) { + const {value, locked} = setting + acc = Object.assign(acc, { + [key]: locked ? value : _settings?.[key as keyof Settings] ?? value + }) } return acc }, {} as Settings)