@meith/web 0.16.0

package/app/(board)/member/[id]/page.tsx

@@ -0,0 +1,187 @@
+import type { Metadata } from 'next'
+import { notFound } from 'next/navigation'
+
+import { requireSlot, slotCopy } from '@meith/theme-kit'
+
+import { RemoveRelationForm, SetRelationForm } from '@/components/account/relation-forms'
+import { AvatarLockForm, SignatureLockForm } from '@/components/moderation/signature-lock-form'
+import { BOARD_MEASURE } from '@/components/shell/measure'
+import { avatarFor, avatarsFor } from '@/server/avatars'
+import { getContainer } from '@/server/container'
+import { getActor } from '@/server/context'
+import { identitiesFor } from '@/server/group-identity'
+import { getTranslator, tr } from '@/server/i18n'
+import { filterView, pluginRegion, viewerRef } from '@/server/plugin-view'
+import { visibleProfileFields } from '@/server/profile-fields'
+import { relationService } from '@/server/relations'
+import { reputationService, reputationSettings } from '@/server/reputation'
+import { currentTheme } from '@/server/theme'
+import { getViewerPreferences } from '@/server/viewer-preferences'
+import { buildMemberProfileView } from '@/view/member-profile'
+import { moderationFormsCopy } from '@/view/moderation-copy'
+import { reputationLabel } from '@/view/reputation'
+import { numericId } from '@/view/slug-id'
+
+export async function generateMetadata(): Promise<Metadata> {
+  return { title: await tr('page.member-profile') }
+}
+
+export default async function MemberProfilePage({ params }: { params: Promise<{ id: string }> }) {
+  const id = numericId((await params).id)
+  if (id === null) notFound()
+
+  const actor = await getActor()
+  const { authorizer, memberProfiles, messages, warnings } = getContainer()
+  if (!authorizer.can(actor, 'profile.view')) notFound()
+
+  const profile = await memberProfiles.findPublicById(id)
+  if (!profile) notFound()
+
+  const _preferences = await getViewerPreferences()
+  const customFields = await visibleProfileFields(id)
+
+  const relations = relationService()
+  const currentRelation =
+    relations === null || actor.userId === null || actor.userId === id
+      ? null
+      : (await relations.list(actor.userId, 'buddy')).some((row) => row.userId === id)
+        ? 'buddy'
+        : (await relations.ignores(actor.userId, id))
+          ? 'ignore'
+          : 'none'
+
+  const reputation = reputationService()
+  const repSettings = await reputationSettings()
+  const repSummary =
+    reputation === null || !repSettings.enabled ? null : await reputation.summary(id)
+
+  const signatures = getContainer().signatures
+  const signatureState =
+    signatures === null || !authorizer.can(actor, 'user.warn')
+      ? null
+      : await signatures.read(id).catch(() => null)
+
+  const MemberProfile = requireSlot(await currentTheme(), 'MemberProfile')
+  const translator = await getTranslator()
+
+  const profileModel = await filterView(
+    'view.member-profile',
+    {
+      ...buildMemberProfileView(profile, new Date(), {
+        avatarUrl: (await avatarsFor([id])).get(id) ?? null,
+        nameClass: (await identitiesFor([id])).get(id)?.nameClass ?? null,
+        canWarn: warnings !== null && actor.userId !== id && authorizer.can(actor, 'user.warn'),
+        canMessage:
+          messages !== null &&
+          actor.userId !== null &&
+          actor.userId !== id &&
+          authorizer.can(actor, 'pm.use'),
+        t: translator,
+        customFields,
+      }),
+      regions: {
+        plugins: await pluginRegion('profile.panel', {
+          viewer: viewerRef(actor),
+          subjectId: id,
+          authorId: id,
+        }),
+      },
+    },
+    viewerRef(actor),
+  )
+
+  return (
+    <main id="board-content" tabIndex={-1} className="flex-1">
+      <MemberProfile
+        {...profileModel}
+        copy={slotCopy(await currentTheme(), 'MemberProfile', translator)}
+      />
+
+      {(signatureState !== null || repSummary !== null || currentRelation !== null) && (
+        <div className={`${BOARD_MEASURE} pt-4 pb-8`}>
+          <section
+            aria-label={translator.t('board.member.about', { username: profile.username })}
+            className="flex flex-col divide-y divide-border rounded-lg border border-border bg-card text-sm"
+          >
+            {repSummary !== null && (
+              <div className="flex flex-wrap items-baseline gap-3 px-4 py-3">
+                <span className="text-muted-foreground">
+                  {translator.t('board.member.reputation')}
+                </span>
+                <span className="font-medium">{reputationLabel(repSummary, translator)}</span>
+                <a
+                  href={`/member/${id}/reputation`}
+                  className="ms-auto font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
+                >
+                  {await tr('page.see-all-ratings')}
+                </a>
+              </div>
+            )}
+
+            {currentRelation !== null && (
+              <div className="flex flex-wrap items-center gap-3 px-4 py-3">
+                {currentRelation === 'none' ? (
+                  <>
+                    <SetRelationForm
+                      userId={id}
+                      username={profile.username}
+                      kind="buddy"
+                      returnTo={`/member/${id}`}
+                      label={translator.t('board.member.addBuddy')}
+                    />
+                    <SetRelationForm
+                      userId={id}
+                      username={profile.username}
+                      kind="ignore"
+                      returnTo={`/member/${id}`}
+                      label={translator.t('board.member.ignore')}
+                    />
+                  </>
+                ) : (
+                  <RemoveRelationForm
+                    userId={id}
+                    username={profile.username}
+                    returnTo={`/member/${id}`}
+                    label={
+                      currentRelation === 'buddy'
+                        ? translator.t('board.member.removeBuddy')
+                        : translator.t('board.member.stopIgnoring')
+                    }
+                  />
+                )}
+                <a
+                  href="/usercp/contacts"
+                  className="ms-auto text-sm text-muted-foreground hover:text-foreground"
+                >
+                  {await tr('page.lists')}
+                </a>
+              </div>
+            )}
+
+            {signatureState !== null && (
+              <div className="flex flex-wrap items-center gap-3 px-4 py-3">
+                <span className="text-muted-foreground">
+                  {translator.t('board.member.signature', {
+                    status: translator.t(
+                      signatureState.locked ? 'board.member.locked' : 'board.member.allowed',
+                    ),
+                  })}
+                </span>
+                <SignatureLockForm
+                  userId={id}
+                  locked={signatureState.locked}
+                  copy={moderationFormsCopy(translator)}
+                />
+                <AvatarLockForm
+                  userId={id}
+                  locked={(await avatarFor(id)).locked}
+                  copy={moderationFormsCopy(translator)}
+                />
+              </div>
+            )}
+          </section>
+        </div>
+      )}
+    </main>
+  )
+}

package/app/(board)/member/[id]/reputation/page.tsx

@@ -0,0 +1,195 @@
+import type { Metadata } from 'next'
+import { notFound } from 'next/navigation'
+
+import { RateMemberForm, WithdrawRatingForm } from '@/components/account/reputation-forms'
+import { BoardNotice } from '@/components/shell/board-notice'
+import { getContainer } from '@/server/container'
+import { getActor } from '@/server/context'
+import { getTranslator, tr } from '@/server/i18n'
+import { reputationService, reputationSettings, viewerRaterLimits } from '@/server/reputation'
+import { getViewerPreferences } from '@/server/viewer-preferences'
+import { rateMemberFormCopy } from '@/view/account-copy'
+import { buildReputationView, reputationLabel, reputationNotice } from '@/view/reputation'
+import { numericId } from '@/view/slug-id'
+
+export async function generateMetadata(): Promise<Metadata> {
+  return { title: await tr('page.reputation') }
+}
+
+export default async function ReputationPage({
+  params,
+  searchParams,
+}: {
+  params: Promise<{ id: string }>
+  searchParams: Promise<{
+    before?: string
+    post?: string
+    rated?: string
+    withdrawn?: string
+  }>
+}) {
+  const id = numericId((await params).id)
+  if (id === null) notFound()
+
+  const query = await searchParams
+
+  const translator = await getTranslator()
+  const actor = await getActor()
+  const { authorizer, memberProfiles } = getContainer()
+  if (!authorizer.can(actor, 'profile.view')) notFound()
+
+  const service = reputationService()
+  const settings = await reputationSettings()
+  if (service === null || !settings.enabled) notFound()
+
+  const profile = await memberProfiles.findPublicById(id)
+  if (!profile) notFound()
+
+  const before = Number(query.before)
+  const ratedPost = Number(query.post)
+  const postId = Number.isInteger(ratedPost) && ratedPost > 0 ? ratedPost : null
+  const _preferences = await getViewerPreferences()
+
+  const [summary, history, limits] = await Promise.all([
+    service.summary(id),
+    service.history({
+      userId: id,
+      ...(Number.isInteger(before) && before > 0 ? { before } : {}),
+    }),
+    viewerRaterLimits(),
+  ])
+
+  const mayRate = limits.canGive && actor.userId !== null && actor.userId !== id
+  const [existing, givenToday] = mayRate
+    ? await Promise.all([
+        service.existing({ givenByUserId: actor.userId as number, userId: id, postId }),
+        service.givenToday(actor.userId as number),
+      ])
+    : [null, 0]
+
+  const view = buildReputationView({
+    userId: id,
+    summary,
+    rows: history.rows,
+    nextBefore: history.nextBefore,
+    viewerUserId: actor.userId,
+    maxPerDay: limits.maxPerDay,
+    givenToday,
+    now: new Date(),
+    t: await getTranslator(),
+  })
+
+  const notice = reputationNotice(query, translator)
+  const returnTo = `/member/${id}/reputation`
+
+  return (
+    <main id="board-content" tabIndex={-1} className="flex-1">
+      <div className="mx-auto flex w-full max-w-3xl flex-col gap-6 px-6 py-8">
+        {notice !== null && (
+          <BoardNotice kind={notice.kind} message={notice.message} dismissHref={returnTo} />
+        )}
+
+        <div className="flex flex-col gap-1">
+          <h1 className="font-heading text-2xl font-semibold">
+            {profile.username}&rsquo;s reputation
+          </h1>
+          <p className="text-sm text-muted-foreground">
+            {reputationLabel(view.summary, translator)}
+          </p>
+          <a
+            href={`/member/${id}`}
+            className="text-sm font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
+          >
+            {await tr('page.back-their-profile')}
+          </a>
+        </div>
+
+        {mayRate && (
+          <RateMemberForm
+            userId={id}
+            postId={postId}
+            returnTo={returnTo}
+            allowNegative={settings.allowNegative}
+            commentRequired={settings.commentRequired}
+            existingComment={existing?.comment ?? null}
+            existingPoints={existing?.points ?? null}
+            remainingLabel={view.remainingLabel}
+            copy={rateMemberFormCopy(profile.username, translator)}
+          />
+        )}
+
+        {view.rows.length === 0 ? (
+          <p className="text-sm text-muted-foreground">
+            {await tr('page.nobody-has-rated-them-yet')}
+          </p>
+        ) : (
+          <ul className="flex flex-col divide-y divide-border rounded-lg border border-border">
+            {view.rows.map((row) => (
+              <li key={row.id} className="flex flex-col gap-1 px-4 py-3">
+                <div className="flex flex-wrap items-baseline gap-2 text-sm">
+                  <span
+                    className={
+                      row.points > 0
+                        ? 'font-semibold text-moderation-approved'
+                        : row.points < 0
+                          ? 'font-semibold text-destructive'
+                          : 'font-semibold text-muted-foreground'
+                    }
+                  >
+                    {row.pointsLabel}
+                  </span>
+                  {row.givenByHref === null ? (
+                    <span className="font-medium">{row.givenBy}</span>
+                  ) : (
+                    <a
+                      href={row.givenByHref}
+                      className="font-medium text-foreground hover:underline underline-offset-2"
+                    >
+                      {row.givenBy}
+                    </a>
+                  )}
+                  <time dateTime={row.at.iso} className="text-xs text-muted-foreground">
+                    {row.at.label}
+                  </time>
+                  {row.postHref !== null && (
+                    <a
+                      href={row.postHref}
+                      className="text-xs font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
+                    >
+                      on a post
+                    </a>
+                  )}
+                  {row.isMine && (
+                    <span className="ml-auto">
+                      <WithdrawRatingForm
+                        ratingId={row.id}
+                        userId={id}
+                        returnTo={returnTo}
+                        copy={rateMemberFormCopy(profile.username, translator)}
+                      />
+                    </span>
+                  )}
+                </div>
+
+                {row.comment !== '' && (
+                  <p className="whitespace-pre-wrap break-words text-sm text-muted-foreground">
+                    {row.comment}
+                  </p>
+                )}
+              </li>
+            ))}
+          </ul>
+        )}
+
+        {view.nextHref !== null && (
+          <a
+            href={view.nextHref}
+            className="text-sm font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
+          >
+            {await tr('page.older-ratings')}
+          </a>
+        )}
+      </div>
+    </main>
+  )
+}

package/app/(board)/member/by-name/[name]/page.tsx

@@ -0,0 +1,32 @@
+import type { Metadata } from 'next'
+import { notFound, redirect } from 'next/navigation'
+
+import { foldIdentifier } from '@meith/accounts'
+
+import { getContainer } from '@/server/container'
+import { getActor } from '@/server/context'
+import { tr } from '@/server/i18n'
+import { memberHref } from '@/view/member-profile'
+
+export async function generateMetadata(): Promise<Metadata> {
+  return { title: await tr('page.member-profile') }
+}
+
+export default async function MemberByNamePage({ params }: { params: Promise<{ name: string }> }) {
+  const raw = (await params).name
+  let name: string
+  try {
+    name = decodeURIComponent(raw)
+  } catch {
+    notFound()
+  }
+
+  const actor = await getActor()
+  const { authorizer, accountStore } = getContainer()
+  if (!authorizer.can(actor, 'profile.view')) notFound()
+
+  const account = await accountStore.accounts.findByUsernameLower(foldIdentifier(name))
+  if (account === null) notFound()
+
+  redirect(memberHref(account.id))
+}

package/app/(board)/messages/[id]/page.tsx

@@ -0,0 +1,103 @@
+import type { Metadata } from 'next'
+import { notFound } from 'next/navigation'
+
+import { postBodyHtml } from '@meith/markdown'
+
+import { PanelPage } from '@/components/shell/panel-page'
+import { getContainer } from '@/server/container'
+import { activeVocabulary } from '@/server/content-admin'
+import { getActor } from '@/server/context'
+import { getTranslator, tr } from '@/server/i18n'
+import { messageService } from '@/server/messages'
+import { getViewerPreferences } from '@/server/viewer-preferences'
+import { buildMessageView, folderHref } from '@/view/messages'
+
+export async function generateMetadata(): Promise<Metadata> {
+  return { title: await tr('page.private-message') }
+}
+
+export default async function MessagePage({ params }: { params: Promise<{ id: string }> }) {
+  const { id } = await params
+  const messageId = Number(id)
+  if (!Number.isInteger(messageId) || messageId <= 0) notFound()
+
+  const actor = await getActor()
+  const { authorizer } = getContainer()
+  const service = messageService()
+
+  if (actor.userId === null || service === null) notFound()
+  if (!authorizer.can(actor, 'pm.use')) notFound()
+
+  const detail = await service.open({ messageId, userId: actor.userId }).catch(() => null)
+  if (detail === null) notFound()
+
+  const [_preferences, translator] = await Promise.all([getViewerPreferences(), getTranslator()])
+  const view = buildMessageView({
+    detail,
+    bodyHtml: postBodyHtml(detail.message, await activeVocabulary(), {
+      quoteAttribution: (author) => translator.t('markdown.quote.attribution', { author }),
+    }),
+    viewerUserId: actor.userId,
+    now: new Date(),
+    t: translator,
+  })
+
+  return (
+    <PanelPage
+      back={{ href: folderHref(view.folder), label: `Back to ${view.folder}` }}
+      title={view.subject}
+      lede={
+        <>
+          From <span className="font-medium text-foreground">{view.author}</span>{' '}
+          <time dateTime={view.at.iso}>{view.at.label}</time>
+        </>
+      }
+      {...(view.participants.length > 0
+        ? {
+            meta: `To: ${view.participants
+              .filter((participant) => participant.role !== 'author')
+              .map((participant) =>
+                participant.role === 'bcc' ? `${participant.username} (bcc)` : participant.username,
+              )
+              .join(', ')}`,
+          }
+        : {})}
+    >
+      <article
+        className="prose prose-sm max-w-none break-words"
+        dangerouslySetInnerHTML={{ __html: view.bodyHtml }}
+      />
+
+      <div className="flex flex-wrap items-center gap-4 border-t border-border pt-4">
+        {view.actions.map((action) => (
+          <a
+            key={action.href}
+            href={action.href}
+            className="text-sm font-medium text-foreground underline decoration-border underline-offset-2 hover:decoration-foreground"
+          >
+            {action.label}
+          </a>
+        ))}
+        {view.reportHref !== null && (
+          <a href={view.reportHref} className="text-sm text-muted-foreground hover:text-foreground">
+            {await tr('page.report-this-message')}
+          </a>
+        )}
+      </div>
+
+      {view.tracking.length > 0 && (
+        <section className="flex flex-col gap-2 rounded-lg border border-border bg-card p-4">
+          <h2 className="text-sm font-medium">{await tr('page.who-has-read-it')}</h2>
+          <ul className="flex flex-col gap-1 text-sm text-muted-foreground">
+            {view.tracking.map((participant) => (
+              <li key={participant.username}>
+                <span className="text-foreground">{participant.username}</span>
+                {participant.role === 'bcc' ? ' (bcc)' : ''} — {participant.readLabel}
+              </li>
+            ))}
+          </ul>
+        </section>
+      )}
+    </PanelPage>
+  )
+}

package/app/(board)/messages/compose/page.tsx

@@ -0,0 +1,60 @@
+import type { Metadata } from 'next'
+import { notFound } from 'next/navigation'
+
+import { ComposeForm } from '@/components/messages/message-forms'
+import { PanelPage } from '@/components/shell/panel-page'
+import { getContainer } from '@/server/container'
+import { getActor } from '@/server/context'
+import { getTranslator, tr } from '@/server/i18n'
+import { messageService } from '@/server/messages'
+import { messageFormsCopy } from '@/view/content-copy'
+
+export async function generateMetadata(): Promise<Metadata> {
+  return { title: await tr('page.write-message') }
+}
+
+export default async function ComposePage({
+  searchParams,
+}: {
+  searchParams: Promise<{ to?: string; reply?: string; forward?: string }>
+}) {
+  const query = await searchParams
+  const actor = await getActor()
+  const { authorizer } = getContainer()
+  const service = messageService()
+
+  if (actor.userId === null || service === null) notFound()
+  if (!authorizer.can(actor, 'pm.use')) notFound()
+
+  const reply = positiveInt(query.reply)
+  const forward = positiveInt(query.forward)
+
+  const draft =
+    reply !== null
+      ? await service.replyDraft({ messageId: reply, userId: actor.userId }).catch(() => null)
+      : forward !== null
+        ? await service.forwardDraft({ messageId: forward, userId: actor.userId }).catch(() => null)
+        : null
+
+  return (
+    <PanelPage
+      back={{ href: '/messages', label: await tr('page.private-messages') }}
+      title={await tr('page.write-message')}
+      lede={await tr('page.private-messages-not-moderated-but')}
+    >
+      <ComposeForm
+        copy={messageFormsCopy(await getTranslator())}
+        to={draft?.to ?? query.to ?? ''}
+        subject={draft?.subject ?? ''}
+        message={draft?.message ?? ''}
+        replyToId={draft?.replyToId ?? null}
+      />
+    </PanelPage>
+  )
+}
+
+function positiveInt(raw: string | undefined): number | null {
+  if (raw === undefined) return null
+  const value = Number(raw)
+  return Number.isInteger(value) && value > 0 ? value : null
+}

package/app/(board)/messages/layout.tsx

@@ -0,0 +1,5 @@
+import { UserCpShell } from '@/components/account/usercp-shell'
+
+export default function MessagesLayout({ children }: { children: React.ReactNode }) {
+  return <UserCpShell>{children}</UserCpShell>
+}