@meith/web 0.16.0

package/src/view/admin-nav.ts

@@ -0,0 +1,164 @@
+import type { Translator } from '@meith/i18n'
+
+import {
+  currentProps,
+  deepestHrefIn,
+  isUnder,
+  type PanelNav,
+  type PanelSection,
+  type PanelSubsection,
+  sectionHrefIn,
+} from './panel-nav'
+import { SETTING_GROUP_NAV } from './setting-groups'
+import { untranslated } from './time'
+
+export type {
+  PanelSection as AdminSection,
+  PanelSubsection as AdminSubsection,
+} from './panel-nav'
+export { currentProps, isUnder }
+
+export const ADMIN_OVERVIEW: PanelSection = {
+  href: '/admin',
+  titleKey: 'adminNav.admin.title',
+  icon: 'overview',
+  blurbKey: 'adminNav.admin.blurb',
+}
+
+export const ADMIN_SECTIONS: PanelNav = [
+  {
+    href: '/admin/settings',
+    titleKey: 'adminNav.admin-settings.title',
+    icon: 'settings',
+    blurbKey: 'adminNav.admin-settings.blurb',
+    children: SETTING_GROUP_NAV,
+  },
+  {
+    href: '/admin/forums',
+    titleKey: 'adminNav.admin-forums.title',
+    icon: 'forums',
+    blurbKey: 'adminNav.admin-forums.blurb',
+  },
+  {
+    href: '/admin/groups',
+    titleKey: 'adminNav.admin-groups.title',
+    icon: 'groups',
+    blurbKey: 'adminNav.admin-groups.blurb',
+    children: [
+      { href: '/admin/groups/promotions', titleKey: 'adminNav.admin-groups-promotions.title' },
+      { href: '/admin/groups/memberships', titleKey: 'adminNav.admin-groups-memberships.title' },
+    ],
+  },
+  {
+    href: '/admin/users',
+    titleKey: 'adminNav.admin-users.title',
+    icon: 'users',
+    blurbKey: 'adminNav.admin-users.blurb',
+    children: [
+      { href: '/admin/users/mail', titleKey: 'adminNav.admin-users-mail.title' },
+      { href: '/admin/users/prune', titleKey: 'adminNav.admin-users-prune.title' },
+    ],
+  },
+  {
+    href: '/admin/content',
+    titleKey: 'adminNav.admin-content.title',
+    icon: 'content',
+    blurbKey: 'adminNav.admin-content.blurb',
+    children: [
+      {
+        href: '/admin/content/announcements',
+        titleKey: 'adminNav.admin-content-announcements.title',
+      },
+      { href: '/admin/content/attachments', titleKey: 'adminNav.admin-content-attachments.title' },
+      {
+        href: '/admin/content/navigation',
+        titleKey: 'adminNav.admin-content-navigation.title',
+      },
+    ],
+  },
+  {
+    href: '/admin/antispam',
+    titleKey: 'adminNav.admin-antispam.title',
+    icon: 'antispam',
+    blurbKey: 'adminNav.admin-antispam.blurb',
+  },
+  {
+    href: '/admin/themes',
+    titleKey: 'adminNav.admin-themes.title',
+    icon: 'themes',
+    blurbKey: 'adminNav.admin-themes.blurb',
+  },
+  {
+    href: '/admin/plugins',
+    titleKey: 'adminNav.admin-plugins.title',
+    icon: 'plugins',
+    blurbKey: 'adminNav.admin-plugins.blurb',
+  },
+  {
+    href: '/admin/api-tokens',
+    titleKey: 'adminNav.admin-api-tokens.title',
+    icon: 'tokens',
+    blurbKey: 'adminNav.admin-api-tokens.blurb',
+  },
+  {
+    href: '/admin/system',
+    titleKey: 'adminNav.admin-system.title',
+    icon: 'system',
+    blurbKey: 'adminNav.admin-system.blurb',
+  },
+  {
+    href: '/admin/log',
+    titleKey: 'adminNav.admin-log.title',
+    icon: 'log',
+    blurbKey: 'adminNav.admin-log.blurb',
+  },
+  {
+    href: '/admin/security',
+    titleKey: 'adminNav.admin-security.title',
+    icon: 'log',
+    blurbKey: 'adminNav.admin-security.blurb',
+  },
+]
+
+export const ADMIN_NAV: PanelNav = [ADMIN_OVERVIEW, ...ADMIN_SECTIONS]
+
+export const ADMIN_PLUGINS_HREF = '/admin/plugins'
+
+const PLUGIN_KEY_PATTERN = /^\/admin\/plugins\/([a-z][a-z0-9-]*)(?:\/|$|\?)/
+
+export function pluginKeyAt(pathname: string): string | null {
+  return PLUGIN_KEY_PATTERN.exec(pathname)?.[1] ?? null
+}
+
+export interface PluginNavSection {
+  readonly key: string
+  readonly name: string
+  readonly pages: readonly PanelSubsection[]
+}
+
+export function adminNavWithPlugin(
+  plugin: PluginNavSection | null,
+  t: Translator = untranslated(),
+): PanelNav {
+  if (plugin === null || plugin.pages.length === 0) return ADMIN_NAV
+
+  const section: PanelSection = {
+    href: `${ADMIN_PLUGINS_HREF}/${plugin.key}`,
+    titleText: plugin.name,
+    icon: 'plugins',
+    blurbText: t.t('adminNav.plugin.blurb', { name: plugin.name }),
+    children: plugin.pages,
+  }
+
+  const at = ADMIN_NAV.findIndex((entry) => entry.href === ADMIN_PLUGINS_HREF)
+
+  return [...ADMIN_NAV.slice(0, at + 1), section, ...ADMIN_NAV.slice(at + 1)]
+}
+
+export function activeSectionHref(pathname: string, nav: PanelNav = ADMIN_NAV): string {
+  return sectionHrefIn(nav, pathname) ?? ADMIN_OVERVIEW.href
+}
+
+export function deepestNavHref(pathname: string, nav: PanelNav = ADMIN_NAV): string {
+  return deepestHrefIn(nav, pathname) ?? ADMIN_OVERVIEW.href
+}

package/src/view/admin-navigation-copy.ts

@@ -0,0 +1,58 @@
+import type { Translator } from '@meith/i18n'
+
+import { adminSharedCopy } from './admin-copy'
+import { copyFor, patternCopy } from './copy'
+import { NAVIGATION_AUDIENCE_MESSAGE_KEYS } from './navigation'
+import { untranslated } from './time'
+
+export function navigationAdminCopy(
+  t: Translator = untranslated(),
+): Readonly<Record<string, string>> {
+  return {
+    ...adminSharedCopy(t),
+    ...copyFor(
+      [
+        'adminContent.save',
+        'adminContent.add',
+        'adminContent.added',
+        'adminNavigation.label',
+        'adminNavigation.labelHint',
+        'adminNavigation.address',
+        'adminNavigation.addressHint',
+        'adminNavigation.inside',
+        'adminNavigation.topLevel',
+        'adminNavigation.audience',
+        'adminNavigation.groups',
+        'adminNavigation.groupsHint',
+        'adminNavigation.newTab',
+        'adminNavigation.shown',
+        'adminNavigation.removeThis',
+        'adminNavigation.builtIn',
+        'adminNavigation.custom',
+        'adminNavigation.hidden',
+        'adminNavigation.tree.heading',
+        'adminNavigation.tree.dragHint',
+        'adminNavigation.tree.arrowsHint',
+        'adminNavigation.tree.help',
+        'adminNavigation.tree.where.topLevel',
+        'adminNavigation.tree.order.first',
+        ...Object.values(NAVIGATION_AUDIENCE_MESSAGE_KEYS),
+      ],
+      t,
+    ),
+    ...patternCopy(
+      [
+        'adminNavigation.tree.edit',
+        'adminNavigation.tree.moveHandle',
+        'adminNavigation.tree.placed',
+        'adminNavigation.tree.where.under',
+        'adminNavigation.tree.order.after',
+        'adminNavigation.tree.nudge.up',
+        'adminNavigation.tree.nudge.down',
+        'adminNavigation.tree.nudge.in',
+        'adminNavigation.tree.nudge.out',
+      ],
+      t,
+    ),
+  }
+}

package/src/view/admin-panel-copy.ts

@@ -0,0 +1,194 @@
+import type { Translator } from '@meith/i18n'
+
+import { adminSharedCopy } from './admin-copy'
+import { copyFor, patternCopy, splitAround } from './copy'
+import { untranslated } from './time'
+
+export function adminFormsCopy(t: Translator = untranslated()): Readonly<Record<string, string>> {
+  return {
+    ...copyFor(
+      [
+        'adminPanel.title',
+        'adminPanel.reason.reauth',
+        'adminPanel.reason.expired',
+        'adminPanel.reason.default',
+        'adminPanel.password',
+        'adminPanel.twoFactorCode',
+        'adminPanel.twoFactorCodeHint',
+        'adminPanel.enter',
+        'adminPanel.leave',
+      ],
+      t,
+    ),
+    ...patternCopy(['adminPanel.idleNote'], t),
+  }
+}
+
+export function apiTokenFormsCopy(
+  t: Translator = untranslated(),
+): Readonly<Record<string, string>> {
+  return copyFor(
+    [
+      'adminPanel.token.copyNow',
+      'adminPanel.token.name',
+      'adminPanel.token.namePlaceholder',
+      'adminPanel.token.nameHint',
+      'adminPanel.token.scopes',
+      'adminPanel.token.scopesHint',
+      'adminPanel.token.expiresInDays',
+      'adminPanel.token.expiresPlaceholder',
+      'adminPanel.token.expiresHint',
+      'adminPanel.token.issue',
+      'adminPanel.token.revoke',
+    ],
+    t,
+  )
+}
+
+export function systemFormsCopy(t: Translator = untranslated()): Readonly<Record<string, string>> {
+  return {
+    ...copyFor(
+      [
+        'adminPanel.system.pruneTokens',
+        'adminPanel.system.recountRun',
+        'adminPanel.system.clearNote',
+        'adminPanel.system.clearForumTree',
+        'adminPanel.system.retried',
+        'adminPanel.system.jobId',
+        'adminPanel.system.jobIdHint',
+        'adminPanel.system.retry',
+        'adminPanel.system.nothingToIndex',
+      ],
+      t,
+    ),
+    ...patternCopy(
+      [
+        'adminPanel.system.sessionsRemoved',
+        'adminPanel.system.tokensRemoved',
+        'adminPanel.system.pruneSessions',
+        'adminPanel.system.recountResult',
+        'adminPanel.system.cleared',
+        'adminPanel.system.indexFinished',
+        'adminPanel.system.indexMore',
+        'adminPanel.system.indexNext',
+      ],
+      t,
+    ),
+  }
+}
+
+export function pluginFormsCopy(t: Translator = untranslated()): Readonly<Record<string, string>> {
+  const [envInertLead, envInertTail] = splitAround(t, 'adminPanel.plugin.envInert', 'name')
+  const [envOverridesLead, envOverridesTail] = splitAround(
+    t,
+    'adminPanel.plugin.envOverrides',
+    'name',
+  )
+  return {
+    ...copyFor(
+      [
+        'adminPanel.plugin.enable',
+        'adminPanel.plugin.disable',
+        'adminPanel.plugin.saved',
+        'adminPanel.plugin.secretFromEnvPlaceholder',
+        'adminPanel.plugin.secretSetPlaceholder',
+        'adminPanel.plugin.secretNotSetPlaceholder',
+        'adminPanel.plugin.on',
+        'adminPanel.plugin.off',
+        'adminPanel.plugin.empty',
+        'adminPanel.plugin.advanced',
+        'adminPanel.plugin.save',
+        'adminPanel.plugin.clearFailures',
+      ],
+      t,
+    ),
+    ...patternCopy(['adminPanel.plugin.shipsAs'], t),
+    'adminPanel.plugin.envInertLead': envInertLead,
+    'adminPanel.plugin.envInertTail': envInertTail,
+    'adminPanel.plugin.envOverridesLead': envOverridesLead,
+    'adminPanel.plugin.envOverridesTail': envOverridesTail,
+  }
+}
+
+export function settingsFormCopy(t: Translator = untranslated()): Readonly<Record<string, string>> {
+  return copyFor(
+    [
+      'adminPanel.setting.unchangedPlaceholder',
+      'adminPanel.setting.clearStored',
+      'adminPanel.setting.noMatches',
+      'adminPanel.setting.saved',
+      'adminPanel.setting.unchanged',
+      'adminPanel.setting.advanced',
+      'adminPanel.setting.changed',
+      'adminPanel.setting.save',
+    ],
+    t,
+  )
+}
+
+export function mailTestCardCopy(t: Translator = untranslated()): Readonly<Record<string, string>> {
+  const [driverOverridesLead, driverOverridesTail] = splitAround(
+    t,
+    'adminPanel.mail.driverOverrides',
+    'name',
+  )
+  const [driverUntilUnsetLead, driverUntilUnsetTail] = splitAround(
+    t,
+    'adminPanel.mail.driverUntilUnset',
+    'name',
+  )
+  const [testNoteLead, testNoteTail] = splitAround(t, 'adminPanel.mail.testNote', 'saved')
+  return {
+    ...copyFor(
+      [
+        'adminPanel.mail.title',
+        'adminPanel.mail.reachesNobody',
+        'adminPanel.mail.sending',
+        'adminPanel.mail.send',
+        'adminPanel.mail.testNoteSaved',
+      ],
+      t,
+    ),
+    'adminPanel.mail.driverOverridesLead': driverOverridesLead,
+    'adminPanel.mail.driverOverridesTail': driverOverridesTail,
+    'adminPanel.mail.driverUntilUnsetLead': driverUntilUnsetLead,
+    'adminPanel.mail.driverUntilUnsetTail': driverUntilUnsetTail,
+    'adminPanel.mail.testNoteLead': testNoteLead,
+    'adminPanel.mail.testNoteTail': testNoteTail,
+  }
+}
+
+export function brandingFormsCopy(
+  t: Translator = untranslated(),
+): Readonly<Record<string, string>> {
+  return {
+    ...adminSharedCopy(t),
+    ...copyFor(
+      [
+        'adminPanel.branding.saved',
+        'adminPanel.branding.removed',
+        'adminPanel.branding.nothing',
+        'adminPanel.branding.upload',
+      ],
+      t,
+    ),
+    ...patternCopy(['adminPanel.branding.formats'], t),
+  }
+}
+
+export function badgeFormsCopy(t: Translator = untranslated()): Readonly<Record<string, string>> {
+  return {
+    ...adminSharedCopy(t),
+    ...copyFor(
+      ['adminPanel.badge.removed', 'adminPanel.badge.noBadge', 'adminPanel.badge.upload'],
+      t,
+    ),
+    ...patternCopy(['adminPanel.badge.labelSr', 'adminPanel.badge.formats'], t),
+  }
+}
+
+export function marketplaceFormsCopy(
+  t: Translator = untranslated(),
+): Readonly<Record<string, string>> {
+  return copyFor(['adminPanel.marketplace.refresh', 'adminPanel.marketplace.refreshed'], t)
+}

package/src/view/admin-settings.ts

@@ -0,0 +1,173 @@
+import type { Translator } from '@meith/i18n'
+import {
+  SETTING_DEFINITIONS,
+  type SettingDefinition,
+  type SettingField,
+  type SettingGroup,
+  type SettingsSnapshot,
+  secretClearField,
+  settingField,
+} from '@meith/settings'
+
+import { GROUP_LABELS, GROUP_ORDER } from './setting-groups'
+import { untranslated } from './time'
+
+export { DEFAULT_SETTING_GROUP, SETTING_GROUP_NAV } from './setting-groups'
+
+export interface SettingFieldModel {
+  readonly key: string
+  readonly label: string
+  readonly description: string
+  readonly field: SettingField
+  readonly value: string
+  readonly checked: boolean
+  readonly isDefault: boolean
+  readonly advanced: boolean
+  readonly clearName: string | null
+}
+
+export interface SettingGroupModel {
+  readonly group: SettingGroup
+  readonly label: string
+  readonly settings: readonly SettingFieldModel[]
+}
+
+export interface AdminSettingsModel {
+  readonly groups: readonly SettingGroupModel[]
+  readonly tabs: readonly { readonly group: SettingGroup; readonly label: string }[]
+  readonly query: string
+  readonly activeGroup: SettingGroup | null
+  readonly showAdvanced: boolean
+  readonly hiddenAdvanced: number
+  readonly total: number
+}
+
+function matches(definition: SettingDefinition, copy: SettingCopy, query: string): boolean {
+  if (query === '') return true
+  const needle = query.toLowerCase()
+  return (
+    definition.key.toLowerCase().includes(needle) ||
+    copy.label.toLowerCase().includes(needle) ||
+    copy.description.toLowerCase().includes(needle)
+  )
+}
+
+interface SettingCopy {
+  readonly label: string
+  readonly description: string
+}
+
+export function settingCopy(definition: SettingDefinition, translator: Translator): SettingCopy {
+  const label = `setting.${definition.key}.label`
+  const description = `setting.${definition.key}.description`
+
+  return {
+    label: translator.has(label) ? translator.t(label) : definition.label,
+    description: translator.has(description) ? translator.t(description) : definition.description,
+  }
+}
+
+export function settingGroupLabel(group: SettingGroup, translator: Translator): string {
+  const key = `setting.group.${group}`
+  return translator.has(key) ? translator.t(key) : GROUP_LABELS[group]
+}
+
+function settingFieldCopy(definition: SettingDefinition, translator: Translator): SettingField {
+  const field = settingField(definition)
+  if (field.kind !== 'select') return field
+
+  return {
+    ...field,
+    options: field.options.map((option) => {
+      const key = `setting.${definition.key}.option.${option.value}`
+      return translator.has(key) ? { ...option, label: translator.t(key) } : option
+    }),
+  }
+}
+
+function formValue(definition: SettingDefinition, current: unknown): string {
+  if (definition.secret === true) return ''
+  if (typeof current === 'boolean') return current ? '1' : ''
+  return String(current ?? '')
+}
+
+export function buildAdminSettingsModel(input: {
+  readonly snapshot: SettingsSnapshot
+  readonly query?: string | undefined
+  readonly group?: string | undefined
+  readonly advanced?: boolean | undefined
+  readonly t?: Translator | undefined
+}): AdminSettingsModel {
+  const translator = input.t ?? untranslated()
+  const query = (input.query ?? '').trim()
+  const showAdvanced = input.advanced === true
+  const searching = query !== ''
+
+  const requested = GROUP_ORDER.find((group) => group === input.group)
+  const activeGroup = searching ? null : (requested ?? GROUP_ORDER[0]!)
+
+  let hiddenAdvanced = 0
+  const groups: SettingGroupModel[] = []
+
+  for (const group of GROUP_ORDER) {
+    if (activeGroup !== null && group !== activeGroup) continue
+
+    const settings: SettingFieldModel[] = []
+    for (const definition of SETTING_DEFINITIONS) {
+      if (definition.group !== group) continue
+      const copy = settingCopy(definition, translator)
+      if (!matches(definition, copy, query)) continue
+
+      if (definition.ui?.managed === true) continue
+
+      const advanced = definition.ui?.advanced === true
+      if (advanced && !showAdvanced) {
+        hiddenAdvanced += 1
+        continue
+      }
+
+      const current = input.snapshot.get(definition.key as never) as unknown
+      const isDefault = Object.is(current, definition.default)
+      settings.push({
+        key: definition.key,
+        label: copy.label,
+        description: copy.description,
+        field: settingFieldCopy(definition, translator),
+        value: formValue(definition, current),
+        checked: current === true,
+        isDefault,
+        advanced,
+        clearName:
+          definition.secret === true && !isDefault ? secretClearField(definition.key) : null,
+      })
+    }
+
+    if (settings.length > 0) {
+      groups.push({ group, label: settingGroupLabel(group, translator), settings })
+    }
+  }
+
+  return {
+    groups,
+    tabs: GROUP_ORDER.map((group) => ({ group, label: settingGroupLabel(group, translator) })),
+    query,
+    activeGroup,
+    showAdvanced,
+    hiddenAdvanced,
+    total: groups.reduce((count, group) => count + group.settings.length, 0),
+  }
+}
+
+export function settingsHref(input: {
+  readonly group?: SettingGroup | null
+  readonly query?: string
+  readonly advanced?: boolean
+}): string {
+  const params = new URLSearchParams()
+  if (input.query !== undefined && input.query !== '') params.set('q', input.query)
+  else if (input.group != null) params.set('group', input.group)
+  if (input.advanced === true) params.set('advanced', '1')
+
+  const search = params.toString()
+  return search === '' ? '/admin/settings' : `/admin/settings?${search}`
+}