[Intum Help](https://intum.com/help.md) / [Insight](https://intum.com/help/insight.md)

# [How to add a custom Noe app that highlights emails from a specific sender](https://intum.com/help/insight/how-to-add-a-custom-noe-app-that-highlights-emails-from-a-specific-sender.md)

A Noe app is a small script you can inject into any Intum page. Here's how to create one that highlights emails from a specific sender.

![](637bdb7ebced-Screenshot - 2026-05-12T164611.346.png)

## First - enable the Noe module

1. Open **Account -> Modules**
2. Find **Noe** and switch to **Active**
3. Refresh the page

## Where to add the app

**Noe -> Noe Apps** -> **+Add**

## Form fields

- **Name** - e.g. `Highlight email from example@intum123.net`
- **URL code** - e.g. `highlight_system_emails`
- **App engine** - **JS**
- **CSS engine** - **none**
- **Show in module** - `mail/emails/index`
- **Active** - checked

## Source code

```javascript
(function() {
  console.log('[Noe] Email highlighting app for example@intum123.net launched');
  const TARGET = 'example@intum123.net';
  const RED_BG = '#fee2e2';
  const RED_BORDER = '#dc2626';

  function highlight() {
    const frames = document.querySelectorAll('turbo-frame[id^="index_email_"]');
    frames.forEach(frame => {
      const titles = Array.from(frame.querySelectorAll('[title]'))
        .map(e => e.getAttribute('title') || '').join(' ');
      const text = frame.textContent || '';
      const haystack = (text + ' ' + titles).toLowerCase();
      if (haystack.includes(TARGET)) {
        const li = frame.querySelector('li');
        if (li && !li.dataset.noeHighlighted) {
          li.style.backgroundColor = RED_BG;
          li.style.borderLeft = '4px solid ' + RED_BORDER;
          li.dataset.noeHighlighted = '1';
        }
      }
    });
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', highlight);
  } else {
    highlight();
  }
  document.addEventListener('turbo:frame-load', highlight);
  document.addEventListener('turbo:render', highlight);
  document.addEventListener('turbo:load', highlight);

  const list = document.querySelector('ul[data-id="mail_email"]');
  if (list) {
    new MutationObserver(highlight).observe(list, { childList: true, subtree: true });
  }
})();
```

## How to change the target address

Change `const TARGET = 'example@intum123.net';` to any address or domain fragment like `'@company.com'`.

Full list of **Show in module** values: [Internal Noe Apps](../noe-ai/aplikacje-noe-wewnetrzne).