Zendesk Status Colour Customiser v1.0.1

← Back to User Scripts

Script Content

// ==UserScript==
// @name         Zendesk: Status Colour Customiser
// @namespace    https://github.com/tjhleeds/user-scripts/
// @version      1.1.0
// @description  Applies custom colours to Zendesk ticket statuses.
// @author       tjhleeds
// @match        https://audacia.zendesk.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const statusColors = {
        "In QA": "lightgreen",
        "In UAT": "lightgreen",
        "Waiting on Live Release": "green"
    };

    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            if (mutation.addedNodes.length) {
                applyCustomColors();
            }
        });
    });

    function applyCustomColors() {
        const openBadges = document.querySelectorAll('[data-cy-test-id="status-badge-state"]');
        openBadges.forEach((badge) => {
            const statusText = badge.textContent.trim();
            if (statusColors[statusText]) {
                badge.style.backgroundColor = statusColors[statusText];
            }
        });

        const ticketStatusLabels = document.querySelectorAll('.ticket_status_label');
        ticketStatusLabels.forEach((label) => {
            const statusText = label.textContent.trim();
            if (statusColors[statusText]) {
                label.style.backgroundColor = statusColors[statusText];
            }
        });
    }

    observer.observe(document.body, { childList: true, subtree: true });

    // Initial run
    applyCustomColors();
})();