import { ListItem } from '@my/ui'
import { ChevronRight } from '@tamagui/lucide-icons'
import type { SettingsItemProps } from '@my/ui'
import { useCallback } from 'react'
import { Linking } from 'react-native'

export interface SettingsAlertProps {
  title: string
  message: string
}

export const SettingsLink = (props: SettingsItemProps<'link'>) => {
  const { label, icon, description, disabled, options } = props

  const gotoLink = useCallback(async () => {
    const { url } = options
    const supported = await Linking.canOpenURL(url)
    if (supported) {
      await Linking.openURL(url)
    } else {
      console.log('无法打开该 URL: ' + url)
    }
  }, [options])

  return (
    <>
      <ListItem
        hoverTheme
        pressTheme
        title={label}
        subTitle={description}
        icon={icon}
        disabled={disabled}
        onPress={gotoLink}
        iconAfter={ChevronRight}
      />
    </>
  )
}
