Drag and Drop feature for cards

[tu2-atmanand]

The FR for this feature is been tracked here : #5

This may be the most requested feature by users and also a very essential one even from the Kanban methodological POV. Because, in Kanban the whole point is to arrange the tasks in a 2D space to organize them in way so that we can prioritize and build a better roadmap for the project we are working on or just to organize our daily tasks.

Usually, Kanban boards are static, that means changing certain properties or due to changing other factors, the cards will not automatically going to move from one column to another by itself. But Task Board has a lot of automations functionalities (a lot more coming in the future), to make the manual-labor work of organizing each and every task by going through the board again and again. These automations also helps to filter tasks faster. For example, there are date-type columns, which helps to filter out which tasks are planned for today, tomorrow, in next seven days, etc., so when the days are passing, the tasks will move from one column to another automatically and you dont have to move them manually. And there are tag-type column, which filters tasks with certain tag on them, so if you update the tag for any task in your notes, that task will now appear in some other column, based on its new tag.
So in summary, this plugin makes use of the properties the tasks already have, to filter and organize them.

Hence, if we are implementing a drag and drop feature in this automatic Kanban board, then these propertie-values will also need to be updated so the tasks can move from one column to another, or to add itself in another column. But there will be certain restriction this plugin might have while implementing this feature. Lets discuss as much cases as possible in the following comments.

[tu2-atmanand]

Possible Drag-and-Drop actions

For the nomenclature and to understand the Column types better refer this : https://tu2-atmanand.github.io/task-board-docs/docs/Components/Types_Of_Columns/

Following will the drag-and-drop actions possible and their mapped actions on the task. If you move a task :

• from Dated to Dated : For example, say the user moves a task from Today's column to Tomorrow's column (procrastination), then the universal date* value will be changed from today's date to tomorrow's date for this task. And thats why the task will going to appear inside the Tomorrow's column.

• from Undated to Dated : This can be a very useful one, if say there is a column, Backlogs, with all the tasks which do not have Universal date on them. Then user can simply drag any task and drop into say tomorrow's column. This action will add a universal date to this task with tomorrow's date as value.

• from Dated to Undated : From v1.5.0 onwards, users will be able to select which date should be used for this Dated type column. Hence, if user moves a task from a Dated type column, which had the Scheduled type date, then this property will be simply removed from the task.

  • Also, please note, if the task is moving from a Dated type column of date-kind Created date, then this should not be possible. Since its not a good idea to remove a Created date property from a task.

• from Tagged to Tagged : This is a very useful and if there are all Tagged type column on a particular board, then this board will act like a normal static board. So when user will move a task, say from #important to #InProgress, then simply the #important tag will be removed a the new #InProgress tag will be added to this task. This has reduced the manual work of removing and adding a new tag.

• from Untagged to Tagged : This is another very important functionality, where say user has a column with all the tasks which do not have any tags on them. So, now user can simply move them from this column to any Tagged column and the tag associated with that column will be added as a tag on this task.

• from Priority to Priority : Here simply the older priority will be replaced by the new status value/emoji according to the column's configuration value.

• from Status to Status : Here simply the older status will be replaced by the new status symbol according to the column's configuration value.

From any other column to a specific column

• from any other column to Dated : This action will simply add the date property to the task. For example, if a task is dropped inside a Dated type column with the date-kind as Scheduled date as todays date, then the today's date will be added as a Scheduled date property to the task.

• from any other column to Tagged : This will simply add the tag if it do not exists on the task. If it already exists, then it should not do anything.

• from any other column to Completed : This will simply mark the task as completed and add the completion date to it.

• from any other column to Priority : In this case, if the task do not contain a priority property then the applicable priority will be assigned to it. But if there is already a priority present to the task then it will be simply updated.

• from any other column to Status : In this case, simple the previous status of the task will be updated to the new one according to the column configuration value for the status.

Actions which need brainstorming

• from any other column to Dated type column with a range of dates : If user moves any task, from any type of column to a Dated type column with a range of dates, for example, a column showing all the tasks scheduled for next seven days, then its not possible to directly add a date as its scheduled date property. In this case a new popup might be required, which will ask user to select on which date this tasks should be scheduled for.

• from any other column to Other Tags : This is also not possible, since a Other Tags type column shows all the tasks which has not been shown in the Tagged type column present the same board. If user tries to drop any task inside this column, this will mean that user wants this task to have either some tag, if this tasks didnt had a tag at all, or the task already had a tag, but want to give some different tag. This can be solved using a same approach as above, where a popup will open asking user, what tag they want to give to this task.

• from any other column to Untagged : I am not sure, if I should implement this, because removing all the tags from a task by simply moving them to this column seems to be a dangerous action to perform.

Not possible Drag-and-Drop actions

• from any other column to Overdue column : Overdue column means all the tasks with past universal date value on them. So this is simply doesnt makes sense if any user will like to move a task to a past date column. Hence this functionality won't be available.

• from any other column to Undated : Except the Dated column, if user tries to move a task from any other type of column, say a Tagged type column and say this task has Due date and Scheduled date present on them. This will simply not possible, since its not a good idea to simply remove all the date properties of the task altogether.

---

Abbreviations

• Universal date is a date user has selected as the default date, to be considered for most of the operation out of all the other dates present on the task, which are Start date, Scheduled date and Due date. This can be changed from setting, from v1.5.0 and onwards.

[tu2-atmanand]

Guides while dropping a task

By default the columns will have the manual sorting criteria set to them, which means, initially tasks will be populated by the order in which they are scanned, but later user will be free to arrange the tasks within the column using this drag and drop handle.

Now, while moving a task from one column to another, if the column in which the task is to be dropped is set to the manual sorting criteria then this feature should show the guides, which indicates where this moving task will be placed, that is, between which two tasks this dropped task will be placed.
The Following GIF shows an illustration of the same, where an empty area is shown as guide, where the task will be placed once dropped. We might show some glowing line, similarly:

But if there is any other sorting criteria have been set to the destination column. Like sort based on the priority or schedule date etc., then in this case the guides won't be shown and once user drops the task inside the highlighted/destination column. It will be automatically arranged to its applicable position as per the criteria.

[Gugarutz]

You are nuts (the good way). Thanks for doing this
+1 from me

[Gugarutz]

I am Astrusia on the forums

[tu2-atmanand]

Thank you for showing interest in this plugin!
The ultimate goal is to update the task properties in the easiest possible way. This feature has a great potential and I am excited to implement it ASAP in the Task Board.

[Astrusia]

I have created a new account for more clarity/ better association. Just FYI

[medo0o0o0]

I'm a bit confused Is this future got implemented ? why i cant use it ? i am using the latest version

[tu2-atmanand]

No @medo2132112 , this feature has been planned for version 1.10.0.

You may go through the following link for the version wise roadmap: https://github.com/tu2-atmanand/Task-Board/milestones

Following link is the complete roadmap and the status of the development: Task Board Dev

The development for this feature has started locally. I am trying out it's integration with the rest of the features release so far and the features planned for the upcoming version before it's release. Advanced Board Filters and Filtering and sorting for individual columns are some of the features which I have to develop before I can develop/release this drag and drop feature. Hence, it has been planned a little late and also to ensure I get enough time to make it big free as much as I can.

A rough estimation I can give is. The version 1.10.0 will be released within 2 months. But the advanced Board Filters are coming within a few weeks.

[tu2-atmanand]

This discussion topic is to discuss and note down every possible edge case I will need to handle whole developing this feature. Because this is not a static Kanban board, the architecture to implement a drag and drop Manager will be a little complex.

[tu2-atmanand]

Ahh! I think I might have caused a confusion by providing a wrong issue number.

The FR is being tracked on #5 and not on #10.

Updated it in the original post.

[medo0o0o0]

oh now i see why @Gugarutz said :

You are nuts (the good way). Thanks for doing this +1 from me

😂It's one hell of a future if it gets implemented.
+1

[medo0o0o0]

for real ! ,how you know that its "she"

She never said that

[Astrusia]

It was told to my by the oracle and also: https://youtu.be/HQkSMJFJu4g?si=cAICy6vm9KZwSYhK

[medo0o0o0]

😂ok

[tu2-atmanand]

https://youtu.be/HQkSMJFJu4g?si=cAICy6vm9KZwSYhK

Seen reels so many times, but still havent seen this movie. Gotta watch it now.

[Astrusia]

never seen it either. just know that scene haha. i guess i have to watch it too now.

[medo0o0o0]

What about moving Values into different inline properties , Similar to :

from any other column to Priority : In this case, if the task do not contain a priority property then the applicable priority will be assigned to it. But if there is already a priority present to the task then it will be simply updated.

But using custom inline property

[tu2-atmanand]

What kind of properties are we talking about?
(I haven't used Dataview much, so my knowledge about inline properties will be limited). But are we talking about custom properties here?

An example will be nice to understand.

[medo0o0o0]

That is a small presentation I made to convey what I meant

Screen.Recording.2025-10-10.200328.mp4

[medo0o0o0]

also useful

[tu2-atmanand]

Awesome !

I didnt knew that we can add custom properties in Dataview plugin. Actually, I am not a big fan of queries. So, whether its Tasks plugin or Datacore, etc. I dont use them day-to-day. So my knowledge about them is limited.

But I tried to make Task Board as close as Tasks plugin. And the queries part is done through advanced filters in Task Board.

I think, now Task Board should also get as much compatible with Dataview plugin as it is right now with Tasks plugin. If, users are applying different kinds of custom properties to their tasks. Then Task Board will also support the same and use them accordingly for various processing with its features. Actually, I have already, unknowingly, have added custom properties like "[time:: ]" as can be seen here : https://tu2-atmanand.github.io/task-board-docs/docs/Components/MetadataFormats/#compatible-plugin-format

So, for the universal properties, will define the specific property names, so users can use them and those properties will be picked up faster. For custom properties, we can store them while scanning and later users can use them inside Advanced Board filters and Advanced Column filtering and sorting. (coming up in the next release)

[tu2-atmanand]

@medo2132112 , created a new FR for this : #414
We can take forward this discussion in that issue.

[medo0o0o0]

Back to our topic,😂 I use drag and drop to reschedule tasks using the day planner, and thanks to the compatibility of this plug-in with it, it's satisfying.

[tu2-atmanand]

Yeah! I had been using it with Task Board and compatibility is nice so far. It has really nice features and since its already been implemented, thats why I didnt wanted to re-invent the wheel, like the Calender view and all. But it requires Dataview plugin to work. So, installing so many plugins concerns me. Because there are few issues like more load time at Obsidian startup, the integration of all these three plugins might not go well with releases of Obsidian, etc.

But for now, it can be used. Maybe in future Task Board can have its own Calender view and the other features of Day planner plugin can be integrated in Task Board natively.

[medo0o0o0]

I am a heavy user of Dataview. It's great for querying things around your vault

Task Board can have its own Calender view

🤩that nice !

[tu2-atmanand]

"It's always hard before you start", this is what I felt after completing the drag and drop functionality in Task Board.

I actually thought, this feature will going to be the most painful feature to implement in this plugin. The main reason for my this assumption was, I was planning to implement this feature using an external react library, to handle all the animations and everything.

But, turns out react natively provides a much optimal way to implement a drag and drop functionality. Although, everything else, like UI state management will required to be handled by us. But, instead of depending on any third party library, its worth to implement it this way, and I dont think, the external libraries will going to provide any advantage, it will simply going to increase the size of this plugin, which will lead to more load time during Obsidian start. So its better to have a native implementation and soon, will be able to improve it with more styling and animations.

And with time the code can be improved. But, for now, with this current first version state, the performance is already much better than I expected.

I hope, experienced UI/UX developers and testers will going to contribute in improving this feature in the future.

For now, below is the demo of how its performing in the beta version I have released for my personal testing as well as for the beta testers our there. (Apologies for the lag in the GIFs, its because of my old PC and the screen recording, etc...)

Column to Column

Notice the green and red color indicates, whether the task can be dropped inside the target column or not. There are only few exceptions which can be implemented in the future, but for now they have been disabled.

Also, a date-picker popup will appear if you drop the task inside a dated type column with a range of dates, so user can pick a particular date.

Not only this, at this same time of the development, another user suggested the Swimlanes feature. This was an amazing coincidence, because building both these features simultaneously helped me to structure the code properly and build a better algorithm design. I have personally tested it and have found to be properly working. Read more about this here :

Manual sorting

I believe users might encounter few issues with this feature. Because, there are below conditions applicable for manual sorting to work properly:

• All the tasks within the target column and the task which will be moved inside it, all these tasks must have a ID on them.

This feature will work even if all the tasks don't have ID on them, but it will not persist that order. Hence, ID is vital.

Also, manual sorting feature has been disabled for now in Swimlanes, as it's giving unexpected results. It's a little complex to implement, so will work on it seperately in the future.

How to test this beta version

Read this to learn how to test a beta version : https://github.com/tu2-atmanand/Task-Board/releases/tag/1.9.0-beta-1

[Astrusia]

WOOHOO

[tu2-atmanand]

Testing has started

A thorough testing has been started in the following ticket. After this testing is over and once we have ensured that this feature is working as expected in all aspects of its functionalities. It can be released in the next version, 1.10.0.

#681

[Metanoia41]

Request to add a new feature:

Applying a priority filter blocks the use of Drag-and-Drop in the column. It becomes impossible manually:

1. Change the order of the cards within the same priority level.

2. Change the priority of the card by manually transferring it from one level to another priority level: (from "High" to "Very High" etc).

Is it possible to implement something like this in the future?
Using both: a priority filter and manual sorting (D&D) on the same column?

[Metanoia41]

I'm less sure about the second point. This can probably confuse the user when there is already a context window.

On the other hand, such a feature would make it easier to change the priority of a task without going to the context menu.