logo

pleroma-fe

My custom branche(s) on git.pleroma.social/pleroma/pleroma-fe git clone https://hacktivis.me/git/pleroma-fe.git
commit: 228a9afdf5ecc10a17de31f88bd88ad1efbe0004
parent 95c15fca225d989613a50a6039c8ffa809a8fd88
Author: Tusooa Zhu <tusooa@kazv.moe>
Date:   Sat, 30 Apr 2022 11:08:19 -0400

Add timed-mute functionality

Diffstat:

Msrc/components/poll/poll_form.js13++-----------
Msrc/components/user_card/user_card.js13+++++++++++--
Msrc/components/user_card/user_card.scss5+++++
Msrc/components/user_card/user_card.vue28+++++++++++++++++++++++++++-
Msrc/modules/users.js7+++++--
Msrc/services/api/api.service.js8++++++--
Msrc/services/date_utils/date_utils.js16++++++++++++++++
7 files changed, 72 insertions(+), 18 deletions(-)

diff --git a/src/components/poll/poll_form.js b/src/components/poll/poll_form.js @@ -94,19 +94,10 @@ export default { }, convertExpiryToUnit (unit, amount) { // Note: we want seconds and not milliseconds - switch (unit) { - case 'minutes': return (1000 * amount) / DateUtils.MINUTE - case 'hours': return (1000 * amount) / DateUtils.HOUR - case 'days': return (1000 * amount) / DateUtils.DAY - } + return DateUtils.secondsToUnit(unit, amount) }, convertExpiryFromUnit (unit, amount) { - // Note: we want seconds and not milliseconds - switch (unit) { - case 'minutes': return 0.001 * amount * DateUtils.MINUTE - case 'hours': return 0.001 * amount * DateUtils.HOUR - case 'days': return 0.001 * amount * DateUtils.DAY - } + return DateUtils.unitToSeconds(unit, amount) }, expiryAmountChange () { this.expiryAmount = diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js @@ -1,3 +1,4 @@ +import { unitToSeconds } from 'src/services/date_utils/date_utils.js' import UserAvatar from '../user_avatar/user_avatar.vue' import RemoteFollow from '../remote_follow/remote_follow.vue' import ProgressButton from '../progress_button/progress_button.vue' @@ -48,7 +49,9 @@ export default { return { followRequestInProgress: false, betterShadow: this.$store.state.interface.browserSupport.cssFilter, - showingConfirmMute: false + showingConfirmMute: false, + muteExpiryAmount: 0, + muteExpiryUnit: 'minutes' } }, created () { @@ -142,6 +145,9 @@ export default { shouldConfirmMute () { return this.mergedConfig.modalOnMute }, + muteExpiryUnits () { + return ['minutes', 'hours', 'days'] + }, ...mapGetters(['mergedConfig']) }, components: { @@ -172,7 +178,10 @@ export default { } }, doMuteUser () { - this.$store.dispatch('muteUser', this.user.id) + this.$store.dispatch('muteUser', { + id: this.user.id, + expiresIn: this.shouldConfirmMute ? unitToSeconds(this.muteExpiryUnit, this.muteExpiryAmount) : 0 + }) this.hideConfirmMute() }, unmuteUser () { diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss @@ -355,3 +355,8 @@ text-decoration: none; } } + +.mute-expiry { + display: flex; + flex-direction: row; +} diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue @@ -325,7 +325,7 @@ > <i18n-t keypath="user_card.mute_confirm" - tag="span" + tag="div" > <template #user> <span @@ -333,6 +333,32 @@ /> </template> </i18n-t> + <div + class="mute-expiry" + > + <label> + {{ $t('user_card.mute_duration_prompt') }} + </label> + <input + v-model="muteExpiryAmount" + type="number" + class="expiry-amount hide-number-spinner" + :min="0" + > + <Select + v-model="muteExpiryUnit" + unstyled="true" + class="expiry-unit" + > + <option + v-for="unit in muteExpiryUnits" + :key="unit" + :value="unit" + > + {{ $t(`time.${unit}_short`, ['']) }} + </option> + </Select> + </div> </confirm-modal> </teleport> </div> diff --git a/src/modules/users.js b/src/modules/users.js @@ -61,13 +61,16 @@ const editUserNote = (store, { id, comment }) => { .then((relationship) => store.commit('updateUserRelationship', [relationship])) } -const muteUser = (store, id) => { +const muteUser = (store, args) => { + const id = typeof args === 'object' ? args.id : args + const expiresIn = typeof args === 'object' ? args.expiresIn : 0 + const predictedRelationship = store.state.relationships[id] || { id } predictedRelationship.muting = true store.commit('updateUserRelationship', [predictedRelationship]) store.commit('addMuteId', id) - return store.rootState.api.backendInteractor.muteUser({ id }) + return store.rootState.api.backendInteractor.muteUser({ id, expiresIn }) .then((relationship) => { store.commit('updateUserRelationship', [relationship]) store.commit('addMuteId', id) diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js @@ -1118,8 +1118,12 @@ const fetchMutes = ({ credentials }) => { .then((users) => users.map(parseUser)) } -const muteUser = ({ id, credentials }) => { - return promisedRequest({ url: MASTODON_MUTE_USER_URL(id), credentials, method: 'POST' }) +const muteUser = ({ id, expiresIn, credentials }) => { + const payload = {} + if (expiresIn) { + payload['expires_in'] = expiresIn + } + return promisedRequest({ url: MASTODON_MUTE_USER_URL(id), credentials, method: 'POST', payload }) } const unmuteUser = ({ id, credentials }) => { diff --git a/src/services/date_utils/date_utils.js b/src/services/date_utils/date_utils.js @@ -41,3 +41,19 @@ export const relativeTimeShort = (date, nowThreshold = 1) => { r.key += '_short' return r } + +export const unitToSeconds = (unit, amount) => { + switch (unit) { + case 'minutes': return 0.001 * amount * MINUTE + case 'hours': return 0.001 * amount * HOUR + case 'days': return 0.001 * amount * DAY + } +} + +export const secondsToUnit = (unit, amount) => { + switch (unit) { + case 'minutes': return (1000 * amount) / MINUTE + case 'hours': return (1000 * amount) / HOUR + case 'days': return (1000 * amount) / DAY + } +}