GitHub Notifications By Organizations

github-notifications.js

// ==UserScript==
// @name         GitHub Notifications By Organizations
// @namespace    https://github.com
// @version      1.0
// @description  Group the notifications list by organizations
// @author       marcospereira
// @match        https://github.com/notifications
// @include      https://github.com/*/notifications
// @license      MIT
// @grant        none
// @run-at       document-end
// ==/UserScript==

(function () {
    'use strict';

    const repositoriesParent = document.querySelector(".filter-list.small");
    const repositories = repositoriesParent.querySelectorAll("li");

    const groupedByOrg = {};

    repositories.forEach(element => {
        const ownerAndRepo = element.querySelector(".repo-and-owner");
        const owner = ownerAndRepo.textContent.split("/")[0];
        const repo = ownerAndRepo.textContent.split("/")[1];

        // short the text content to have only the repository name
        // since it will be under the org list.
        ownerAndRepo.textContent = repo;

        // Is this really how you check if a dictionary has a key
        // in JavaScript?
        if (Object.keys(groupedByOrg).some(k => k == owner)) {
            groupedByOrg[owner].push(element);
        } else {
            groupedByOrg[owner] = [element];
        }
    });

    repositoriesParent.innerHTML = "";

    Object.keys(groupedByOrg).forEach(orgName => {
        const orgLi = document.createElement("li");
        const orgHeader = document.createElement("h5");
        orgHeader.textContent = orgName;

        orgLi.appendChild(orgHeader);

        const reposUl = document.createElement("ul");
        reposUl.setAttribute("class", "filter-list small");

        groupedByOrg[orgName].forEach(e => reposUl.appendChild(e));
        orgLi.appendChild(reposUl);

        repositoriesParent.appendChild(orgLi);
    })
})();