Uploaded image for project: 'Compass '
  1. Compass
  2. COMPASS-7039

Align AI Query Input with recent designs

    • Type: Icon: Task Task
    • Resolution: Done
    • Priority: Icon: Major - P3 Major - P3
    • No version
    • Affects Version/s: None
    • Component/s: GAI, Query Bar, UI / UX
    • None
    • Not Needed

      This ticket involves updating the UI for the ai query experience to match the up to date designs. Once completed let's sync with design and ensure the experience is what we were thinking.
      At the time of writing this involves:

      • Move the ai robot button to the left of the text input (currently it's on the right).
      • Update the `title` text properties of various buttons.
      • Show the `Ask AI` button when the query bar filter has content (shown pushed to the right side instead of placeholder).
      • Showing error state in the input area. This is the red warning icon that is shown when an error occurs.
      • Ensuring that the overlaying items like the success, generate button, ai robot icon button, and error icon don't impede user typing experience (related to https://jira.mongodb.org/browse/COMPASS-7036 )

      Figma designs:
      https://www.figma.com/file/Ip4CPowv3Uxxhu3klyXA0e/Generative-AI-in-Compass-MVP?type=design&node-id=1125%3A67271&mode=dev 

            Assignee:
            rhys.howell@mongodb.com Rhys Howell
            Reporter:
            rhys.howell@mongodb.com Rhys Howell
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

              Created:
              Updated:
              Resolved: