Ajouter un bouton de déconnexion au menu supérieur

Dev
1

J’ai un client avec une communauté dont les membres utilisent souvent des ordinateurs à accès public ; lors de leurs tests, ils constatent que de nombreux utilisateurs ont du mal à trouver le lien de déconnexion dans le menu hamburger. Malheureusement, je ne pense pas qu’il existe une bonne façon de leur apprendre à tous ZZ.

Par conséquent : j’essaie d’ajouter un bouton déconnexion dans le menu supérieur.

Il semble que je devrais pouvoir utiliser (Superseded) Add a "+ New Topic" button on every page pour créer un nouveau sujet afin de me déconnecter, et que cela devrait être « facile » de modifier ce createTopic en logout, puis ce serait fait.

https://github.com/discourse/discourse-new-topic-button-theme-component/blob/master/common/header.html#L39

J’ai fouillé pendant une heure ou deux et je n’arrive pas tout à fait à comprendre comment faire.

4 « J'aime »
2

I’ll happily use what you come up with,

could you mimic the home button api function?

image

<script type="text/discourse-plugin" version="0.4">
  api.changeWidgetSetting('home-logo', 'href' , 'xxx')
</script>
1 « J'aime »
3

I’ve got the button OK, it’s the logout API that I can’t find.

3 « J'aime »
4

sorry, I do like the plan and hoped I could help, what does the $0 refer to and is it part of document.querySelector that may help?

image

1 « J'aime »
5

I got it! I won’t promise that it’ll work for you, but this might do it for you.

This is common/header.html

<script type="text/discourse-plugin" version="0.8">    
    const { iconNode } = require("discourse-common/lib/icon-library");
    const { logout } = require("discourse/lib/logout");

    api.decorateWidget("header-buttons:before", helper => {
        if (!Discourse.User.current()) return;
        currentUser = Discourse.User.current();


        let container = api.container,
        logout_text = 'Log Out', // button text!
        logout_title = 'Log Out',
        logout_icon = 'sign-out-alt',
        logout_button_class = "btn btn-default btn btn-icon-text",
        logout_button_helper = "button#logout",
        logout_label_helper = "span.d-button-label",
        composerModal = require("discourse/models/composer").default,
        composerController = container.lookup("controller:composer");

        const myLogout = function () {
            if (currentUser) {
                currentUser.destroySession();
            }
        };
 

        let currentUser = Discourse.User.current();
        let currentUsername = Discourse.User.current().username;
        return helper.h("span.header-links", [

        helper.h(
            logout_button_helper,
            {
              className: logout_button_class,
              title: logout_title,
              onclick: myLogout
            },
            [iconNode(logout_icon), helper.h(logout_label_helper, logout_text)]
          )        
      ])
    });
    </script>
14 « J'aime »
6

WTH Jay,

I put that script in and got a

Summary

a working button!
image

image
image870×335 53.2 KB

I’ll need to tune the look a bit but it works, great job!

Thanks for sharing :sunglasses:

4 « J'aime »
8

Hello Jay,
your code works like a charm!
I have a custom menu below the standard header. How can I relocate this button there? Screenshot by Lightshot
in order to create my custom navigation, I added HTML to section common -> header

thanks in advance

1 « J'aime »
9

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.