How would you model structure for a Kanban app?

[bebraw]

I am currently using a schema like this at my project:

{
  lanes: [{
    id: 'number', // has to be unique within lanes
    name: 'string',
    notes: [
      {
        id: 'number', // has to be unique within notes
        task: 'string',
      }
    ]
  }]
};

Especially dealing with id uniqueness is a little painful. The ids need to be unique because I need to deal with drag and drop (DnD) and it helps immensely with that.

To get a unique id for a new note I need to do something like this:

function getAmountOfNotes(lanesCursor) {
  return lanesCursor.get().map((lane) => lane.notes.length).reduce((a, b) => a + b) || 0;
}

The problem with nested structure is that besides this nasty check lookups across notes become difficult. That's something I need to do in DnD.

After some discussions it was proposed that the structure could be flattened like this:

lanesById: { // { laneId -> lane }
  1: { id: 1, name: 'Lane' },
  2: { id: 2, name: 'Other Lane' }
},
notesById: { // { noteId -> note }
  1: { id: 1, name: 'Note' },
  2: { id: 2, name: 'Other Note' },
  3: { id: 3, name: 'Yet Another Note' },
},
laneOrder: [2, 1], // [laneId*]
noteOrder: { // { laneId -> [noteId*] }
  1: [2, 1],
  2: [3]
}

This means we would effectively separate order from lanes and notes and flatten the structure. The benefit of this approach is that the lookups I need for DnD become very simple. On downside now we're dealing with id references.

I realized baobab facets could hide some of this detail. This way I could have notes and lanes at root level of the tree. To deal with lane specific notes I would implement a facet that takes lane id and returns notes to render (it would resolve the order based on above). DnD operations would operate on order through facets.

How would you resolve this with baobab? Does the facet approach sound sensible to you?

CC @christianalfoni

[christianalfoni]

check answer on: survivejs/react-book#20

[bebraw]

Thanks! Closing as it's probably better to keep discussion there.

[Yomguithereal]

Will follow up there.