add distance date
This commit is contained in:
parent
01457eea40
commit
2b7c4a6c04
24
src/components/DistanceDate.svelte
Normal file
24
src/components/DistanceDate.svelte
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
<script context="module">
|
||||||
|
import { formatDistance } from 'date-fns'
|
||||||
|
import { readable } from 'svelte/store'
|
||||||
|
|
||||||
|
const format = (date, baseDate) => formatDistance(date, baseDate, { addSuffix: true })
|
||||||
|
|
||||||
|
const now = readable(new Date(), set => {
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
set(new Date())
|
||||||
|
}, 1000)
|
||||||
|
|
||||||
|
return () => clearInterval(interval)
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export let date
|
||||||
|
|
||||||
|
$: iso = date.toISOString()
|
||||||
|
$: text = format(date, $now)
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<time datetime={iso}>{text}</time>
|
||||||
|
|
@ -4,7 +4,7 @@
|
|||||||
{#if $next}
|
{#if $next}
|
||||||
<div class="entry" on:click={() => select($next)}>
|
<div class="entry" on:click={() => select($next)}>
|
||||||
<div class="title">{$next.title}</div>
|
<div class="title">{$next.title}</div>
|
||||||
<div class="user">by {$next.referer.username}</div>
|
<div class="user">shared by {$next.referer.username} <DistanceDate date={$next.date} /></div>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
@ -18,13 +18,14 @@
|
|||||||
{#each history as track}
|
{#each history as track}
|
||||||
<div class="entry" class:active={track === $current} on:click={() => select(track)}>
|
<div class="entry" class:active={track === $current} on:click={() => select(track)}>
|
||||||
<div class>{track.title}</div>
|
<div class>{track.title}</div>
|
||||||
<div class>shared by {track.referer.username}</div>
|
<div class>shared by {track.referer.username} <DistanceDate date={track.date} /></div>
|
||||||
</div>
|
</div>
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { queue, next, current, enqueueing, select } from '/store.js'
|
import { queue, next, current, enqueueing, select } from '/store.js'
|
||||||
|
import DistanceDate from '/components/DistanceDate.svelte'
|
||||||
|
|
||||||
$: history = $queue.filter(x => x !== $next).reverse()
|
$: history = $queue.filter(x => x !== $next).reverse()
|
||||||
</script>
|
</script>
|
||||||
|
@ -97,7 +97,7 @@ export async function* hashtagsIterator (domain, hashtags) {
|
|||||||
|
|
||||||
const processStatus = (domain, status) => ({
|
const processStatus = (domain, status) => ({
|
||||||
title: '',
|
title: '',
|
||||||
date: new Date(status.createdAt),
|
date: new Date(status.created_at),
|
||||||
referer: {
|
referer: {
|
||||||
username: status.account.username,
|
username: status.account.username,
|
||||||
url: status.url,
|
url: status.url,
|
||||||
|
Loading…
Reference in New Issue
Block a user