feat(dashboard): add news
This commit is contained in:
parent
ce323096e6
commit
92e7e1f1cb
5 changed files with 73 additions and 5 deletions
|
|
@ -1,20 +1,21 @@
|
|||
<script lang="ts">
|
||||
import apiFetch from "$lib/api";
|
||||
import apiFetch, { type Meta, type NewsMessage } from "$lib/api";
|
||||
import { onMount } from "svelte";
|
||||
import type { PageData } from "./$types";
|
||||
import { Button, ButtonGroup } from "@sveltestrap/sveltestrap";
|
||||
import Message from "./Message.svelte";
|
||||
|
||||
export let data: PageData;
|
||||
|
||||
let guildCount: number | null = null;
|
||||
let inviteUrl: string | null = null;
|
||||
|
||||
type MetaResponse = { guilds: number; invite_url: string };
|
||||
let news: NewsMessage[] = [];
|
||||
|
||||
onMount(async () => {
|
||||
const meta = await apiFetch<MetaResponse>("GET", "/api/meta");
|
||||
const meta = await apiFetch<Meta>("GET", "/api/meta");
|
||||
guildCount = meta.guilds;
|
||||
inviteUrl = meta.invite_url;
|
||||
news = meta.news;
|
||||
});
|
||||
</script>
|
||||
|
||||
|
|
@ -59,3 +60,11 @@
|
|||
</ButtonGroup>
|
||||
</p>
|
||||
{/if}
|
||||
|
||||
<h2>News</h2>
|
||||
|
||||
{#each news as message (message.posted_at)}
|
||||
<Message {message} />
|
||||
{:else}
|
||||
<p>No news right now.</p>
|
||||
{/each}
|
||||
|
|
|
|||
31
Catalogger.Frontend/src/routes/Message.svelte
Normal file
31
Catalogger.Frontend/src/routes/Message.svelte
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
<script lang="ts">
|
||||
import type { NewsMessage } from "$lib/api";
|
||||
import {
|
||||
Card,
|
||||
CardBody,
|
||||
CardFooter,
|
||||
CardText,
|
||||
} from "@sveltestrap/sveltestrap";
|
||||
import { DateTime } from "luxon";
|
||||
|
||||
export let message: NewsMessage;
|
||||
|
||||
$: postedAt = DateTime.fromISO(message.posted_at).toLocaleString(
|
||||
DateTime.DATETIME_MED,
|
||||
);
|
||||
$: editedAt = message.edited_at
|
||||
? DateTime.fromISO(message.edited_at).toLocaleString(DateTime.DATETIME_MED)
|
||||
: null;
|
||||
</script>
|
||||
|
||||
<Card>
|
||||
<CardBody>
|
||||
<CardText>{message.content}</CardText>
|
||||
</CardBody>
|
||||
<CardFooter>
|
||||
From {message.author} • Posted {postedAt}
|
||||
{#if editedAt}
|
||||
<p class="text-muted">(edited {editedAt})</p>
|
||||
{/if}
|
||||
</CardFooter>
|
||||
</Card>
|
||||
Loading…
Add table
Add a link
Reference in a new issue