The objective is to do a new presentational component which improves the design and functionalities of the existing configuration table.
The project has several of those tables scattered in different parts of the interface, but the first goal is to improve on of them: the one in the general settings "Title block" (see screenshot below)
Do not show an index (1, 2, 3 etc...) column
Add possibility to reorder rows with drag and drop
Check if a library already exists in the project to do this. If adding a library is required, consult with us first. The way it works can be inspired from github project tables.
Remove the "action" column which contain the "plus" and "trash" icons.
The plus action is replaced by adding a field, then reordering the rows.
The trash icon only appears when hovering a row, and does not appear as part of a separate column. Similar to how an overlay appears in github project tables, see video below.
The add field action is more tightly integrated to the table, at the place where the new field is going to be added (also similar to github project table video below)
This should be all done using a new presentational component that does not do any action on the application's state. For example, re-ordering the columns or editing a cell should call a callback which then dispatches the action outside of this component.
Don't hesitate to ask if there are questions regarding the API design of this component along the way.
The objective is to do a new presentational component which improves the design and functionalities of the existing configuration table.
The project has several of those tables scattered in different parts of the interface, but the first goal is to improve on of them: the one in the general settings "Title block" (see screenshot below)
This should be all done using a new presentational component that does not do any action on the application's state. For example, re-ordering the columns or editing a cell should call a callback which then dispatches the action outside of this component.
Don't hesitate to ask if there are questions regarding the API design of this component along the way.
https://github.com/user-attachments/assets/01b7fd3b-746a-4230-ad13-ee061191ca7d