Kanban Board Theme Component

[david (David Taylor)]

This theme component allows you to display and organise topics using a kanban board interface.

Repository Link

Preview on Theme Creator

So far, there are three modes. Categories, tags, and assignment. You can drag topics between lists to change the corresponding attributes:

Lists are ‘lazy-loaded’, so performance is reasonable, even for very large numbers of categories. You can enter fullscreen mode for even more space to organise your projects:

The default board mode will be automatically determined using these criteria:

• If this is the top level, use categories mode
• If this is a category, and there are sub-categories, use categories mode
• Otherwise, use tags mode. (Lists built from ‘top tags’ list)

You can change the board mode using the filter button on the left, and configuration changes will be reflected in the URL. Users can bookmark their favorite configuration in their browser. Administrators can customize the defaults per-category in the theme settings.

The most intuitive setup is “tags”, where the tags displayed are in a tag group with “only one tag from this group” enabled.

#pr-welcome features:

• make the lists more configurable. e.g. allow administrators to define a combination of assignment, tags, and categories in one display

• Add support for dragging cards on mobile devices. Unfortunately they don’t support html drag and drop

[justindirose]

Wow this is amazing, @david. I considered building something like this about a year ago but didn’t have the time to do it.

goes and explores the possibility of spinning up a personal Discourse for a todo list…

[merefield (Robert)]

Oh, the video! Drag and drop! Superb. @angus

[justindirose]

I’m not sure if this is a component bug or something with Discourse. I have three tags I’m trying to add: completed, in-progress, and inactive. I can search for one and add it, but when trying to search for another, it shows “no matches found”.

[Stephen]

One small glitch I’ve noticed is that even with allow uncategorized topics unchecked and no topics within uncategorized I see a column for it in the category view

[Chaboi_3000]

Wow. This is awesome. Great job @david! Somehow it reminds me of GitKraken Glo. But good job with this component!

[david (David Taylor)]

Thanks @justindirose and @Stephen, I’ll take a look at those issues.

Somehow it reminds me of GitKraken Glo

Yes, GitKraken Glo and Trello are popular examples of “Kanban board” interfaces. They didn’t invent the idea though

[angus (Angus McLeod)]

Oh boy. Awesome!

We’re going to use this to help manage work on open source plugins. Already set up here:

A couple of initial questions / requests:

1. Could we have a setting to turn the ‘Untagged’ column off?

2. Could we include the topic-title plugin outlet in the topic template being used here? (I’ll see if I can make a PR next week). I’d like to include event details in that topic template.

[justin.noom (Justin Thurer)]

Wow - this looks amazing, thank you @david!

[bletch (Danny Goodall)]

@david, this is excellent and looks like a great fit for a use case I have.

A couple of things… (you knew that was coming, right?).

I moved an untagged item to a tagged column and the confirmatory modal seems to contain some placeholder or string interpolation text.

Secondly, I’d love to see the ability to restrict the cards that are displayed across the columns to only open topics (i.e. not closed or archived). Right now, it appears that all topics in the column that match the category or tag are displayed.

Perhaps a theme setting that asks “Only open topics?”

Great work!

[david (David Taylor)]

Thanks for the bugs/suggestions everyone - I’ll try and find time to implement them soon.

I’d love to see the ability to restrict the cards that are displayed across the columns to only open topics (i.e. not closed or archived)

You can kinda do this already, by manually adding &status=open to the URL. The lists will reflect all the normal discourse filters in the URL. But yes, I would like to add this as a theme setting and a UI option

[tobiaseigen]

Amazing. Really looking forward to exploring this theme component. I’d love to see it in action on the newly improved assigned activity list, and also on assigned messages! I think this might move us forward quite a bit with the Tickets Plugin 🎟, @angus.

[Ellibereth]

Are you able to set it up to display subcategories from the top level? Can only figure out how to make it default to certain categories.

[kristoferlund]

Nice work! I have been working on something similar to support the needs of our community. I didn’t create a theme component but instead created an external service using Express/React, connecting with Discourse through the api.

Manage categories Trello style - a kanban service for Discourse

Manage categories Trello style - a kanban service for Discourse

The prototype kanban service is live now, we are currently trying out an alpha version on our forum: https://foodshift.se I’m calling the service: Lanes [lanes-screendump] The service is a Node/Express/React thing, connecting with Discourse through the api. Boards are currently configured manually and added to Discourse using an iframe - not the coolest solution, but it works really well for our use case. See a board integrated in our forum here: The Food Shift Improvements Boa…

[ZackFea]

Thanks for sharing this, awesome!

It should be possible to hide topics from list. For exampe the category description topics will never moved.

[Hanon_Ondricek]

I have three tags I’m trying to add: completed, in-progress, and inactive. I can search for one and add it, but when trying to search for another, it shows “no matches found”.

Do you have those three tags set to allow only one from that group? If you have one tag added, it won’t let you add another from the same group until you delete the one you have in there.

[FoohonPie]

I had the same issue, but it wouldn’t let me add a second tag to the kanban view at all, regardless of what individual topics were tagged as.

Strangely, it works if I disable the “Limit one tag per topic from this group” setting, which I assume is not the correct solution given the instructions here.

[david (David Taylor)]

Yes, at the moment the tag selection component is behaving like it does in a topic (i.e. preventing multiple tags from ‘limit one tag’ tag groups). I will get it fixed. In the meantime you can always add the tags manually to the URL.

[rodvay]

Very good theme im waiting

[justindirose]

I worked around this using the setting to set the default view for categories. Works just fine that way!