[UI/UX Design] Design the empty and error states for the offering discovery results

[thlpkee20-wq]

Description

This is a UI/UX design task to design dedicated empty-results and error states for InvestorDiscovery (e.g. no offerings match a search/filter, or the list failed to load). Today only a static three-card grid exists with no handling for these cases.

Requirements and context

• Must be accessible (WCAG 2.1 AA), responsive, and documented in the design system
• Should be consistent with existing patterns and easy to review
• Relevant code: src/components/InvestorDiscovery.tsx
• Empty state should reference the active search/filter and offer a reset action

Suggested execution

• Fork the repo and create a branch
• git checkout -b uiux/discovery-empty-error-states
• Implement changes
  • Design a no-results state with icon, message, and clear-filters action
  • Design an error state with a retry action and reassuring copy
  • Distinguish "no offerings yet" from "no matches for filters"
• Validate accessibility and responsive assumptions

Test and commit

• Run checks
  • npm run lint and component/visual tests
• Cover edge cases
  • filtered-empty vs truly-empty, error+retry, mobile layout, keyboard focus on actions, contrast
• Include screenshots/before-after and accessibility (axe) notes

Example commit message

design: discovery empty and error states

Guidelines

• Minimum 95 percent test coverage
• Clear documentation
• Timeframe: 96 hours