johnandersen777.bsky.social/knotless
git that lives in your Atmosphere account
Forked from chadtmiller.com/knotless
0
0
<script lang="ts">
import type * as listReports from '#lib/lexicons/dev/knotless/listReports.ts';
import { ago } from '#lib/format.ts';
import Time from '#lib/atoms/Time.svelte';
import Empty from '#lib/molecules/Empty.svelte';
/** The reports this appview was sent, newest first: each one's reason, what it is about and who sent it; `pick` takes up its subject to look at. */
let { reports, pick }: { reports: listReports.Report[]; pick: (subject: string) => void } =
$props();
/** The account's DID or the record's at:// URI a report is about. */
const about = (r: listReports.Report) =>
('did' in r.subject ? r.subject.did : 'uri' in r.subject ? r.subject.uri : '') as string;
/** `com.atproto.moderation.defs#reasonSpam` as `spam`. */
const reason = (r: listReports.Report) =>
String(r.reasonType).split('#reason').pop()?.toLowerCase() ?? '';
</script>
<div class="box admin-box">
<div class="boxhead"><h2>Reports</h2></div>
<ul class="list reports">
{#each reports as r (r.id)}
<li>
<div class="grow">
<p><b>{reason(r)}</b>{` · ${about(r)}`}</p>
{#if r.reason}<p class="mute">{r.reason}</p>{/if}
<p class="mute">{`by ${r.reportedBy}`}</p>
</div>
<span class="mute"><Time at={r.createdAt} show={ago} /></span>
<button class="btn" onclick={() => pick(about(r))}>Look at</button>
</li>
{:else}
<li class="blank"><Empty title="No reports yet" /></li>
{/each}
</ul>
</div>