add ability to post a reply

This commit is contained in:
Nolan Lawson 2018-03-07 18:04:20 -08:00
parent d5aa18ddb6
commit e3850beddf
5 changed files with 87 additions and 4 deletions

View File

@ -35,12 +35,18 @@ export async function postStatus (realm, text, inReplyToId, mediaIds,
return return
} }
store.set({postingStatus: true}) store.set({
postingStatus: true,
postedStatusForRealm: null
})
try { try {
let status = await postStatusToServer(instanceName, accessToken, text, let status = await postStatusToServer(instanceName, accessToken, text,
inReplyToId, mediaIds, sensitive, spoilerText, visibility) inReplyToId, mediaIds, sensitive, spoilerText, visibility)
addStatusOrNotification(instanceName, 'home', status) addStatusOrNotification(instanceName, 'home', status)
store.clearComposeData(realm) store.clearComposeData(realm)
store.set({
postedStatusForRealm: realm
})
} catch (e) { } catch (e) {
toast.say('Unable to post status: ' + (e.message || '')) toast.say('Unable to post status: ' + (e.message || ''))
} finally { } finally {

View File

@ -61,6 +61,13 @@
import { postStatus } from '../../_actions/statuses' import { postStatus } from '../../_actions/statuses'
export default { export default {
oncreate() {
this.observe('postedStatusForRealm', postedStatusForRealm => {
if (postedStatusForRealm === this.get('realm')) {
window.history.back()
}
}, {init: false})
},
components: { components: {
ComposeAuthor, ComposeAuthor,
ComposeToolbar, ComposeToolbar,
@ -86,7 +93,8 @@
}, },
overLimit: (length) => length > CHAR_LIMIT, overLimit: (length) => length > CHAR_LIMIT,
contentWarningShown: (composeData) => composeData.contentWarningShown, contentWarningShown: (composeData) => composeData.contentWarningShown,
contentWarning: (composeData) => composeData.contentWarning || '' contentWarning: (composeData) => composeData.contentWarning || '',
postedStatusForRealm: ($postedStatusForRealm) => $postedStatusForRealm
}, },
transitions: { transitions: {
slide slide
@ -101,7 +109,9 @@
let realm = this.get('realm') let realm = this.get('realm')
let mediaIds = media.map(_ => _.data.id) let mediaIds = media.map(_ => _.data.id)
/* no await */ postStatus(realm, text, null, mediaIds, let inReplyTo = realm === 'home' ? null : realm
/* no await */ postStatus(realm, text, inReplyTo, mediaIds,
sensitive, contentWarning, postPrivacyKey) sensitive, contentWarning, postPrivacyKey)
} }
} }

View File

@ -157,7 +157,9 @@
return `${$currentInstance}/${timelineType}/${timelineValue}/${notification ? notification.id : ''}/${status.id}` return `${$currentInstance}/${timelineType}/${timelineValue}/${notification ? notification.id : ''}/${status.id}`
}, },
originalAccount: (originalStatus) => originalStatus.account, originalAccount: (originalStatus) => originalStatus.account,
isStatusInOwnThread: (timelineType, timelineValue, statusId) => timelineType === 'status' && timelineValue === statusId, isStatusInOwnThread: (timelineType, timelineValue, statusId) => {
return (timelineType === 'status' || timelineType === 'reply') && timelineValue === statusId
},
isStatusInNotification: (status, notification) => notification && notification.status && notification.type !== 'mention' && notification.status.id === status.id, isStatusInNotification: (status, notification) => notification && notification.status && notification.type !== 'mention' && notification.status.id === status.id,
spoilerShown: ($spoilersShown, contextualStatusId) => !!$spoilersShown[contextualStatusId], spoilerShown: ($spoilersShown, contextualStatusId) => !!$spoilersShown[contextualStatusId],
visibility: (originalStatus) => originalStatus.visibility, visibility: (originalStatus) => originalStatus.visibility,

View File

@ -2,6 +2,9 @@
<IconButton <IconButton
label="Reply" label="Reply"
href="#fa-reply" href="#fa-reply"
disabled="{{disableReply}}"
delegateKey="{{replyKey}}"
ref:replyNode
/> />
<IconButton <IconButton
label="{{reblogLabel}}" label="{{reblogLabel}}"
@ -41,15 +44,18 @@
import { registerClickDelegate, unregisterClickDelegate } from '../../_utils/delegate' import { registerClickDelegate, unregisterClickDelegate } from '../../_utils/delegate'
import { setFavorited } from '../../_actions/favorite' import { setFavorited } from '../../_actions/favorite'
import { setReblogged } from '../../_actions/reblog' import { setReblogged } from '../../_actions/reblog'
import { goto } from 'sapper/runtime.js'
export default { export default {
oncreate() { oncreate() {
registerClickDelegate(this.get('favoriteKey'), () => this.onFavoriteClick()) registerClickDelegate(this.get('favoriteKey'), () => this.onFavoriteClick())
registerClickDelegate(this.get('reblogKey'), () => this.onReblogClick()) registerClickDelegate(this.get('reblogKey'), () => this.onReblogClick())
registerClickDelegate(this.get('replyKey'), () => this.onReplyClick())
}, },
ondestroy() { ondestroy() {
unregisterClickDelegate(this.get('favoriteKey')) unregisterClickDelegate(this.get('favoriteKey'))
unregisterClickDelegate(this.get('reblogKey')) unregisterClickDelegate(this.get('reblogKey'))
unregisterClickDelegate(this.get('replyKey'))
}, },
components: { components: {
IconButton IconButton
@ -65,6 +71,10 @@
let statusId = this.get('statusId') let statusId = this.get('statusId')
let reblogged = this.get('reblogged') let reblogged = this.get('reblogged')
/* no await */ setReblogged(statusId, !reblogged) /* no await */ setReblogged(statusId, !reblogged)
},
onReplyClick() {
let statusId = this.get('statusId')
goto(`/statuses/${statusId}/reply`)
} }
}, },
computed: { computed: {
@ -105,8 +115,10 @@
return status.favourited return status.favourited
}, },
statusId: (status) => status.id, statusId: (status) => status.id,
disableReply: (statusId, timelineType, timelineValue) => timelineType === 'reply' && statusId === timelineValue,
favoriteKey: (statusId, timelineType, timelineValue) => `fav-${timelineType}-${timelineValue}-${statusId}`, favoriteKey: (statusId, timelineType, timelineValue) => `fav-${timelineType}-${timelineValue}-${statusId}`,
reblogKey: (statusId, timelineType, timelineValue) => `reblog-${timelineType}-${timelineValue}-${statusId}`, reblogKey: (statusId, timelineType, timelineValue) => `reblog-${timelineType}-${timelineValue}-${statusId}`,
replyKey: (statusId, timelineType, timelineValue) => `reply-${timelineType}-${timelineValue}-${statusId}`,
} }
} }
</script> </script>

View File

@ -0,0 +1,53 @@
<:Head>
<title>Pinafore Reply</title>
</:Head>
<Layout page='reply' >
<DynamicPageBanner title=""/>
<div class="reply-container">
{{#if status}}
<Status index="0"
length="1"
timelineType="reply"
timelineValue="{{params.statusId}}"
:status
/>
<ComposeBox realm="{{params.statusId}}" />
{{else}}
<LoadingPage />
{{/if}}
</div>
</Layout>
<style>
.reply-container {
position: relative;
margin-top: 20px;
min-height: 60vh;
}
</style>
<script>
import Layout from '../../_components/Layout.html'
import { store } from '../../_store/store.js'
import DynamicPageBanner from '../../_components/DynamicPageBanner.html'
import LoadingPage from '../../_components/LoadingPage.html'
import ComposeBox from '../../_components/compose/ComposeBox.html'
import Status from '../../_components/status/Status.html'
import { database } from '../../_database/database'
export default {
async oncreate() {
let statusId = this.get('params').statusId
let instanceName = this.store.get('currentInstance')
let status = await database.getStatus(instanceName, statusId)
this.set({status})
},
store: () => store,
components: {
Layout,
DynamicPageBanner,
LoadingPage,
ComposeBox,
Status
}
}
</script>