From b8c6f2bed0250353f7d7dc8a4991731416bd6519 Mon Sep 17 00:00:00 2001
From: Anton Reshetov <reshetov.art@gmail.com>
Date: Sat, 25 Apr 2026 04:39:44 +0300
Subject: [PATCH] chore: typed unsponsored label

---
 package.json                                  |   1 +
 pnpm-lock.yaml                                |   8 +
 .../components/space-rail/SpaceRail.vue       |  24 +--
 .../components/space-rail/Unsponsored.vue     | 137 ++++++++++++++++++
 4 files changed, 149 insertions(+), 21 deletions(-)
 create mode 100644 src/renderer/components/space-rail/Unsponsored.vue

diff --git a/package.json b/package.json
index 9e66b069..d8cadefe 100644
--- a/package.json
+++ b/package.json
@@ -108,6 +108,7 @@
     "slugify": "^1.6.6",
     "tailwind-merge": "^3.0.2",
     "toml": "^3.0.0",
+    "typed.js": "^2.1.0",
     "uuid": "^11.1.0",
     "vue-sonner": "^1.3.0",
     "vue-virtual-scroller": "2.0.0-beta.8",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 485178ee..f28b82bc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -188,6 +188,9 @@ importers:
       toml:
         specifier: ^3.0.0
         version: 3.0.0
+      typed.js:
+        specifier: ^2.1.0
+        version: 2.1.0
       uuid:
         specifier: ^11.1.0
         version: 11.1.0
@@ -5250,6 +5253,9 @@ packages:
     resolution: {integrity: sha512-VwaXim9Gp1bngi/q3do8hgttYn2uC3MoT/gfuMWylnj1IeZBUAyPddHZlo1K05BDoj8DYPpMdiHqH1dDYdJf2A==}
     engines: {node: '>= 18'}
 
+  typed.js@2.1.0:
+    resolution: {integrity: sha512-bDuXEf7YcaKN4g08NMTUM6G90XU25CK3bh6U0THC/Mod/QPKlEt9g/EjvbYB8x2Qwr2p6J6I3NrsoYaVnY6wsQ==}
+
   typescript@5.7.3:
     resolution: {integrity: sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==}
     engines: {node: '>=14.17'}
@@ -11271,6 +11277,8 @@ snapshots:
 
   typed-function@4.2.2: {}
 
+  typed.js@2.1.0: {}
+
   typescript@5.7.3: {}
 
   uc.micro@2.1.0: {}
diff --git a/src/renderer/components/space-rail/SpaceRail.vue b/src/renderer/components/space-rail/SpaceRail.vue
index a8da54eb..eb774713 100644
--- a/src/renderer/components/space-rail/SpaceRail.vue
+++ b/src/renderer/components/space-rail/SpaceRail.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import * as Tooltip from '@/components/ui/shadcn/tooltip'
-import { useApp, useTheme } from '@/composables'
-import { i18n, ipc, store } from '@/electron'
+import { i18n, store } from '@/electron'
 import { RouterName } from '@/router'
 import { getSpaceDefinitions } from '@/spaceDefinitions'
 import { isMac } from '@/utils'
@@ -9,14 +8,8 @@ import { Settings } from 'lucide-vue-next'
 import { RouterLink, useRoute } from 'vue-router'
 import packageJson from '../../../../package.json'
 
-const { isSponsored } = useApp()
-const { isDark } = useTheme()
 const route = useRoute()
 
-function openDonatePage() {
-  void ipc.invoke('system:open-external', 'https://masscode.io/donate/')
-}
-
 const spaces = computed(() => {
   return getSpaceDefinitions().map(space => ({
     ...space,
@@ -80,20 +73,9 @@ watch(
       </RouterLink>
     </div>
     <div
-      class="mt-auto flex flex-1 flex-col items-center justify-end gap-2 pb-2"
+      class="mt-auto flex min-h-0 flex-1 flex-col items-center justify-end gap-2 overflow-hidden pb-2"
     >
-      <span
-        v-if="!isSponsored"
-        class="cursor-pointer text-center text-[9px] leading-none font-semibold tracking-[0.14em] uppercase select-none [writing-mode:sideways-lr]"
-        :class="isDark ? 'text-amber-300/70' : 'text-violet-500/70'"
-        role="link"
-        tabindex="0"
-        @click="openDonatePage"
-        @keydown.enter="openDonatePage"
-        @keydown.space.prevent="openDonatePage"
-      >
-        {{ i18n.t("messages:special.unsponsored") }}
-      </span>
+      <SpaceRailUnsponsored />
       <RouterLink
         v-slot="{ navigate }"
         custom
diff --git a/src/renderer/components/space-rail/Unsponsored.vue b/src/renderer/components/space-rail/Unsponsored.vue
new file mode 100644
index 00000000..241a6773
--- /dev/null
+++ b/src/renderer/components/space-rail/Unsponsored.vue
@@ -0,0 +1,137 @@
+<script setup lang="ts">
+import { useApp, useTheme } from '@/composables'
+import { i18n, ipc } from '@/electron'
+import Typed from 'typed.js'
+
+const { isSponsored } = useApp()
+const { isDark } = useTheme()
+
+const labelRef = ref<HTMLElement | null>(null)
+let typed: Typed | null = null
+
+const TYPING_DELAY = 1000 * 15
+const FIRST_PROMPT = i18n.t('messages:special.unsponsored').toUpperCase()
+
+const SINCE_YEAR = 2019
+const NOW_YEAR = new Date().getFullYear()
+
+const prompts = [
+  'Zero sponsors. Infinite snippets',
+  'Free. Forever. Fueled by you',
+  'No sponsors. No regrets',
+  'Open source. Open wallet? 👀',
+  `${NOW_YEAR - SINCE_YEAR} years solo. Still going`,
+  'Ad-free since 2019',
+  '404: Sponsor Not Found',
+  'One dev. Thousands of users. Math? 🤔',
+  'Your snippets. My rent',
+  'Love it? Fuel it',
+  'You use it. You fund it?',
+  'A coffee keeps v6 coming',
+  'Stars are nice. Coffee is better',
+  'Built with love. Funded by you?',
+  'No tracking. No ads. No catch',
+  'Indie. Forever',
+  'Side project, full heart',
+  'Made by humans, for humans',
+  'Vibes-driven development',
+  '100% indie. 0% bullshit',
+  'Snippets > Sponsors',
+  // дев прикол
+  '$ donate --please',
+  'throw new Error("No sponsors yet")',
+  'sudo support-massCode',
+  'npm install coffee',
+  'git blame → one guy',
+  'sponsors.length === 0',
+  '// TODO: find sponsor',
+  'kill -9 ads',
+  'if (you.likeIt) donate()',
+  'await getSponsor() // pending...',
+  'try { ship() } catch { coffee() }',
+  'SELECT * FROM sponsors → 0 rows',
+  'console.log("send help")',
+  'npm install --save-life',
+  'git push --love origin main',
+  'chmod +x developer',
+  'function fund() { return ❤️ }',
+  'rm -rf ads/',
+  'process.exit(0) // jk, still here',
+  'import coffee from "you"',
+  'Error: SponsorsNotFoundException',
+  'cargo run --keep-alive',
+  'docker run --restart=donations',
+  // самоирония
+  'Stars don\'t pay rent',
+  'GitHub stars: many. Sponsors: zero',
+  'One-man army. Tired army',
+  'Built different. Funded different?',
+  'Ship it. Eat ramen. Repeat',
+  'Free for you. Costly for me',
+]
+
+function shufflePrompts(input: string[]) {
+  const shuffled = [...input]
+
+  for (let i = shuffled.length - 1; i > 0; i -= 1) {
+    const j = Math.floor(Math.random() * (i + 1))
+    const current = shuffled[i]
+    shuffled[i] = shuffled[j]
+    shuffled[j] = current
+  }
+
+  return shuffled
+}
+
+function getPromptSequence() {
+  return [FIRST_PROMPT, ...shufflePrompts(prompts)]
+}
+
+function openDonatePage() {
+  void ipc.invoke(
+    'system:open-external',
+    'https://masscode.io/donate/?ref=unsponsored-label',
+  )
+}
+
+onMounted(() => {
+  if (isSponsored || !labelRef.value) {
+    return
+  }
+
+  typed = new Typed(labelRef.value, {
+    strings: getPromptSequence(),
+    typeSpeed: 60,
+    backSpeed: 20,
+    backDelay: TYPING_DELAY,
+    startDelay: 700,
+    loop: true,
+    smartBackspace: true,
+    showCursor: false,
+  })
+})
+
+onBeforeUnmount(() => {
+  typed?.destroy()
+  typed = null
+})
+</script>
+
+<template>
+  <button
+    v-if="!isSponsored"
+    type="button"
+    class="relative h-32 w-3 cursor-pointer border-0 bg-transparent p-0 focus-visible:outline-none"
+    :class="isDark ? 'text-amber-300/70' : 'text-violet-500/70'"
+    @click="openDonatePage"
+  >
+    <div
+      class="absolute top-0 left-0 flex h-3 w-32 origin-top-left translate-y-32 -rotate-90 items-center"
+    >
+      <span
+        ref="labelRef"
+        class="_uppercase font-mono text-[10px] leading-none font-semibold tracking-[0.14em] whitespace-nowrap select-none"
+      />
+    </div>
+  </button>
+</template>