fix(cache): make badge cache query control client and CDN headers

.oxlintrc.json

@@ -0,0 +1,28 @@
+{
+  "$schema": "./node_modules/oxlint/configuration_schema.json",
+  "plugins": ["react", "typescript", "nextjs"],
+  "env": {
+    "es6": true,
+    "browser": true,
+    "node": true
+  },
+  "globals": {
+    "__DEV__": "readonly",
+    "Generator": "readonly",
+    "XMLHttpRequest": "readonly"
+  },
+  "ignorePatterns": [
+    ".next/**",
+    "out/**",
+    "build/**",
+    "dist/**",
+    "next-env.d.ts"
+  ],
+  "rules": {
+    "no-case-declarations": "off",
+    "no-unused-vars": "off",
+    "react/no-unescaped-entities": "off",
+    "react/no-unknown-property": ["error", { "ignore": ["jsx"] }],
+    "react/react-in-jsx-scope": "off"
+  }
+}

components/help-info.tsx

@@ -56,7 +56,7 @@
       </li>
       <li>
         <code>cache</code>
-        Live badge are cached in cdn for 24hrs (86400), you may limit it to a minimum of 5min (300).
+        Control how long live badges may be cached by downstream clients and the CDN. Minimum value is 5min (300).
         &nbsp;<a href='/npm/dm/express?cache=600'>e.g.</a>
       </li>
     </ul>
@@ -160,7 +160,7 @@
   })
 }
 
 const explainCode = (isFlat: Boolean) => {
   const text = `
 https://badgen.net/badge/:subject/:status/:color?icon=github
                    ──┬──  ───┬───  ──┬───  ──┬── ────┬──────

libs/badge-cache-control.ts

@@ -0,0 +1,23 @@
+const MIN_BADGE_CACHE_SECONDS = 300
+
+export function resolveBadgeCacheMaxAge (
+  cache: string | string[] | undefined,
+  fallbackSeconds: number
+): number {
+  const cacheValue = Array.isArray(cache) ? cache[0] : cache
+
+  if (cacheValue === undefined) {
+    return fallbackSeconds
+  }
+
+  const parsedCacheSeconds = parseInt(String(cacheValue), 10)
+  if (Number.isNaN(parsedCacheSeconds)) {
+    return MIN_BADGE_CACHE_SECONDS
+  }
+
+  return Math.max(parsedCacheSeconds, MIN_BADGE_CACHE_SECONDS)
+}
+
+export function createBadgeCacheControlHeader (cacheSeconds: number): string {
+  return `public, max-age=${cacheSeconds}, s-maxage=${cacheSeconds}, stale-while-revalidate=86400`
+}

libs/gitlab.ts

@@ -19,8 +19,8 @@ export function restGitlab<T = any>(path: string, fullResponse = false) {
   const headers = {
     authorization: token ? `Bearer ${token}` : undefined,
   }
-  const prefixUrl = process.env.GITLAB_API || 'https://gitlab.com/api/v4'
-  return fullResponse ? ky.get(path, { prefixUrl, headers }) : ky.get(path, { prefixUrl, headers }).json<T>()
+  const prefix = process.env.GITLAB_API || 'https://gitlab.com/api/v4'
+  return fullResponse ? ky.get(path, { prefix, headers }) : ky.get(path, { prefix, headers }).json<T>()
 }
 
 function pickGitlabToken() {

libs/serve-badge-next.ts

@@ -3,6 +3,7 @@ import icons from 'badgen-icons'
 import originalUrl from 'original-url'
 
 import { BadgenParams } from './types'
+import { createBadgeCacheControlHeader, resolveBadgeCacheMaxAge } from './badge-cache-control'
 
 import type { NextApiRequest, NextApiResponse } from 'next'
 
@@ -41,8 +42,8 @@ export async function serveBadgeNext (req: NextApiRequest, res: NextApiResponse,
 
   // Minimum s-maxage is set to 300s(5m)
   if (res.getHeader('cache-control') === undefined) {
-    const cacheMaxAge = cache ? Math.max(parseInt(String(cache)), 300) : sMaxAge
-    res.setHeader('cache-control', `public, max-age=86400, s-maxage=${cacheMaxAge}, stale-while-revalidate=86400`)
+    const cacheMaxAge = resolveBadgeCacheMaxAge(cache, sMaxAge)
+    res.setHeader('cache-control', createBadgeCacheControlHeader(cacheMaxAge))
   }
 
   res.setHeader('Content-Type', 'image/svg+xml;charset=utf-8')

libs/serve-badge.ts

@@ -4,6 +4,7 @@
 
 import { IncomingMessage, ServerResponse } from 'http'
 import { BadgenParams } from './types'
+import { createBadgeCacheControlHeader, resolveBadgeCacheMaxAge } from './badge-cache-control'
 
 type ServeBadgeOptions = {
   code?: number
@@ -20,7 +21,7 @@
   const _icon = await resolveIcon(icon, iconWidth)
 
   // TODO: review usage of list
   list && console.log(`FEAT-LIST ${req.url}`)
 
   const badge = badgen({
     labelColor,
@@ -33,8 +34,8 @@
     scale: parseFloat(scale || '1'),
   })
 
-  const cacheMaxAge = cache ? Math.max(parseInt(cache as string) || 0, 300) : sMaxAge
-  res.setHeader('Cache-Control', `public, max-age=120, s-maxage=${cacheMaxAge}, stale-while-revalidate=86400`)
+  const cacheMaxAge = resolveBadgeCacheMaxAge(cache, sMaxAge)
+  res.setHeader('Cache-Control', createBadgeCacheControlHeader(cacheMaxAge))
   res.setHeader('Content-Type', 'image/svg+xml;charset=utf-8')
   res.statusCode = code
   res.end(badge)