feat(feedback): add standalone comment entry point#676
Open
martyanovandrey wants to merge 11 commits into
Open
feat(feedback): add standalone comment entry point#676martyanovandrey wants to merge 11 commits into
martyanovandrey wants to merge 11 commits into
Conversation
Contributor
Author
|
/update-screenshots |
Contributor
|
✅ Screenshots have been updated successfully! |
Contributor
|
Visual Tests Report is ready. |
Decouple rating from commenting. Add an always-available comment control
next to like/dislike in both footer (Wide) and aside (Regular) views that
opens a rating-free feedback form, sending {type: comment, comment}.
- add FeedbackType.comment to the data contract
- generalize DislikeVariantsPopup into a reusable FeedbackFormPopup
parametrized by titleKey and showVariants
- add FeedbackControl entry point and DOCS_FOOTER/ASIDE_FEEDBACK_CLICK
analytics events
- add comment-text and comment-form-title i18n keys across all locales
- keep the rating untouched on a neutral comment submit in demo stories
Allow hiding the comment entry point independently of the like/dislike
rating via useInterface('feedback-comment'), mirroring the toc/toc-header
pattern. The key defaults to shown; set interface['feedback-comment'] to
false (globally or per-page meta) to hide the comment control and its
popups. The master 'feedback' flag still hides the whole block.
The Wide-view comment control used flex-basis:100%, so its hover/focus background stretched across the whole feedback box. Wrap it in a full-width row and let the button stay content-width and centered, so its hover hugs the label and visually matches the like/dislike group.
7f9ce45 to
c0c9c60
Compare
Contributor
|
Storybook preview is ready. |
In Regular view the comment control was wrapped in a display:contents row, so the tooltip popup's inline nodes joined the aside flex row on hover and nudged the neighbouring control by its margin. Render the bare control in Regular (like the like/dislike icons) and keep the wrapper only for the Wide footer.
For the public package, the comment control must not appear on upgrade unless explicitly enabled. Show it only when interface['feedback-comment'] is true (read directly, leaving the useInterface hide-flag contract untouched). Enable the flag in the demo stories so Storybook and the screenshot tests still exercise the control.
Add a showComment prop to Feedback for consumers that use the package as a dependency, threaded through DocPage (showFeedbackComment) and Controls so both the footer and aside honour it. The prop takes precedence; when omitted it falls back to the feedback-comment interface flag (config-driven path). Both default to off, so an upgrade still changes nothing by default.
Add a hideAsideFeedback prop (DocPage + Controls) to hide the like/dislike reactions in the aside/header controls while keeping the footer feedback block. When the prop is omitted it falls back to the feedback-aside interface flag. Defaults to shown, so nothing changes by default. Lets a consumer that builds its own client drop the top reactions programmatically.
Replace the ad-hoc showFeedbackComment / hideAsideFeedback props with a single, typed control-visibility map. DocPage now consumes its (previously dormant) viewerInterface prop: it merges the map over the surrounding InterfaceProvider and re-provides it, so one prop configures every control by key (feedback, feedback-aside, feedback-comment, ...). Add a typed InterfaceKey union (open to custom strings) for autocomplete. Feedback keeps its showComment unit prop. Additive and non-breaking; defaults unchanged.
19c2989 to
94442d5
Compare
- drop redundant '?? {}' in DocPage.getInterface (spreading undefined is a no-op)
- reword an inherited TODO into a plain note (documents a uikit limitation)
- name the FeedbackControl forwardRef render function
Add a comment-form-placeholder i18n key (customer-provided ru/en copy; other locales best-effort) and parametrize FeedbackFormPopup with an optional placeholderKey. The neutral comment form uses the new friendlier text; the dislike form keeps the shared comment-placeholder.
Contributor
Author
|
/update-screenshots |
|
Contributor
|
✅ Screenshots have been updated successfully! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.



What
Decouples rating from commenting in the article feedback block. Adds an opt-in "Leave a comment" entry point next to like/dislike that opens a rating-free feedback form, so a comment can be left independently of any rating (the pattern used by DigitalOcean and AWS docs). Control visibility (comment entry point, aside reactions, etc.) is configured through one typed
viewerInterfacemap.Changes
FeedbackType.comment. A neutral comment is sent as{type: comment, comment}. Additive only; existing payloads unchanged.DislikeVariantsPopupinto a reusableFeedbackFormPopup(titleKey+showVariants): dislike keeps reasons + comment; neutral comment is free-text only.FeedbackControlentry point: Wide (footer) as a flat "Leave a comment" button under Yes/No; Regular (aside) as a comment icon next to the thumbs.viewerInterfaceprop, merging it over the surroundingInterfaceProviderand re-providing it, so a single prop configures every control by key. Same keys as the config-driveninterface(used by@diplodoc/cli/@diplodoc/client).feedback-comment: trueenables the comment entry point (opt-in, off by default).feedback-aside: falsehides the aside (top) reactions while keeping the footer block.InterfaceKeyunion gives autocomplete and typo-checking; arbitrary string keys are still allowed.showFeedbackComment/hideAsideFeedbackprops were removed in favour of the map.Feedbackkeeps ashowCommentunit prop for standalone use.DOCS_FOOTER_FEEDBACK_CLICKandDOCS_ASIDE_FEEDBACK_CLICK.comment-textandcomment-form-titleacross all locales (ru/en authored; rest best-effort).viewerInterface(aHideAsideFeedbackarg toggles the aside reactions); the standalone Feedback story usesshowComment; a neutral comment submit no longer resets the rating.Configuration
Everything is off/shown by default. Configure via the
viewerInterfaceprop (for consumers building their own client) or the same keys inInterfaceProvider/ build config (config-driven path). The prop merges over the surrounding provider, per key.Standalone
Feedbackalso acceptsshowComment. Keys default to each control's own default: most controls are shown (falsehides);feedback-commentis opt-in (trueshows).Note: adding
feedback-comment/feedback-asideto the@diplodoc/cliconfig schema (yfm-schema.yaml) is a small separate change in the CLI package.Compatibility
No breaking changes - everything additive:
FeedbackTypegainscomment;FeedbackSendData,FeedbackViewand existing props unchanged.viewerInterfaceonDocPagewas already declared (now wired); its type is widened to the typedViewerInterface(a superset ofRecord<string, boolean>).exportsblocks deep imports), so the rename is invisible.Visual tests
Baselines were regenerated on the x86_64 CI runner via
/update-screenshotsand are included.Out of scope (follow-up)
Optional external feedback form URL (would extend the
feedbackconfig object across CLI + client + a component prop).