streamyfin/components/settings/OptimizedServerForm.tsx

import { useTranslation } from "react-i18next";
import { Linking, TextInput, View } from "react-native";
import { Text } from "../common/Text";

interface Props {
  value: string;
  onChangeValue: (value: string) => void;
}

export const OptimizedServerForm: React.FC<Props> = ({
  value,
  onChangeValue,
}) => {
  const handleOpenLink = () => {
    Linking.openURL("https://github.com/streamyfin/optimized-versions-server");
  };

  const { t } = useTranslation();

  return (
    <View>
      <View className='flex flex-col rounded-xl overflow-hidden pl-4 bg-neutral-900 px-4'>
        <View className={`flex flex-row items-center bg-neutral-900 h-11 pr-4`}>
          <Text className='mr-4'>{t("home.settings.downloads.url")}</Text>
          <TextInput
            className='text-white'
            placeholder={t("home.settings.downloads.server_url_placeholder")}
            value={value}
            keyboardType='url'
            returnKeyType='done'
            autoCapitalize='none'
            textContentType='URL'
            onChangeText={(text) => onChangeValue(text)}
          />
        </View>
      </View>
      <Text className='px-4 text-xs text-neutral-500 mt-1'>
        {t("home.settings.downloads.optimized_version_hint")}{" "}
        <Text className='text-blue-500' onPress={handleOpenLink}>
          {t("home.settings.downloads.read_more_about_optimized_server")}
        </Text>
      </Text>
    </View>
  );
};