Skip to content

feat: shareable link copy feedback and mobile clipboard support#4

Open
jaydenkalu wants to merge 1 commit into
mainfrom
issues/476-copy-feedback-mobile
Open

feat: shareable link copy feedback and mobile clipboard support#4
jaydenkalu wants to merge 1 commit into
mainfrom
issues/476-copy-feedback-mobile

Conversation

@jaydenkalu

Copy link
Copy Markdown
Owner

Closes AnnabelJoe#476

Summary

Copy actions now confirm success visually, via toast, and via aria-live — and work on mobile browsers that don't support the Clipboard API.

Changes

  • src/components/copy-button.tsx:
    • writeToClipboard(text) — tries navigator.clipboard.writeText, falls back to execCommand('copy') via a temporary <textarea> for mobile
    • CopyButton: adds aria-pressed={copied} for screen-reader state; optional onCopied callback
    • Exports writeToClipboard for reuse elsewhere
  • src/app/verify/page.tsx:
    • copyLink(): uses writeToClipboard, pushes success toast on copy or error toast with fallback instruction on failure
    • Share button label wrapped in <span aria-live="polite"> for screen-reader announcement

Acceptance criteria

  • ✅ Copy button confirms success visually (checkmark) and via toast
  • aria-live announces copy state to screen readers
  • ✅ Mobile browsers get execCommand fallback
  • ✅ User sees actionable message if copy fails

…belJoe#476)

- copy-button.tsx: add writeToClipboard() with execCommand fallback for
  mobile browsers that lack navigator.clipboard; add aria-pressed state;
  add optional onCopied callback; export writeToClipboard for reuse
- verify/page.tsx: replace bare navigator.clipboard.writeText with
  writeToClipboard; push success/error toast on copy; add aria-live
  region to Share button label for screen-reader feedback
- Update snapshots for CopyButton/CopyableText (aria-pressed added)

Closes AnnabelJoe#476
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add shareable verification link copy feedback on mobile

1 participant