A solution for inbox per-project filtering

English Forum Tips and Tricks
1

Hello Asana Community,
I’m willing to share to share a UserScript that I’ve developed to address a long-standing gap in Asana’s functionality: the ability to filter the Inbox by project. Despite numerous requests over the years, this feature has not been implemented by Asana. As a result, I decided to take matters into my own hands and create a solution using Tampermonkey.

This script adds a dropdown filter to the Inbox view in Asana, allowing you to filter tasks by project. This enhancement aims to make project managers to have more context when coping with notifications from many projects .

How to install the script:

  1. Ensure you have Tampermonkey installed in your browser.
  2. Add the script from the following Gist: Asana Inbox Project Filter UI Improvement · GitHub
  3. Refresh your Asana Inbox view, and you should see the new project filter dropdown.

I am open to any feedback and would love to collaborate with others to improve this script. If you have suggestions or improvements, please feel free to share them. Together, we can enhance the Asana experience for everyone.

Thank you for your time, and I hope you find this script as useful as I do!

Best regards,
Francesco Canovi

4 Likes
2

@Francesco_Canovi thank you for building this extension. I was able to install it and get it running. There are couple of issues that I ran into:

  1. The list of projects seems to get cached, where I am not able to see the recently visited projects in the projects dropdown list.

  2. When I select a project, I am still seeing Inbox results from other projects.

  3. Are you able to display the dropdown menu next the to the filter bar in the ‘PageToolbarStructure-leftChildren’ container?

3

Hello Erjon,
problems 1 and 2 are due to the fact that Asana uses infinite scrolling and the script can’t detect modifications after the page is loaded. Currently I recommend to refresh the page before using the filter. I’m working on a workaround but I currently have no ETA for this.
About the third: I’m not sure this is more visible. Anyway, you can customize it changing the selector in this row:

const toolbar = document.querySelector('.GlobalTopbarStructure-middleChildren, .GlobalTopbarStructure-search');

modifying into:

const toolbar = document.querySelector('.PageToolbarStructure-leftChildren');

1 Like
4

Got it. That makes sense. Thanks, I will give this a try.

5

Dear Erjon, I released a new version that should solve your issue.
Please update it and let me know: Asana Inbox Project Filter UI Improvement · GitHub
Best,

Francesco Canovi

1 Like
6

I released a new version, hopefully more robust, which also includes a update feature that doesn’t request the page refresh. Asana Inbox Project Filter UI Improvement · GitHub

7

hey Francesco!! I was just visitng to see if there was any movement on this feature request and see that you’ve built it!!

Here is my challenge, i’m lost at “1. Ensure you have Tampermonkey installed in your browser.” :rofl: I use chrome. I dont see Tapermonkey as an extension. How would i go about installing it to my browser. I’m not a developer or anything but not a luddite :nerd_face:
Can you help me get this working? I waste too much time in inbox trying to make sure i dont miss important stuff. Filtering by project would be EPIC!

8

Hello Emily.
Tampermonkey IS an extension!

Step 1: Install Tampermonkey on Chrome

  1. Open Google Chrome.
  2. Go to the Chrome Web Store for Tampermonkey extension: https://chromewebstore.google.com/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo
  3. Click the “Add to Chrome” button.
  4. Confirm the installation by clicking “Add extension” in the popup.
  5. Be sure to activate the developer mode in Chrome: FAQ | Tampermonkey

Step 2: Install the Asana Inbox Filtering Script

  1. Open Tampermonkey by clicking its icon in the Chrome toolbar.
  2. Select “Create a new script…”
  3. Delete any default code present in the editor.
  4. Copy the entire code from Gist: Asana Inbox Project Filter UI Improvement · GitHub
  5. Paste the copied code into the Tampermonkey editor.
  6. Click the “File” menu and select “Save” or simply press Ctrl + S.

Step 3: Activate the Script

  1. Ensure the script is enabled by checking the “Enabled” status in the Tampermonkey dashboard.
  2. Open or refresh your Asana Inbox to start using the new filtering functionality.

Let me know if you have any difficulties.
Best,
Francesco-

1 Like
9

Great Francesco, you should remove the tamper monkey script and insert the function I sent to you via X some days ago. It will move your great work to a full JS compatibility :wink:

10

Please Riccardo, write me to francesco@blackstudio.it with all the details. My script is born for tampermonkey, so first of all I want to maintain the compatibility with it. Send me all the details of your variations and I’ll take them into consideration.
Thank you.
Francesco-