@meith/web 0.24.0 → 0.25.1

package/src/server/marketplace-admin.ts

@@ -1,6 +1,6 @@
 import 'server-only'
 
-import { env, logger, readPluginEnv } from '@meith/core'
+import { env, logger } from '@meith/core'
 import { getDb, PostgresMarketplaceCacheRepository } from '@meith/db'
 import {
   type CachedMarketplace,
@@ -8,8 +8,6 @@ import {
   EMPTY_CACHE,
   type InstalledEntry,
   type ListingKind,
-  type ListingStatus,
-  type MarketplaceListing,
   MEITH_VERSION,
   PLUGIN_API_MAJOR,
   refreshCatalog,
@@ -27,28 +25,6 @@ const BUILD_INFO = {
   themeApiMajor: THEME_API_MAJOR,
 }
 
-function onStockImage(): boolean {
-  return readPluginEnv('BOARD_PLUGINS_MANIFEST') !== undefined
-}
-
-const MAX_NAME_LENGTH = 120
-const MAX_DESCRIPTION_LENGTH = 500
-const MAX_LICENCE_LENGTH = 100
-const MAX_REASON_LENGTH = 300
-
-function truncate(value: string, max: number): string {
-  return value.length > max ? `${value.slice(0, max - 1)}…` : value
-}
-
-function safeHttpsUrl(value: string): string | null {
-  try {
-    const url = new URL(value)
-    return url.protocol === 'https:' ? url.toString() : null
-  } catch {
-    return null
-  }
-}
-
 export function marketplaceCacheRepository(): PostgresMarketplaceCacheRepository | null {
   return env.DATA_SOURCE === 'postgres' ? new PostgresMarketplaceCacheRepository(getDb()) : null
 }
@@ -65,45 +41,6 @@ async function readCache(): Promise<CachedMarketplace> {
   }
 }
 
-export interface MarketplaceListingRow {
-  readonly key: string
-  readonly kind: ListingKind
-  readonly name: string
-  readonly description: string
-  readonly version: string
-  readonly package: string
-  readonly licence: string
-  readonly repositoryUrl: string | null
-  readonly screenshotHrefs: readonly string[]
-  readonly status: ListingStatus
-  readonly incompatibleReason: string | null
-  readonly installedVersion: string | null
-  readonly installSteps: readonly string[] | null
-  readonly onStockImage: boolean
-}
-
-export interface MarketplaceCatalogView {
-  readonly listings: readonly MarketplaceListingRow[]
-  readonly fetchedAt: Date | null
-  readonly hasEverFetched: boolean
-  readonly unreachable: boolean
-  readonly errorMessage: string | null
-}
-
-function installSteps(kind: ListingKind, packageName: string): readonly string[] {
-  return kind === 'plugin'
-    ? [
-        `npm install ${packageName}`,
-        `community plugin:add ${packageName}`,
-        'Rebuild and redeploy for it to take effect.',
-      ]
-    : [
-        `npm install ${packageName}`,
-        'Register it in community.config.ts (and set it as defaultTheme if it should be the board default).',
-        'Rebuild and redeploy for it to take effect.',
-      ]
-}
-
 async function pluginInstalledEntries(): Promise<ReadonlyMap<string, InstalledEntry>> {
   const map = new Map<string, InstalledEntry>()
   for (const plugin of configuredPlugins()) {
@@ -116,70 +53,38 @@ async function pluginInstalledEntries(): Promise<ReadonlyMap<string, InstalledEn
 async function themeInstalledEntries(): Promise<ReadonlyMap<string, InstalledEntry>> {
   const map = new Map<string, InstalledEntry>()
   for (const theme of await themeListing()) {
-    map.set(theme.key, { enabled: theme.enabled, version: null })
+    map.set(theme.key, { enabled: theme.enabled, version: theme.version })
   }
   return map
 }
 
-function screenshotHref(listingKey: string, index: number): string {
-  return `/admin/api/marketplace/screenshot?key=${encodeURIComponent(listingKey)}&index=${index}`
-}
-
-function toRow(
-  listing: MarketplaceListing,
-  installed: InstalledEntry | null,
-): MarketplaceListingRow {
-  const { status, incompatibleReason } = computeListingStatus({ ...listing, installed }, BUILD_INFO)
-
-  return {
-    key: listing.key,
-    kind: listing.kind,
-    name: truncate(listing.name, MAX_NAME_LENGTH),
-    description: truncate(listing.description, MAX_DESCRIPTION_LENGTH),
-    version: listing.version,
-    package: listing.package,
-    licence: truncate(listing.licence, MAX_LICENCE_LENGTH),
-    repositoryUrl: safeHttpsUrl(listing.repository),
-    screenshotHrefs: listing.screenshots.map((_, index) => screenshotHref(listing.key, index)),
-    status,
-    incompatibleReason:
-      incompatibleReason === null ? null : truncate(incompatibleReason, MAX_REASON_LENGTH),
-    installedVersion: installed?.version ?? null,
-    installSteps: status === 'not-installed' ? installSteps(listing.kind, listing.package) : null,
-    onStockImage: status === 'not-installed' && onStockImage(),
-  }
+export interface MarketplaceUpdatesView {
+  readonly latestByKey: ReadonlyMap<string, string>
+  readonly fetchedAt: Date | null
+  readonly hasEverFetched: boolean
+  readonly unreachable: boolean
 }
 
-export async function marketplaceCatalog(kind: ListingKind): Promise<MarketplaceCatalogView> {
+export async function marketplaceUpdates(kind: ListingKind): Promise<MarketplaceUpdatesView> {
   const cache = await readCache()
   const installed =
     kind === 'plugin' ? await pluginInstalledEntries() : await themeInstalledEntries()
 
-  const listings = (cache.feed?.listings ?? [])
-    .filter((listing) => listing.kind === kind)
-    .map((listing) => toRow(listing, installed.get(listing.key) ?? null))
+  const latestByKey = new Map<string, string>()
+  for (const listing of cache.feed?.listings ?? []) {
+    if (listing.kind !== kind) continue
+    const entry = installed.get(listing.key)
+    if (entry === undefined) continue
+
+    const { status } = computeListingStatus({ ...listing, installed: entry }, BUILD_INFO)
+    if (status === 'update-available') latestByKey.set(listing.key, listing.version)
+  }
 
   return {
-    listings,
+    latestByKey,
     fetchedAt: cache.fetchedAt,
     hasEverFetched: cache.fetchedAt !== null,
     unreachable: cache.error !== null,
-    errorMessage: cache.error,
-  }
-}
-
-export async function marketplaceScreenshotUrl(key: string, index: number): Promise<string | null> {
-  const cache = await readCache()
-  if (cache.feed === null || cache.sourceUrl === null) return null
-
-  const listing = cache.feed.listings.find((entry) => entry.key === key)
-  const path = listing?.screenshots[index]
-  if (path === undefined) return null
-
-  try {
-    return new URL(path, cache.sourceUrl).toString()
-  } catch {
-    return null
   }
 }
 
@@ -194,7 +99,10 @@ export async function refreshMarketplaceNow(): Promise<{
   }
 
   const url = (await getSettingsUncached()).get('marketplace.feed_url')
-  const pluginEntries = await pluginInstalledEntries()
+  const [pluginEntries, themeEntries] = await Promise.all([
+    pluginInstalledEntries(),
+    themeInstalledEntries(),
+  ])
   const notifications = notificationService()
 
   const result = await refreshCatalog({
@@ -202,7 +110,7 @@ export async function refreshMarketplaceNow(): Promise<{
     repository,
     build: BUILD_INFO,
     resolveInstalled: (listing) =>
-      listing.kind === 'plugin' ? (pluginEntries.get(listing.key) ?? null) : null,
+      (listing.kind === 'plugin' ? pluginEntries : themeEntries).get(listing.key) ?? null,
     notifyUpdate: async (listing) => {
       if (notifications === null) return
       await notifications.raiseForAdministrators({
@@ -213,7 +121,7 @@ export async function refreshMarketplaceNow(): Promise<{
           package: listing.package,
           version: listing.version,
         },
-        href: '/admin/plugins/browse',
+        href: listing.kind === 'plugin' ? '/admin/plugins' : '/admin/themes',
         dedupeKey: `marketplace.update_available:${listing.key}:${listing.version}`,
       })
     },

package/src/server/theme-admin.ts

@@ -42,6 +42,7 @@ export interface ThemeAdminView {
 export interface ThemeListing {
   readonly key: string
   readonly title: string
+  readonly version: string | null
   readonly isBuildTheme: boolean
   readonly isDefault: boolean
   readonly enabled: boolean
@@ -82,6 +83,7 @@ export async function themeListing(): Promise<readonly ThemeListing[]> {
     return {
       key: theme.key,
       title: theme.title,
+      version: theme.theme?.version ?? null,
       isBuildTheme: theme.key === buildThemeKey,
       isDefault:
         claimed === undefined || byKey.get(claimed.key)?.enabled === false

package/src/server/upgrade-notice.ts

@@ -6,7 +6,7 @@ import { planUpgrade, type UpgradeState, upgradeNotice } from '@meith/upgrade'
 
 import { activeDefinitions } from './plugin-host'
 
-export const CODE_VERSION = '0.24.0'
+export const CODE_VERSION = '0.25.1'
 
 export async function pendingUpgradeNotice(): Promise<string | null> {
   if (env.DATA_SOURCE !== 'postgres') return null

package/app/admin/api/marketplace/screenshot/route.ts

@@ -1,63 +0,0 @@
-import type { NextRequest } from 'next/server'
-
-import { readCappedBody } from '@meith/marketplace'
-
-import { requireAdmin } from '@/server/admin'
-import { marketplaceScreenshotUrl } from '@/server/marketplace-admin'
-
-export const dynamic = 'force-dynamic'
-
-const TIMEOUT_MS = 10_000
-const MAX_BYTES = 5_000_000
-
-function fail(status: number, message: string): Response {
-  return new Response(message, {
-    status,
-    headers: { 'Content-Type': 'text/plain', 'Cache-Control': 'no-store' },
-  })
-}
-
-export async function GET(request: NextRequest): Promise<Response> {
-  try {
-    await requireAdmin()
-  } catch {
-    return fail(403, 'Enter the control panel and try again.')
-  }
-
-  const key = request.nextUrl.searchParams.get('key') ?? ''
-  const index = Number(request.nextUrl.searchParams.get('index') ?? '')
-  if (key === '' || !Number.isInteger(index) || index < 0) {
-    return fail(400, 'A screenshot needs a listing key and an index.')
-  }
-
-  const url = await marketplaceScreenshotUrl(key, index)
-  if (url === null) return fail(404, 'No such screenshot.')
-
-  const controller = new AbortController()
-  const timeout = setTimeout(() => controller.abort(), TIMEOUT_MS)
-
-  try {
-    const upstream = await fetch(url, {
-      signal: controller.signal,
-      headers: { accept: 'image/png' },
-      redirect: 'manual',
-    })
-    if (!upstream.ok) return fail(502, 'The catalog host did not answer with the screenshot.')
-
-    const bytes = await readCappedBody(upstream, MAX_BYTES)
-    if (bytes === null) return fail(502, 'The screenshot was larger than expected.')
-
-    return new Response(bytes.buffer as ArrayBuffer, {
-      headers: {
-        'Content-Type': 'image/png',
-        'X-Content-Type-Options': 'nosniff',
-        'Content-Security-Policy': "default-src 'none'; sandbox",
-        'Cache-Control': 'private, max-age=3600',
-      },
-    })
-  } catch {
-    return fail(502, 'Could not reach the catalog host.')
-  } finally {
-    clearTimeout(timeout)
-  }
-}

package/app/admin/plugins/browse/page.tsx

@@ -1,70 +0,0 @@
-import type { Metadata } from 'next'
-
-import { MarketplaceRefreshForm } from '@/components/admin/marketplace-forms'
-import { MarketplaceListingCard } from '@/components/admin/marketplace-listing'
-import { PANEL_NOTE } from '@/components/shell/panel-list'
-import { PanelPage } from '@/components/shell/panel-page'
-import { ViewTabs } from '@/components/shell/view-tabs'
-import { adminPageContext } from '@/server/admin'
-import { getTranslator, tr } from '@/server/i18n'
-import { marketplaceCatalog } from '@/server/marketplace-admin'
-import { marketplaceFormsCopy } from '@/view/admin-panel-copy'
-import { catalogTabs } from '@/view/marketplace-panel'
-import { formatTime } from '@/view/time'
-
-export async function generateMetadata(): Promise<Metadata> {
-  return { title: await tr('adminMarketplace.browsePluginsTitle') }
-}
-
-export default async function AdminPluginsBrowsePage() {
-  if ((await adminPageContext()) === null) return null
-
-  const t = await getTranslator()
-  const catalog = await marketplaceCatalog('plugin')
-  const copy = marketplaceFormsCopy(t)
-  const now = new Date()
-
-  return (
-    <PanelPage
-      title={t.t('adminMarketplace.browsePluginsTitle')}
-      lede={t.t('adminMarketplace.browseLede')}
-    >
-      <ViewTabs
-        label={t.t('adminMarketplace.tabsLabel')}
-        tabs={catalogTabs({
-          installedHref: '/admin/plugins',
-          browseHref: '/admin/plugins/browse',
-          current: 'browse',
-          t,
-        })}
-        aside={
-          catalog.fetchedAt !== null
-            ? t.t('adminMarketplace.lastFetched', {
-                time: formatTime(catalog.fetchedAt, now, t).label,
-              })
-            : undefined
-        }
-      />
-
-      <MarketplaceRefreshForm copy={copy} />
-
-      {catalog.unreachable && <p className={PANEL_NOTE}>{t.t('adminMarketplace.unreachable')}</p>}
-
-      {!catalog.unreachable && !catalog.hasEverFetched && (
-        <p className={PANEL_NOTE}>{t.t('adminMarketplace.neverFetched')}</p>
-      )}
-
-      {catalog.hasEverFetched && catalog.listings.length === 0 && (
-        <p className={PANEL_NOTE}>{t.t('adminMarketplace.emptyPlugins')}</p>
-      )}
-
-      {catalog.listings.length > 0 && (
-        <ul className="flex flex-col gap-4">
-          {catalog.listings.map((listing) => (
-            <MarketplaceListingCard key={listing.key} listing={listing} t={t} />
-          ))}
-        </ul>
-      )}
-    </PanelPage>
-  )
-}

package/app/admin/themes/browse/page.tsx

@@ -1,70 +0,0 @@
-import type { Metadata } from 'next'
-
-import { MarketplaceRefreshForm } from '@/components/admin/marketplace-forms'
-import { MarketplaceListingCard } from '@/components/admin/marketplace-listing'
-import { PANEL_NOTE } from '@/components/shell/panel-list'
-import { PanelPage } from '@/components/shell/panel-page'
-import { ViewTabs } from '@/components/shell/view-tabs'
-import { adminPageContext } from '@/server/admin'
-import { getTranslator, tr } from '@/server/i18n'
-import { marketplaceCatalog } from '@/server/marketplace-admin'
-import { marketplaceFormsCopy } from '@/view/admin-panel-copy'
-import { catalogTabs } from '@/view/marketplace-panel'
-import { formatTime } from '@/view/time'
-
-export async function generateMetadata(): Promise<Metadata> {
-  return { title: await tr('adminMarketplace.browseThemesTitle') }
-}
-
-export default async function AdminThemesBrowsePage() {
-  if ((await adminPageContext()) === null) return null
-
-  const t = await getTranslator()
-  const catalog = await marketplaceCatalog('theme')
-  const copy = marketplaceFormsCopy(t)
-  const now = new Date()
-
-  return (
-    <PanelPage
-      title={t.t('adminMarketplace.browseThemesTitle')}
-      lede={t.t('adminMarketplace.browseLede')}
-    >
-      <ViewTabs
-        label={t.t('adminMarketplace.tabsLabel')}
-        tabs={catalogTabs({
-          installedHref: '/admin/themes',
-          browseHref: '/admin/themes/browse',
-          current: 'browse',
-          t,
-        })}
-        aside={
-          catalog.fetchedAt !== null
-            ? t.t('adminMarketplace.lastFetched', {
-                time: formatTime(catalog.fetchedAt, now, t).label,
-              })
-            : undefined
-        }
-      />
-
-      <MarketplaceRefreshForm copy={copy} />
-
-      {catalog.unreachable && <p className={PANEL_NOTE}>{t.t('adminMarketplace.unreachable')}</p>}
-
-      {!catalog.unreachable && !catalog.hasEverFetched && (
-        <p className={PANEL_NOTE}>{t.t('adminMarketplace.neverFetched')}</p>
-      )}
-
-      {catalog.hasEverFetched && catalog.listings.length === 0 && (
-        <p className={PANEL_NOTE}>{t.t('adminMarketplace.emptyThemes')}</p>
-      )}
-
-      {catalog.listings.length > 0 && (
-        <ul className="flex flex-col gap-4">
-          {catalog.listings.map((listing) => (
-            <MarketplaceListingCard key={listing.key} listing={listing} t={t} />
-          ))}
-        </ul>
-      )}
-    </PanelPage>
-  )
-}

package/src/components/admin/marketplace-listing.tsx

@@ -1,114 +0,0 @@
-import type { Translator } from '@meith/i18n'
-import { cn } from '@meith/ui'
-
-import { PANEL_CARD } from '@/components/shell/panel-list'
-import type { MarketplaceListingRow } from '@/server/marketplace-admin'
-import { type StatusTone, statusBadge } from '@/view/marketplace-panel'
-
-const TONE_CLASS: Readonly<Record<StatusTone, string>> = {
-  active: 'bg-primary text-primary-foreground',
-  muted: 'border border-border text-muted-foreground',
-  warning: 'border border-border bg-accent text-foreground font-medium',
-  destructive: 'bg-destructive/10 text-destructive',
-}
-
-export function MarketplaceListingCard({
-  listing,
-  t,
-}: {
-  listing: MarketplaceListingRow
-  t: Translator
-}) {
-  const badge = statusBadge(listing.status, t)
-
-  return (
-    <li className={cn(PANEL_CARD, 'gap-3')}>
-      <div className="flex flex-wrap items-start justify-between gap-2">
-        <div className="flex min-w-0 flex-col gap-0.5">
-          <span className="flex flex-wrap items-center gap-2">
-            <span className="text-sm font-medium">{listing.name}</span>
-            <span className="text-xs text-muted-foreground">{listing.version}</span>
-          </span>
-          <span className="truncate font-mono text-xs text-muted-foreground">
-            {listing.key} · {listing.package}
-          </span>
-        </div>
-        <span className={cn('shrink-0 rounded-full px-2 py-0.5 text-xs', TONE_CLASS[badge.tone])}>
-          {badge.label}
-        </span>
-      </div>
-
-      {listing.screenshotHrefs.length > 0 && (
-        <div className="flex flex-wrap gap-2">
-          {listing.screenshotHrefs.map((href) => (
-            <img
-              key={href}
-              src={href}
-              alt=""
-              loading="lazy"
-              className="h-28 w-auto rounded-md border border-border object-cover"
-            />
-          ))}
-        </div>
-      )}
-
-      <p className="text-sm text-muted-foreground">{listing.description}</p>
-
-      {listing.status === 'incompatible' && listing.incompatibleReason !== null && (
-        <p className="text-sm text-destructive">{listing.incompatibleReason}</p>
-      )}
-
-      {listing.status === 'update-available' && listing.installedVersion !== null && (
-        <p className="text-xs text-muted-foreground">
-          {t.t('adminMarketplace.installedVersion', { version: listing.installedVersion })}
-        </p>
-      )}
-
-      {listing.installSteps !== null && (
-        <div className="flex flex-col gap-1.5 rounded-md border border-border bg-surface p-3 text-sm">
-          <p className="font-medium">{t.t('adminMarketplace.installSteps')}</p>
-          <ol className="flex flex-col gap-1">
-            {listing.installSteps.map((step) => (
-              <li key={step} className="text-xs">
-                {step.startsWith('npm ') || step.startsWith('community ') ? (
-                  <code className="rounded bg-muted px-1.5 py-0.5">{step}</code>
-                ) : (
-                  <span className="text-muted-foreground">{step}</span>
-                )}
-              </li>
-            ))}
-          </ol>
-          <a
-            href="https://www.meith.dev/docs/marketplace"
-            rel="noopener noreferrer"
-            className="w-fit text-xs font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
-          >
-            {t.t('adminMarketplace.installDocsLink')}
-          </a>
-          {listing.onStockImage && (
-            <a
-              href="https://www.meith.dev/docs/marketplace#moving-to-a-custom-board"
-              rel="noopener noreferrer"
-              className="w-fit text-xs font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
-            >
-              {t.t('adminMarketplace.graduationLink')}
-            </a>
-          )}
-        </div>
-      )}
-
-      <div className="flex flex-wrap items-center gap-3 text-xs text-muted-foreground">
-        <span>{listing.licence}</span>
-        {listing.repositoryUrl !== null && (
-          <a
-            href={listing.repositoryUrl}
-            rel="noopener noreferrer"
-            className="font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
-          >
-            {t.t('adminMarketplace.repository')}
-          </a>
-        )}
-      </div>
-    </li>
-  )
-}

package/src/view/marketplace-panel.ts

@@ -1,51 +0,0 @@
-import type { Translator } from '@meith/i18n'
-import type { ListingStatus } from '@meith/marketplace'
-
-import type { ViewTab } from '@/components/shell/view-tabs'
-
-export type StatusTone = 'active' | 'muted' | 'warning' | 'destructive'
-
-export interface StatusBadge {
-  readonly label: string
-  readonly tone: StatusTone
-}
-
-const STATUS_KEYS: Readonly<Record<ListingStatus, string>> = {
-  active: 'adminMarketplace.status.active',
-  'installed-disabled': 'adminMarketplace.status.installedDisabled',
-  'not-installed': 'adminMarketplace.status.notInstalled',
-  'update-available': 'adminMarketplace.status.updateAvailable',
-  incompatible: 'adminMarketplace.status.incompatible',
-}
-
-const STATUS_TONES: Readonly<Record<ListingStatus, StatusTone>> = {
-  active: 'active',
-  'installed-disabled': 'muted',
-  'not-installed': 'muted',
-  'update-available': 'warning',
-  incompatible: 'destructive',
-}
-
-export function statusBadge(status: ListingStatus, t: Translator): StatusBadge {
-  return { label: t.t(STATUS_KEYS[status]), tone: STATUS_TONES[status] }
-}
-
-export function catalogTabs(input: {
-  readonly installedHref: string
-  readonly browseHref: string
-  readonly current: 'installed' | 'browse'
-  readonly t: Translator
-}): readonly ViewTab[] {
-  return [
-    {
-      href: input.installedHref,
-      label: input.t.t('adminMarketplace.tab.installed'),
-      isCurrent: input.current === 'installed',
-    },
-    {
-      href: input.browseHref,
-      label: input.t.t('adminMarketplace.tab.browse'),
-      isCurrent: input.current === 'browse',
-    },
-  ]
-}