fix: always show the home compose box (#1109)

* fix: always show the home compose box

fixes #1076

* fix loading visibility
This commit is contained in:
Nolan Lawson 2019-03-20 20:19:18 -07:00 committed by GitHub
parent f0af8178af
commit 2e8e0a5f19
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 35 additions and 11 deletions

View file

@ -7,9 +7,7 @@
{#if hidePage}
<LoadingPage />
{/if}
{#if $currentVerifyCredentials }
<ComposeBox realm="home" hidden={hidePage}/>
{/if}
<div class="timeline-home-anchor-container">
{#if !hidePage && hideTimeline}
<LoadingPage />

View file

@ -1,13 +1,18 @@
<a href="/accounts/{verifyCredentials.id}"
<a {href}
rel="prefetch"
class="compose-box-avatar"
class="compose-box-avatar {loaded ? 'loaded' : 'not-loaded'}"
aria-hidden={!loaded}
aria-label="Profile for {accessibleName}">
<Avatar account={verifyCredentials} size="small"/>
</a>
<a class="compose-box-display-name" href="/accounts/{verifyCredentials.id}" rel="prefetch">
<a class="compose-box-display-name {loaded ? 'loaded' : 'not-loaded'}"
{href}
aria-hidden={!loaded}
rel="prefetch">
<AccountDisplayName account={verifyCredentials} />
</a>
<span class="compose-box-handle">
<span class="compose-box-handle {loaded ? 'loaded' : 'not-loaded'}"
aria-hidden={!loaded} >
{'@' + verifyCredentials.acct}
</span>
<style>
@ -41,6 +46,12 @@
font-size: 1.1em;
margin-left: 5px;
}
.not-loaded {
visibility: hidden;
}
.loaded {
visibility: visible;
}
@media (max-width: 767px) {
.compose-box-avatar {
@ -54,6 +65,7 @@
import { store } from '../../_store/store'
import AccountDisplayName from '../profile/AccountDisplayName.html'
import { removeEmoji } from '../../_utils/removeEmoji'
import { ONE_TRANSPARENT_PIXEL } from '../../_static/media'
export default {
components: {
@ -62,14 +74,26 @@
},
store: () => store,
computed: {
verifyCredentials: ({ $currentVerifyCredentials }) => $currentVerifyCredentials,
loaded: ({ $currentVerifyCredentials }) => !!$currentVerifyCredentials,
verifyCredentials: ({ $currentVerifyCredentials }) => {
// return a placeholder while we're waiting on IndexedDB to load
// (https://github.com/nolanlawson/pinafore/issues/1076)
return $currentVerifyCredentials || {
display_name: '',
acct: '',
avatar: ONE_TRANSPARENT_PIXEL,
avatar_static: ONE_TRANSPARENT_PIXEL
}
},
id: ({ verifyCredentials }) => (verifyCredentials && verifyCredentials.id),
href: ({ id }) => (id ? `/accounts/${id}` : '#'),
emojis: ({ verifyCredentials }) => (verifyCredentials.emojis || []),
displayName: ({ verifyCredentials }) => verifyCredentials.display_name || verifyCredentials.username,
accessibleName: ({ displayName, emojis, $omitEmojiInDisplayNames }) => {
if ($omitEmojiInDisplayNames) {
return removeEmoji(displayName, emojis) || displayName
return removeEmoji(displayName, emojis) || displayName || ''
}
return displayName
return displayName || ''
}
}
}

View file

@ -155,7 +155,9 @@
media: ({ composeData }) => composeData.media || [],
inReplyToId: ({ composeData }) => composeData.inReplyToId,
postPrivacy: ({ postPrivacyKey }) => POST_PRIVACY_OPTIONS.find(_ => _.key === postPrivacyKey),
defaultPostPrivacyKey: ({ $currentVerifyCredentials }) => $currentVerifyCredentials.source.privacy,
defaultPostPrivacyKey: ({ $currentVerifyCredentials }) => (
($currentVerifyCredentials && $currentVerifyCredentials.source.privacy) || 'public'
),
postPrivacyKey: ({ composeData, defaultPostPrivacyKey }) => composeData.postPrivacy || defaultPostPrivacyKey,
textLength: ({ text }) => measureText(text),
contentWarningLength: ({ contentWarning }) => measureText(contentWarning),