design a component for me: There should be a toggle called "Use Compensation Table Currency" Toggle should be on by default: but if its turned off:* we should now enable clicking on a dropdown of currency codes. If the toggle is ON and then turned off - the currency code dropdown should get disabled and its values should get unselected.
I'll create a currency configuration component with the toggle and dropdown behavior you specified.
I've created a currency selector component that meets all your requirements:
Key Features:
The component uses React state to manage the toggle and currency selection, with the toggle change handler automatically clearing the currency when the compensation table option is enabled.
Change the label to be: override comp table currency
Let me first read the current component to see the exact structure before making the label change.
I've updated the label text from "Use Compensation Table Currency" to "override comp table currency" as requested. The component functionality remains the same with the new label text.
change the functionality to show the dropdown and enable it if toggle is active. and to unseelct any existing values, disable and hide dropdown if toggle is inactive