# Notification Panel for Developer Interface

For the year's final milestone, a key initiative is implementing a dedicated Notification Panel in the Developer Interface (Apps UI). Integrated into the navigation bar, this panel will serve as a single, accessible source for recent transaction visibility.

## 🚀 Key Features & Benefits

* **Panel Display:** Provides at-a-glance access to **chain-specific** transaction details, including type, status, and a clickable block identifier (number or hash).
* Persistence Note: To ensure continuity, the panel will utilize browser local storage to retain the last 20-30 transaction items, ensuring this vital information is accessible even when the user returns to the interface.

* **Toast Notifications:** Includes direct, clickable links to the corresponding block in the toast itself, wherever possible.

* **User Value:** This update is especially critical for chains without Subscan or similar explorer support, giving developers a reliable, in-app mechanism to monitor and trace their activity immediately after submission.

## 👇 Files Likely to Be Updated (or Utilized)

1. [packages/apps](https://github.com/polkadot-js/apps/tree/master/packages/apps)
* *src/Notifications*

2. [packages/react-components](https://github.com/polkadot-js/apps/tree/master/packages/react-components)
* *src/Status*

3. [packages/apps-config](https://github.com/polkadot-js/apps/tree/master/packages/apps-config)
* *src/links*

4. [packages/react-hooks](https://github.com/polkadot-js/apps/tree/master/packages/react-hooks)
* *src/useQueue.ts*
* *src/ctx/Queue.tsx*

## 💡 Intuition

My intuition is to implement the **Observer Design Pattern** within the existing **Queue Provider**, which is responsible for publishing events. Any subscriber can then register to receive queue events and be notified whenever a new event occurs. Each subscriber can independently decide how to handle the incoming event.

Since there are now multiple subscribers (e.g., the Toast component and the Notification Panel) reacting to the latest events, it makes sense to introduce loose coupling between them. Previously, only the Toast component consumed queue events extensively, but with multiple consumers, decoupling becomes more important for scalability and maintainability.

The actual UI rendering can be handled entirely within the Notification component inside [packages/apps](https://github.com/polkadot-js/apps/tree/master/packages/apps).

*Note: The GitHub issue is being tracked here – [polkadot-js/apps#11962](https://github.com/polkadot-js/apps/issues/11962).*