Implement connection locking

common/src/board-reducer.ts

@@ -6,6 +6,7 @@ import {
  Board,
  Connection,
  ConnectionEndPoint,
+ ConnectionUpdate,
  findItem,
  findItemIdsRecursively,
  getConnection,
@@ -156,16 +157,22 @@ export function boardReducer(
  },
  ]
  case "item.update": {
+ const updatedConnections = updateConnections(board, event.connections || [])
  return [
  {
  ...board,
  items: updateItems(board.items, event.items),
+ connections: board.connections.map((c) => {
+ const replacement = updatedConnections.find((r) => r.id === c.id)
+ return replacement ? replacement : c
+ }),
  },
  {
  action: "item.update",
  boardId: board.id,
  // TODO: Undo of update could only undo the actually updated fields here
  items: event.items.map((item) => getItem(board)(item.id)),
+ connections: (event.connections || []).map((connection) => getConnection(board)(connection.id)),
  },
  ]
  }
@@ -296,6 +303,18 @@ function applyFontSize(items: Record<string, Item>, factor: number, itemIds: Id[
  }
 }
 
+function updateConnections(board: Board, updates: ConnectionUpdate[]): Connection[] {
+ return updates.map((update) => {
+ const existing = board.connections.find((c) => c.id === update.id)
+ if (!existing) {
+ throw Error(`Trying to modify nonexisting connection ${update.id} on board ${board.id}`)
+ }
+ const updated = { ...existing, ...update }
+ validateConnection(board, updated)
+ return updated
+ })
+}
+
 function updateItems(current: Record<Id, Item>, updateList: ItemUpdate[]): Record<Id, Item> {
  const updatedItems: Item[] = updateList.map((update) => ({ ...current[update.id], ...update } as Item))
  const updatedItemMap = arrayToRecordById(updatedItems)

common/src/domain.ts

@@ -280,8 +280,9 @@ export type AuthJWTLogin = {
 export type AuthLogout = { action: "auth.logout" }
 export type Ping = { action: "ping" }
 export type AddItem = { action: "item.add"; boardId: Id; items: Item[]; connections: Connection[] }
-export type UpdateItem = { action: "item.update"; boardId: Id; items: ItemUpdate[] }
+export type UpdateItem = { action: "item.update"; boardId: Id; items: ItemUpdate[]; connections?: ConnectionUpdate[] }
 export type ItemUpdate<I extends Item = Item> = Partial<I> & { id: Id }
+export type ConnectionUpdate = Partial<Connection> & { id: Id }
 export type MoveItem = {
  action: "item.move"
  boardId: Id

frontend/src/board/contextmenu/lock.tsx

@@ -32,8 +32,11 @@ export function lockMenu({ board, focusedItems, dispatch }: SubmenuProps) {
  function setLocked() {
  const b = board.get()
  if (!enabled.get()) return
- const updated = focusedItems.get().items.map((item) => ({ id: item.id, locked: nextLockState.get() }))
- dispatch({ action: "item.update", boardId: b.id, items: updated })
+ const all = focusedItems.get()
+ const locked = nextLockState.get()
+ const items = all.items.map((item) => ({ id: item.id, locked }))
+ const connections = all.connections.map((connection) => ({ id: connection.id, locked }))
+ dispatch({ action: "item.update", boardId: b.id, items, connections })
  }
 
  return L.view(hasItems, nextLockState, (hasItems, nextState) => {