import { TCanMakePaymentResult } from "@/components/PaymentPage/methods/StripeButton";
import CreditCard from "@/components/ui/PaymentMethodsButtons/CreditCard";
import PaymentButtons from "@/components/ui/PaymentMethodsButtons/PaymentButtons";

export enum EPaymentMethod {
  CREDIT_CARD = "card",
  PAYMENT_BUTTONS = "paymentButtons",
}

export interface IPaymentMethod {
  id: EPaymentMethod;
  component: JSX.Element;
}

// export const paymentMethods: IPaymentMethod[] = [
//   {
//     id: EPaymentMethod.PAYMENT_BUTTONS,
//     component: <PaymentButtons />,
//   },
//   {
//     id: EPaymentMethod.CREDIT_CARD,
//     component: <CreditCard />,
//   },
// ];

export function paymentMethods(
  availableMethods: TCanMakePaymentResult
): IPaymentMethod[] {
  let methods = [
    {
      id: EPaymentMethod.PAYMENT_BUTTONS,
      component: <PaymentButtons availableMethods={availableMethods} />,
    },
    {
      id: EPaymentMethod.CREDIT_CARD,
      component: <CreditCard />,
    },
  ];

  if (!availableMethods) {
    methods = methods.filter(
      (method) => method.id !== EPaymentMethod.PAYMENT_BUTTONS
    );
  }
  return methods;
}