UX improvement for enums
Closed this issue · 0 comments
blackmann commented
The current collection form shows the enum field for strings all the time; even if no value is passed. I think this litters the form.
To improve this we can have a button to toggle the enum chips input.
Requirement
- We should show a toggle button next to "Unique"
- The toggle button is has grey background when the chips input is not showing
- When the chips input is showing, the toggle button should have a blue background
- We should not be able to un-toggle the enum button when there are values in the chips input. We can only toggle it on/off if the enum input is empty1.
- This UI/code change should mostly happen here:
mangobase/admin/src/components/field.tsx
Line 198 in 5a6b6bd
- Add the toggle button here, but use absolute positioning to move it next to the "Unique" button.
The screenshot below should give you an idea of how this will look like.
![Group 1](https://private-user-images.githubusercontent.com/5024388/290918633-e46a5072-090d-49bf-87ec-8aa6193110ed.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjA2NDQzNzcsIm5iZiI6MTcyMDY0NDA3NywicGF0aCI6Ii81MDI0Mzg4LzI5MDkxODYzMy1lNDZhNTA3Mi0wOTBkLTQ5YmYtODdlYy04YWE2MTkzMTEwZWQucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcxMCUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MTBUMjA0MTE3WiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9ZDBkMzg1ODRmMWU5ODU5YTM3NDVhNzU0NWJiYWRhZWJiN2I4MzExMjY2MTJhMmJjODkxZjJlNTYyNDNkYTY3ZiZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.sy96Qbu_hhnag9N9UgEEx6b6VIBxg3ecc7nQARLWuc0)
Footnotes
-
Empty enum input means, there's no chip item in it. When it only text in it, you should be able to toggle it on/off. ↩