## Context This is a follow up from the following conversation: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/92723#note_1036676392 Functionality to add an existing task is already implemented but has been turned off to allow more refined iteration on hierarchy widget. The goal of this issue is to to the functionality back on and ensure it works well alongside creating a new task in the issue. ## Solution For MVC, we should remain consistent with other widget types as we validate other more divergent solutions. <img src="/uploads/8f3557423369464459d28119a6c1005e/add_existing_flow.png" width="400"> - Change the `Add` button to a dropdown that has the options: - New task - Existing task - Clicking on `New task` triggers our current creating a task experience - Clicking on `Existing task` trigger an experience similar to our other "add existing" type flows https://gitlab.com/gitlab-org/gitlab/-/issues/368757/designs/Existing_task_default.png - Existing task card - Input is in focus - Placeholder text reads "Search existing tasks" - Help text reads "Paste task link or <#task id>" - Button options are `Add` (disabled by default unless task has been attached) and `Cancel` (closes add task card) - Input - When user has input something but results are loading, trigger loading state in dropdown https://gitlab.com/gitlab-org/gitlab/-/issues/368757/designs/Existing_task_loading.png - When results have loading, display them in dropdown, styled like existing issues in similar widgets https://gitlab.com/gitlab-org/gitlab/-/issues/368757/designs/Existing_task_searching.png - When user selects an option, tokenize it within the input (can be removed) https://gitlab.com/gitlab-org/gitlab/-/issues/368757/designs/Existing_task_attached.png - User can add another existing task if one has been attached, `Add`, or `Cancel` to clear work ## Designs Designs can be found in the issue this epic was promoted from: https://gitlab.com/gitlab-org/gitlab/-/issues/368757