tssbot.web/vite.config.js

import crypto from 'node:crypto'
import { defineConfig, loadEnv } from 'vite'
import react from '@vitejs/plugin-react'
import tailwindcss from '@tailwindcss/vite'
import obfuscatorPlugin from 'rollup-plugin-obfuscator'

const OBFUSCATOR_OPTIONS = {
  compact: true,
  controlFlowFlattening: false,
  deadCodeInjection: false,
  debugProtection: false,
  disableConsoleOutput: false,
  identifierNamesGenerator: 'hexadecimal',
  log: false,
  numbersToExpressions: false,
  renameGlobals: false,
  selfDefending: false,
  simplify: true,
  splitStrings: false,
  stringArray: true,
  stringArrayCallsTransform: false,
  stringArrayEncoding: ['base64'],
  stringArrayRotate: true,
  stringArrayShuffle: true,
  stringArrayThreshold: 0.75,
  transformObjectKeys: false,
  unicodeEscapeSequence: false,
}

function obfuscate() {
  const factory = obfuscatorPlugin.default || obfuscatorPlugin
  const inner = factory({ global: true, options: OBFUSCATOR_OPTIONS })
  return { ...inner, apply: 'build', enforce: 'post' }
}

const MAX_TEAM_NAME_LENGTH = 80

function sri() {
  return {
    name: 'sri',
    apply: 'build',
    enforce: 'post',
    transformIndexHtml: {
      order: 'post',
      handler(html, ctx) {
        const bundle = ctx?.bundle
        if (!bundle) return html

        const hashFor = (fileName) => {
          const asset = bundle[fileName]
          if (!asset) return null
          const source = asset.type === 'asset' ? asset.source : asset.code
          const buf = Buffer.isBuffer(source) ? source : Buffer.from(source, 'utf8')
          return `sha384-${crypto.createHash('sha384').update(buf).digest('base64')}`
        }

        const tagPattern = /<(?:script|link)\b[^>]*\b(?:src|href)=["'](\/[^"']+)["'][^>]*>/g
        return html.replace(tagPattern, (tag, url) => {
          if (/\bintegrity=/.test(tag)) return tag
          const fileName = url.replace(/^\//, '').split('?')[0].split('#')[0]
          const integrity = hashFor(fileName)
          if (!integrity) return tag
          const closing = tag.endsWith('/>') ? ' />' : '>'
          const body = tag.slice(0, -closing.length)
          let out = `${body} integrity="${integrity}"`
          if (!/\bcrossorigin\b/.test(tag)) out += ' crossorigin="anonymous"'
          return `${out}${closing}`
        })
      },
    },
  }
}

function isAllowedApiUrl(req) {
  const url = new URL(req.url, 'http://localhost')
  const params = url.searchParams

  if (url.pathname === '/api/viewers' && (req.method === 'GET' || req.method === 'HEAD')) return true
  if (url.pathname === '/api/viewers/event' && req.method === 'POST') return true

  if (req.method !== 'GET' && req.method !== 'HEAD') return false

  if (url.pathname === '/api/tss/leaderboard/teams') {
    const keys = [...params.keys()]
    const limit = Number(params.get('limit') || 100)
    return keys.every((key) => key === 'limit') && Number.isInteger(limit) && limit >= 1 && limit <= 100
  }

  if (url.pathname === '/api/tss/teams/resolve') {
    const keys = [...params.keys()]
    const name = params.get('name') || ''
    return keys.every((key) => key === 'name') && name.length >= 2 && name.length <= MAX_TEAM_NAME_LENGTH
  }

  if (url.pathname === '/api/tss/teams/search') {
    const keys = [...params.keys()]
    const query = params.get('q') || params.get('name') || ''
    const limit = Number(params.get('limit') || 10)
    return (
      keys.every((key) => ['q', 'name', 'limit'].includes(key)) &&
      query.length >= 2 &&
      query.length <= MAX_TEAM_NAME_LENGTH &&
      Number.isInteger(limit) &&
      limit >= 1 &&
      limit <= 20
    )
  }

  if ([...params.keys()].length) return false

  try {
    const match = url.pathname.match(/^\/api\/tss\/teams\/([^/]+)(?:\/(history|games))?$/)
    const teamName = match ? decodeURIComponent(match[1]) : ''
    return Boolean(teamName) && teamName.length <= MAX_TEAM_NAME_LENGTH
  } catch {
    return false
  }
}

function apiGuard() {
  return {
    name: 'api-guard',
    configureServer(server) {
      server.middlewares.use((req, res, next) => {
        if (!req.url?.startsWith('/api/')) {
          next()
          return
        }

        if (isAllowedApiUrl(req)) {
          next()
          return
        }

        res.writeHead(404, {
          'content-type': 'application/json; charset=utf-8',
          'x-content-type-options': 'nosniff',
        })
        res.end(JSON.stringify({ error: 'API route not found' }))
      })
    },
  }
}

function comingSoonHtml() {
  return `<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="noindex">
    <meta name="theme-color" content="#fefde7">
    <title>Toothless' TSS Bot | Coming soon</title>
  </head>
  <body style="margin:0;min-width:320px;min-height:100vh;background:#fefde7;color:#000;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Inter,Arial,sans-serif;">
    <main style="min-height:100vh;display:grid;place-items:center;padding:32px;">
      <section style="width:min(100%,720px);border-left:4px solid #e82517;padding:8px 0 8px 28px;">
        <p style="margin:0 0 14px;color:#e82517;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;">Toothless' TSS Bot</p>
        <h1 style="margin:0;color:#000;font-size:clamp(48px,12vw,112px);line-height:.92;font-weight:900;letter-spacing:0;">Coming soon</h1>
        <p style="margin:24px 0 0;max-width:520px;color:#555;font-size:18px;line-height:1.6;font-weight:600;">TSS analytics are getting tucked away for a little bit. Check back soon.</p>
      </section>
    </main>
  </body>
</html>`
}

function comingSoonDev(enabled) {
  return {
    name: 'coming-soon-dev',
    configureServer(server) {
      if (!enabled) return

      server.middlewares.use((req, res, next) => {
        if (req.url?.startsWith('/api/') || req.url === '/health') {
          next()
          return
        }

        const acceptsHtml = String(req.headers.accept || '').includes('text/html')
        if (!acceptsHtml && req.url !== '/') {
          next()
          return
        }

        res.writeHead(200, {
          'content-type': 'text/html; charset=utf-8',
          'cache-control': 'no-store',
          'x-content-type-options': 'nosniff',
        })
        res.end(comingSoonHtml())
      })
    },
  }
}

export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd(), '')
  const comingSoon = String(env.comingsoon || env.COMINGSOON || '').toLowerCase() === 'true'

  return {
    plugins: [comingSoonDev(comingSoon), apiGuard(), react(), tailwindcss(), obfuscate(), sri()],
    server: {
      host: '0.0.0.0',
      port: 3001,
      proxy: {
        '/api': {
          target: process.env.VITE_API_TARGET ?? 'http://localhost:6000',
          changeOrigin: true,
        },
        '/health': {
          target: process.env.VITE_API_TARGET ?? 'http://localhost:6000',
          changeOrigin: true,
        },
      },
    },
  }
})