<commit_before>import React from 'react';
import PropTypes from 'prop-types';
import moment from 'moment';
import CTALink from '../CTALink';
import recordEvent from '~/platform/monitoring/record-event';

export const Payments = ({ lastPayment }) => {
  return (
    <div className="vads-u-display--flex vads-u-flex-direction--column large-screen:vads-u-flex--1 vads-u-margin-bottom--2p5">
      <div
        className="vads-u-background-color--gray-lightest vads-u-padding-y--2p5 vads-u-padding-x--2p5"
        data-testid="payment-card"
      >
        <h3 className="vads-u-margin-top--0" data-testid="deposit-header">
          We deposited {lastPayment.payCheckAmount} in your account ending in{' '}
          {lastPayment.accountNumber.substr(-4)} on{' '}
          {moment(lastPayment.payCheckDt).format('MMMM D, YYYY')}
        </h3>
        <p className="vads-u-margin-bottom--1 vads-u-margin-top--0">
          Type: {lastPayment.payCheckType}
        </p>
        <CTALink
          text="View your payment history"
          href="/va-payment-history/payments/"
          testId="payment-card-view-history-link"
          onClick={() => {
            recordEvent({
              event: 'nav-linkslist',
              'links-list-header': 'View your payment history',
              'links-list-section-header': 'Benefit payments and debts',
            });
          }}
        />
      </div>
    </div>
  );
};

Payments.propTypes = {
  lastPayment: PropTypes.shape({
    payCheckAmount: PropTypes.string.isRequired,
    payCheckDt: PropTypes.string.isRequired,
    payCheckId: PropTypes.string.isRequired,
    payCheckReturnFiche: PropTypes.string.isRequired,
    payCheckType: PropTypes.string.isRequired,
    paymentMethod: PropTypes.string.isRequired,
    bankName: PropTypes.string.isRequired,<commit_msg>39471 ios voiceover issue (#20852)<commit_after>import React from 'react';
import PropTypes from 'prop-types';
import moment from 'moment';
import CTALink from '../CTALink';
import recordEvent from '~/platform/monitoring/record-event';

export const Payments = ({ lastPayment }) => {
  return (
    <div className="vads-u-display--flex vads-u-flex-direction--column large-screen:vads-u-flex--1 vads-u-margin-bottom--2p5">
      <div
        className="vads-u-background-color--gray-lightest vads-u-padding-y--2p5 vads-u-padding-x--2p5"
        data-testid="payment-card"
      >
        <h3 className="vads-u-margin-top--0" data-testid="deposit-header">
          {/* eslint-disable-next-line jsx-a11y/aria-role */}
          <span role="text">
            We deposited {lastPayment.payCheckAmount} in your account ending in{' '}
            {lastPayment.accountNumber.substr(-4)} on{' '}
            {moment(lastPayment.payCheckDt).format('MMMM D, YYYY')}
          </span>
        </h3>
        <p className="vads-u-margin-bottom--1 vads-u-margin-top--0">
          Type: {lastPayment.payCheckType}
        </p>
        <CTALink
          text="View your payment history"
          href="/va-payment-history/payments/"
          testId="payment-card-view-history-link"
          onClick={() => {
            recordEvent({
              event: 'nav-linkslist',
              'links-list-header': 'View your payment history',
              'links-list-section-header': 'Benefit payments and debts',
            });
          }}
        />
      </div>
    </div>
  );
};

Payments.propTypes = {
  lastPayment: PropTypes.shape({
    payCheckAmount: PropTypes.string.isRequired,
    payCheckDt: PropTypes.string.isRequired,
    payCheckId: PropTypes.string.isRequired,
    payCheckReturnFiche: PropTypes.string.isRequired,
    payCheckType: PropTypes.string.isRequired,
    paymentMethod: PropTypes.string.isRequired,
    bankName: PropTypes.string.isRequired,
{'fraction_non_alphanumeric': 0.1425925925925926, 'fraction_numerical': 0.010052910052910053, 'mean_word_length': 2.5636192271442035, 'pattern_counts': {'":': 0, '<': 23, '<?xml version=': 0, '>': 27, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4945235', 'n_tokens_mistral': 1170, 'n_tokens_neox': 1176, 'n_words': 204}