Add timeline dividers

[anselrd]

Checked for duplicates

Yes - I've already checked

Alternatives considered

Yes - and alternatives don't suffice

Related problems

I'm frustrated when [...] happens as documented in issue-XYZ

Describe the feature request

We should include an option for visual divider rows in the timeline to separate groups of timeline rows. Raven has a feature like this that works very well but I can't add a picture because this is public GH

Dev direction

https://www.figma.com/design/wE7Jw6TWcZFIdbdvqwAUkW/Aerie-Section-Dividers?node-id=54-4988&t=82ZgusGnE9wrwWwO-4

• Update context menu
  • Option to add section
  • Option to "remove section" which flattens all rows inside
• Sections
  • Can have custom color
  • Can have custom name
  • Can be expanded + collapsed
  • Can be dragged as a group. Drag handle is the section header
• Rows
  • Can be dragged in and out of sections
• Open questions
  • Open design question on how to handle the timeline editor

[duranb]

probably can be lumped in with #1002

[AaronPlave]

One note of clarification here - this would essentially be a new row type that users could add to the view with a label and perhaps a color.

[lklyne]

Was catching up with @ewferg about this one. There could be a simple solution that adds readability and organization capabilities to the timeline.

Basics are: 1) Some way to create a dividing row. This should be able to have less vertical height than other rows. 2) Ability to customize the row color.

Right now, removing a row name is a step in the right direction, but it still has an empty state and isn't a different color.

Some open questions:

• How similar are rows and dividers in functionality?
• How would the row divider be created? Is this some different type (eg, insert row below, insert divider below)
• Or can a row be turned into a divider by removing the name or adding --- to the name?
• Does the color coding option apply to just the dividers or is there utility in adding this to all rows?

[lklyne]

Ideas after initial design review 9/25/24 https://www.figma.com/design/wE7Jw6TWcZFIdbdvqwAUkW/Aerie-Section-Dividers?node-id=0-1&t=cmp6XxgcnJ2c9l67-1

Can a section be a group of rows that can be acted upon together.

• Contain different rows
• collapse as a group
• move as a group
• Color or indentation system that indicates a row is part of a group

What preset colors would make sense to include?

• Is there a preset palette that works

Functionality

• Insert section from context menu
• Section has limited settings: name, color, and height

[lklyne]

Direction exploring using sections as groups: https://www.figma.com/design/wE7Jw6TWcZFIdbdvqwAUkW/Aerie-Section-Dividers?node-id=25-1671&t=w2KCWTyfrxFZ0hbV-4

1. Sections can be empty and contain no rows
2. Sections can have a name and a custom background color
3. Sections don't have a minimum height like rows, so they can be collapsed into a line
4. Rows can be added to sections through drag and drop, then expanded and collapsed as a group
5. Section color shows on the left of the row