Skip to content

Conversation

@vishsanghishetty
Copy link
Contributor

  • Add CopyButton component with PatternFly icons (CopyIcon/CheckIcon)
  • Automatically detects copyable columns (id, name, url, email, cluster)
  • Shows on row hover with smooth animations
  • Visual feedback: icon changes and animates on successful copy
  • Includes CSS for hover states, transitions, and success animation
  • Uses modern Clipboard API with error handling
  • Non-intrusive UX: hidden until hover, doesn't interfere with row clicks

Tested in OCM Genie POC with cluster IDs, names, and URLs.
image

@vishsanghishetty
Copy link
Contributor Author

@lkrzyzanek could you please review? Thanks

@lkrzyzanek lkrzyzanek requested a review from jschuler October 20, 2025 14:05
@vishsanghishetty
Copy link
Contributor Author

@jschuler ready for review, added test coverage

- Add CopyButton component with PatternFly icons (CopyIcon/CheckIcon)
- Automatically detects copyable columns (id, name, url, email, cluster)
- Shows on row hover with smooth animations
- Visual feedback: icon changes and animates on successful copy
- Includes CSS for hover states, transitions, and success animation
- Uses modern Clipboard API with error handling
- Non-intrusive UX: hidden until hover, doesn't interfere with row clicks

Tested in OCM Genie POC with cluster IDs, names, and URLs.
- Add 20 new test cases for copy-to-clipboard functionality
- Test copyable column detection (id, name, url, email, cluster)
- Test non-copyable columns don't get copy buttons
- Test clipboard API integration with mocked navigator.clipboard
- Test visual feedback (CheckIcon on success)
- Test event propagation blocking to prevent row clicks
- Test multiple copy buttons across rows and columns
- Test case-insensitive column name detection
- Test cell wrapper structure and accessibility (aria-label)
- Test with empty values and numeric values
- All 25 tests passing ✓
@vishsanghishetty
Copy link
Contributor Author

Closing this PR in favor of #22.

Joachim's implementation using PatternFly's ClipboardCopy component is cleaner and more maintainable. The smart data-type detection is also better than my hardcoded column name approach.

Thanks for the review and the improved solution! I learned a lot from comparing the two approaches.

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.

1 participant