Pinafore-Web-Client-Frontend/routes/pinned.html

75 lines
2.1 KiB
HTML
Raw Normal View History

<:Head>
<title>Pinafore Pinned toots</title>
</:Head>
<Layout page='pinned'>
<DynamicPageBanner title="Pinned toots" icon="#fa-thumb-tack" />
<div class="pinned-toots-page">
{{#if loading}}
<LoadingPage />
{{elseif statuses && statuses.length}}
<ul class="pinned-toots-results">
2018-02-19 18:17:22 +01:00
{{#each statuses as status, index}}
<StatusSearchResult :status :index length="{{statuses.length}}" />
{{/each}}
</ul>
{{/if}}
</div>
</Layout>
<style>
.pinned-toots-page {
min-height: 60vh;
padding: 20px 20px;
position: relative;
}
.pinned-toots-results {
list-style: none;
box-sizing: border-box;
border: 1px solid var(--main-border);
border-radius: 2px;
}
@media (max-width: 767px) {
.pinned-toots-page {
padding: 20px 10px;
}
}
</style>
<script>
import Layout from './_components/Layout.html'
import { store } from './_store/store'
import LoadingPage from './_components/LoadingPage.html'
import StatusSearchResult from './_components/search/StatusSearchResult.html'
import { toast } from './_utils/toast'
import DynamicPageBanner from './_components/DynamicPageBanner.html'
import { getPinnedStatuses } from './_api/pinnedStatuses'
import { updateVerifyCredentialsForInstance } from './_actions/instances'
export default {
async oncreate() {
let accountsFetcher = this.get('accountsFetcher')
try {
let currentInstance = this.store.get('currentInstance')
await updateVerifyCredentialsForInstance(currentInstance)
let accessToken = this.store.get('accessToken')
let verifyCredentials = this.store.get('currentVerifyCredentials')
let statuses = await getPinnedStatuses(currentInstance, accessToken, verifyCredentials.id)
this.set({ statuses: statuses })
} catch (e) {
toast.say('Error: ' + (e.name || '') + ' ' + (e.message || ''))
} finally {
this.set({loading: false})
}
},
data: () => ({
loading: true,
accounts: []
}),
store: () => store,
components: {
Layout,
LoadingPage,
StatusSearchResult,
DynamicPageBanner
}
}
</script>