Views Board (Kanban and Gantt)

Views Board adds a Board format to Views. Any view of content, users, terms or other entities becomes a kanban board: cards in columns, one column per value of a field, optionally split into lanes by a second field. Editors move cards by drag and drop or from the keyboard, and each move is saved as a normal edit, only when the user may make it. Two submodules draw the same view as a Gantt chart, with bars that move by dragging, or as waves of what waits for what.

Features

• 🗂️ Any view as a board. Columns come from an entity reference, list, boolean or state field, in the order the field gives. Filters, contextual filters and exposed forms are the view's own, so a board can be scoped to a group, a project or the current user like any other view.
• 🛣️ Lanes. A second field splits the board into collapsible lanes, by person, team or any single-value field. Offer several and the reader switches between them above the board. Lanes by milestone, sprint or term can follow the milestone's date, the sprint's start or the term's weight instead of their names, and site code can add a detail under each lane's name: a milestone's date and how many of its items are open, say.
• ⌨️ Drag and drop, or the keyboard. Cards move with a mouse, a pen or a finger, or through a Move menu that works with the arrow keys. Every move is announced to screen readers and can be undone.
• 🔒 Moves checked like edits. A move needs the user's update access to the entity, or the site's own rule for who moves a card, and edit access to each field it changes, passes validation, and is saved through the entity's normal save, with a revision when the bundle keeps them. Cards the user cannot change show no handle.
• 📌 The order is kept. With a weight field, the order of cards within a column survives a reload. Reordering does not count as an edit.
• 🚦 Columns that say something. Colors, work-in-progress limits per column and per lane, a total of a numeric field, and columns that start collapsed.
• ⏰ Due dates. With a date field, a card past its day says "Overdue", and one due today or soon says so, in words and not in color alone. Each column head counts its overdue cards, and finished columns such as Done never show a card as late.
• 🔗 What blocks a card. With an entity reference field to items of the same type, each card lists what it waits for: pending while the item is open, met once it reaches a finished column, and a conflict, in red, when the card is finished first. Moving an item updates the cards that wait for it, and an arrows library draws the same links for displays that set cards out by them.
• ➕ Add from the board. An Add link in each cell opens the create form with the column and lane already filled in.
• 🔌 Events for site code. Decide who may move a card (the person assigned to a task, say, without the right to edit it), veto a move before it is saved, react after it (to send an email when a card changes hands, say), add empty lanes or a detail under each one, change the Add links, or decide when a dependency is met.
• 🎨 Takes the site's look. Uses the colors of Olivero, Claro, Gin and Bootstrap 5.3 themes, dark mode included, with no front-end framework of its own.
• 🖥️ Full screen. A button above the board puts the whole view, filters included, on the whole screen. With Use AJAX on the view, filtering and switching lanes keep it there.
• 🧩 Views Board Gantt submodule. A Gantt format: the same view as bars on a time axis, colored by column and grouped by lane, with weekends, a line for today and, when lanes stand for milestones, their dates. Each reader zooms it to days, weeks or months, with an axis for each, and their browser keeps the level they chose. What blocks each item is drawn as arrows between the bars, from and to the ends a Dependency field's link type names. Dragging a bar or one of its ends changes the dates, with the same checks as moving a card and an Undo, and a dialog does the same from the keyboard. A bar starts at a start date, at the due date less a duration such as an estimate in hours, or where site code says, from the item's history. No chart library.
• 🧩 Views Board Dependencies submodule. A Dependencies format: the cards of a board set out in waves by what blocks them, each one wave after the furthest card it waits for, so every arrow points right and the long chains show. Each card says whether it can start or is waiting, filters pick out what can start, what waits, what blocks others and what is in conflict, and hovering or focusing a card lights up the whole chain.
• 🧩 Views Board Dependency Field submodule. A Dependency field: a reference to the item an entity waits for that also records how, finish-to-start, finish-to-finish, start-to-start or start-to-finish, as in a Gantt chart. Saving refuses a cycle, even one through items the editor cannot see, and the same item twice with the same link type. It works as a board's Blocked by field, gets relationships both ways in Views, and a site can extend it with columns of its own.
• 🧩 Views Board Tools submodule. Two Tool API tools, one that reads a board, with what blocks each card, and one that moves a card, for agents of the AI module, MCP servers and Drush, with the same checks as a move in the browser.

A card dragged from Writing to Scheduled, then the confirmation with its Undo. Opens a 4-second animation.

The Gantt submodule: the plan's tasks as bars, its milestones as lanes, and what each task waits for as arrows.

The Dependencies submodule: each item one wave after the furthest item it waits for.

Quick start

composer require drupal/views_board:@beta
drush en views_board

1. Create or edit a view of entities, and under Format choose Board.
2. Pick the column field, and optionally a lane field and a weight field. Set the pager to Display all items.
3. Choose what a card shows in the Board card view mode, under the bundle's Manage display.
4. Open the view's page: the cards are in their columns, and dragging one saves the new value.

The Move menu: every column, lane and position, reachable with the arrow keys.

Good to know

• Views of entities stored in SQL only. Search API views are not supported: the index lags behind the save, so a moved card could return to its old column on the next refresh.
• Lane, weight and total fields must hold a single value.
• No permissions of its own. The view's access decides who sees a board; entity and field access decide who moves a card, unless site code decides otherwise.
• A Gantt counts calendar days and moves bars in time, not between lanes. Critical paths, automatic rescheduling and baselines are outside it.
• The module sends no notifications. A move is a normal save, so whatever a site already does on save still runs, and the move events cover the rest.

Additional requirements

• Drupal 10.3 or later, or Drupal 11.
• Views, from core. Drag and drop uses core's SortableJS; there is no jQuery or Bootstrap dependency.
• Views Board Tools only: Tool API, which needs Drupal 10.5 or later. Require it with Composer yourself; Views Board does not depend on it.

Recommended modules/libraries

• State Machine: its state field can be the column field, for boards that follow a workflow.
• ECA: Event - Condition - Action: rules that react to an entity being updated also run when a card is moved.
• Duration Field: its duration can give a Gantt bar its length, its days as days and the rest as working hours.

Similar projects

• View kanban bootstrap also shows a view as columns, with Bootstrap 5 markup.
• Content Planner is an editorial dashboard with a content calendar and a kanban of content by moderation state. Pick it for a ready-made editorial workflow; pick Views Board for a board over any entity and any field.
• View gantt draws a view as a Gantt chart with the dhtmlx Gantt library, from its CDN or a copy in the libraries folder, with parent tasks, progress, tasks added and edited in the chart, and baselines with the library's Pro edition. Pick it for a scheduling tool; pick Views Board for a board and a chart over the same view, with no library.

Community documentation

• README: every setting, how a move is checked, the events with examples, and theming.

Supporting this module

Developed and maintained by Bloomidea. Bloomidea offers support and custom development for this module.