# Feature COMMS-7 - Indication of unread notifications with a badge in the browser icon

Project: Stream Communicator
Status: needs clarification
URL: https://community.openproject.org/work_packages/COMMS-7

## Planning

| Attribute | Value |
| --- | --- |
| Date |  |
| Priority | Low |
| Target versions | Wish List |
| Sprint |  |
| 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 |  |
| Feature Flag |  |
| Requires doc change | No |
| Enterprise plan |  |

## Details

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

## People

| Attribute | Value |
| --- | --- |
| Assignee | Niels Lindenthal |
| Accountable |  |
| Product manager |  |
| Developers |  |
| Designer |  |
| Ordered by |  |
| Signed off by |  |
| Interest by |  |

## Estimates and progress

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

## Description

**As a** project member,   
**I want to** be alerted to the presence of unread notifications via the little favicon/cut icon on my browser tab,   
**so that** my attention can, at a glance, be drawn to OpenProject tab(s) if there are unread notifications when I am browsing other websites.

**Visual reference**

Example from Fastmail,

_Normal state:_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/22017/content"></div></figure>

_With badge:_

<figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/22018/content"></div></figure>

**Acceptance Criteria**

*   In modern browsers, there should be a small visual indication on the favicon (also called the shortcut icon) that indicates the presence of unread notifications.
*   This badge should not present if there are no unread notifications.
*   When all existing unread notifications are read (and the badge with the number disappears on the Notification icon in the top bar), the favicon badge should also disappear.
*   When a new unread notification is received on a open tab, the favicon should then immediately show that badge, regardless of if that tab is active or not.

**Note**   
We need to discuss the technical implementation of this (using APIs vs drawing a new favicon), and if we want to display only a simple dot badge (to convey the presence of unread notifications) or a badge with a number (of total unread notifications).

We need to also discuss if we want the the behaviour described above or if we want a more &quot;ephemeral&quot;/reactive badge that simply alerts to new notifications _since_ the last viewing of the page. In which case, if multiple tabs are open, visiting any one of the tabs would get rid of the badge in all. The use case would then be to alert to only _new unread notifications_.