twenty
twenty copied to clipboard
twentyhq
New object field - Step 2 - New field type: Pipeline steps
Scope
We want to introduce a way to create custom pipelines on any standards and custom objects, thanks to a new field type.
Please welcome: pipelines steps 🎉
Please note that the name of the Pipeline steps may change in the future. While it is currently chosen for clarity, it may be too long.
Desired behavior - Settings
A lot of behaviors are common with the Select field type.
1. Drag & drop
Options are reorderable. On reordering, update their position numbers accordingly.
2. Choose color
The color picker is slightly different from the Select field type. There is a "dot" inside the color picker.
3. Menu option
If not the default option:
If default option:
(Notice the additional checkmark on the side indicating the default option)
4. Add step
Select Add Step to insert a new row at the end of the options. The new input should be automatically focused (outlined in blue).
The newly added option's color should follow the previous one on the color wheel. (If the last option is Green, the newly added option should be "Turquoise" for instance.
Figma
https://www.figma.com/file/xt8O9mFeLl46C5InWwoMrN/Twenty?type=design&node-id=13884-59983&mode=design&t=BPGkFQDJNvsZsRl7-11
Desired behavior - Views
With this new field type, users can create Pipeline views on any object. Here's how:
1. Click on "Create a view"
2. Define the view parameters
- Select a icon & a name for the view
- Select the "Pipeline" view type
- After selecting the pipeline view type, specify the field type to be used as pipeline steps in the
Stagesdropdown. Please note this name could evolve (in steps or pipeline steps for instance)
- Create the new view
5.If no Pipeline steps are defined on the object, a deactivated dropdown is displayed. The main call-to-action (CTA) redirects to the New field page in the settings for the corresponding object. For example, for the company, go to Settings > Company > New field.
Desired behavior - Cells and inline cells
No Pen button icon is needed, as it's not a relation:
Display it as is in the settings field preview. (Ensure the label is not present in cells for sure)
Figmas
Settings
https://www.figma.com/file/xt8O9mFeLl46C5InWwoMrN/Twenty?type=design&node-id=13884-59983&mode=design&t=BPGkFQDJNvsZsRl7-11
New view
https://www.figma.com/file/xt8O9mFeLl46C5InWwoMrN/Twenty?type=design&node-id=15014-58618&mode=design&t=BPGkFQDJNvsZsRl7-11
### Tasks
- [ ] https://github.com/twentyhq/twenty/issues/2820
@Bonapara I would like to work on this. Can you guide me on the next task after @thaisguigon has created the Status component?
Hi @ARSHIL1804! Thank you for offering to contribute! I'll let @thaisguigon decide if we need external contributors for any part of this. Otherwise I added some new "Good first issue" you can check.
Oh, I have made significant progress on this one. Should I raise a pull request for you to review and decide? @Bonapara
@thaisguigon Please review this PR. If you are okay give me heads up so I can continue with Views
Technical input:
- Add kanbanFieldMetadataId on view standard object
- build a component for view picker that should update the view / create a new view
