Merge branch 'from/develop/tusooa/remote-xact' into 'develop'

Remote interaction with posts: frontend part

See merge request pleroma/pleroma-fe!1419
This commit is contained in:
HJ 2022-11-21 19:34:19 +00:00
commit 513b81a23b
8 changed files with 49 additions and 7 deletions

View File

@ -48,6 +48,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
- Enabled users to zoom and pan images in media viewer with mouse and touch - Enabled users to zoom and pan images in media viewer with mouse and touch
- Timelines/panels and conversations have sticky headers now - Timelines/panels and conversations have sticky headers now
- Added frontend ui for account migration - Added frontend ui for account migration
- Implemented remote interaction with statuses
## [2.4.2] - 2022-01-09 ## [2.4.2] - 2022-01-09

View File

@ -39,7 +39,10 @@ const FavoriteButton = {
} }
}, },
computed: { computed: {
...mapGetters(['mergedConfig']) ...mapGetters(['mergedConfig']),
remoteInteractionLink () {
return this.$store.getters.remoteInteractionLink({ statusId: this.status.id })
}
} }
} }

View File

@ -33,13 +33,19 @@
/> />
</FALayers> </FALayers>
</button> </button>
<span v-else> <a
v-else
class="button-unstyled interactive"
target="_blank"
role="button"
:href="remoteInteractionLink"
>
<FAIcon <FAIcon
class="fa-scale-110 fa-old-padding" class="fa-scale-110 fa-old-padding"
:title="$t('tool_tip.favorite')" :title="$t('tool_tip.favorite')"
:icon="['far', 'star']" :icon="['far', 'star']"
/> />
</span> </a>
<span <span
v-if="!mergedConfig.hidePostStats && status.fave_num > 0" v-if="!mergedConfig.hidePostStats && status.fave_num > 0"
class="action-counter" class="action-counter"

View File

@ -17,6 +17,9 @@ const ReplyButton = {
computed: { computed: {
loggedIn () { loggedIn () {
return !!this.$store.state.users.currentUser return !!this.$store.state.users.currentUser
},
remoteInteractionLink () {
return this.$store.getters.remoteInteractionLink({ statusId: this.status.id })
} }
} }
} }

View File

@ -26,13 +26,19 @@
/> />
</FALayers> </FALayers>
</button> </button>
<span v-else> <a
v-else
class="button-unstyled interactive"
target="_blank"
role="button"
:href="remoteInteractionLink"
>
<FAIcon <FAIcon
icon="reply" icon="reply"
class="fa-scale-110 fa-old-padding" class="fa-scale-110 fa-old-padding"
:title="$t('tool_tip.reply')" :title="$t('tool_tip.reply')"
/> />
</span> </a>
<span <span
v-if="status.replies_count > 0" v-if="status.replies_count > 0"
class="action-counter" class="action-counter"

View File

@ -36,6 +36,9 @@ const RetweetButton = {
computed: { computed: {
mergedConfig () { mergedConfig () {
return this.$store.getters.mergedConfig return this.$store.getters.mergedConfig
},
remoteInteractionLink () {
return this.$store.getters.remoteInteractionLink({ statusId: this.status.id })
} }
} }
} }

View File

@ -40,13 +40,19 @@
:title="$t('timeline.no_retweet_hint')" :title="$t('timeline.no_retweet_hint')"
/> />
</span> </span>
<span v-else> <a
v-else
class="button-unstyled interactive"
target="_blank"
role="button"
:href="remoteInteractionLink"
>
<FAIcon <FAIcon
class="fa-scale-110 fa-old-padding" class="fa-scale-110 fa-old-padding"
icon="retweet" icon="retweet"
:title="$t('tool_tip.repeat')" :title="$t('tool_tip.repeat')"
/> />
</span> </a>
<span <span
v-if="!mergedConfig.hidePostStats && status.repeat_num > 0" v-if="!mergedConfig.hidePostStats && status.repeat_num > 0"
class="no-event" class="no-event"

View File

@ -36,6 +36,8 @@ const REGIONAL_INDICATORS = (() => {
return res return res
})() })()
const REMOTE_INTERACTION_URL = '/main/ostatus'
const defaultState = { const defaultState = {
// Stuff from apiConfig // Stuff from apiConfig
name: 'Pleroma FE', name: 'Pleroma FE',
@ -214,6 +216,18 @@ const instance = {
}, },
instanceDomain (state) { instanceDomain (state) {
return new URL(state.server).hostname return new URL(state.server).hostname
},
remoteInteractionLink (state) {
const server = state.server.endsWith('/') ? state.server.slice(0, -1) : state.server
const link = server + REMOTE_INTERACTION_URL
return ({ statusId, nickname }) => {
if (statusId) {
return `${link}?status_id=${statusId}`
} else {
return `${link}?nickname=${nickname}`
}
}
} }
}, },
actions: { actions: {