@meith/plugin-awards 0.37.0

package/src/ui/page.tsx

@@ -0,0 +1,217 @@
+import type {
+  PluginPageContext,
+  PluginRegionContext,
+  PluginRuntimeContext,
+} from '@meith/plugin-kit'
+import { surfaceVariants, textLinkVariants } from '@meith/ui'
+
+import { asId, postbitLimit } from '../awards'
+import { cachedAwards } from '../display-cache'
+import { allAwards, awardById, awardRules, type GrantRow, memberGrants } from '../store'
+import { ruleSummary } from './rules'
+import { date, icon, type TextContext, translated } from './shared'
+
+export async function AwardsPage(context: PluginPageContext) {
+  const awards = await allAwards(context.data, true)
+  const rules = await awardRules(context.data, true)
+  return (
+    <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+      {awards.length === 0 && <p>{translated(context, 'awards.empty')}</p>}
+      {awards.map((award) => (
+        <article
+          key={award.id}
+          className={surfaceVariants({ padded: true, className: 'flex flex-col gap-3' })}
+        >
+          <div className="flex items-center gap-3">
+            {icon(award)}
+            <h2 className="font-semibold">
+              <a href={`/plugins/awards/award?id=${award.id}`} className={textLinkVariants()}>
+                {award.name}
+              </a>
+            </h2>
+          </div>
+          <p className="whitespace-pre-wrap text-sm">{award.description}</p>
+          <p className="text-sm text-muted-foreground">
+            {translated(context, 'awards.holders')}: {award.count}
+          </p>
+          <div className="text-sm">
+            {rules.some((rule) => rule.awardId === Number(award.id)) ? (
+              rules
+                .filter((rule) => rule.awardId === Number(award.id))
+                .map((rule) => <p key={rule.id}>{ruleSummary(context, rule)}</p>)
+            ) : (
+              <p>{translated(context, 'awards.staff')}</p>
+            )}
+          </div>
+        </article>
+      ))}
+    </div>
+  )
+}
+
+export async function AwardPage(context: PluginPageContext) {
+  const id = asId(context.query.id)
+  const award = id === null ? null : await awardById(context.data, id)
+  if (award === null || award.archived_at !== null)
+    return <p>{translated(context, 'awards.notice.missing')}</p>
+  const page = Math.min(asId(context.query.page) ?? 1, 1_000_000)
+  const holders = await context.data.query<{
+    user_id: number
+    count: number
+    granted_at: string | Date
+  }>(
+    `select user_id, count(*)::int as count, max(granted_at) as granted_at
+    from plugin_awards_grant where award_id = $1 group by user_id
+    order by max(granted_at) desc, user_id limit 51 offset $2`,
+    [id, (page - 1) * 50],
+  )
+  const visible = holders.slice(0, 50)
+  const members = await context.users.standing(visible.map((holder) => Number(holder.user_id)))
+  const names = new Map(members.map((member) => [member.userId, member.username]))
+  return (
+    <section className={surfaceVariants({ padded: true, className: 'flex flex-col gap-4' })}>
+      <div className="flex items-center gap-3">
+        {icon(award)}
+        <h2 className="text-lg font-semibold">{award.name}</h2>
+      </div>
+      <p className="whitespace-pre-wrap">{award.description}</p>
+      <h3 className="font-semibold">{translated(context, 'awards.holders')}</h3>
+      <ul className="flex flex-col gap-2">
+        {visible.map((holder) => (
+          <li key={holder.user_id} className="flex flex-wrap gap-3">
+            <a className={textLinkVariants()} href={`/plugins/awards/member?id=${holder.user_id}`}>
+              {names.get(Number(holder.user_id)) ?? translated(context, 'awards.deletedMember')}
+            </a>
+            <span>×{holder.count}</span>
+            <span>{date(context, holder.granted_at)}</span>
+          </li>
+        ))}
+      </ul>
+      <nav className="flex gap-4" aria-label={translated(context, 'awards.pagination')}>
+        {page > 1 && (
+          <a
+            href={`/plugins/awards/award?id=${id}&page=${page - 1}`}
+            className={textLinkVariants()}
+          >
+            {translated(context, 'awards.previous')}
+          </a>
+        )}
+        {holders.length > 50 && (
+          <a
+            href={`/plugins/awards/award?id=${id}&page=${page + 1}`}
+            className={textLinkVariants()}
+          >
+            {translated(context, 'awards.next')}
+          </a>
+        )}
+      </nav>
+    </section>
+  )
+}
+
+export async function memberList(context: TextContext & PluginRuntimeContext, userId: number) {
+  const grants = await memberGrants(context.data, userId)
+  const grouped = new Map<number, GrantRow[]>()
+  for (const grant of grants) {
+    const items = grouped.get(Number(grant.id)) ?? []
+    items.push(grant)
+    grouped.set(Number(grant.id), items)
+  }
+  return (
+    <ul className="flex flex-col gap-4">
+      {[...grouped].map(([id, items]) => {
+        const award = items[0]!
+        return (
+          <li key={id} className="flex gap-3">
+            {icon(award)}
+            <div>
+              <a className={textLinkVariants()} href={`/plugins/awards/award?id=${id}`}>
+                {award.name}
+              </a>
+              <span> ×{items.length}</span>
+              <ul className="text-sm text-muted-foreground">
+                {items.map((grant) => (
+                  <li key={grant.grant_id}>
+                    <time dateTime={new Date(grant.granted_at).toISOString()}>
+                      {date(context, grant.granted_at)}
+                    </time>
+                    {context.settings.show_reasons !== false &&
+                      grant.rule_id === null &&
+                      grant.reason !== '' && <span> · {grant.reason}</span>}
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </li>
+        )
+      })}
+      {grants.length === 0 && <li>{translated(context, 'awards.member.empty')}</li>}
+    </ul>
+  )
+}
+
+export async function MemberPage(context: PluginPageContext) {
+  const id = asId(context.query.id)
+  const member = id === null ? undefined : (await context.users.standing([id]))[0]
+  if (member === undefined) return <p>{translated(context, 'awards.notice.unknown')}</p>
+  return (
+    <section className={surfaceVariants({ padded: true, className: 'flex flex-col gap-4' })}>
+      <h2 className="font-semibold">
+        <a href={`/member/${member.userId}`} className={textLinkVariants()}>
+          {member.username}
+        </a>
+      </h2>
+      {await memberList(context, member.userId)}
+    </section>
+  )
+}
+
+export async function PostbitBadges(context: PluginRegionContext) {
+  if (context.authorId === null) return null
+  const runtime = await context.runtime()
+  const limit = postbitLimit(runtime.settings)
+  if (limit === 0) return null
+  const awards = await cachedAwards(runtime.data, context.authorId, limit)
+  const more = Number(awards[0]?.total ?? 0) - limit
+  const href = `/plugins/awards/member?id=${context.authorId}`
+  return (
+    <span className="flex flex-wrap items-center gap-1">
+      {awards.slice(0, limit).map((award) => (
+        <a key={award.id} href={href} title={award.name} aria-label={award.name}>
+          {icon(award)}
+        </a>
+      ))}
+      {more > 0 && (
+        <a href={href} title={translated(context, 'awards.more')}>
+          +{more}
+        </a>
+      )}
+    </span>
+  )
+}
+
+export async function ProfilePanel(context: PluginRegionContext) {
+  if (context.subjectId === null) return null
+  const runtime = await context.runtime()
+  return (
+    <section className="flex flex-col gap-3">
+      <h2 className="font-semibold">{translated(context, 'awards.title')}</h2>
+      {await memberList({ ...runtime, t: context.t, locale: context.locale }, context.subjectId)}
+    </section>
+  )
+}
+
+export async function Dashboard(context: PluginRegionContext) {
+  const { data } = await context.runtime()
+  const row = await data.one<{ count: number }>(
+    `select count(*)::int as count from plugin_awards_grant where granted_at >= now() - interval '7 days'`,
+  )
+  return (
+    <p>
+      <a href="/admin/plugins/awards/grant" className={textLinkVariants()}>
+        {translated(context, 'awards.dashboard')}
+      </a>
+      : {row?.count ?? 0}
+    </p>
+  )
+}

package/src/ui/rules.tsx

@@ -0,0 +1,126 @@
+import type { PluginAdminPageContext } from '@meith/plugin-kit'
+import { controlVariants, surfaceVariants, textLinkVariants } from '@meith/ui'
+
+import { asId } from '../awards'
+import { type AwardRule, CRITERIA } from '../rules'
+import { allAwards, awardRules } from '../store'
+import {
+  action,
+  button,
+  checkbox,
+  date,
+  field,
+  notice,
+  type TextContext,
+  translated,
+} from './shared'
+
+const LABELS = {
+  minPostCount: 'awards.rule.posts',
+  minThreadCount: 'awards.rule.threads',
+  minReputation: 'awards.rule.reputation',
+  minDaysRegistered: 'awards.rule.days',
+} as const
+const FIELDS = {
+  minPostCount: 'min_post_count',
+  minThreadCount: 'min_thread_count',
+  minReputation: 'min_reputation',
+  minDaysRegistered: 'min_days_registered',
+} as const
+
+export function ruleSummary(context: TextContext, rule: AwardRule): string {
+  return `${translated(context, 'awards.rule.all')} ${CRITERIA.filter((key) => rule[key] !== null)
+    .map((key) => `${translated(context, LABELS[key])}: ${rule[key]}`)
+    .join(' · ')}`
+}
+
+export async function RulesAdmin(context: PluginAdminPageContext) {
+  const rules = await awardRules(context.data)
+  const awards = await allAwards(context.data)
+  const names = new Map(awards.map((award) => [Number(award.id), award.name]))
+  const edit = rules.find((rule) => rule.id === asId(context.query.edit))
+  const state = await context.data.one<{ cursor: number; completed_at: string | Date | null }>(
+    `select cursor, completed_at from plugin_awards_scan where id = 1`,
+  )
+  return (
+    <div className="flex flex-col gap-4">
+      {notice(context, context.query.notice)}
+      <section className={surfaceVariants({ padded: true, className: 'flex flex-col gap-3' })}>
+        <p>
+          {translated(context, 'awards.rule.cursor')}: {state?.cursor ?? 0}
+        </p>
+        <p>
+          {translated(context, 'awards.rule.completed')}:{' '}
+          {state?.completed_at == null
+            ? translated(context, 'awards.rule.never')
+            : date(context, state.completed_at)}
+        </p>
+        <div className="flex flex-wrap gap-3">
+          {action(context, 'rules', 1, 'run', 'awards.rule.run')}
+          {action(context, 'rules', 1, 'reset', 'awards.rule.reset')}
+        </div>
+        <p className="text-sm text-muted-foreground">{translated(context, 'awards.rule.budget')}</p>
+      </section>
+      <form
+        method="post"
+        action="/admin/api/plugins/awards/rules"
+        className={surfaceVariants({ padded: true, className: 'grid gap-3 sm:grid-cols-2' })}
+      >
+        <h2 className="font-semibold sm:col-span-2">
+          {translated(context, edit === undefined ? 'awards.rule.create' : 'awards.rule.edit')}
+        </h2>
+        {edit !== undefined && <input type="hidden" name="id" value={edit.id} />}
+        {field(context, 'title', 'awards.rule.title', edit?.title ?? '', 'text', true)}
+        <label className="flex flex-col gap-1">
+          {translated(context, 'awards.award')}
+          <select
+            name="award_id"
+            required
+            defaultValue={edit?.awardId}
+            className={controlVariants()}
+          >
+            {awards
+              .filter((award) => award.archived_at === null)
+              .map((award) => (
+                <option key={award.id} value={award.id}>
+                  {award.name}
+                </option>
+              ))}
+          </select>
+        </label>
+        {CRITERIA.map((key) => (
+          <div key={key}>
+            {field(context, FIELDS[key], LABELS[key], edit?.[key] ?? '', 'number')}
+          </div>
+        ))}
+        {checkbox(context, 'enabled', 'awards.rule.enabled', edit?.enabled ?? true)}
+        <p className="text-sm text-muted-foreground">{translated(context, 'awards.rule.help')}</p>
+        <div>{button(context, 'awards.rule.save')}</div>
+      </form>
+      <ul className="flex flex-col gap-3">
+        {rules.map((rule) => (
+          <li
+            key={rule.id}
+            className={surfaceVariants({ padded: true, className: 'flex flex-col gap-2' })}
+          >
+            <a href={`/admin/plugins/awards/rules?edit=${rule.id}`} className={textLinkVariants()}>
+              {rule.title}
+            </a>
+            <p>{names.get(rule.awardId)}</p>
+            <p className="text-sm">{ruleSummary(context, rule)}</p>
+            <div className="flex gap-3">
+              {action(
+                context,
+                'rules',
+                rule.id,
+                rule.enabled ? 'disable' : 'enable',
+                rule.enabled ? 'awards.rule.disable' : 'awards.rule.enable',
+              )}
+              {action(context, 'rules', rule.id, 'delete', 'awards.delete')}
+            </div>
+          </li>
+        ))}
+      </ul>
+    </div>
+  )
+}

package/src/ui/shared.tsx

@@ -0,0 +1,134 @@
+import type { PluginPageContext } from '@meith/plugin-kit'
+import { buttonVariants, controlVariants } from '@meith/ui'
+
+import { type AwardDraft, ICON_PATHS } from '../awards'
+import en from '../messages/en.json'
+
+export type TextContext = Pick<PluginPageContext, 't' | 'locale'>
+export function translated(context: TextContext, key: keyof typeof en): string {
+  return context.t.has(key) ? context.t.t(key) : en[key]
+}
+export function date(context: TextContext, value: Date | string): string {
+  return new Intl.DateTimeFormat(context.locale, { dateStyle: 'medium', timeZone: 'UTC' }).format(
+    new Date(value),
+  )
+}
+export function icon(award: Pick<AwardDraft, 'icon' | 'icon_kind'>) {
+  if (award.icon_kind === 'image')
+    return (
+      <img
+        src={award.icon}
+        alt=""
+        width={24}
+        height={24}
+        loading="lazy"
+        className="inline-block size-6 object-contain"
+      />
+    )
+  if (award.icon_kind === 'svg')
+    return (
+      <svg
+        viewBox="0 0 24 24"
+        width="24"
+        height="24"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="1.6"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        aria-hidden="true"
+      >
+        <path d={ICON_PATHS[award.icon as keyof typeof ICON_PATHS]} />
+      </svg>
+    )
+  return (
+    <span aria-hidden="true" className="text-xl">
+      {award.icon}
+    </span>
+  )
+}
+export function field(
+  context: TextContext,
+  name: string,
+  key: keyof typeof en,
+  value: string | number = '',
+  type = 'text',
+  required = false,
+) {
+  return (
+    <label className="flex flex-col gap-1">
+      {translated(context, key)}
+      <input
+        className={controlVariants()}
+        name={name}
+        defaultValue={value}
+        type={type}
+        required={required}
+        {...(type === 'number' ? { min: 0, max: 2147483647, step: 1 } : {})}
+      />
+    </label>
+  )
+}
+export function checkbox(
+  context: TextContext,
+  name: string,
+  key: keyof typeof en,
+  checked: boolean,
+) {
+  return (
+    <label className="flex items-center gap-2">
+      <input type="checkbox" name={name} defaultChecked={checked} />
+      {translated(context, key)}
+    </label>
+  )
+}
+export function button(context: TextContext, key: keyof typeof en) {
+  return (
+    <button type="submit" className={buttonVariants({ variant: 'primary', size: 'sm' })}>
+      {translated(context, key)}
+    </button>
+  )
+}
+export function action(
+  context: TextContext,
+  route: string,
+  id: number,
+  value: string,
+  key: keyof typeof en,
+) {
+  return (
+    <form method="post" action={`/admin/api/plugins/awards/${route}`}>
+      <input type="hidden" name="id" value={id} />
+      <input type="hidden" name="action" value={value} />
+      {button(context, key)}
+    </form>
+  )
+}
+export function notice(context: TextContext, value: string | undefined) {
+  const notices = {
+    evaluated: 'awards.notice.evaluated',
+    reset: 'awards.notice.reset',
+    'rule-invalid': 'awards.notice.rule-invalid',
+    'rule-empty': 'awards.notice.rule-empty',
+    'rule-missing': 'awards.notice.rule-missing',
+    'rule-saved': 'awards.notice.rule-saved',
+    already: 'awards.notice.already',
+    deleted: 'awards.notice.deleted',
+    granted: 'awards.notice.granted',
+    held: 'awards.notice.held',
+    icon: 'awards.notice.icon',
+    invalid: 'awards.notice.invalid',
+    missing: 'awards.notice.missing',
+    multiple: 'awards.notice.multiple',
+    partial: 'awards.notice.partial',
+    revoked: 'awards.notice.revoked',
+    saved: 'awards.notice.saved',
+    unknown: 'awards.notice.unknown',
+  } as const
+  const key = notices[value as keyof typeof notices]
+  return key !== undefined ? (
+    <p role="status" className="rounded border p-3">
+      {translated(context, key as keyof typeof en)}
+    </p>
+  ) : null
+}