☰

X to Unroll Redirect (Yellow Icon, Tweet-specific)

Add a yellow Unroll button next to the like button on X (Twitter) individual tweet pages

  1. // ==UserScript==
  2. // @name         X to Unroll Redirect (Yellow Icon, Tweet-specific)
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.3
  5. // @description  Add a yellow Unroll button next to the like button on X (Twitter) individual tweet pages
  6. // @match        https://twitter.com/*
  7. // @match        https://x.com/*
  8. // @grant        none
  9. // @license MIT
  10.  
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     function addUnrollButton() {
  17.         // Check if we're on an individual tweet page
  18.         if (!window.location.pathname.includes('/status/')) return;
  19.  
  20.         const tweetActions = document.querySelector('div[role="group"]');
  21.         if (!tweetActions || document.querySelector('#unrollButton')) return;
  22.  
  23.         const unrollButton = document.createElement('div');
  24.         unrollButton.id = 'unrollButton';
  25.         unrollButton.role = 'button';
  26.         unrollButton.ariaLabel = 'Unroll thread';
  27.         unrollButton.innerHTML = `
  28.             <div dir="ltr" class="css-1rynq56 r-bcqeeo r-qvutc0 r-37j5jr r-a023e6 r-rjixqe r-16dba41 r-1awozwy r-6koalj r-1h0z5md r-o7ynqc r-clp7b1 r-3s2u2q">
  29.                 <svg viewBox="0 0 24 24" width="20" height="20">
  30.                     <g><path fill="#FFD700" d="M7.8 21c-.3 0-.5-.1-.7-.3-.5-.5-.4-1.2.1-1.6L14.9 12 7.2 4.9c-.5-.4-.6-1.1-.1-1.6.4-.5 1.1-.6 1.6-.1l8.8 8c.3.3.4.7.4 1.1s-.2.8-.4 1.1l-8.8 8c-.3.2-.6.3-.9.3z"></path></g>
  31.                 </svg>
  32.             </div>
  33.         `;
  34.  
  35.         unrollButton.style.cssText = `
  36.             display: inline-flex;
  37.             align-items: center;
  38.             padding: 0 12px;
  39.             cursor: pointer;
  40.         `;
  41.  
  42.         unrollButton.addEventListener('click', function(e) {
  43.             e.preventDefault();
  44.             e.stopPropagation();
  45.             const tweetId = window.location.pathname.split('/status/')[1];
  46.             if (tweetId) {
  47.                 window.open(`https://unrollnow.com/status/${tweetId}`, '_blank');
  48.             } else {
  49.                 alert('Unable to find tweet ID. Make sure you are on a tweet page.');
  50.             }
  51.         });
  52.  
  53.         tweetActions.appendChild(unrollButton);
  54.     }
  55.  
  56.     // Run the function initially and also whenever the URL changes
  57.     const observer = new MutationObserver((mutations) => {
  58.         for (let mutation of mutations) {
  59.             if (mutation.type === 'childList') {
  60.                 addUnrollButton();
  61.             }
  62.         }
  63.     });
  64.  
  65.     observer.observe(document.body, { childList: true, subtree: true });
  66.  
  67.     // Also run when the page loads and when the URL changes
  68.     window.addEventListener('load', addUnrollButton);
  69.     window.addEventListener('popstate', addUnrollButton);
  70. })();