154 lines
4.2 KiB
HTML
154 lines
4.2 KiB
HTML
{#if $isUserLoggedIn}
|
|
<div class="community-page">
|
|
|
|
<RadioGroup
|
|
id="pinnables"
|
|
length={numPinnable}
|
|
label="Pinnable timelines">
|
|
|
|
<h2 class="community-header">
|
|
Timelines
|
|
</h2>
|
|
|
|
<PageList label="Timelines">
|
|
<PageListItem href="/local"
|
|
label="Local Timeline"
|
|
icon="#fa-users"
|
|
pinnable="true"
|
|
pinIndex={0}
|
|
/>
|
|
<PageListItem href="/federated"
|
|
label="Federated Timeline"
|
|
icon="#fa-globe"
|
|
pinnable="true"
|
|
pinIndex={1}
|
|
/>
|
|
<PageListItem href="/favorites"
|
|
label="Favorites"
|
|
icon="#fa-star"
|
|
pinnable="true"
|
|
pinIndex={2}
|
|
/>
|
|
<PageListItem href="/direct"
|
|
label="Direct messages"
|
|
icon="#fa-envelope"
|
|
pinnable="true"
|
|
pinIndex={3}
|
|
/>
|
|
</PageList>
|
|
|
|
{#if listsLength}
|
|
|
|
<h2 class="community-header">
|
|
Lists
|
|
</h2>
|
|
|
|
<PageList label="Lists">
|
|
{#each $lists as list, i}
|
|
<PageListItem href="/lists/{list.id}"
|
|
label={list.title}
|
|
icon="#fa-bars"
|
|
pinnable="true"
|
|
pinIndex={4 + i}
|
|
/>
|
|
{/each}
|
|
</PageList>
|
|
|
|
{/if}
|
|
|
|
</RadioGroup>
|
|
|
|
<h2 class="community-header">
|
|
Instance settings
|
|
</h2>
|
|
|
|
<PageList label="Instance settings">
|
|
{#if isLockedAccount}
|
|
<PageListItem href="/requests"
|
|
label={followRequestsLabel}
|
|
icon="#fa-user-plus"
|
|
/>
|
|
{/if}
|
|
<PageListItem href="/muted"
|
|
label="Muted users"
|
|
icon="#fa-volume-off"
|
|
/>
|
|
<PageListItem href="/blocked"
|
|
label="Blocked users"
|
|
icon="#fa-ban"
|
|
/>
|
|
<PageListItem href="/pinned"
|
|
label="Pinned toots"
|
|
icon="#fa-thumb-tack"
|
|
/>
|
|
</PageList>
|
|
|
|
</div>
|
|
{:else}
|
|
<HiddenFromSSR>
|
|
<FreeTextLayout>
|
|
<h1>Community</h1>
|
|
|
|
<p>Community options appear here when logged in.</p>
|
|
</FreeTextLayout>
|
|
</HiddenFromSSR>
|
|
<div style="display: none">
|
|
<!-- TODO: this is just a hack so that `sapper export` knows to crawl these files -->
|
|
<a href="/muted">Muted</a>
|
|
<a href="/blocked">Blocked</a>
|
|
<a href="/pinned">Pinned</a>
|
|
<a href="/requests">Requests</a>
|
|
<a href="/share">Share</a>
|
|
<a href="/federated">Federated</a>
|
|
<a href="/favorites">Favorites</a>
|
|
<a href="/direct">Conversations</a>
|
|
</div>
|
|
{/if}
|
|
<style>
|
|
.community-page {
|
|
margin: 20px;
|
|
}
|
|
@media (max-width: 767px) {
|
|
.community-page {
|
|
margin: 20px 10px;
|
|
}
|
|
}
|
|
</style>
|
|
<script>
|
|
import FreeTextLayout from '../../_components/FreeTextLayout.html'
|
|
import { store } from '../../_store/store.js'
|
|
import HiddenFromSSR from '../../_components/HiddenFromSSR'
|
|
import PageList from '../../_components/community/PageList.html'
|
|
import PageListItem from '../../_components/community/PageListItem.html'
|
|
import RadioGroup from '../../_components/radio/RadioGroup.html'
|
|
import { updateListsForInstance } from '../../_actions/lists'
|
|
import { updateFollowRequestCountIfLockedAccount } from '../../_actions/followRequests'
|
|
|
|
export default {
|
|
async oncreate () {
|
|
const { currentInstance } = this.store.get()
|
|
if (currentInstance) {
|
|
await Promise.all([
|
|
updateListsForInstance(currentInstance),
|
|
updateFollowRequestCountIfLockedAccount(currentInstance)
|
|
])
|
|
}
|
|
},
|
|
store: () => store,
|
|
components: {
|
|
FreeTextLayout,
|
|
HiddenFromSSR,
|
|
PageList,
|
|
PageListItem,
|
|
RadioGroup
|
|
},
|
|
computed: {
|
|
isLockedAccount: ({ $currentVerifyCredentials }) => $currentVerifyCredentials && $currentVerifyCredentials.locked,
|
|
followRequestsLabel: ({ $hasFollowRequests, $numberOfFollowRequests }) => (
|
|
`Follow requests${$hasFollowRequests ? ` (${$numberOfFollowRequests})` : ''}`
|
|
),
|
|
listsLength: ({ $lists }) => $lists ? $lists.length : 0,
|
|
numPinnable: ({ listsLength }) => listsLength + 4 // 4 because of local/federated/favs/direct
|
|
}
|
|
}
|
|
</script>
|