Title: Introduce inputModes option for showing score and comment fields by laander · Pull Request #472 · reflagcom/javascript · GitHub
Open Graph Title: Introduce inputModes option for showing score and comment fields by laander · Pull Request #472 · reflagcom/javascript
X Title: Introduce inputModes option for showing score and comment fields by laander · Pull Request #472 · reflagcom/javascript
Description: This PR introduces a new inputMode option to the Reflag feedback UI that allows developers to control which input fields are shown to users when collecting feedback. This addresses the need for more flexible feedback collection scenarios where satisfaction scores may not always be required. Changes Core Feature: inputMode Option New inputMode parameter with three options: "comment-and-score" (default) - Shows both comment field and satisfaction score "comment-only" - Shows only the comment field, no satisfaction score required "score-only" - Shows only the satisfaction score, no comment field API Changes Updated RequestFeedbackOptions to include the new inputMode parameter Simplified FeedbackSubmission interface - both score and comment are now optional Consolidated callback handling - replaced separate onScoreSubmit with unified onSubmit that returns OnSubmitResult Removed deprecated options: requireSatisfactionScore (replaced by inputMode) openWithCommentVisible (replaced by inputMode) UI/UX Improvements Streamlined feedback form with cleaner conditional rendering based on inputMode Better validation - ensures at least one field (score or comment) is provided Improved user experience - no longer forces satisfaction scores when only comments are needed Documentation Updates Updated FEEDBACK.md with comprehensive examples of the new inputMode option. Added new screenshots showing different positioning options (modal, dialog, popover) Enhanced development server with better examples and documentation Preview FEEDBACK.md Preview README.md Technical Improvements Input validation for inputMode parameter with clear error messages Type safety improvements with better TypeScript definitions Code cleanup - removed 315 lines while adding 173 lines (net reduction of 142 lines) Use Cases This change enables several new feedback collection scenarios: Comment-only feedback - For collecting general feedback without requiring satisfaction scores Score-only surveys - For quick satisfaction polls without requiring detailed comments Flexible collection - Allows the same feedback UI to adapt to different contexts Breaking Changes requireSatisfactionScore and openWithCommentVisible options have been removed onScoreSubmit callback has been replaced with unified onSubmit callback FeedbackScoreSubmission interface has been removed Migration Guide Before: reflagClient.requestFeedback({ flagKey: "my-flag", requireSatisfactionScore: false, openWithCommentVisible: true }); After: reflagClient.requestFeedback({ flagKey: "my-flag", inputMode: "comment-only" }); Testing All existing tests updated to work with new API New validation tests for inputMode parameter UI tests cover all three input modes
Open Graph Description: This PR introduces a new inputMode option to the Reflag feedback UI that allows developers to control which input fields are shown to users when collecting feedback. This addresses the need for mor...
X Description: This PR introduces a new inputMode option to the Reflag feedback UI that allows developers to control which input fields are shown to users when collecting feedback. This addresses the need for mor...
Opengraph URL: https://github.com/reflagcom/javascript/pull/472
X: @github
Domain: patch-diff.githubusercontent.com
| route-pattern | /:user_id/:repository/pull/:id/checks(.:format) |
| route-controller | pull_requests |
| route-action | checks |
| fetch-nonce | v2:2c362414-99ad-a800-f6c3-72149dc71200 |
| current-catalog-service-hash | 87dc3bc62d9b466312751bfd5f889726f4f1337bdff4e8be7da7c93d6c00a25a |
| request-id | BD52:2DEB8:5322C:695A3:6980242B |
| html-safe-nonce | 7ad646130a85165633b10c7677eba893a9cf047c19d70feead109c3997cd17ea |
| visitor-payload | eyJyZWZlcnJlciI6IiIsInJlcXVlc3RfaWQiOiJCRDUyOjJERUI4OjUzMjJDOjY5NUEzOjY5ODAyNDJCIiwidmlzaXRvcl9pZCI6IjE2MTM0Mzg2MzcyNzIyMTI1MjMiLCJyZWdpb25fZWRnZSI6ImlhZCIsInJlZ2lvbl9yZW5kZXIiOiJpYWQifQ== |
| visitor-hmac | e7e5ce91459769e4f345eaa4b41c764cff17b8647154354d671ea9573cc09f23 |
| hovercard-subject-tag | pull_request:2811988878 |
| github-keyboard-shortcuts | repository,pull-request-list,pull-request-conversation,pull-request-files-changed,checks,copilot |
| google-site-verification | Apib7-x98H0j5cPqHWwSMm6dNU4GmODRoqxLiDzdx9I |
| octolytics-url | https://collector.github.com/github/collect |
| analytics-location | / |
| fb:app_id | 1401488693436528 |
| apple-itunes-app | app-id=1477376905, app-argument=https://github.com/reflagcom/javascript/pull/472/checks |
| twitter:image | https://avatars.githubusercontent.com/u/222419?s=400&v=4 |
| twitter:card | summary_large_image |
| og:image | https://avatars.githubusercontent.com/u/222419?s=400&v=4 |
| og:image:alt | This PR introduces a new inputMode option to the Reflag feedback UI that allows developers to control which input fields are shown to users when collecting feedback. This addresses the need for mor... |
| og:site_name | GitHub |
| og:type | object |
| hostname | github.com |
| expected-hostname | github.com |
| None | 60279d4097367e16897439d16d6bbe4180663db828c666eeed2656988ffe59f6 |
| turbo-cache-control | no-preview |
| go-import | github.com/reflagcom/javascript git https://github.com/reflagcom/javascript.git |
| octolytics-dimension-user_id | 78933796 |
| octolytics-dimension-user_login | reflagcom |
| octolytics-dimension-repository_id | 467592928 |
| octolytics-dimension-repository_nwo | reflagcom/javascript |
| octolytics-dimension-repository_public | true |
| octolytics-dimension-repository_is_fork | false |
| octolytics-dimension-repository_network_root_id | 467592928 |
| octolytics-dimension-repository_network_root_nwo | reflagcom/javascript |
| turbo-body-classes | logged-out env-production page-responsive full-width full-width-p-0 |
| disable-turbo | false |
| browser-stats-url | https://api.github.com/_private/browser/stats |
| browser-errors-url | https://api.github.com/_private/browser/errors |
| release | 7c85641c598ad130c74f7bcc27f58575cac69551 |
| ui-target | full |
| theme-color | #1e2327 |
| color-scheme | light dark |
Links:
Viewport: width=device-width