import { useMemo } from 'react';
import { BillingScreenPropsQuery } from 'types/graphql';
import {
  BillingInformation,
  isEmpty,
} from 'components/billing/BillingInformation';
import { omit } from 'utils/omit';

export const BillingInformationClean = ({
  data,
}: {
  data: BillingScreenPropsQuery['billingDetails'];
}) => {
  const billingDetails = useMemo(() => omit(data, ['__typename']), [data]);
  return (
    <BillingInformation
      data={billingDetails}
      showForm={isEmpty(billingDetails)}
      disabled={isEmpty(billingDetails)}
    />
  );
};