Modal Form for Creating Tasks WITH tags auto completion

[edakimling]

Fist off, thank you dev for this incredible plugin. It is very powerful and greatly appreciated.
I know we all sorely miss the tags auto completion feature in the create task form. This matters to those of us that create tasks anywhere in obsidian with a hotkey and tasks are then written into one main file. Then tasks are shown in dashboards, daily notes, etc via tasks queries.

In this thread it is discussed how this feature is important to people, but the dev does not have time/skills to implement it. I agree that especially with nested tags, it is impossible to remember them and not misspell them. Thus this feature is crucial for many of us.

I have created and alternate form using modal forms and quickadd plugins. This form is missing some functionality (listed below) but I find it does the job for the 99% of people and crucially, you can now auto select tags. In some other ways the form is also better, such as supplying default values, which speeds up tasks creation even more.

Benefits of This Form

• The tasks' plugin built-in modal form is missing crucial support for pop up tag selection. If you are using hierarchical nested tags, this is crucial omission. Unfortunately the dev of tasks said numerous times she has no time/skills to do this.
• If setup with quickadd, this form can be invoked anywhere with a hotkey and can append tasks to one common file, as is the usual setup
• This form has default values passed to the form for quick task creation (you can modify these values in the js code below):
  • creation date is set to today
  • due date is set to tomorrow
  • status is set to 'TODO'
  • Priority is set to 'normal' (there is a small hack with inline note in the code to make this work with tasks and modal form)
• Tags are parsed and prefixed with '#' to support inline tasks on a task line. Although modal form has a field for tags, it parses them in an array like format to be used in frontmatter or with a key value pair inline; not as independent inline tags as tasks expects.
• Recurring has automatically added 'when done' and 'on completion' strings. These affect how recurring tasks are created. I use these defaults as they make sense to me. You can remove them; read about it in tasks documentation first.
• Tags, Recurring, start and scheduled dates are all optional fields and checked so no empty emojis would be injected into your tasks .md file if these fields were left empty
• The form is checked if it is cancelled, so again no tasks with emojis and no values are created if cancelled
• I tried to put defaults in separate lines for you to easily tweak. I also broken the resulting output line into separate independent sections so you can comment them out or add new ones to your liking
• The resulting text for task has the various elements of the task written in the right order as per how tasks does it.
• Fields are ordered with essential ones on the top and less important towards bottom so you can create tasks fast. Again, you can edit the order of the fields once you import the code below into the form manager
• I added custom statuses, as come from many themes. I only added those that made sense to me. Modify to your liking. This does not affect the js code for the quick add, but you must follow precisely the VALUE part of the field as in other fields.

Cons of This Form

• This form does not support editing existing tasks. For that, use simply the edit button on each task in dataview on your dashboards
• This form does not support adding linked tasks.
• This form omits some fields not often used. Notably, it does not allow you to 'check' a task (you can do this from your dashboard; this form is for creation)
• This form does not allow you to set creation, done and cancelled field (same reasons as above; this is a creation form)

It is possible some (all?) of these cons could be resolved with further coding, but this is for someone with far more skills than I possess in js.

How to setup

• install quickadd, tasks and of course modal forms plugins

• Open the modal forms manager via the command palette. Import the code below for the form. Edit the form to your liking - add fields, remove fields, modify order, etc. BEWARE that removing fields will break the code for the quickadd, so you must remove their mentions there too. Same for adding. If you add new fields, you must add code in the js snippet for quickadd. But that should be easy; use my code as example. Just remember to insert the new fields at the right places.

• Save the form.

• Open quick add via command palette. Add a new capture. Click on the lighting bolt.

• Click on the settings icon and setup the quickadd to capture (append) to an existing file. This is commonly how folks in obsidian do it, but feel free to do it s per your setup of course.

• Navigate to the bottom section where it says 'capture format' and paste in the js code below.

• Exit and go to hotkeys and set the hotkey for the new quick add.

Congratulations, you should be all done. Open the file where tasks will be appended. Invoke the hotkey and try the form out. If there are issues, write to me here. Watch tutorials on YT on how to set things up. I highly recommend this person's blog; he did an amazing job explaining quickadd, modal forms etc.

Modal Form - import this in your modal form manager

{
  "title": "Insert New Task",
  "name": "NewTask",
  "fields": [
    {
      "name": "TaskDesc",
      "label": "Description",
      "description": "",
      "isRequired": true,
      "input": {
        "type": "text",
        "hidden": false
      }
    },
    {
      "name": "Tags",
      "label": "Tags",
      "description": "",
      "isRequired": false,
      "input": {
        "type": "tag"
      }
    },
    {
      "name": "DueDate",
      "label": "Due",
      "description": "",
      "isRequired": false,
      "input": {
        "type": "date",
        "hidden": false
      }
    },
    {
      "name": "Recurring",
      "label": "Recurring",
      "description": "Use natural language and numbers for entities. (\"when done 🏁 delete\" will be appended)",
      "isRequired": false,
      "input": {
        "type": "text",
        "hidden": false
      }
    },
    {
      "name": "Priority",
      "label": "Priority",
      "description": "",
      "isRequired": true,
      "input": {
        "type": "select",
        "source": "fixed",
        "options": [
          {
            "value": "⏬",
            "label": "⏬ Lowest"
          },
          {
            "value": "🔽",
            "label": "🔽 Low"
          },
          {
            "value": "-",
            "label": "⏹️ Normal"
          },
          {
            "value": "🔼",
            "label": "🔼 Medium"
          },
          {
            "value": "⏫",
            "label": "⏫ High"
          },
          {
            "value": "🔺",
            "label": "🔺Highest"
          }
        ]
      }
    },
    {
      "name": "Status",
      "label": "Status",
      "description": "",
      "isRequired": true,
      "input": {
        "type": "select",
        "source": "fixed",
        "options": [
          {
            "value": "- [ ]",
            "label": "[ ] Unchecked"
          },
          {
            "value": "- [/]",
            "label": "[/] In Progress"
          },
          {
            "value": "- [-]",
            "label": "[-] Cancelled"
          },
          {
            "value": "- [>]",
            "label": "[>] Rescheduled"
          },
          {
            "value": "- [!]",
            "label": "[!] Important"
          },
          {
            "value": "- [i]",
            "label": "[i] Information"
          },
          {
            "value": "- [*]",
            "label": "[*] Star"
          },
          {
            "value": "- [l]",
            "label": "[l] Location"
          },
          {
            "value": "- [?]",
            "label": "[?] Question"
          },
          {
            "value": "- [I]",
            "label": "[I] Idea"
          },
          {
            "value": "- [b]",
            "label": "[b] Bookmark"
          },
          {
            "value": "- [\"]",
            "label": "[\"] Quote'"
          },
          {
            "value": "- [S]",
            "label": "[S] Amount"
          },
          {
            "value": "- [p]",
            "label": "[p] Pro"
          },
          {
            "value": "- [c]",
            "label": "[c] Con"
          }
        ]
      }
    },
    {
      "name": "ScheduledDate",
      "label": "Scheduled",
      "description": "",
      "isRequired": false,
      "input": {
        "type": "date",
        "hidden": false
      }
    },
    {
      "name": "StartDate",
      "label": "Start",
      "description": "",
      "isRequired": false,
      "input": {
        "type": "date",
        "hidden": false
      }
    }
  ],
  "version": "1",
  "template": {
    "createCommand": true,
    "parsedTemplate": [
      {
        "_tag": "text",
        "value": "<%*\n  const modalForm = app.plugins.plugins.modalforms.api;\n  const result = await modalForm.openForm(\"NewTask\", {\n  \"omit\": [\n  \"Description\",\n  \"DueDate\"\n  ]\n  });\n  \n-%>\n- [ ] <% result.get(\"Description\") %> 📅<% result.get(\"DueDate\") %>\n\n"
      }
    ]
  }
}

js code for capture in quickadd (note that github strips out the opening 3 back tics and js quickadd you must add that)

`

const defCreatedDate = moment().format('YYYY-MM-DD');
const defDueDate = moment().add(1, 'days').format('YYYY-MM-DD');
const defStatus = "- [ ]";
const defPriority = "-";
const defValues = {
	DueDate:  defDueDate,
	Status: defStatus,
	Priority: defPriority
};

const modalForm = app.plugins.plugins.modalforms.api;
const result = await modalForm.openForm("NewTask", { values: defValues });
const tR = result.Status +
			" " + result.TaskDesc +
			" " + (result.get("Tags") === "" ? "" : result.get("Tags", tags => tags.map( t => "#" + t.trim())).join(" ")) +
			// hack below; modal form cannot have empty string as value, but that is what tasks expects for priority 'normal'
			(result.get("Priority") === "-" ? "" : " " + result.Priority) +
			(result.get("Recurring") === "" ? "" : " 🔁 " + result.Recurring + " when done 🏁 delete") +
			" ➕ " + defCreatedDate +
			(result.get("StartDate") === "" ? "" : " 🛫 " + result.StartDate) +
			(result.get("ScheduledDate") === "" ? "" : " ⏳ " + result.ScheduledDate) +
			" 📅 " + result.DueDate;	

// Check if the user did not cancel the form; so we don't have bunch of emojies written into our task file with no values
return result.status === "ok" ? tR : ""; 

`

[claremacrae]

Thanks @edakimling.

Any chance you could include a screenshot of each stage or stages please?

[edakimling]

Wonderful suggestion. Here are some pictures.

Form in Manage Form view of the Modal Forms plugin:

The Form itself running, invoked via hotkey

The task appended in the standard way in my single file that contains all tasks

Task setup screen in QuickAdd (there are other setup steps; this is just he main one)

[claremacrae]

Brilliant - thanks you very much.

[claremacrae]

I have put the JSON text in to a fenced code block so that:

1. It is formatted and readable
2. It has a Copy button.

[edakimling]

Thank you; I am new to discussions on github. I tried to put it in a code block but it was clashing with it already being a js quickadd codeblock, so thank you

[claremacrae]

Huh? The JSON code block has gone.... Perhaps I didn't save it.
Ah well, I've tried again.