feat(frontend): client-side validation and error feedback on campaign form

[Temi-suwa18]

Summary

Adds instant client-side validation and inline error feedback to the campaign form (frontend/src/CreateCampaign.jsx). The form now catches invalid token amounts, end dates in the past and missing or malformed required fields before anything is sent to the API or the chain.

Changes

frontend/src/lib/validateCampaignForm.js (new)

A pure function that takes the form values and returns a map from field to error message:

Field	Rule
name	Required, 3–80 characters after trimming
rewardPerAction	If set, must be a positive whole number (rejects 0, negatives, decimals and non-numeric input)
maxParticipants	If set, must be a whole number ≥ 0 (0 = unlimited)
rewardToken / contractId	If set, must be a Stellar contract address (C followed by 55 base32 characters)
startDate / endDate	Must parse. The end date must be in the future and after the start date

In edit mode the "end date in the past" rule is skipped, so admins can still edit campaigns that have already ended.

frontend/src/CreateCampaign.jsx

• Validation runs on every render. A field's error shows once that field has been blurred or after a submit attempt, so the form doesn't flag errors while the user is still typing.
• Invalid inputs get aria-invalid, plus aria-describedby pointing to a role="alert" message.
• Submit is blocked with a summary message ("Please fix the highlighted fields…") until the form is valid.
• The button is no longer disabled just because the form is invalid. Clicking it now shows every error instead of silently doing nothing. It is still disabled while submitting and when no API key is set.
• Touched and submit-attempt state resets after a successful save.

frontend/src/Landing.css

Styles for .create-campaign-field-error and invalid inputs, using the existing --danger token.

Tests

frontend/src/lib/validateCampaignForm.test.js adds 9 Vitest cases covering every branch above, including the edit-mode past-date exemption.

Verification

• The 9 new tests pass under Vitest 2, run in isolation because no node_modules were installed locally.
• CreateCampaign.jsx compiles with esbuild.
• The full frontend suite, lint and Playwright e2e were not run locally; CI will cover them.

Notes

• The issue template also mentions backend and contract work. This PR covers the requested client-side form validation only. The backend should keep its own server-side checks, because client validation can be bypassed.
• Tightening rewardPerAction to require a positive value means an explicit 0 is now rejected. Leaving the field empty still sends 0 as before.
  Closes feat(frontend): Add client-side input validation and error feedback on campaign form #1230
  Closes feat(frontend): Add full-screen modal gallery for campaign media assets #1231
  Closes feat(frontend): Campaign comparison tool (side-by-side reward & task specs) #1232
  Closes feat(frontend): Add claim transaction gas estimator widget before wallet signature #1233

[drips-wave]

@Temi-suwa18 Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits