Gitlab monkey copy

simple copy to cliboard formatted commit message

Versão de: 21/10/2022. Veja: a última versão.

Você precisará instalar uma extensão como Tampermonkey, Greasemonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Violentmonkey para instalar este script.

Você precisará instalar uma extensão como Tampermonkey ou Userscripts para instalar este script.

Você precisará instalar uma extensão como o Tampermonkey para instalar este script.

Você precisará instalar um gerenciador de scripts de usuário para instalar este script.

(Eu já tenho um gerenciador de scripts de usuário, me deixe instalá-lo!)

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar uma extensão como o Stylus para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

Você precisará instalar um gerenciador de estilos de usuário para instalar este estilo.

(Eu já possuo um gerenciador de estilos de usuário, me deixar fazer a instalação!)

// ==UserScript==
// @name         Gitlab monkey copy
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  simple copy to cliboard formatted commit message
// @author       You
// @match        http*://www.gitlab.com/*
// @match      	 http*://*.gitlab.com/*
// @match      	 http*://gitlab.com/*
// @grant        GM_addStyle
// @run-at       document-idle
// @license      https://creativecommons.org/licenses/by-sa/4.0
// ==/UserScript==

const GIT_COPY_BUTTON_CLASS = 'superbutton';
const GIT_COPY_BUTTON_MSG = 'Copy as Git commit message 🚀';
const GIT_COPY_BUTTON_MSG_SUCCESS = 'Copied. Great work and happy commit! 🎉';
const ISSUE_NUMBER_SELECTOR = '[data-qa-selector="breadcrumb_current_link"] a';
const ISSUE_TITLE_SELECTOR = '[data-qa-selector="title_content"]';

void new class {
    constructor() {
        this.init();
        this.addStyles();
    }

    init() {
        let gitlabDetailPageEl = document.querySelector('.js-detail-page-description');
        if (!gitlabDetailPageEl) return;
 
        this.createGitCopyButton(gitlabDetailPageEl);

        let gitCopyButtonEl = document.querySelector(`.${GIT_COPY_BUTTON_CLASS}`);

        this.events(gitCopyButtonEl);
    }

    events(gitCopyButtonEl) {
        gitCopyButtonEl.addEventListener('click', (e) => {
            e.preventDefault();

            let commitMessage = this.createCommitMessage();

            commitMessage && this.copyTextToClipboard(commitMessage).then(() => {
                e.target.textContent = GIT_COPY_BUTTON_MSG_SUCCESS;
            });
        });
    }

    async copyTextToClipboard(text) {
        try {
            await navigator.clipboard.writeText(text);
        } catch (err) {
            console.error('Failed to copy: ', err);
        }
    }

    createCommitMessage() {
        let issueNum = document.querySelector(`${ISSUE_NUMBER_SELECTOR}`);
        let issueTitle = document.querySelector(`${ISSUE_TITLE_SELECTOR}`);

        return 'textContent' in issueNum && issueTitle && `FIX:${issueNum.textContent.replace('#','')} - ${issueTitle.textContent}`
    }

    createGitCopyButton(parentEl) {
        parentEl.insertAdjacentHTML('afterbegin', `<button class="${GIT_COPY_BUTTON_CLASS}">${GIT_COPY_BUTTON_MSG}</button>`);
    }

    addStyles() {
        GM_addStyle(`
            .${GIT_COPY_BUTTON_CLASS} {
                display: inline-block;
                outline: 0;
                cursor: pointer;
                border: 1px solid #000;
                border-radius: 6px;
                color: #000;
                background: #fff;
                font-size: 16px;
                font-weight: 500;
                line-height: 1.6;
                padding: 8px 20px;
                margin-bottom: 30px;
                text-align:center;
                transition-duration: .15s;
                transition-property: all;
                transition-timing-function: cubic-bezier(.4,0,.2,1);
            }
            .${GIT_COPY_BUTTON_CLASS}:hover{
                background: rgb(251, 193, 245);
            }
        `);
    }
}