**As** a project member
**I want to** include to my current view the work packages from another project or subproject that is not the same one that I'm working on
**so that** act upon or verify work packages that might affect or have relations with my current project.

**Acceptance criteria**

* The new Begin of the insertionactionEnd of the insertion Begin of the deletion filterEnd of the deletion will be Begin of the insertionincludedEnd of the insertion Begin of the deletion part to the generic filterEnd of the deletion in Begin of the deletion any work packages view. You could search for it throughEnd of the deletion the Begin of the insertiontop menu toolbar asEnd of the insertion Begin of the deletion "Add filter".
* Substitute the current "Including subproject" filter with the filter "Include projects".
* Once the filter is addedEnd of the deletion a Begin of the deletion row is added with aEnd of the deletion dropdown Begin of the insertionbutton (2nd level of navigation):End of the insertion Begin of the deletion box with the text "Select a project" inside and a dropdown icon on the left.
* To remove this filter a cross icon is added outside the box.End of the deletion

<figure class="image Begin of the insertionop-uc-figure" style="width:50%;"><divEnd of the insertion Begin of the deletion op-uc-figure"><divEnd of the deletion class="op-uc-figure--content"><img class="op-uc-image" Begin of the insertionsrc="/api/v3/attachments/24630/content"></div></figure>End of the insertion Begin of the deletion src="/api/v3/attachments/24527/content"></div></figure>End of the deletion

* Once the Begin of the insertionbutton is clickedEnd of the insertion Begin of the deletion user clicks on the box to start searching forEnd of the deletion a Begin of the deletion project aEnd of the deletion modal Begin of the insertiondialog will be openedEnd of the insertion Begin of the deletion menuEnd of the deletion with Begin of the deletion allEnd of the deletion the Begin of the insertionhierarchy ofEnd of the insertion projects and sub-projects Begin of the deletion (that I&#39;m member of) in a hierarchy modeEnd of the deletion with a Begin of the insertionmultiple selection checkbox style:

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24634/content"></div></figure>

End of the insertion Begin of the deletion limit high of 360px. Displaying as many elements as possible and scrolling the rest of the list.
End of the deletion * Begin of the insertionThis dialog includes multiple elements:
* Search bar: this will allowEnd of the insertion Begin of the deletion WhenEnd of the deletion a Begin of the insertionsearch of theEnd of the insertion project Begin of the insertionand sub-projects by name. In this search bar chips (as we haveEnd of the insertion Begin of the deletion is selected a chip (same component already existingEnd of the deletion in the filters) Begin of the deletion inside the filter box appear with the nameEnd of the deletion of the Begin of the insertionalreadyEnd of the insertion Begin of the deletion projectEnd of the deletion selected Begin of the insertionprojects will be displayedEnd of the insertion Begin of the deletion (with an &quot;X&quot; icon to remove it)End of the deletion and Begin of the deletion the work packages of that project are added to the work package list. If is a parent project only the work packages of the parent projectEnd of the deletion will be added Begin of the insertionscrolling toEnd of the insertion Begin of the deletion (notEnd of the deletion the Begin of the insertionleft leaving space to keep writing. When this searchEnd of the insertion Begin of the deletion sub-project ones).
* In case thereEnd of the deletion is Begin of the insertionhappening, the &quot;parent&quot;End of the insertion Begin of the deletion already otherEnd of the deletion projects Begin of the deletion selected this onesEnd of the deletion are greyed out Begin of the deletion (#CCCCCC) of the modal menuEnd of the deletion and Begin of the deletion this can&#39;t be selected again. This onesEnd of the deletion are Begin of the insertionnot selectable whileEnd of the insertion Begin of the deletion still visible to keepEnd of the deletion the Begin of the insertiontext searched will turn blue inEnd of the insertion Begin of the deletion hierarchy ofEnd of the deletion the Begin of the insertionmatched projects or sub-projects.End of the insertion Begin of the deletion elements but not selectable.End of the deletion

<figure class="image Begin of the insertionop-uc-figure" style="width:50%;"><divEnd of the insertion Begin of the deletion op-uc-figure"><divEnd of the deletion class="op-uc-figure--content"><img class="op-uc-image" Begin of the insertionsrc="/api/v3/attachments/24632/content"></div></figure>End of the insertion Begin of the deletion src="/api/v3/attachments/24528/content"></div></figure>End of the deletion

<figure class="image Begin of the insertionop-uc-figure" style="width:50%;"><divEnd of the insertion Begin of the deletion op-uc-figure"><divEnd of the deletion class="op-uc-figure--content"><img class="op-uc-image" Begin of the insertionsrc="/api/v3/attachments/24633/content"></div></figure>End of the insertion Begin of the deletion src="/api/v3/attachments/24529/content"></div></figure>End of the deletion

* Begin of the insertionCheckbox list hierarchy: this isEnd of the insertion Begin of the deletion IfEnd of the deletion the Begin of the insertionsame list asEnd of the insertion Begin of the deletion user starts typingEnd of the deletion the Begin of the insertiontop navigationEnd of the insertion Begin of the deletion modalEnd of the deletion menu Begin of the insertiononEnd of the insertion Begin of the deletion will shrink toEnd of the deletion the Begin of the insertiontop left corner but including a checkbox system. The checkboxes can have multiple status:
* Active non-selected: blue empty checkboxEnd of the insertion Begin of the deletion elements correspondingEnd of the deletion with Begin of the insertionblack letters.
* Active selected: blue selected checkbox with black letters.
* Inactive non-selected: grey empty checkbox with black letters. This happens inEnd of the insertion the Begin of the insertionsearch behaviour explained onEnd of the insertion Begin of the deletion texts. In caseEnd of the deletion the Begin of the insertiontop.
End of the insertion Begin of the deletion matching texts belongs to a sub-project the parent projects will still appear but greyed (#878787) and not selectable.
End of the deletion * Begin of the insertionInactive selected: grey selected checkboxEnd of the insertion Begin of the deletion The text that is 100% correspondingEnd of the deletion with Begin of the insertionblack letters. This happens withEnd of the insertion the Begin of the insertioncurrent project that you are in (in the mock-ups Autoliv) or when you have the action &quot;Include all sub-projects&quot; selected and you select a parent project (then all sub-projectsEnd of the insertion Begin of the deletion written oneEnd of the deletion will be Begin of the insertionin this status).

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24635/content"></div></figure>

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24636/content"></div></figure>

End of the insertion Begin of the deletion highlighted with the main blue colour.
End of the deletion * Begin of the insertionInclude all sub-projects action: This allows the user to select if they want to automatically check all the sub-project bellow a parent project if thisEnd of the insertion Begin of the deletion In case thereEnd of the deletion is Begin of the deletion already other projectsEnd of the deletion selected Begin of the insertionor in the contrary selectEnd of the insertion this Begin of the insertionalways manually. The only case where this action doesn&#39;t affect the sub-projects is for the current project youEnd of the insertion Begin of the deletion onesEnd of the deletion are Begin of the insertionworking on (Autoliv inEnd of the insertion Begin of the deletion greyed out (#CCCCCC) ofEnd of the deletion the Begin of the insertionmockups) asEnd of the insertion Begin of the deletion modal menu andEnd of the deletion this Begin of the insertionone willEnd of the insertion Begin of the deletion can&#39;tEnd of the deletion be selected Begin of the insertionby default but its sub-projects not.
* Modal buttons: Two actions, one positive &quot;Apply&quot;End of the insertion Begin of the deletion again. This ones are still visibleEnd of the deletion to Begin of the insertionconfirmEnd of the insertion Begin of the deletion keepEnd of the deletion the Begin of the insertionselected checkboxes and one to &quot;Clear selection&quot;.End of the insertion Begin of the deletion hierarchy of the elements but not selectable.End of the deletion

Begin of the insertion**Visuals:**

* EMPTY:

End of the insertion <figure class="image Begin of the insertionop-uc-figure" style="width:50%;"><divEnd of the insertion Begin of the deletion op-uc-figure"><divEnd of the deletion class="op-uc-figure--content"><img class="op-uc-image" Begin of the insertionsrc="/api/v3/attachments/24637/content"></div></figure>End of the insertion Begin of the deletion src="/api/v3/attachments/24531/content"></div></figure>End of the deletion

Begin of the insertion* ALL SUB-PROJECTS NOT SELECTED:

End of the insertion <figure class="image Begin of the insertionop-uc-figure" style="width:50%;"><divEnd of the insertion Begin of the deletion op-uc-figure"><divEnd of the deletion class="op-uc-figure--content"><img class="op-uc-image" Begin of the insertionsrc="/api/v3/attachments/24638/content"></div></figure>End of the insertion Begin of the deletion src="/api/v3/attachments/24530/content"></div></figure>End of the deletion

Begin of the insertion<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24639/content"></div></figure>

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24640/content"></div></figure>

* ALL SUB-PROJECTS SELECTED:

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24641/content"></div></figure>

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24642/content"></div></figure>

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24643/content"></div></figure>

* SEARCH:

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24644/content"></div></figure>

<figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/24645/content"></div></figure>


**Figma file:**End of the insertion Begin of the deletion **Visuals:**End of the deletion

[https://www.figma.com/file/rddHeKCAkJo2MNI2zktSaR/?node-id=0%3A1](https://www.figma.com/file/rddHeKCAkJo2MNI2zktSaR/?node-id=0%3A1)