josh/electric-cherry
1
0
Fork 0
Code Issues 18 Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify instance details and clarify diagnostics

Browse Source
This commit is contained in:
josh
2026-10-06 17:42:05 -04:00
parent f4094b7f5d
commit b8cccc5a98
15 changed files with 329 additions and 323 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/ui/components/ChatPanel.svelte
+9 -6
View File
@@ -18,6 +18,7 @@
let missing = $state(false);
let body = $state<HTMLDivElement | null>(null);
let follow = $state(true);
let paused = $state(false);
let controller: AbortController | null = null;
async function refresh(manual = false) {
@@ -31,9 +32,10 @@
controller = request;
try {
const response = await fetch(`/api/servers/${encodeURIComponent(server)}/chat`, { signal: request.signal });
const data = await response.json();
if (!response.ok || !data.ok) throw new Error(data.reason ?? 'Could not refresh chat.');
const data = await response.json().catch(() => null);
if (!response.ok || !data?.ok) throw new Error('Could not refresh chat. Try again shortly.');
if (request.signal.aborted) return;
if (paused && !manual) return;
entries = data.entries ?? [];
missing = !!data.missing;
loaded = true;
@@ -54,7 +56,7 @@
if (body) body.scrollTop = body.scrollHeight;
}
onMount(() => {
const stop = pollVisible(() => refresh(), 5000);
const stop = pollVisible(() => paused ? Promise.resolve() : refresh(), 5000);
return () => { stop(); controller?.abort(); };
});
</script>
@@ -87,8 +89,9 @@
<section aria-label="Player chat">
<div class="chat-head">
<div class="chat-title"><h2>Chat</h2><span class="update-cadence">Updates every 5s</span></div>
<div class="chat-title"><h2>Chat</h2><span class="update-cadence">{paused ? 'Paused' : 'Live · 5s'}</span></div>
<div class="actions">
{#if hasMessages}<Button size="sm" variant="ghost" onclick={() => paused = !paused}>{paused ? 'Resume' : 'Pause'}</Button>{/if}
{#if !follow}<Button size="sm" variant="ghost" onclick={latest}>Latest messages</Button>{/if}
<Button size="sm" onclick={() => refresh(true)} loading={manualRefreshing} ariaLabel={manualRefreshing ? 'Refreshing chat' : 'Refresh chat'}>Refresh</Button>
</div>
@@ -143,8 +146,8 @@
.chat-title { gap: var(--space-2) var(--space-3); }
h2 { margin: 0; font-size: var(--text-lg); }
.update-cadence { color: var(--text-secondary); font-size: var(--text-xs); }
.empty { color: var(--text-secondary); font-size: var(--text-sm); padding: var(--space-6) 0; }
.messages { max-height: 60vh; overflow: auto; margin-top: var(--space-4); }
.empty { color: var(--text-secondary); font-size: var(--text-sm); padding: 8px 0; margin-bottom: 0; }
.messages { max-height: 360px; overflow: auto; margin-top: var(--space-4); }
.messages:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--accent-primary); border-radius: var(--radius-sm); }
ol { list-style: none; padding: 0; margin: 0; }
.message { display: grid; grid-template-columns: 6rem minmax(0, 1fr); align-items: baseline; column-gap: var(--space-4); padding: var(--space-3) 0; }