Place "Power Off" as last option in the system menu?

I have been using Ubuntu 21.10 for about slightly more than a month now and there is a design choice that irritates me.

The "Log Out" button is placed below the "Power Off" button in the system menu. You can see the image link below.

It irritates me as I am used to clicking the last option in the menu, like Mac OS. Is there a way to put the "Power Off" button below the "Log Out?"

I have installed a few different Extensions to try and fix this.

"Bring Out SubMenu of Power Off/Logout Button" As you can see there is no option for me to reaarange. :/

"Top Bar Organiser"

A few others, but just haven't been able to put the Power Off Button below the Logout Button. Does anyone have a clue on how to reorder the options?

Also, I chanced on a few menu designs that look good like the link below.

I believe this was Gnome3 in 18.04? I much prefer the round buttons. I will be okay switching to this look too.

Thanks in advance for helping me!

Solution 1:

With the new Update to the extension, the code has changed a bit, so to do this.

Turn on the option

Then, using the command from @UnKNOWn answer

Open the extensions extension.js file with below command

gedit $HOME/.local/share/gnome-shell/extensions/[email protected]/extension.js

Reorder the menu as you wish from _createMenu() funtion, for example

_createMenu() {
    let bindFlags = GObject.BindingFlags.DEFAULT | GObject.BindingFlags.SYNC_CREATE;
    let forceLockDown = this._settings.get_boolean('force-lock-down');
    let boolean;
    
    // Separator1
    
    boolean = this._settings.get_boolean('remove-separator-1');
    if (!boolean) { SystemMenu.addMenuItem(separator1); };
    
    // Suspend
    

    suspend = new PopupMenu.PopupImageMenuItem(_('Suspend'), 'media-playback-pause-symbolic');
    suspend.connect('activate', () => {
                        DefaultActions.activateSuspend();
                });
    
    if(!forceLockDown) {
            SystemMenu.addMenuItem(suspend);
            DefaultActions.bind_property('can-suspend', suspend, 'visible', bindFlags);
            } else {
                boolean = this._settings.get_boolean('remove-suspend-button');
                if (!boolean) {
                SystemMenu.addMenuItem(suspend);
                // DefaultActions.bind_property('can-suspend', suspend, 'visible', bindFlags);
                        }
                }
                
    
                
    // Restart

    restart = new PopupMenu.PopupImageMenuItem(_('Restart…'), 'system-reboot-symbolic');
    restart.connect('activate', () => {
                            SHELL_MAJOR_VERSION >= 40 ? DefaultActions.activateRestart() : SessionManager.RebootRemote();
                    });
    
    if(!forceLockDown) {
            SystemMenu.addMenuItem(restart);
            SHELL_MAJOR_VERSION >= 40 ? DefaultActions.bind_property('can-restart', restart, 'visible', bindFlags) :
                            DefaultActions.bind_property('can-power-off', restart, 'visible', bindFlags);
            } else {
                boolean = this._settings.get_boolean('remove-restart-button');
                if (!boolean) {
                SystemMenu.addMenuItem(restart);
                // SHELL_MAJOR_VERSION >= 40 ? DefaultActions.bind_property('can-restart', this._restartButton, 'visible', bindFlags) :
                                // DefaultActions.bind_property('can-power-off', this._restartButton, 'visible', bindFlags);
                        }
                }
                
    // Logout

    logout = new PopupMenu.PopupImageMenuItem(_('Log Out'), 'system-log-out-symbolic');
    logout.connect('activate', () => { DefaultActions.activateLogout(); });
    
    if(!forceLockDown) {
            SystemMenu.addMenuItem(logout);
            DefaultActions.bind_property('can-logout', logout, 'visible', bindFlags);
            } else {
                boolean = this._settings.get_boolean('remove-logout-button');
                if (!boolean) {
                SystemMenu.addMenuItem(logout);
                // DefaultActions.bind_property('can-logout', logout, 'visible', bindFlags);
                        }
                }
                
    
    // Separator2
    
    boolean = this._settings.get_boolean('remove-separator-2');
    if (!boolean) { SystemMenu.addMenuItem(separator2); };
    
    
                
    // Power

    power = new PopupMenu.PopupImageMenuItem(_('Power Off…'), 'system-shutdown-symbolic');
    power.connect('activate', () => { DefaultActions.activatePowerOff(); });
    
    if(!forceLockDown) {
            SystemMenu.addMenuItem(power);
            DefaultActions.bind_property('can-power-off', power, 'visible', bindFlags);
            } else {
                boolean = this._settings.get_boolean('remove-power-button');
                if (!boolean) {
                SystemMenu.addMenuItem(power);
                // DefaultActions.bind_property('can-suspend', suspend, 'visible', bindFlags);
                        }
                }
                
                
    // Switch User

    switchUser = new PopupMenu.PopupImageMenuItem(_('Switch User…'), 'system-switch-user-symbolic');
    SystemMenu.addMenuItem(switchUser)
    switchUser.connect('activate', () => { DefaultActions.activatSwitchUser(); });
    DefaultActions.bind_property('can-switch-user', switchUser, 'visible', bindFlags);
    
    DefaultActions.forceUpdate();   

    }

You should get a menu that looks like this: