Azure DevOps Zendesk Link v1.0.0

← Back to User Scripts

Script Content

// ==UserScript==
// @name         Azure DevOps Zendesk Link
// @namespace    http://tampermonkey.net/
// @version      1.1.0
// @description  Adds a button to Azure DevOps work items to open the corresponding Zendesk ticket.
// @author       Jules
// @match        https://dev.azure.com/*
// @grant        GM_openInTab
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    'use strict';

    console.log('Zendesk Link script started');

    const zendeskRegex = /\[Zendesk (\d+)\]/;

    function addButton(titleElement) {
        console.log('addButton called');
        const match = titleElement.value.match(zendeskRegex);
        if (!match) {
            console.log('No Zendesk link found in title');
            return;
        }

        const zendeskId = match[1];
        const zendeskUrl = `https://audacia.zendesk.com/agent/tickets/${zendeskId}`;

        // Check if button already exists
        if (document.getElementById('zendesk-link-button')) {
            console.log('Zendesk link button already exists');
            return;
        }

        console.log(`Zendesk ticket ${zendeskId} found, adding button`);

        const zendeskIconSvg = `
            
        `;

        const button = document.createElement('button');
        button.id = 'zendesk-link-button';
        button.innerHTML = zendeskIconSvg;
        button.onclick = () => {
            GM_openInTab(zendeskUrl, { active: true });
        };

        const titleElementParent = titleElement.parentElement;
        titleElementParent.style.position = 'relative';

        // Add padding to the title element to make space for the button
        titleElement.style.paddingLeft = '40px';

        GM_addStyle(`
            #zendesk-link-button {
                position: absolute;
                left: 0px;
                top: 50%;
                transform: translateY(-50%);
                width: 34px;
                height: 34px;
                z-index: 1000;
                border: none;
                background: transparent;
                cursor: pointer;
                padding: 3px;
            }
            #zendesk-link-button svg {
                width: 100%;
                height: 100%;
            }
        `);

        titleElementParent.appendChild(button);
        console.log('Zendesk link button added');
    }

    const observer = new MutationObserver(() => {
        console.log('Mutation observer triggered');
        const titleElement = document.querySelector('[aria-label="Title field"]');
        if (titleElement) {
            addButton(titleElement);
        } else {
            console.log('Title element not found');
        }
    });

    console.log('Observing document for mutations');
    observer.observe(document, {
        childList: true,
        subtree: true
    });
})();