XPOHID.user.js

// ==UserScript==
// @name         XPOHID
// @namespace    http://fabi.pw
// @version      0.1
// @description  Hide Posts from X (formerly Twitter) more effectively | Oculta Posts de X (ex Twitter) de forma más eficaz
// @author       Nekitaww
// @match        https://x.com/*
// @icon         https://upload.wikimedia.org/wikipedia/commons/thumb/6/6f/Logo_of_Twitter.svg/512px-Logo_of_Twitter.svg.png
// @grant        none
// ==/UserScript==

window.hidden_data = localStorage.hideList ?? {by_name:
                                               ['🇮🇱', '🦁', '🐍', /[del\s|\(]56%[\)]/i,
                                                /miller/i, /villarruel/i,
                                                /vllc/i, /LLibertadAvanza/i]};
let hidder_template = `
<div class="XPOHID-Box">
   <b>Ocultador de Posts ✨Ultra✨</b>
   <br>
   <br>
   <small>No agregues un solo caracter, pero sí palabras, expresiones regulares o emojis</small>
   <br><br>
   Palabra a ocultar
   <br>
   <input type="text" id="XPOHID-Input">
   <br>
   <button type="button" class="XPOHID-Btn XPOHID-Add-Btn">Agregar</button>
   <br>
   <br>
   <div class="XPOHID-list">
      <ul>
         <li><button type="button" class="XPOHID-Btn XPOHID-Del-Btn">X</button>  <code>Macri</code></li>
         <li><button type="button" class="XPOHID-Btn XPOHID-Del-Btn">X</button>  <code>Cristina</code></li>
         <li><button type="button" class="XPOHID-Btn XPOHID-Del-Btn">X</button>  <code>Milei</code></li>
         <li><button type="button" class="XPOHID-Btn XPOHID-Del-Btn">X</button>  <code>/cr[y|i]pto/</code></li>
      </ul>
   </div>
</div>
`;
let hidder_style = `
.XPOHID-Box {
    position: absolute;
    /* width: 300px; */
    /* height: 300px; */
    z-index: 999999999;
    display: block;
    left: 0;
    top: 0;
    border: solid 1px #adadad;
    border-radius: 5px;
    padding: 22px;
    font-family: sans-serif;
    background-color: #fff;
}
#XPOHID-Input{
   border-radius: 5px;
   border: solid 1px #adadad;
   padding: 5px;
   margin: 6px 0;
}

.XPOHID-Btn{
    border: none;
    border-radius: 50px;
    color: #fff;
    padding: 10px 20px;
    font-weight: bold;
    cursor: pointer;
}
.XPOHID-Add-Btn{
    background-color: #317a1e;
}
.XPOHID-Del-Btn{
    background-color: #e13939;
}

.XPOHID-list{
    background: #e1e1e1;
    border-radius: 5px;
    border: solid 1px #adadad;
}

.XPOHID-list ul{
   list-style: none;
   /*padding: 10px;*/
   padding: 0px;
   margin: 0px;
}
.XPOHID-list ul li{
   padding: 5px;
}
.XPOHID-list ul li:nth-child(2n+0){
   background: #fff;
   border-radius: 5px;
}
.XPOHID-hidden{
background-color:#ffcccc;
font-family: TwitterChirp, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.XPOHID-hidden > div{
display: none;
}
.XPOHID-hidden:before{
    font-family: TwitterChirp, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    content: "Post oculto [Click para ver]";
    width: 100%;
    padding: 6px;
    font-weight: bold;
    cursor:pointer;
}
`;
(function() {
    'use strict';

    const hideTwt = (x)=>{
        /*let p = x.children[0];
        p.style.visibility = 'hidden';
        p.style.height = "30px";*/
        x.classList.add("XPOHID-hidden");
        x.onmouseover = (e) => {e.preventDefault(); e.stopPropagation();}
        x.onclick = (e) => {e.preventDefault(); showTwt(x);}
    };

    const showTwt = (x)=>{
        x.classList.remove("XPOHID-hidden");
    }

    let tmpobj = document.createElement("div")
    tmpobj.innerHTML = hidder_template;
    //document.body.appendChild(tmpobj);

    const style = document.createElement('style');
    style.innerHTML = hidder_style;

    document.head.appendChild(style);

    // Your code here...

    //TEST
    //document.querySelectorAll('[data-testid="tweet"]').forEach((x)=> { if(x.innerHTML.includes('data-testid="icon-verified"')) { x.style.display = 'none'} })

    // Select the node that will be observed for mutations
    const targetNode = document.getElementById('react-root');

    // Options for the observer (which mutations to observe)
    const config = { attributes: true, childList: true, subtree: true };

    // Callback function to execute when mutations are observed

    const callback = (mutationList, observer) => {

        for (const mutation of mutationList) {
            if (mutation.type === "childList"
                && !mutation.target.innerHTML.includes('data-testid="app-text-transition-container"')
               && !mutation.target.innerHTML.includes('data-testid="like"')
               && !mutation.target.innerHTML.includes('data-testid="retweet"')) {

                document.querySelectorAll('[data-testid="tweet"]').forEach(
                    (x)=> {

                        //if(x.innerHTML.includes('data-testid="icon-verified"')) { }
                        window.hidden_data.by_name.forEach(
                            (r)=>{
                                if(x.innerHTML.search(r) != -1){
                                    hideTwt(x);
                                }
                            }
                        );
                    }
                );
                break;
            }
        }
    };

    // Create an observer instance linked to the callback function
    const observer = new MutationObserver(callback);

    // Start observing the target node for configured mutations
    observer.observe(targetNode, config);
})();