lots of fixes

fresh.gen.ts

@@ -4,6 +4,7 @@
 
 import * as $_404 from './routes/_404.tsx'
 import * as $_app from './routes/_app.tsx'
+import * as $api_agents from './routes/api/agents.ts'
 import * as $index from './routes/index.tsx'
 
 import type { Manifest } from '$fresh/server.ts'
@@ -12,6 +13,7 @@ const manifest = {
   routes: {
     './routes/_404.tsx': $_404,
     './routes/_app.tsx': $_app,
+    './routes/api/agents.ts': $api_agents,
     './routes/index.tsx': $index,
   },
   islands: {},

lib/agent.ts

@@ -22,6 +22,7 @@ const BROWSER_NAME_AGENT_KEYS: Record<string, AgentLiteKey> = {
 }
 
 export type AgentRelease = {
+  ok: boolean
   name: string
   version: MajorVersionStr
   userAgent?: UserAgent | null
@@ -41,6 +42,7 @@ export const getAgentReleaseInfo = (ua: string): AgentRelease => {
 
   if (!name || !version) {
     return {
+      ok: false,
       name: 'Unknown',
       userAgent,
       version: '0',
@@ -57,11 +59,19 @@ export const getAgentReleaseInfo = (ua: string): AgentRelease => {
     .filter(([_, date]) => date !== null)
     .sort(([versionA], [versionB]) => parseFloat(versionB) - parseFloat(versionA))[0]
 
+  const sortedVersions = Object.entries(agentStats.usage_global)
+    .filter(([_, usage]) => usage > 0)
+    .sort(([, usageA], [, usageB]) => usageB - usageA)
+
+  console.dir(sortedVersions)
+
   const versionRank = Object.entries(agentStats.usage_global)
+    .filter(([_, usage]) => usage > 0)
     .sort(([, usageA], [, usageB]) => usageB - usageA)
     .findIndex(([v]) => v === version) + 1
 
   return {
+    ok: true,
     name,
     version,
     userAgent,

lib/family.ts

@@ -0,0 +1,59 @@
+import type { Browser, Device } from '$std/http/user_agent.ts'
+import usage from './usage.ts'
+
+const BROWSER_FAMILIES: Record<string, string> = {
+  'Chrome': 'Chrome',
+  'Mobile Chrome': 'Chrome',
+  'DuckDuckGo': 'Chrome',
+
+  'Firefox': 'Firefox',
+  'Mobile Firefox': 'Firefox',
+
+  'Safari': 'Safari',
+  'Mobile Safari': 'Safari',
+
+  'IE': 'IE',
+  'Edge': 'Edge',
+
+  'Opera': 'Opera',
+  'Opera Mini': 'Opera Mini',
+
+  'QQ Browser': 'QQ Browser',
+  'UC': 'UC Browser',
+  'Samsung Internet': 'Samsung Internet',
+}
+
+export const getFamilyName = (name: string): string => BROWSER_FAMILIES[name]
+
+// https://github.com/denoland/std/pull/6129
+type FixedDeviceType = Device['type'] | 'tablet' | 'smarttv'
+
+export const getGlobalUsageStats = (browser: Browser, device: Device): number => {
+  if (browser?.name === undefined || browser.name === 'Unknown') return 0
+
+  const usageKey = getFamilyName(browser.name)
+
+  switch (device.type as FixedDeviceType) {
+    case undefined:
+      return usage.ww.desktop[usageKey] ?? 0
+    case 'mobile':
+      return usage.ww.mobile[usageKey] ?? 0
+    default:
+      return 0
+  }
+}
+
+export const getNorthAmericaUsageStats = (browser: Browser, device: Device): number => {
+  if (browser?.name === undefined || browser.name === 'Unknown') return 0
+
+  const usageKey = getFamilyName(browser.name)
+
+  switch (device.type as FixedDeviceType) {
+    case undefined:
+      return usage.na.desktop[usageKey] ?? 0
+    case 'mobile':
+      return usage.na.mobile[usageKey] ?? 0
+    default:
+      return 0
+  }
+}

lib/usage.ts

@@ -0,0 +1,85 @@
+type RegionalDeviceStatProps = {
+  asOf: string
+  ww: { desktop: Record<string, number>; mobile: Record<string, number> }
+  na: { desktop: Record<string, number>; mobile: Record<string, number> }
+}
+const UsageStats: RegionalDeviceStatProps = {
+  asOf: '2024-10-20T03:16:59.483Z',
+  ww: {
+    desktop: {
+      'Chrome': 64.95,
+      'Edge': 13.75,
+      'Safari': 9.13,
+      'Firefox': 6.5,
+      'Opera': 3.07,
+      '360 Safe Browser': 0.95,
+      'Yandex Browser': 0.53,
+      'IE': 0.38,
+      'QQ Browser': 0.23,
+      'Coc Coc': 0.12,
+      'Sogou Explorer': 0.1,
+      'Mozilla': 0.09,
+      'Whale Browser': 0.08,
+      'Edge Legacy': 0.05,
+      'UC Browser': 0.02,
+      'Chromium': 0.01,
+      'Other': 0.05,
+    },
+    mobile: {
+      'Chrome': 67.1,
+      'Safari': 23.04,
+      'Samsung Internet': 3.8,
+      'Opera': 1.84,
+      'UC Browser': 1.77,
+      'Firefox': 0.53,
+      'Edge': 0.45,
+      'QQ Browser': 0.42,
+      'Android': 0.36,
+      'Yandex Browser': 0.27,
+      'Whale Browser': 0.14,
+      'Coc Coc': 0.08,
+      'Instabridge': 0.05,
+      'KaiOS': 0.04,
+      'Ecosia': 0.03,
+      'Puffin': 0.03,
+      'Unknown': 0.02,
+      'Phoenix': 0.01,
+      'Other': 0.02,
+    },
+  },
+  na: {
+    desktop: {
+      'Chrome': 59.72,
+      'Safari': 15.48,
+      'Edge': 15.26,
+      'Firefox': 7.2,
+      'Opera': 1.64,
+      'IE': 0.24,
+      'Mozilla': 0.23,
+      'Yandex Browser': 0.06,
+      '360 Safe Browser': 0.05,
+      'Edge Legacy': 0.04,
+      'SeaMonkey': 0.02,
+      'QQ Browser': 0.01,
+      'Pale Moon': 0.01,
+      'Chromium': 0.01,
+      'Other': 0.04,
+    },
+    mobile: {
+      'Chrome': 48.58,
+      'Safari': 45.96,
+      'Samsung Internet': 3.04,
+      'Firefox': 1,
+      'Opera': 0.51,
+      'Edge': 0.43,
+      'UC Browser': 0.13,
+      'Android': 0.13,
+      'Yandex Browser': 0.07,
+      'Unknown': 0.04,
+      'QQ Browser': 0.04,
+      'Ecosia': 0.02,
+      'Other': 0.05,
+    },
+  },
+}
+export default UsageStats

lib/utils.ts

@@ -3,3 +3,39 @@ export const epochToDate = (epoch: number): Date => new Date(epoch * 1000)
 
 // Count the number of occurrences of a character in a string
 export const countLiterals = (str: string, char: string): number => str.split(char).length - 1
+
+// Grab the YYY-MM-DD part of a date
+export const toISODate = (date: Date) => date.toISOString().split('T')[0]
+
+export const formatDateYearMonth = (date: Date) => {
+  return date.toLocaleDateString('en-US', { year: 'numeric', month: 'long' })
+}
+
+export const andJoin = (arr: string[]) => {
+  if (arr.length === 0) return ''
+  if (arr.length === 1) return arr[0]
+  if (arr.length === 2) return arr.join(' and ')
+  return arr.slice(0, -1).join(', ') + ', and ' + arr.slice(-1)[0]
+}
+
+export const humanizedTimeSince = (on: Date | undefined | null): string | null => {
+  if (!on) return null
+
+  const now = new Date()
+  const years = now.getFullYear() - on.getFullYear()
+  const months = now.getMonth() - on.getMonth()
+
+  const adjustedMonths = months < 0 ? months + 12 : months
+  const adjustedYears = months < 0 ? years - 1 : years
+
+  const parts = []
+  if (adjustedYears > 0) parts.push(`${adjustedYears} year${adjustedYears > 1 ? 's' : ''}`)
+  if (adjustedMonths > 0) parts.push(`${adjustedMonths} month${adjustedMonths > 1 ? 's' : ''}`)
+
+  return andJoin(parts) + ' ago'
+}
+
+export const randInterjection = () => {
+  const suffixes = ['Sweet', 'Nice', 'Cool', 'Awesome', 'Rad', 'Neat', 'Groovy', 'Dope', 'Tight', 'Sick', 'Wicked', 'Lit', 'Fire']
+  return suffixes[Math.floor(Math.random() * suffixes.length)]
+}

routes/api/agents.ts

@@ -0,0 +1,12 @@
+import type { FreshContext } from '$fresh/server.ts'
+import { getAgentReleaseInfo } from '../../lib/agent.ts'
+
+export const handler = (req: Request, _ctx: FreshContext) => {
+  const userAgent = req.headers.get('user-agent') || 'Unknown'
+
+  const body = getAgentReleaseInfo(userAgent)
+
+  return new Response(JSON.stringify(body), {
+    headers: { 'Content-Type': 'application/json' },
+  })
+}