Autofocus the Query Name input on page load/refresh (if the input is blank)
Indicate that Query Name is required
Add selectedConditions to component's state
Toggling the checkbox will now add/remove the given condition from this group
Related Issue
Fixes #118
Additional Information
Original AC was to save data from this page to the db; since we are/were not saving query-condition relations, this isn't appropriate. Instead, the data is saved in the component state and will be used to retrieve the corresponding value sets on the next page (eventually sent to the db with the full query data (value sets, concepts, etc)).
How to Test
Navigate to the "My Queries" page: landing page -> gear icon -> sign in -> gear icon -> my queries -> create query button
The "Query Name" input should autofocus and the "Create Query" button should be disabled
On hover over the button, tooltip text should read "Select at least one condition below"
Select one or more conditions from at least two categories
The "Create Query" button should now be enabled
Click to create the query, without adding a query name.
An inline error should appear and focus should jump back to the Query Name input
Tooltip text should read "Enter a query name, then click to create your query"
Name your query
The inline error should go away
Tooltip text should read "Click to create your query"
Open the dev console
Click "Create Query" and confirm all your selections are logged appropriately
Uncheck one condition and repeat above
Confirm the unchecked item was removed
Repeat such that a given category no longer has any checked items; confirm the category is no longer logged in the console
Ex:
Checklist
[x] Descriptive Pull Request title
[x] Link to relevant issues
[x] Provide necessary context for design reviewers
@mikang @robertandremitchell button state and inline error updated as shown above (I can't capture the cursor in a screenshot but it shows either a pointer or an X based on disabled status).
PULL REQUEST
Summary
selectedConditions
to component's stateRelated Issue
Fixes #118
Additional Information
How to Test
landing page
->gear icon
->sign in
->gear icon
->my queries
->create query button
Ex:
Checklist