Proposed changes to summary card

EmploymentHistorySummaryCard.jsx

import React from 'react';
import { Link } from 'react-router-dom';
import { MiniSummaryCard } from './shared/MiniSummaryCard';
import { setJobIndex } from '../utils/session';

const EmploymentHistorySummaryCard = ({formData, setFormData, isSpouse }) => {
  const employmentHistory = formData?.employmentHistory || {
    spouse: { employmentRecords: [] },
    veteran: { employmentRecords: [] },
  };
  const employmentRecords = isSpouse
    ? employmentHistory.spouse.employmentRecords
    : employmentHistory.veteran.employmentRecords;

  const onDelete = deleteIndex => {
    const updatedEmploymentRecords = employmentRecords.filter(
      (_, index) => index !== deleteIndex
    );

    setFormData({
      ...data,
      employmentHistory: {
        ...employmentHistory,
        [isSpouse ? 'spouse' : 'veteran']: {
          employmentRecords: updatedEmploymentRecords,
        },
      },
    });
  };

  const employmentCardSubheading = job =>
    `From ${job.from} to ${job.isCurrent ? 'Now' : job.to}`;

  const cardBody = job => (
    <div>
      <p className="vads-u-margin-y--2 vads-u-font-weight--normal">
        {employmentCardSubheading(job)}
      </p>
      <p>Type: {job.type}</p>
      <p>Gross Monthly Income: ${job.grossMonthlyIncome}</p>
      {job.deductions && (
        <div>
          <p>Deductions:</p>
          <ul>
            {job.deductions.map((deduction, i) => (
              <li key={i}>
                {deduction.name}: ${deduction.amount}
              </li>
            ))}
          </ul>
        </div>
      )}
    </div>
  );

  return (
    <div>
      {employmentRecords.map((job, index) => (
        <MiniSummaryCard
          editDestination={{
            pathname: isSpouse
              ? '/enhanced-spouse-employment-records'
              : '/enhanced-employment-records',
            search: `?index=${index}`,
          }}
          heading={job.employerName}
          body={cardBody(job)}
          key={job.employerName + job.from + job.to}
          onDelete={() => onDelete(index)}
          showDelete
        />
      ))}
    </div>
  );
};

export default EmploymentHistorySummaryCard;