# Feature OP-17571 - Create 'Email Updates Mode Selector' component and use it in the Meetings and File storages modules

Project: OpenProject
Status: closed
URL: https://community.openproject.org/work_packages/OP-17571

## Planning

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

## OPEN POINTS / FEEDBACK

_No work packages_

## Features and Chunks

_No work packages_

## Bugs and other work packages

_No work packages_

## Technical Details

| Attribute | Value |
| --- | --- |
| Module | Modules and project features / File storages, Administration, Modules and project features / Meetings, Frontend components and Primer design system |
| Feature Flag |  |
| Requires doc change | No |
| Enterprise plan |  |

## Details

| Attribute | Value |
| --- | --- |
| Pull preview |  |
| Mockups |  |
| Found in mobile app version |  |
| Follow-up feedback e-mail |  |
| Accessibility | No |

## People

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

## Estimates and progress

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

## Description

#### **Acceptance criteria**

  - Create a new component called '**Email Updates Mode Selector**' based on the 'Enable calendar updates' right-panel design consisting of:
    
      - A heading (h4)
    
      - Text (with colour: `color-fg-subtle`)
    
      - An action (by default: Link with leading icon, bold in accent colour)
        
          - The button operates as a switch (enable/disable). The text indicates the current state.

  - Use this component in:
    
      - The Meetings module for 'Email calendar updates' (originally implemented in <mention class="mention" data-id="61773" data-type="work_package" data-text="##61773">\#\#61773</mention>)
    
      - The File storages module, for the 'Email updates to admin' section under the health checks

  - Document this component in LookBook (Parimal)

#### **Technical notes**

  - The original design for this involved the use of toggle swtich. However, because of limitations of that implementation we had to change the design to something simpler. More context (thanks, <mention class="mention" data-id="78274" data-type="user" data-text="@Mir Bhatia">@Mir Bhatia</mention>):

> I can't use the toggle switch + confirmation dialog pattern because it isn't possible without changing the primer component. What's happening is that the switch button moves before any data is even sent across, so even if you click "Cancel", the switch is in the moved position already. I tried to work around it by updating the switch itself when it is clicked, but this has a noticeable delay & you can see the switch moving over and back, which doesn't work either

#### **Visuals**

<img class="op-uc-image op-uc-image_inline" src="/api/v3/attachments/749217/content">