Sample JSX File

// Sample React component — samplefiles.com
import { useState } from 'react';

export function CustomerList({ customers }) {
  const [vipOnly, setVipOnly] = useState(false);
  const shown = vipOnly ? customers.filter((c) => c.balance >= 10_000) : customers;

  return (
    <section>
      <label>
        <input type="checkbox" checked={vipOnly} onChange={(e) => setVipOnly(e.target.checked)} /> VIP only
      </label>
      <ul>
        {shown.map((c) => (
          <li key={c.id}>
            {c.name}: ${c.balance.toFixed(2)}
          </li>
        ))}
      </ul>
    </section>
  );
}