# Feature DREAM-505 - Make project description and status widget editable on Overview tab

Project: Stream Design System
Status: closed
URL: https://community.openproject.org/work_packages/DREAM-505

## Planning

| Attribute | Value |
| --- | --- |
| Date |  |
| Priority | Medium |
| Target versions | 17.2.0 |
| Sprint |  |
| Backlog bucket |  |
| Votes |  |
| List |  |
| Roadmap |  |
| Relevance |  |

## OPEN POINTS / FEEDBACK

_No work packages_

## Features and Chunks

| ID | Subject | Type | Status | Assignee | Target versions | Spent time |
| --- | --- | --- | --- | --- | --- | --- |
| DREAM-547 | Standardized inplace edit fields based on Primer | Feature | closed |  | 17.2.0 |  |

## Bugs and other work packages

| ID | Type | Subject | Status | Assignee | Target versions | Spent time | Module |
| --- | --- | --- | --- | --- | --- | --- | --- |
| DREAM-624 | Bug | Overview placeholder is wrong for users without permissions | closed |  | 17.2.0 |  | Modules and project features / Project overview, Frontend components and Primer design system |
| DREAM-623 | Bug | Overview widget is not editable if there is no existing description | closed |  | 17.2.0 |  | Modules and project features / Project overview, Frontend components and Primer design system |

## Technical Details

| Attribute | Value |
| --- | --- |
| Module | Modules and project features / Project overview |
| Feature Flag |  |
| Requires doc change | Yes |
| Enterprise plan |  |

## Details

| Attribute | Value |
| --- | --- |
| Pull preview |  |
| Mockups |  |
| Accessibility | No |

## People

| Attribute | Value |
| --- | --- |
| Assignee |  |
| Accountable | Henriette Darge |
| Product manager |  |
| Developers | Henriette Darge |
| Designer | Parimal Satyal |
| Ordered by |  |
| Signed off by |  |
| Interest by |  |

## Estimates and progress

| Attribute | Value |
| --- | --- |
| PD (min) |  |
| PD (max) |  |
| Work |  |
| Labor costs |  |

## Description

**Context**

An extension of the work done in <mention class="mention" data-id="67203" data-type="work_package" data-text="##67203">##67203</mention>.

**Acceptance criteria**

  - For the project description widget:
    
      - On the **overview** tab, when hovering the actual description there is a border around it shown.
        
          - When clicking the bordered area, the description will switch to CKEditor edit mode, with two actions:
            
              - Save (primary)
            
              - Cancel (secondary)

  - For the project status widget:
    
      - On the **overview** tab, when hovering the actual status description there is a border around it shown
        
          - When clicking the bordered area, the description will switch to CKEditor edit mode, with two actions:
            
              - Save (primary)
            
              - Cancel (secondary)

  - When lacking the permission, the description text can also be read-only to some users

  - When there is no description provided, there is a placeholder shown. When hovered, the border is shown and behaves as above

**Out of scope**

  - Migrating the angular wigets from the Dashboard tab

<br>

**Open questions:**

1.  Shall we apply the same pattern to the dashboard page?
    
      - On the **dashboard** tab, there is a three dots menu.
        
          - Clicking on the three dots, will open a menu with:
            
              - an option to edit the description
                
                  - When clicking that, the description will switch to CKEditor edit mode (similar to meeting notes) with two actions:
                    
                      - Save (primary)
                    
                      - Cancel (secondary)
            
              - an option to remove the widget
    
      - Problem: The dashboard is Angular based. The widget themselves are Angular (including the header), only the content is part of a TurboFrame. In order to use more or less the same code on both Overview and Dashboard, we'd need to weaken the `WidgetBoxComponent` and implement a lot of hacks
    
      - Possible solution: Switching from the edit button in the header to actual click-to-edit fields once we have them?

<br>