]> git.r.bdr.sh - rbdr/forum/blobdiff - src/lib/components/post/post.svelte
Don't remember what this WIP was about
[rbdr/forum] / src / lib / components / post / post.svelte
index 4e6c28ff70b0b3e9a325325103c0e669139007be..dfabdce94ff62317d579cedf63c8a74de228e722 100644 (file)
@@ -1,38 +1,55 @@
 <script lang="ts">
 <script lang="ts">
-       export let post;
+       import type { Post } from '$lib/data/types';
+
+       export let post: Post;
        export let index = 0;
        export let count = 1;
 
        import { _ } from 'svelte-i18n';
        import Glyph from '$lib/components/glyph/glyph.svelte';
 
        export let index = 0;
        export let count = 1;
 
        import { _ } from 'svelte-i18n';
        import Glyph from '$lib/components/glyph/glyph.svelte';
 
-       const timestampToISO = (timestamp) => new Date(timestamp).toISOString();
+       const timestampToISO = (timestamp: number) => new Date(timestamp).toISOString();
 </script>
 
 <aside
        class="post-meta"
        title={$_('post.metadata_title', { values: { count: index + 1, total: count } })}
 >
 </script>
 
 <aside
        class="post-meta"
        title={$_('post.metadata_title', { values: { count: index + 1, total: count } })}
 >
-       <Glyph uuid={post.author.id} />
-       <span class="h-card">
-               {$_('post.author_credit')}
-               <a href="/a/{post.author.handle}" class="p-nickname u-url">{post.author.handle}</a>.
-       </span>
+       <Glyph uuid={post.author_id} />
+       {#if post.author}
+               <span class="h-card">
+                       {$_('post.author_credit')}
+                       <a
+                               href="/a/{post.author.handle}"
+                               class="p-nickname u-url underline text-blue-600 visited:text-purple-500"
+                               >{post.author.handle}</a
+                       >.
+               </span>
+       {:else}
+               <span>????</span>
+       {/if}
        <time role="presentation" class="dt-published" datetime={timestampToISO(post.created_at)}>
        <time role="presentation" class="dt-published" datetime={timestampToISO(post.created_at)}>
-               <a title={$_('post.permalink_title')} href="/p/{post.id}">
+               <a
+                       title={$_('post.permalink_title')}
+                       class="underline text-blue-600 visited:text-purple-500"
+                       href="/p/{post.id}"
+               >
                        {timestampToISO(post.created_at)}
                </a>
        </time>
                        {timestampToISO(post.created_at)}
                </a>
        </time>
-  {#if post.topic}
-  <span>
-    ({$_('post.topic_location')} <a href="/t/{post.topic.id}">{post.topic.title}</a>.)
-  </span>
-  {/if}
+       {#if post.topic}
+               <span>
+                       ({$_('post.topic_location')}
+                       <a class="text-blue-600 underline visited:text-purple-500" href="/t/{post.topic.id}"
+                               >{post.topic.title}</a
+                       >.)
+               </span>
+       {/if}
 </aside>
 <article
 </aside>
 <article
-       class="e-content"
+       class="e-content whitespace-pre"
        title={$_('post.title', {
        title={$_('post.title', {
-               values: { count: index + 1, total: count, author: post.author.handle }
+               values: { count: index + 1, total: count, author: post.author?.handle || '????' }
        })}
 >
        {post.text}
        })}
 >
        {post.text}