import ProInputCard from "components/ProInputCard/ProInputCard.tsx";
import ProPhoneInput from "components/ProPhoneInput";
import { selectCart, updatePhone } from "features/order/orderSlice";
import { useTranslation } from "react-i18next";
import { useAppDispatch, useAppSelector } from "redux/hooks";
import { OrderType } from "pages/checkout/hooks/types.ts";

export default function PhoneCard() {
  const { t } = useTranslation();
  const dispatch = useAppDispatch();
  const { phone, orderType } = useAppSelector(selectCart);

  return (
    orderType !== OrderType.Gift && (
      <>
        <ProInputCard title={t("checkout.phoneNumber")}>
          <ProPhoneInput
            phone={phone}
            setPhone={(phone) => dispatch(updatePhone(phone))}
          />
        </ProInputCard>
      </>
    )
  );
}
