Add case follow-up queues and personal update notifications

2026-10-17 20:00:13 -04:00
parent 90b94911c5
commit b678de2f6f
19 changed files with 1408 additions and 16 deletions
@@ -0,0 +1,97 @@
+<script lang="ts">
+    import type { ModerationCase, ModerationCaseAction } from '$lib/moderation.js';
+    import { timeFormat } from '$ui/stores/time-zone.js';
+    import Badge from '../primitives/Badge.svelte';
+    import Button from '../primitives/Button.svelte';
+    import CaseReviewDialog from './CaseReviewDialog.svelte';
+
+    let {
+        item,
+        actions = [],
+        checkedAt,
+        permitted,
+        onsubmitted
+    }: {
+        item: ModerationCase;
+        actions?: ModerationCaseAction[];
+        checkedAt: string;
+        permitted: boolean;
+        onsubmitted: () => void;
+    } = $props();
+    let open = $state(false);
+    let clearing = $state(false);
+    const overdue = $derived(!!item.reviewAt && Date.parse(item.reviewAt) <= Date.parse(checkedAt));
+    $effect(() => {
+        void item.id;
+        open = false;
+    });
+</script>
+
+<section aria-label="Follow-up review">
+    <div class="heading">
+        <h2>Follow-up review</h2>
+        {#if overdue}<Badge variant="warning">Overdue review</Badge>{/if}
+    </div>
+    {#if item.reviewAt}<p>
+            <time datetime={item.reviewAt}>{$timeFormat.dateTime(item.reviewAt)}</time>
+        </p>
+        {#if item.reviewSanctionId}<p class="hint">Review after linked mute expires.</p>{/if}
+    {:else}<p class="hint">No review scheduled.</p>{/if}
+    {#if item.reviewReason}<p class="reason">{item.reviewReason}</p>{/if}
+    {#if permitted}<div class="actions">
+            <Button
+                size="sm"
+                onclick={() => {
+                    clearing = false;
+                    open = true;
+                }}>{item.reviewAt ? 'Reschedule review' : 'Schedule review'}</Button
+            >
+            {#if item.reviewAt}<Button
+                    size="sm"
+                    onclick={() => {
+                        clearing = true;
+                        open = true;
+                    }}>Complete or clear review</Button
+                >{/if}
+        </div>{/if}
+</section>
+
+{#if permitted && open}<CaseReviewDialog bind:open {item} {actions} {clearing} {onsubmitted} />{/if}
+
+<style>
+    section {
+        display: grid;
+        gap: var(--space-3);
+        padding: var(--space-5);
+        border: 1px solid var(--border-subtle);
+        border-radius: var(--radius-lg);
+        background: var(--surface);
+        min-width: 0;
+    }
+    .heading,
+    .actions {
+        display: flex;
+        align-items: center;
+        flex-wrap: wrap;
+        gap: var(--space-3);
+    }
+    .heading {
+        justify-content: space-between;
+    }
+    h2 {
+        margin: 0;
+        font-size: var(--text-lg);
+    }
+    p {
+        margin: 0;
+        line-height: var(--leading-body);
+        overflow-wrap: anywhere;
+    }
+    .reason {
+        white-space: pre-wrap;
+    }
+    .hint {
+        color: var(--text-secondary);
+        font-size: var(--text-sm);
+    }
+</style>