pinafore/routes/_components/timeline/PinnedStatuses.html
Nolan Lawson 120f50919e
improve a11y of fields, status page, and more (#505)
* improve a11y of fields, status page, and more

* tweak nav name

* fix community page and tweak text

* don't show pinned statuses heading unless there are pinned statuses
2018-08-28 06:44:36 -07:00

41 lines
1.2 KiB
HTML

{#if pinnedStatuses.length }
<h1 class="sr-only">Pinned statuses</h1>
<div role="feed" aria-label="Pinned statuses" class="pinned-statuses">
{#each pinnedStatuses as status, index (status.id)}
<Status {status}
timelineType="pinned"
timelineValue={accountId}
{index}
length={pinnedStatuses.length}
/>
{/each}
</div>
{/if}
<script>
import { store } from '../../_store/store'
import Status from '../status/Status.html'
import { updatePinnedStatusesForAccount } from '../../_actions/pinnedStatuses'
import { on } from '../../_utils/eventBus'
export default {
async oncreate () {
on('updatePinnedStatuses', this, () => this.updatePinnedStatuses())
await this.updatePinnedStatuses()
},
computed: {
pinnedStatuses: ({ $pinnedStatuses, $currentInstance, accountId }) => {
return ($pinnedStatuses[$currentInstance] && $pinnedStatuses[$currentInstance][accountId]) || []
}
},
store: () => store,
components: {
Status
},
methods: {
async updatePinnedStatuses () {
let { accountId } = this.get()
await updatePinnedStatusesForAccount(accountId)
}
}
}
</script>