import React from 'react'
import { View } from 'react-native'
import SwitchToggle from 'react-native-switch-toggle'
import appColors from '../../../../../theme/appColors'
import styles from './styles'
import { useValues } from '../../../../../utils/context'

interface ToggleProps {
  switchOn: boolean
  onPress: any
  background?: string
}

export function Switch({ switchOn, onPress, background }: ToggleProps | any) {
  const { isDark } = useValues()

  return (
    <View>
      <SwitchToggle
        switchOn={switchOn}
        onPress={onPress}
        containerStyle={styles.containerStyles}
        circleStyle={styles.circleStyles}
        backgroundColorOff={isDark ? appColors.darkborder : appColors.loader}
        backgroundColorOn={appColors.black}
        circleColorOn={appColors.white}
        circleColorOff={isDark ? appColors.white : appColors.white}
      />
    </View>
  )
}
