46 lines · 1.3 KB · TypeScript
RawDownload
import type { ComponentProps } from "react";import { View } from "react-native"; import { SymbolView } from "../../../components/AppSymbol";import { AppText as Text } from "../../../components/AppText";import { ThemedSwitch } from "../../../components/ThemedSwitch"; type SymbolName = ComponentProps<typeof SymbolView>["name"]; export function SettingsSwitchRow(props: {  readonly disabled?: boolean;  readonly icon: SymbolName;  readonly label: string;  readonly subtitle?: string;  readonly value: boolean;  readonly onValueChange: (value: boolean) => void;}) {  return (    <View      className={        props.disabled          ? "flex-row items-center gap-4 p-4 opacity-[0.45]"          : "flex-row items-center gap-4 p-4"      }    >      <SymbolView        name={props.icon}        size={22}        tintColorClassName={"accent-icon"}        type="monochrome"        weight="regular"      />      <View className="min-w-0 flex-1">        <Text className="text-lg text-foreground">{props.label}</Text>        {props.subtitle ? (          <Text className="text-sm text-foreground-muted">{props.subtitle}</Text>        ) : null}      </View>      <ThemedSwitch        disabled={props.disabled}        onValueChange={props.onValueChange}        value={props.value}      />    </View>  );}