Frontend donation form component and UX (barebones)

[thaninbew]

Summary:

Create a reusable React donation form with client-side validation and submission to the backend API. This ticket focuses on the UI, validation and calling apiClient.createDonation().

Files to create:

• apps/frontend/src/containers/donations/DonationForm.tsx (new)
• apps/frontend/src/containers/donations/donations.css (new, no comprehensive styling yet)
• apps/frontend/src/api/apiClient.ts (patch/add createDonation())

Form fields (exact):

• firstName (string)
• lastName (string)
• email (string, validated)
• amount (decimal, validated positive)
• isAnonymous (boolean)
• donationType (one_time | recurring) - dropdown or radio
• dedicationMessage (optional text)
• showDedicationPublicly (boolean)

Client validation rules:

• email required and valid when provided
• amount > 0
• If donationType === 'recurring' then defer detailed recurring validation to #6 ; here the UI must allow choosing recurring and capture a simple recurringInterval string (user-friendly select: 'monthly', 'bimonthly', 'quarterly', 'weekly').

Testing:

1. Unit tests: mock apiClient.createDonation() and assert form validation, disabled states, and submission flow.

---