## Question Design the frontend state and update logic for a work board with exactly three ordered columns. Each column supports adding and deleting work items, and users can move an item from one column to another while choosing its new position. ### Constraints & Assumptions - Every column and item has a stable unique ID. - Item order within a column is meaningful. - An item belongs to exactly one column. - Moves may occur through drag-and-drop or keyboard controls, but both call the same state command. - The first version is local-only; explain how the design can later persist changes. ### Clarifying Questions to Ask - Can users reorder an item within its current column? Yes. - Are the three columns fixed or renameable? Fixed for this exercise. - What should happen when an item is deleted while selected? Selection should clear or move predictably. - Is undo required? Not initially, but the update representation should make it feasible. ```hint Model order directly Keep an ordered list of item IDs per column and an ID-keyed item map. Avoid duplicating the item's column in multiple independent places. ``` ### What a Strong Answer Covers - A normalized state shape with one authoritative membership relationship. - Pure add, delete, reorder, and cross-column move transitions. - Correct index adjustment when moving within the same list. - Stable keys and narrow component subscriptions. - Accessible alternatives to dragging and a path to optimistic server persistence. ### Follow-up Questions 1. How would you resolve two users moving the same item concurrently? 2. How would you add undo and redo without storing a full board copy each time? 3. Which state should remain local to a card rather than enter the board store?