import { BillingTypo } from "@/types";
import { useTranslations } from "next-intl";
import { TextField } from "@/components/form/text-field";

export function Tabby({ user, register }: BillingTypo) {
    const t = useTranslations();
    return (
        <div className="grid md:grid-cols-2 gap-2">
            <TextField
                label={t("checkout.name")}
                placeholder={user?.my_full_name}
                registerFor="name"
                register={register}
                required
            />

            <TextField
                label={t("checkout.email")}
                type="email"
                placeholder={user?.email}
                registerFor="email"
                register={register}
                required
            />
            <div className="md:col-span-2 w-full ">
                <TextField
                    label={t("checkout.phone")}
                    type="tel"
                    className="!max-w-full"
                    placeholder={user?.phone || t("placeholder.phone")}
                    registerFor="phone"
                    register={register}
                    required
                />
            </div>

            
        </div>
    )
}