In the "New agreement line" pane.
1. Add an info-popover to the "E-resource" drop-down containing the text "A set of e-resources which are currently in the basket"
2. In the "E-resource" drop-down
Change the text "No matching options" to "No items in e-resource basket"
3. Change the behaviour of the "Link selected e-resource" button as follows:
- When the "E-resource" drop down contains items (i.e. when the basket is not empty) the button should be active. It is currently inactive.
- If the user selects the button without first selecting an item from the E-resource drop-down, display a validation message underneath the drop-down which reads "Please select an e-resource to continue"
- If the e-resource basket is empty, the button should be inactive and have the tooltip "An e-resource can be linked when it is has been added to the basket"
Dev Task Breakdown:
- **An info popover similar to the one here needs to be added to the BasketSelector label prop.
- A new emptyMessage prop needs to be added to the BasketSelector component and needs to be passed down to the Selector Field.] emptyMessage would be the custom message to be displayed in the dropdown "No items in e-resource basket"
- The BasketSelector Link Selected e-resource button disabled status behaves similar to the one in the Basket pane. So changing one would affect the other. If thats desire then thisis where the change needs to go.
- The validation message can be thrown by checking the value of the BasketSelector value within the values prop passed into the FormEresource component.
- You can check for the basket.length === 0 to display a tooltip. Tooltip usage example