☰

GitHub Join Date

Displays user's join date/time/age.

  1. // ==UserScript==
  2. // @name         GitHub Join Date
  3. // @description  Displays user's join date/time/age.
  4. // @icon         https://github.githubassets.com/favicons/favicon-dark.svg
  5. // @version      1.5
  6. // @author       afkarxyz
  7. // @namespace    https://github.com/afkarxyz/userscripts/
  8. // @supportURL   https://github.com/afkarxyz/userscripts/issues
  9. // @license      MIT
  10. // @match        https://github.com/*
  11. // @grant        GM_xmlhttpRequest
  12. // @connect      api.codetabs.com
  13. // @connect      api.cors.lol
  14. // @connect      api.allorigins.win
  15. // @connect      everyorigin.jwvbremen.nl
  16. // @connect      api.github.com
  17. // @require      https://cdn.jsdelivr.net/npm/date-fns@4.1.0/cdn.min.js
  18. // @run-at       document-idle
  19. // ==/UserScript==
  20.  
  21. ;(() => {
  22.   const ELEMENT_ID = "userscript-join-date-display"
  23.   const CACHE_KEY = "githubUserJoinDatesCache_v1"
  24.  
  25.   let isProcessing = false
  26.   let observerDebounceTimeout = null
  27.  
  28.   const proxyServices = [
  29.     {
  30.       name: "Direct GitHub API",
  31.       url: "https://api.github.com/users/",
  32.       parseResponse: (response) => {
  33.         return JSON.parse(response)
  34.       },
  35.     },
  36.     {
  37.       name: "CodeTabs Proxy",
  38.       url: "https://api.codetabs.com/v1/proxy/?quest=https://api.github.com/users/",
  39.       parseResponse: (response) => {
  40.         return JSON.parse(response)
  41.       },
  42.     },
  43.     {
  44.       name: "CORS.lol Proxy",
  45.       url: "https://api.cors.lol/?url=https://api.github.com/users/",
  46.       parseResponse: (response) => {
  47.         return JSON.parse(response)
  48.       },
  49.     },
  50.     {
  51.       name: "AllOrigins Proxy",
  52.       url: "https://api.allorigins.win/get?url=https://api.github.com/users/",
  53.       parseResponse: (response) => {
  54.         const parsed = JSON.parse(response)
  55.         return JSON.parse(parsed.contents)
  56.       },
  57.     },
  58.     {
  59.       name: "EveryOrigin Proxy",
  60.       url: "https://everyorigin.jwvbremen.nl/api/get?url=https://api.github.com/users/",
  61.       parseResponse: (response) => {
  62.         const parsed = JSON.parse(response)
  63.         return JSON.parse(parsed.html)
  64.       },
  65.     },
  66.   ]
  67.  
  68.   function readCache() {
  69.     try {
  70.       const cachedData = localStorage.getItem(CACHE_KEY)
  71.       return cachedData ? JSON.parse(cachedData) : {}
  72.     } catch (e) {
  73.       return {}
  74.     }
  75.   }
  76.  
  77.   function writeCache(cacheData) {
  78.     try {
  79.       localStorage.setItem(CACHE_KEY, JSON.stringify(cacheData))
  80.     } catch (e) {
  81.  
  82.     }
  83.   }
  84.  
  85.   function formatDate(isoDateStr) {
  86.     const joinDate = new Date(isoDateStr)
  87.     const now = new Date()
  88.     
  89.     const datePart = dateFns.format(joinDate, "dd MMM yyyy")
  90.     const timePart = dateFns.format(joinDate, "HH:mm")
  91.     
  92.     let ageText = ""
  93.     
  94.     if (dateFns.differenceInYears(now, joinDate) > 0) {
  95.       const years = dateFns.differenceInYears(now, joinDate)
  96.       ageText = `${years} year${years !== 1 ? "s" : ""}`
  97.     } else if (dateFns.differenceInMonths(now, joinDate) > 0) {
  98.       const months = dateFns.differenceInMonths(now, joinDate)
  99.       ageText = `${months} month${months !== 1 ? "s" : ""}`
  100.     } else if (dateFns.differenceInDays(now, joinDate) > 0) {
  101.       const days = dateFns.differenceInDays(now, joinDate)
  102.       ageText = `${days} day${days !== 1 ? "s" : ""}`
  103.     } else if (dateFns.differenceInHours(now, joinDate) > 0) {
  104.       const hours = dateFns.differenceInHours(now, joinDate)
  105.       ageText = `${hours} hour${hours !== 1 ? "s" : ""}`
  106.     } else {
  107.       const minutes = dateFns.differenceInMinutes(now, joinDate)
  108.       ageText = `${minutes} minute${minutes !== 1 ? "s" : ""}`
  109.     }
  110.  
  111.     return `${datePart} - ${timePart} (${ageText} ago)`
  112.   }
  113.  
  114.   async function fetchFromApi(proxyService, username) {
  115.     const apiUrl = `${proxyService.url}${username}`
  116.  
  117.     return new Promise((resolve) => {
  118.       if (typeof GM_xmlhttpRequest === "undefined") {
  119.         console.error("GM_xmlhttpRequest is not defined. Make sure your userscript manager supports it.")
  120.         resolve({ success: false, error: "GM_xmlhttpRequest is not defined" })
  121.         return
  122.       }
  123.       GM_xmlhttpRequest({
  124.         method: "GET",
  125.         url: apiUrl,
  126.         headers: {
  127.           Accept: "application/vnd.github.v3+json",
  128.         },
  129.         onload: (response) => {
  130.           if (response.responseText.includes("limit") && response.responseText.includes("API")) {
  131.             resolve({
  132.               success: false,
  133.               error: "Rate limit exceeded",
  134.               isRateLimit: true,
  135.             })
  136.             return
  137.           }
  138.  
  139.           if (response.status >= 200 && response.status < 300) {
  140.             try {
  141.               const userData = proxyService.parseResponse(response.responseText)
  142.               const createdAt = userData.created_at
  143.               if (createdAt) {
  144.                 resolve({ success: true, data: createdAt })
  145.               } else {
  146.                 resolve({ success: false, error: "Missing creation date" })
  147.               }
  148.             } catch (e) {
  149.               resolve({ success: false, error: "JSON parse error" })
  150.             }
  151.           } else {
  152.             resolve({
  153.               success: false,
  154.               error: `Status ${response.status}`,
  155.             })
  156.           }
  157.         },
  158.         onerror: () => {
  159.           resolve({ success: false, error: "Network error" })
  160.         },
  161.         ontimeout: () => {
  162.           resolve({ success: false, error: "Timeout" })
  163.         },
  164.       })
  165.     })
  166.   }
  167.  
  168.   async function getGitHubJoinDate(username) {
  169.     for (let i = 0; i < proxyServices.length; i++) {
  170.       const proxyService = proxyServices[i]
  171.       const result = await fetchFromApi(proxyService, username)
  172.  
  173.       if (result.success) {
  174.         return result.data
  175.       }
  176.     }
  177.     return null
  178.   }
  179.  
  180.   function removeExistingElement() {
  181.     const existingElement = document.getElementById(ELEMENT_ID)
  182.     if (existingElement) {
  183.       existingElement.remove()
  184.     }
  185.   }
  186.   
  187.   function formatJoinDateElement(createdAtISO) {
  188.     return `<strong>Joined</strong> <span style="font-weight: normal;">${formatDate(createdAtISO)}</span>`
  189.   }
  190.   
  191.   function updateJoinDateDisplay() {
  192.     const joinElement = document.getElementById(ELEMENT_ID)
  193.     if (!joinElement || !joinElement.dataset.joinDate) return
  194.     
  195.     joinElement.innerHTML = formatJoinDateElement(joinElement.dataset.joinDate)
  196.   }
  197.  
  198.   async function addOrUpdateJoinDateElement() {
  199.     if (document.getElementById(ELEMENT_ID) && !isProcessing) {
  200.       updateJoinDateDisplay()
  201.       return
  202.     }
  203.     if (isProcessing) {
  204.       return
  205.     }
  206.  
  207.     const pathParts = window.location.pathname.split("/").filter((part) => part)
  208.     if (
  209.       pathParts.length < 1 ||
  210.       pathParts.length > 2 ||
  211.       (pathParts.length === 2 && !["sponsors", "followers", "following"].includes(pathParts[1]))
  212.     ) {
  213.       removeExistingElement()
  214.       return
  215.     }
  216.  
  217.     const usernameElement =
  218.       document.querySelector(".p-nickname.vcard-username") || document.querySelector("h1.h2.lh-condensed")
  219.  
  220.     if (!usernameElement) {
  221.       removeExistingElement()
  222.       return
  223.     }
  224.  
  225.     const username = pathParts[0].toLowerCase()
  226.  
  227.     isProcessing = true
  228.     let joinElement = document.getElementById(ELEMENT_ID)
  229.     let createdAtISO = null
  230.     let fromCache = false
  231.  
  232.     try {
  233.       const cache = readCache()
  234.       if (cache[username]) {
  235.         createdAtISO = cache[username]
  236.         fromCache = true
  237.       }
  238.  
  239.       if (!joinElement) {
  240.         joinElement = document.createElement("div")
  241.         joinElement.id = ELEMENT_ID
  242.         joinElement.innerHTML = fromCache ? "..." : "Loading..."
  243.         joinElement.style.color = "var(--color-fg-muted)"
  244.         joinElement.style.fontSize = "14px"
  245.         joinElement.style.fontWeight = "normal"
  246.  
  247.         if (usernameElement.classList.contains("h2")) {
  248.           joinElement.style.marginTop = "0px"
  249.  
  250.           const colorFgMuted = usernameElement.nextElementSibling?.classList.contains("color-fg-muted")
  251.             ? usernameElement.nextElementSibling
  252.             : null
  253.  
  254.           if (colorFgMuted) {
  255.             const innerDiv = colorFgMuted.querySelector("div") || colorFgMuted
  256.             innerDiv.appendChild(joinElement)
  257.           } else {
  258.             usernameElement.insertAdjacentElement("afterend", joinElement)
  259.           }
  260.         } else {
  261.           joinElement.style.marginTop = "8px"
  262.           usernameElement.insertAdjacentElement("afterend", joinElement)
  263.         }
  264.       }
  265.  
  266.       if (!fromCache) {
  267.         createdAtISO = await getGitHubJoinDate(username)
  268.         joinElement = document.getElementById(ELEMENT_ID)
  269.         if (!joinElement) {
  270.           return
  271.         }
  272.  
  273.         if (createdAtISO) {
  274.           const currentCache = readCache()
  275.           currentCache[username] = createdAtISO
  276.           writeCache(currentCache)
  277.         } else {
  278.           removeExistingElement()
  279.           return
  280.         }
  281.       }
  282.  
  283.       if (createdAtISO && joinElement) {
  284.         joinElement.dataset.joinDate = createdAtISO
  285.         joinElement.innerHTML = formatJoinDateElement(createdAtISO)
  286.       } else if (!createdAtISO && joinElement) {
  287.         removeExistingElement()
  288.       }
  289.     } catch (error) {
  290.       removeExistingElement()
  291.     } finally {
  292.       isProcessing = false
  293.     }
  294.   }
  295.  
  296.   function handlePotentialPageChange() {
  297.     clearTimeout(observerDebounceTimeout)
  298.     observerDebounceTimeout = setTimeout(() => {
  299.       addOrUpdateJoinDateElement()
  300.     }, 600)
  301.   }
  302.  
  303.   addOrUpdateJoinDateElement()
  304.  
  305.   const observer = new MutationObserver((mutationsList) => {
  306.     let potentiallyRelevantChange = false
  307.     for (const mutation of mutationsList) {
  308.       if (mutation.type === "childList" && (mutation.addedNodes.length > 0 || mutation.removedNodes.length > 0)) {
  309.         const targetNode = mutation.target
  310.         if (targetNode && targetNode.matches?.("main, main *, .Layout-sidebar, .Layout-sidebar *, body")) {
  311.           let onlySelfChange = false
  312.           if (
  313.             (mutation.addedNodes.length === 1 &&
  314.               mutation.addedNodes[0].id === ELEMENT_ID &&
  315.               mutation.removedNodes.length === 0) ||
  316.             (mutation.removedNodes.length === 1 &&
  317.               mutation.removedNodes[0].id === ELEMENT_ID &&
  318.               mutation.addedNodes.length === 0)
  319.           ) {
  320.             onlySelfChange = true
  321.           }
  322.           if (!onlySelfChange) {
  323.             potentiallyRelevantChange = true
  324.             break
  325.           }
  326.         }
  327.       }
  328.     }
  329.     if (potentiallyRelevantChange) {
  330.       handlePotentialPageChange()
  331.     }
  332.   })
  333.   observer.observe(document.body, { childList: true, subtree: true })
  334.   
  335.   setInterval(updateJoinDateDisplay, 60000)
  336. })()