// ==UserScript== // @name GitHub Issue Number Predictor // @description Show the issue number that will be created, with highlighting for upcoming significant numbers // @namespace web.nextbyte.ai // @version 2.4 // @author NextByte // @match https://github.com/*/*/issues/new* // @grant GM_xmlhttpRequest // @grant GM_addStyle // @connect api.github.com // @run-at document-end // ==/UserScript== (function() { 'use strict'; // List of significant numbers to highlight const SIGNIFICANT_NUMBERS = [ 69, 100, 108, 200, 300, 400, 420, 500, 1000, 1337, 2000, 3000, 4000, 5000, 6000, 7000, 8000, 9000, 9001, 10000, 11000, 12000, 13000, 14000, 15000 ]; // Extract owner and repo from the URL const pathParts = window.location.pathname.split('/').filter(p => p); if (pathParts.length < 2) return; const owner = pathParts[0]; const repo = pathParts[1]; // Add CSS for the preview box with three styling cases GM_addStyle(` .issue-number-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 6px; font-weight: 500; font-size: 14px; margin-left: 12px; } /* Default case: subtle green, no background */ .issue-number-badge.default { color: #1a7f37; background-color: transparent; } /* Upcoming case: subtle yellow, no background */ .issue-number-badge.upcoming { color: #9e6a03; background-color: transparent; } /* Significant case: orange background, white text, enlarged number */ .issue-number-badge.significant { background-color: #fb8500; color: white; } .issue-number-badge-number { font-weight: 700; } .issue-number-badge.significant .issue-number-badge-number { font-size: 18px; } .issue-number-badge-icon { font-size: 16px; } .issue-number-badge.significant .issue-number-badge-icon { font-size: 18px; } `); /** * Determine the status of a number * @param {number} currentNumber - The current/next issue number * @returns {object} - { type: 'default'|'upcoming'|'significant', nextSignificant: number } */ function getNumberStatus(currentNumber) { // Find the next significant number const nextSignificant = SIGNIFICANT_NUMBERS.find(num => num >= currentNumber); if (!nextSignificant) { return { type: 'default', nextSignificant: null }; } const diff = nextSignificant - currentNumber; // If the next number IS significant, it's "significant" if (diff === 0) { return { type: 'significant', nextSignificant }; } // If the next significant number is coming soon (within 5 issues), it's "upcoming" if (diff <= 5) { return { type: 'upcoming', nextSignificant }; } // Otherwise, it's default return { type: 'default', nextSignificant }; } /** * Create the badge element * @param {number} issueNumber - The issue number to display * @returns {HTMLElement} - The badge element */ function createBadge(issueNumber) { const status = getNumberStatus(issueNumber); const badge = document.createElement('span'); badge.className = `issue-number-badge ${status.type}`; let icon = ''; let text = `#${issueNumber}`; if (status.type === 'significant') { icon = '⭐'; text = `${issueNumber}`; } else if (status.type === 'upcoming') { icon = '⏰'; text = `${issueNumber} → ${status.nextSignificant}`; } const iconSpan = icon ? `${icon}` : ''; badge.innerHTML = `${iconSpan}${text}`; return badge; } // Function to fetch the next issue number async function getNextIssueNumber() { return new Promise((resolve, reject) => { // Add cache-busting parameter to prevent caching const timestamp = Date.now(); GM_xmlhttpRequest({ method: 'GET', url: `https://api.github.com/repos/${owner}/${repo}/issues?state=all&per_page=1&sort=created&direction=desc&t=${timestamp}`, headers: { 'Accept': 'application/vnd.github.v3+json', 'Cache-Control': 'no-cache, no-store, must-revalidate', 'Pragma': 'no-cache', 'Expires': '0' }, onload: function(response) { try { if (response.status === 200) { const data = JSON.parse(response.responseText); if (data.length > 0) { const nextNumber = data[0].number + 1; resolve(nextNumber); } else { // No issues yet, next will be #1 resolve(1); } } else { reject('API error: ' + response.status); } } catch (e) { reject('Parse error: ' + e.message); } }, onerror: function(error) { // Properly handle error object from GM_xmlhttpRequest // The error object contains: error, readyState, status, statusText let errorMsg = 'Network error'; if (error && typeof error === 'object') { // Check for error property first (contains the actual error message) if (error.error) { errorMsg = error.error; } else if (error.statusText) { errorMsg = error.statusText; } else if (error.message) { errorMsg = error.message; } else if (error.status) { errorMsg = 'Status ' + error.status; } } else if (error) { errorMsg = String(error); } reject(errorMsg); }, ontimeout: function() { reject('Request timeout'); } }); }); } // Function to create and insert the badge inline next to "Create new issue" async function insertBadge() { // Wait for the heading to be present let heading = document.querySelector('#issue-create-pane-title'); let attempts = 0; while (!heading && attempts < 20) { await new Promise(resolve => setTimeout(resolve, 100)); heading = document.querySelector('#issue-create-pane-title'); attempts++; } if (!heading) { console.warn('Could not find issue create heading'); return; } // Create a loading badge const badge = document.createElement('span'); badge.className = 'issue-number-badge default'; badge.innerHTML = '⏳Loading...'; // Insert the badge inline next to the heading heading.appendChild(badge); // Fetch and update the issue number try { const nextNumber = await getNextIssueNumber(); // Replace the badge with the actual one const actualBadge = createBadge(nextNumber); heading.replaceChild(actualBadge, badge); } catch (error) { // On error, just remove the badge badge.remove(); console.error('Error fetching issue number:', error); } } // Function to watch for form resets (when "Create more" is used) function watchForFormReset() { // Watch for changes to the form or the issue number badge const observer = new MutationObserver(async (mutations) => { // Check if the badge exists and if the form has been reset const heading = document.querySelector('#issue-create-pane-title'); const badge = heading?.querySelector('.issue-number-badge'); const titleInput = document.querySelector('input[placeholder="Title"]'); // Only consider the form reset if both the title and body were filled and now are both empty // This happens when "Create more" is checked and a new issue is created const bodyTextarea = document.querySelector('textarea[placeholder="Type your description here…"]'); if (badge && titleInput && bodyTextarea && titleInput.value === '' && bodyTextarea.value === '') { // Refresh the badge with the new issue number try { const nextNumber = await getNextIssueNumber(); const actualBadge = createBadge(nextNumber); heading.replaceChild(actualBadge, badge); } catch (error) { console.error('Error refreshing issue number:', error); } } }); // Observe the form area for changes const formWrapper = document.querySelector('.CreateIssueForm-module__CreateIssueFormWrapper--xluI0'); if (formWrapper) { observer.observe(formWrapper, { subtree: true, childList: true, characterData: true, attributes: true }); } } // Start the process when DOM is ready if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', () => { insertBadge(); watchForFormReset(); }); } else { insertBadge(); watchForFormReset(); } })();