hj/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge branch 'notifications-thru-sw' into shigusegubu-vue3

Browse source
This commit is contained in:
Henry Jameson 2023-11-13 17:29:43 +02:00
commit e9bc8f020a
32 changed files with 1076 additions and 68 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/components/emoji_input/emoji_input.js
View file

@ -1,4 +1,5 @@
import Completion from '../../services/completion/completion.js'
import genRandomSeed from '../../services/random_seed/random_seed.service.js'
import EmojiPicker from '../emoji_picker/emoji_picker.vue'
import Popover from 'src/components/popover/popover.vue'
import ScreenReaderNotice from 'src/components/screen_reader_notice/screen_reader_notice.vue'
@ -110,7 +111,7 @@ const EmojiInput = {
},
data () {
return {
randomSeed: `${Math.random()}`.replace('.', '-'),
randomSeed: genRandomSeed(),
input: undefined,
caretEl: undefined,
highlighted: -1,

2
src/components/emoji_picker/emoji_picker.vue
View file

@ -3,7 +3,7 @@
ref="popover"
trigger="click"
popover-class="emoji-picker popover-default"
:trigger-attrs="{ 'aria-hidden': true }"
:trigger-attrs="{ 'aria-hidden': true, tabindex: -1 }"
@show="onPopoverShown"
@close="onPopoverClosed"
>

13
src/components/extra_buttons/extra_buttons.js
View file

@ -1,4 +1,5 @@
import Popover from '../popover/popover.vue'
import genRandomSeed from '../../services/random_seed/random_seed.service.js'
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -40,7 +41,8 @@ const ExtraButtons = {
data () {
return {
expanded: false,
showingDeleteDialog: false
showingDeleteDialog: false,
randomSeed: genRandomSeed()
}
},
methods: {
@ -152,6 +154,15 @@ const ExtraButtons = {
editingAvailable () { return this.$store.state.instance.editingAvailable },
shouldConfirmDelete () {
return this.$store.getters.mergedConfig.modalOnDelete
},
triggerAttrs () {
return {
title: this.$t('status.more_actions'),
id: `popup-trigger-${this.randomSeed}`,
'aria-controls': `popup-menu-${this.randomSeed}`,
'aria-expanded': this.expanded,
'aria-haspopup': 'menu'
}
}
}
}

19
src/components/extra_buttons/extra_buttons.vue
View file

@ -2,6 +2,7 @@
<Popover
class="ExtraButtons"
trigger="click"
:trigger-attrs="triggerAttrs"
placement="top"
:offset="{ y: 5 }"
:bound-to="{ x: 'container' }"
@ -10,10 +11,15 @@
@close="onClose"
>
<template #content="{close}">
<div class="dropdown-menu">
<div
class="dropdown-menu"
role="menu"
:id="`popup-menu-${randomSeed}`"
>
<button
v-if="canMute && !status.thread_muted"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="muteConversation"
>
<FAIcon
@ -24,6 +30,7 @@
<button
v-if="canMute && status.thread_muted"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="unmuteConversation"
>
<FAIcon
@ -34,6 +41,7 @@
<button
v-if="!status.pinned && canPin"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="pinStatus"
@click="close"
>
@ -45,6 +53,7 @@
<button
v-if="status.pinned && canPin"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="unpinStatus"
@click="close"
>
@ -57,6 +66,7 @@
<button
v-if="!status.bookmarked"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="bookmarkStatus"
@click="close"
>
@ -68,6 +78,7 @@
<button
v-if="status.bookmarked"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="unbookmarkStatus"
@click="close"
>
@ -80,6 +91,7 @@
<button
v-if="ownStatus && editingAvailable"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="editStatus"
@click="close"
>
@ -91,6 +103,7 @@
<button
v-if="isEdited && editingAvailable"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="showStatusHistory"
@click="close"
>
@ -102,6 +115,7 @@
<button
v-if="canDelete"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="deleteStatus"
@click="close"
>
@ -112,6 +126,7 @@
</button>
<button
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="copyLink"
@click="close"
>
@ -123,6 +138,7 @@
<a
v-if="!status.is_local"
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
title="Source"
:href="status.external_url"
target="_blank"
@ -134,6 +150,7 @@
</a>
<button
class="button-default dropdown-item dropdown-item-icon"
role="menuitem"
@click.prevent="reportStatus"
@click="close"
>

6
src/components/notification/notification.js
View file

@ -50,6 +50,7 @@ const Notification = {
}
},
props: ['notification'],
emits: ['interacted'],
components: {
StatusContent,
UserAvatar,
@ -72,6 +73,9 @@ const Notification = {
getUser (notification) {
return this.$store.state.users.usersObject[notification.from_profile.id]
},
interacted () {
this.$emit('interacted')
},
toggleMute () {
this.unmuted = !this.unmuted
},
@ -95,6 +99,7 @@ const Notification = {
}
},
doApprove () {
this.$emit('interacted')
this.$store.state.api.backendInteractor.approveUser({ id: this.user.id })
this.$store.dispatch('removeFollowRequest', this.user)
this.$store.dispatch('markSingleNotificationAsSeen', { id: this.notification.id })
@ -114,6 +119,7 @@ const Notification = {
}
},
doDeny () {
this.$emit('interacted')
this.$store.state.api.backendInteractor.denyUser({ id: this.user.id })
.then(() => {
this.$store.dispatch('dismissNotificationLocal', { id: this.notification.id })

1
src/components/notification/notification.vue
View file

@ -6,6 +6,7 @@
class="Notification"
:compact="true"
:statusoid="notification.status"
@interacted="interacted"
/>
</article>
<article v-else>

20
src/components/notifications/notifications.js
View file

@ -159,6 +159,26 @@ const Notifications = {
updateScrollPosition () {
this.showScrollTop = this.$refs.root.offsetTop < this.scrollerRef.scrollTop
},
notificationClicked (notification) {
const { type, id, seen } = notification
if (!seen) {
switch (type) {
case 'mention':
case 'pleroma:report':
case 'follow_request':
break
default:
this.markOneAsSeen(id)
}
}
},
notificationInteracted (notification) {
const { id, seen } = notification
if (!seen) this.markOneAsSeen(id)
},
markOneAsSeen (id) {
this.$store.dispatch('markSingleNotificationAsSeen', { id })
},
markAsSeen () {
this.$store.dispatch('markNotificationsAsSeen')
this.seenToDisplayCount = DEFAULT_SEEN_TO_DISPLAY_COUNT

6
src/components/notifications/notifications.vue
View file

@ -67,9 +67,13 @@
role="listitem"
class="notification"
:class="{unseen: !minimalMode && !notification.seen}"
@click="e => notificationClicked(notification)"
>
<div class="notification-overlay" />
<notification :notification="notification" />
<notification
:notification="notification"
@interacted="e => notificationInteracted(notification)"
/>
</div>
</div>
<div class="panel-footer">

3
src/components/poll/poll.js
View file

@ -1,4 +1,5 @@
import Timeago from 'components/timeago/timeago.vue'
import genRandomSeed from '../../services/random_seed/random_seed.service.js'
import RichContent from 'components/rich_content/rich_content.jsx'
import { forEach, map } from 'lodash'
@ -13,7 +14,7 @@ export default {
return {
loading: false,
choices: [],
randomSeed: `${Math.random()}`.replace('.', '-')
randomSeed: genRandomSeed()
}
},
created () {

3
src/components/post_status_form/post_status_form.js
View file

@ -1,4 +1,5 @@
import statusPoster from '../../services/status_poster/status_poster.service.js'
import genRandomSeed from '../../services/random_seed/random_seed.service.js'
import MediaUpload from '../media_upload/media_upload.vue'
import ScopeSelector from '../scope_selector/scope_selector.vue'
import EmojiInput from '../emoji_input/emoji_input.vue'
@ -162,7 +163,7 @@ const PostStatusForm = {
}
return {
randomSeed: `${Math.random()}`.replace('.', '-'),
randomSeed: genRandomSeed(),
dropFiles: [],
uploadingFiles: false,
error: null,

2
src/components/react_button/react_button.vue
View file

@ -11,6 +11,8 @@
/>
<span
class="button-unstyled popover-trigger"
role="button"
:tabindex="0"
:title="$t('tool_tip.add_reaction')"
@click.stop.prevent="show"
>

4
src/components/settings_modal/admin_tabs/frontends_tab.vue
View file

@ -34,9 +34,9 @@
>
<strong>{{ frontend.name }}</strong>
{{ ' ' }}
<span v-if="adminDraft[':pleroma'][':frontends'][':primary'].name === frontend.name">
<span v-if="adminDraft[':pleroma'][':frontends'][':primary']?.name === frontend.name">
<i18n-t
v-if="adminDraft[':pleroma'][':frontends'][':primary'].ref === frontend.refs[0]"
v-if="adminDraft[':pleroma'][':frontends'][':primary']?.ref === frontend.refs[0]"
keypath="admin_dash.frontend.is_default"
/>
<i18n-t

5
src/components/settings_modal/tabs/filtering_tab.vue
View file

@ -91,6 +91,11 @@
{{ $t('settings.hide_attachments_in_convo') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="hideScrobbles">
{{ $t('settings.hide_scrobbles') }}
</BooleanSetting>
</li>
</ul>
</div>
<div

15
src/components/status/status.js
View file

@ -39,7 +39,8 @@ import {
faThumbtack,
faChevronUp,
faChevronDown,
faAngleDoubleRight
faAngleDoubleRight,
faPlay
} from '@fortawesome/free-solid-svg-icons'
library.add(
@ -59,7 +60,8 @@ library.add(
faThumbtack,
faChevronUp,
faChevronDown,
faAngleDoubleRight
faAngleDoubleRight,
faPlay
)
const camelCase = name => name.charAt(0).toUpperCase() + name.slice(1)
@ -152,6 +154,7 @@ const Status = {
'controlledSetMediaPlaying',
'dive'
],
emits: ['interacted'],
data () {
return {
uncontrolledReplying: false,
@ -415,6 +418,12 @@ const Status = {
},
shouldDisplayQuote () {
return this.quotedStatus && this.displayQuote
},
scrobblePresent () {
return !this.mergedConfig.hideScrobbles && this.status.user.latestScrobble && this.status.user.latestScrobble.artist
},
scrobble () {
return this.status.user.latestScrobble
}
},
methods: {
@ -434,9 +443,11 @@ const Status = {
this.error = error
},
clearError () {
this.$emit('interacted')
this.error = undefined
},
toggleReplying () {
this.$emit('interacted')
controlledOrUncontrolledToggle(this, 'replying')
},
gotoOriginal (id) {

21
src/components/status/status.vue
View file

@ -249,6 +249,24 @@
</button>
</span>
</div>
<div class="status-rich-presence" v-if="scrobblePresent">
<FAIcon
class="fa-scale-110 fa-old-padding"
icon="music"
/>
{{ scrobble.artist }} — {{ scrobble.title }}
<FAIcon
class="fa-scale-110 fa-old-padding"
icon="play"
/>
<span class="status-rich-presence-time">
<Timeago
template-key="time.in_past"
:time="scrobble.created_at"
:auto-update="60"
/>
</span>
</div>
<div
v-if="isReply || hasMentionsLine"
class="heading-reply-row"
@ -490,14 +508,17 @@
:visibility="status.visibility"
:logged-in="loggedIn"
:status="status"
@click="$emit('interacted')"
/>
<favorite-button
:logged-in="loggedIn"
:status="status"
@click="$emit('interacted')"
/>
<ReactButton
v-if="loggedIn"
:status="status"
@click="$emit('interacted')"
/>
<extra-buttons
:status="status"