Changing state won't rerender label in react-trello

[oliviervanbulck]

I'm using react-trello for a project. When a card is dragged to another lane, I want to update the labels on the lanes.

I'm currently trying this:

async function handleDragEnd(
        cardId,
        sourceLaneId,
        targetLaneId,
        position,
        cardDetails
    ) {
        await updateDeal(cardId, { ... }).then(() => {
            NotificationManager.success('Successful!');
            let bd = {lanes: [...boardData.lanes]};
            bd.lanes[phases.indexOf(sourceLaneId)].label = 'test';
            setBoardData(bd);
/*          setBoardData(prevState => {
                let prev = {...prevState};
                prev.lanes[phases.indexOf(sourceLaneId)].label = 'test';
                console.log(prev);
                return prev;
            });*/
        }).catch(() => NotificationManager.error('Error...'));
    }

This works and is updating the state, as I checked this with a useEffect() with a dependency on boardData. But the Board won't rerender the label. Anyone who knows how I can fix this?

Board:

<Board
            id="flowTrelloBoard"
            data={boardData}
            style={{
                height: 'calc(100vh - 64px)'
            }}
            editable={false}
            canAddLanes={false}
            hideCardDeleteIcon={true}
            onLaneScroll={onLaneScroll}
            handleDragEnd={handleDragEnd}
            onCardClick={onCardClick}
        />

[dfibuch]

Not sure if this will help you, looks like it's been a while but I've started using this library recently and wanted my labels to update when I moved cards around and used the onDataChange callback with the eventBus to make it happen

For reference, boardData is my { lanes: [] } object that I pass to <Board data={boardData} />

  const onDataChange = useCallback(( newData: any ) => {
   // Checking if any data changed, otherwise do nothing
   // Also helps with the scenario when data is first loaded from the server and eventBus is not init yet
    if (JSON.stringify(boardData) === JSON.stringify(newData))
    {
      return;
    }

   // Iterate through each lane and count the cards, then set it back in the object
    newData.lanes.forEach((lane : any) => {
      lane.label = `${lane.cards.length}`;
    });

   // Pass the new lane data to the eventBus
    eventBus.publish({ type: "UPDATE_LANES", lanes: newData.lanes });
  },[boardData, eventBus]);