Chatbot: feedback

[melissasamworth]

Acceptance criteria

Everything except CSS (Nemo, Buddy)

• Show bar with icons under every Stampy response
  • Under bot generated responses, show just the thumbs up and thumbs down
• Hover states for icons is
  • A centered tooltip above (ideally it would show below based on scroll position but I think this is not "built in" for us, i.e. extra work, so skip that for now if it would take more than 1 minute)
  • A light grey bg underneath the icon user is hovering over

• If user clicks thumbs up
  • "Thank you for your feedback!" text appears to right
  • Thumbs up icon is now highlighted with light teal bg and icon itself is dark teal
  • User cannot change answer (just to make it easier for us)
• If user clicks thumbs down
  • Thumbs down icon is now highlighted with light teal bg and icon itself is dark teal
  • User cannot change answer (just to make it easier for us)
  • Feedback popover appears above and to the right
  • Submit feedback button is greyed out until user chooses one of the 5 categories
  • User can leave a comment but doesn't have to
  • User can click out of the modal to make it disappear (in this case the thumbs down icon stays highlighted and we'll still record this data)
  • If user clicks "Submit feedback" then "Thank you for your feedback!" text appears to right

CSS (Archana, Melissa)

• Make sure visuals match the design, including hover states

Links https://www.figma.com/file/qqfeYAh6Z7QdyJXsQjIUfh/Stampy?type=design&node-id=2197%3A6785&mode=dev&t=Isg5hjkFzr1KY4KQ-1

[melissasamworth]

update: only done for human answers

Melissa give design for human answers

[melissasamworth]

Update: Melissa still needs to adjust CSS

[melissasamworth]

Update: I still have to look at Myles's pr

[melissasamworth]

Update: It's still not letting me merge, messaged Myles about it. Once it's merged move it to design review!

[melissasamworth]

Update: Melissa's video with some small feedback