teamdigitale/italia-app

View on GitHub
ts/features/payments/details/components/WalletDetailsPaymentMethodFeatures.tsx

Summary

Maintainability
A
35 mins
Test Coverage
import { Alert } from "@pagopa/io-app-design-system";
import * as React from "react";
import { WalletInfo } from "../../../../../definitions/pagopa/walletv3/WalletInfo";
import I18n from "../../../../i18n";
import { useIOSelector } from "../../../../store/hooks";
import { isIdPayEnabledSelector } from "../../../../store/reducers/backendStatus";
import { isPaymentMethodExpired } from "../../common/utils";
import PaymentMethodInitiatives from "./WalletDetailsPaymentMethodInitiatives";
import PaymentMethodSettings from "./WalletDetailsPaymentMethodSettings";

type Props = { paymentMethod: WalletInfo };

/**
 * Display the features available for a payment method:
 * - vertical initiatives (eg: cashback, fa)
 * - global settings (payment capability, favourite, etc.)
 */
const WalletDetailsPaymentMethodFeatures = ({ paymentMethod }: Props) => {
  const isMethodExpired = isPaymentMethodExpired(paymentMethod.details);
  const isIdpayEnabled = useIOSelector(isIdPayEnabledSelector);

  if (isMethodExpired) {
    return (
      <Alert variant="error" content={I18n.t("wallet.methodDetails.expired")} />
    );
  }

  return (
    <>
      {isIdpayEnabled ? (
        <PaymentMethodInitiatives paymentMethod={paymentMethod} />
      ) : null}
      <PaymentMethodSettings paymentMethod={paymentMethod} />
    </>
  );
};

export default WalletDetailsPaymentMethodFeatures;