Intégrez les collecteurs de problèmes Jira dans les boutons de sujet

Wiki de la communauté Administrateurs
1

Bonjour :wave:

J’ai commencé à mettre en œuvre les collecteurs de problèmes sur notre forum aujourd’hui et je voulais partager le composant de thème super simple que j’ai créé.

À la fin, cela ressemblera à ceci.


Ce dont vous avez besoin

  • Un collecteur de problèmes Jira
  • Quelques connaissances en JS

Récupérer l’ID du collecteur de problèmes

Pour que le collecteur fonctionne, nous avons besoin de son ID.

1465×318 23.3 KB

Accédez au collecteur de problèmes de votre choix et récupérez le paramètre collectorId de l’URL.

https://tosdr.atlassian.net/secure/ViewCollector!default.jspa?projectKey=BE&collectorId=176cb88e

Dans mon cas, c’est 176cb88e.

Créez un nouveau composant de thème

et utilisez le code suivant dans la section <head>

Remplacez les clés suivantes par leurs valeurs

  • MY_COLLECTOR_ID → 176cb88e
  • REPLACE_ME_AJAX → La source du script de la section « Intégrer ce collecteur de problèmes » → « Intégrer en JavaScript » de votre collecteur de problèmes Jira
    639×443 16.3 KB
  • MY_PROJECT_KEY → Avec la clé de projet de votre collecteur de problèmes, si vous prévoyez d’insérer plusieurs collecteurs de problèmes.
<script type="text/discourse-plugin" version="0.8">
api.decorateCooked(() => {
    window.ATL_JQ_PAGE_PROPS = $.extend(window.ATL_JQ_PAGE_PROPS, {
        'MY_COLLECTOR_ID': {
            "triggerFunction": function(showCollectorDialog) {
                jQuery(document).on('click', "[data-wrap='jira-bug-MY_PROJECT_KEY'] > p", function(e) {
                    e.preventDefault();
                    showCollectorDialog();
                });
            }
        }
    });
});
</script>
<script>
$(document).ready(function() {
    jQuery.ajax({
        url: "REPLACE_ME_AJAX",
        type: "get",
        cache: true,
        dataType: "script"
    });
});
</script>

J’ai créé uniquement 2 boutons CSS pour mes besoins, n’hésitez pas à en ajouter d’autres.

[data-wrap*="jira-bug-"] {
    p {
        border-radius: 2em;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0.53em 0.8em;
    border: none;
    font-weight: normal;
    margin: 1px;
    font-size: var(--font-0);
    line-height: normal;
    color: var(--primary-low);
    background: var(--danger);
    cursor: pointer;
    transition: all 0.25s;
    }
    p:hover {
     color: #000;
    background: #fff;
    border-color: #0060df;
    }
}

[data-wrap*="jira-feature"] {
    p {
        border-radius: 2em;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0.53em 0.8em;
    border: none;
    margin: 1px;
    font-weight: normal;
    font-size: var(--font-0);
    line-height: normal;
    color: var(--secondary-low);
    background: var(--success-medium);
    cursor: pointer;
    transition: all 0.25s;
    }
    p:hover {
     color: #000;
    background: #fff;
    border-color: #0060df;
    }
}

Passons maintenant à l’intégration du collecteur de problèmes dans les publications :

[wrap=jira-bug-MY_PROJECT_KEY]
:bug: Signaler un bug
[/wrap]


[wrap=jira-feature-MY_PROJECT_KEY]
:bulb: Suggérer une fonctionnalité
[/wrap]

C’est tout ! Vous avez maintenant un collecteur de problèmes fonctionnel sous forme de bouton dans votre publication !

3 « J'aime »
Administrators Index