import { LucideChevronRight, LucideSend } from "lucide-react-native";
import React from "react";
import { View, Text, Image } from "react-native";
import { useTranslation } from "react-i18next";
import { Button } from "~/components/ui/button";

export default function RecipCard() {
  const { t } = useTranslation();

  return (
    <View className="flex flex-row justify-between w-full items-center py-2 bg-green-50 rounded-md px-3">
      <View className="flex flex-row space-x-2 items-center">
        <View className=" rounded ">
          <Image
            source={{
              uri: "https://www.gravatar.com/avatar/2c7d99fe281ecd3bcd65ab915bac6dd5?s=250",
            }}
            alt=""
            className="w-12 h-12 rounded"
          />
        </View>
        <View className="flex space-y-1">
          <Text className="font-dmsans text-primary ">
            {t("components.recipcard.name")}
          </Text>
          <Text className="font-dmsans-medium  text-secondary">
            {t("components.recipcard.accountNumber")}
          </Text>
        </View>
      </View>

      <View className="flex space-y-1">
        <Button className="bg-green-50 rounded-md">
          <LucideChevronRight className="text-secondary text-base" />
        </Button>
      </View>
    </View>
  );
}