feat: feedback editor component #3866
Conversation
|
Removed vultr server and associated DNS entries |
| <Typography pt={2}> | ||
| Don't share any personal or financial information in your feedback. If | ||
| you do we will act according to our{" "} | ||
| <Link href={props.privacyPolicyLink ?? ""}>privacy policy</Link>. |
There was a problem hiding this comment.
It's now up to the user to put a privacy policy link in the description via RichTextInput if they want to.
| disclaimer: data?.disclaimer || disclaimerPlaceholder, | ||
| feedbackRequired: data?.feedbackRequired || false, | ||
| ...parseBaseNodeData(data), | ||
| }); |
There was a problem hiding this comment.
The idea here is that all of the editor inputs are optional and there are default descriptions/question wordings to fallback to if no changes needed.
There was a problem hiding this comment.
Lots of lint changes seem to have crept in since sorting some merge conflicts from main, sorry!
| @@ -45,18 +43,23 @@ const FeedbackComponent = ( | |||
| return ( | |||
| <Card handleSubmit={formik.handleSubmit}> | |||
| <CardHeader title={props.title} /> | |||
There was a problem hiding this comment.
Minor bug: when I add more information/help text in the editor modal, I'm not seeing the "More information" link appear as I would expect on public component! Might want to double check how other component headers are handling this!
| value={formik.values.feedback} | ||
| placeholder="What did you think?" | ||
| onChange={formik.handleChange} | ||
| /> |
There was a problem hiding this comment.
The RichTextInput is reserved for editor modals, I'd take a look at the @planx/components/TextInput Public component files for examples of what we expect for the public display here !
(Feel like this points to bigger organisation thing around it being easy to confuse which components are for what currently - let's keep this in mind as we continue to think about how to better organise files!)
| The information collected here isn't monitored by planning officers. | ||
| Don't use it to give extra information about your project or submission. | ||
| If you do, it cannot be used to assess your project. | ||
| <ReactMarkdownOrHtml source={props?.disclaimer} id={"DISCLAIMER"} /> | ||
| </Typography> |
There was a problem hiding this comment.
nit: Rather than a "caption" style here we probably want to mimic the existing disclaimer styles in use on other components as those have passed a11y audits and feel a bit more Gov UK Design system-y I think - check out PlanningConstraints & Result for examples!
| export const disclaimerPlaceholder = | ||
| "The information collected here isn't monitored by planning officers. Don't use it to give extra information about your project or submission. If you do, it cannot be used to assess your project."; | ||
|
|
||
| export const titlePlaceholder = "Tell us what you think"; |
There was a problem hiding this comment.
nit: I'm slighty hesitant about introducing "placeholders" file naming into our structure as this is going to mean something new soon in the world of "templates" !
Would the defaultContent structure currently used in @planx/components/DrawBoundary/model work here? Has small benefit of also being type-able based on component prop types 🙂
There was a problem hiding this comment.
Thanks for all these suggestions! They're in the next PR :)
In this PR ✨ :
FEEDBACK_COMPONENT.Figma link: https://www.figma.com/design/bnUUrsVRG6qPwDkTmVKACI/PlanX-Design?node-id=16904-1689&t=EmDePU6bogpOSjv9-4
Trello link: https://trello.com/c/jEOLoubW/3034-can-we-introduce-in-house-end-of-service-feedback
How to test 🧪
I'm expecting to need to improve this a fair bit, but thought this length of PR was a fine place to stop!
To do in future PRs 🔮 :
Screenshots