Is it possible to customize an issue status color using Script Runner "Raw XML Module"?

[Alex Sander]

Hi.

I'm triyng to customize some issue status color in Jira.

Is it possible using "Raw XML Module"?

[Trudy Claspill]

Hello @Alex Sander 

I have not been able to find (through internet searches) a method that specifically uses that ScriptRunner module.

If you are open to using a different third party app I found several in the Atlassian Marketplace when I searched for "status colors":

https://marketplace.atlassian.com/search?hosting=dataCenter&product=jira&query=status%20colors

[Alex Sander]

Hi @Trudy Claspill, thank's. 

I'm going to check these apps.

I was figuring out a sollution with ScriptRunner 'cause is something very specific that I need. 

[Alex Sander]

Well, I did it work, not by a XML raw, but adding a javascript to a Custom Web Panel.

I've created a groovy script like this:

def script2 = """

<script>

(function() {

function applyCustomStyles(searchElementSelector) {

    // Define the mapping of text to colors

    var colorMapping = {

        'GDM Reprovada': { backgroundColor: '#CD5C5C', color: 'white' },

        'GDM Aprovada': { backgroundColor: '#006400', color: 'white' },

        'Cancelado': { backgroundColor: '#F7DC6F', color: 'white' },

        'Devolvido': { backgroundColor: '#7B241C', color: 'white' },

        'Concluído com Alerta': { backgroundColor: '#DC7633', color: 'white' },

        'Em execução': { backgroundColor: '#1D8348', color: 'white' },

        'Plano em execução': { backgroundColor: '#1D8348', color: 'white' },

        'Aguardando Execução': { backgroundColor: '#3498DB', color: 'white' }

    };

    // Locate the elements with the desired status text

    var elements = document.querySelectorAll(searchElementSelector);

    elements.forEach(function(element) {

        var text = element.textContent.trim();

        if (colorMapping[text]) {

            element.style.backgroundColor = colorMapping[text].backgroundColor;

            element.style.color = colorMapping[text].color;

            console.log('Element styled:', element);

        }

    });

}

// Call the function for different selectors

applyCustomStyles('.jira-issue-status-lozenge');

applyCustomStyles('.aui-dropdown2-trigger'); 

// MutationObserver to reapply styles for dynamic content

var observer = new MutationObserver(function(mutations) {

    mutations.forEach(function(mutation) {

        applyCustomStyles('.jira-issue-status-lozenge');

        applyCustomStyles('.aui-dropdown2-trigger'); 

    });

});

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

console.log('Custom status color script injected.');

})();

</script>

// this script is attached to a panel in UI fragments (only way that it was possible to work)

// so this is to hide de panel (the id must match with Panel in UI Fragmente created)

<style>

    #custom-status-color-pgdm-issues {

        display: none;

    }

</style>

"""

writer.write(script2)

But, it just works linking the code to a Custom Web Panel.
Works fine, but just in the issue view screens.

I tried to set the panel location to the header or banner page, but doesn't work.
I'd like that the status colors could be applied to other pages like panels.

Almost there.