Pinafore-Web-Client-Frontend/src/routes/_components/profile/AccountProfilePage.html

69 lines
2.2 KiB
HTML

{#if $isUserLoggedIn}
<TimelinePage {timeline} >
<DynamicPageBanner title="" {ariaTitle} />
{#if $currentAccountProfile && $currentVerifyCredentials}
<AccountProfile account={$currentAccountProfile}
relationship={$currentAccountRelationship}
verifyCredentials={$currentVerifyCredentials}
{filter}
/>
{/if}
{#if !filter}
<PinnedStatuses {accountId} />
{/if}
</TimelinePage>
{:else}
<HiddenFromSSR>
<FreeTextLayout>
<h1>{intl.profile}</h1>
<p>{intl.profileNotLoggedIn}</p>
</FreeTextLayout>
</HiddenFromSSR>
{/if}
<script>
import TimelinePage from '../TimelinePage.html'
import FreeTextLayout from '../FreeTextLayout.html'
import { store } from '../../_store/store.js'
import HiddenFromSSR from '../HiddenFromSSR'
import DynamicPageBanner from '../DynamicPageBanner.html'
import { updateProfileAndRelationship, clearProfileAndRelationship } from '../../_actions/accounts'
import AccountProfile from './AccountProfile.html'
import PinnedStatuses from '../timeline/PinnedStatuses.html'
import { formatIntl } from '../../_utils/formatIntl'
export default {
oncreate () {
const { accountId } = this.get()
clearProfileAndRelationship()
updateProfileAndRelationship(accountId)
},
store: () => store,
computed: {
profileName: ({ $currentAccountProfile }) => {
return ($currentAccountProfile && ('@' + $currentAccountProfile.acct)) || ''
},
shortProfileName: ({ $currentAccountProfile }) => {
return ($currentAccountProfile && ('@' + $currentAccountProfile.username)) || ''
},
accountName: ({ $currentAccountProfile }) => {
return ($currentAccountProfile && ($currentAccountProfile.display_name || $currentAccountProfile.username)) || ''
},
timeline: ({ accountId, filter }) => (
`account/${accountId}` + (filter ? `/${filter}` : '')
),
ariaTitle: ({ accountName }) => (
formatIntl('intl.profilePageForAccount', { account: accountName })
)
},
components: {
TimelinePage,
FreeTextLayout,
HiddenFromSSR,
DynamicPageBanner,
AccountProfile,
PinnedStatuses
}
}
</script>