Skip to content

Instantly share code, notes, and snippets.

@chx
Last active March 15, 2024 12:46
Show Gist options
  • Save chx/22372925d1db05e19e76d7438262a575 to your computer and use it in GitHub Desktop.
Save chx/22372925d1db05e19e76d7438262a575 to your computer and use it in GitHub Desktop.
Remove the new Slack "rail" containing activity and other useless things
const domObserver = new MutationObserver(() => {
let rail = document.querySelector('div.p-tab_rail');
if (rail) {
rail.remove();
let old_strip = document.querySelector('div.p-workspace_switcher_prototype div.p-control_strip')
if (old_strip) {
old_strip.remove()
}
let strip = document.querySelector('div.p-control_strip');
document.querySelector('div.p-workspace_switcher_prototype').appendChild(strip);
strip.style.left=0;
document.querySelector('.p-client_workspace_wrapper').style.gridTemplateColumns = '0 auto';
}
});
domObserver.observe(document.body, {
subtree: true,
childList: true,
});
@chx
Copy link
Author

chx commented Feb 28, 2024

You need to type /slackdevtools and copypaste this there. If your slack client breaks, just press ctrl+r.

Make sure your workspace switcher is visible before running this. https://i.imgur.com/thJB0sn.png

@kpedro88
Copy link

Thanks for this, it works for me. The only problem is that the floating ⊕ at the bottom for "Create new" and the user profile picture below it end up overlapping with the list of teams (yes, I have too many teams). The ⊕ could be hidden without losing anything of value, but the profile icon has useful features. The best approach may be to restrict the height of the team list to ensure room for these icons. I came up with the following lines to insert after L12:

        document.querySelector('div.p-team_sidebar').style.paddingBottom = "0px";
        document.querySelector('div.p-team_sidebar').style.height = "calc(100vh - "+strip.offsetHeight+"px - 50px)";

@chx
Copy link
Author

chx commented Feb 29, 2024

I am glad it works for you!

Thanks for the suggestion. I do not quite like hardwiring 50px, otherwise sounds reasonable. Could you derive that value from somewhere? Why 50px specifically...?

@kpedro88
Copy link

The paddingBottom was originally 50px. (I'm not quite sure why just removing it once wasn't enough; perhaps it's actually a coincidence and there's another 50px somewhere, but I didn't see any candidates in the computed style from the element inspector.)

This works to avoid hardcoding it:

        let sidebar = document.querySelector('div.p-team_sidebar');
        sidebar.style.height = "calc(100vh - "+strip.offsetHeight+"px - "+getComputedStyle(sidebar).getPropertyValue("padding-bottom")+")";
        sidebar.style.paddingBottom = "0px";

@kpedro88
Copy link

Actually, this needs to be a bit more sophisticated to survive multiple calls to the mutation observer. Here's my attempt (probably better methods are available to those whose javascript knowledge isn't 15 years out of date...):

var sidebarPaddingBottom = "";
const domObserver = new MutationObserver(() => {
    let rail = document.querySelector('div.p-tab_rail');
    if (rail) {
        rail.remove();
        let old_strip = document.querySelector('div.p-workspace_switcher_prototype div.p-control_strip')
        if (old_strip) {
            old_strip.remove()
        }
        let strip = document.querySelector('div.p-control_strip');
        document.querySelector('div.p-workspace_switcher_prototype').appendChild(strip);
        strip.style.left=0;
        document.querySelector('.p-client_workspace_wrapper').style.gridTemplateColumns = '0 auto';
        let sidebar = document.querySelector('div.p-team_sidebar');
        if (sidebarPaddingBottom.length === 0) {
            sidebarPaddingBottom = getComputedStyle(sidebar).getPropertyValue("padding-bottom");
        }
        sidebar.style.height = "calc(100vh - "+strip.offsetHeight+"px - "+sidebarPaddingBottom+")";
        sidebar.style.paddingBottom = "0px";
    }
});
domObserver.observe(document.body, {
    subtree: true,
    childList: true,
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment