moon
/
pleroma-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/develop' into been-awhile 

* origin/develop:
  lint
  fix bugs
  Apply 1 suggestion(s) to 1 file(s)
  change icons
  Update dependency vue-i18n to v9.2.0
  made quick settings into their own component, added quick view settings, added both to conversation view
This commit is contained in:
Henry Jameson 2022-08-08 01:48:38 +03:00
parent 4bfad25f01 068139b27e
commit 59d160a6dd
11 changed files with 238 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -40,7 +40,7 @@
"qrcode": "1",
"utf8": "^3.0.0",
"vue": "3.2.37",
"vue-i18n": "9.2.0-beta.40",
"vue-i18n": "9.2.0",
"vue-router": "4.1.3",
"vue-template-compiler": "2.7.8",
"vuex": "4.0.2"

6
src/components/conversation/conversation.js
View File

@ -1,6 +1,8 @@
import { reduce, filter, findIndex, clone, get } from 'lodash'
import Status from '../status/status.vue'
import ThreadTree from '../thread_tree/thread_tree.vue'
import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
@ -343,7 +345,9 @@ const conversation = {
},
components: {
Status,
ThreadTree
ThreadTree,
QuickFilterSettings,
QuickViewSettings
},
watch: {
statusId (newVal, oldVal) {

8
src/components/conversation/conversation.vue
View File

@ -17,6 +17,14 @@
>
{{ $t('timeline.collapse') }}
</button>
<QuickFilterSettings
v-if="!collapsable"
:conversation="true"
/>
<QuickViewSettings
v-if="!collapsable"
:conversation="true"
/>
</div>
<div class="conversation-body panel-body">
<div

7
src/components/timeline/timeline_quick_settings.js → src/components/quick_filter_settings/quick_filter_settings.js
View File

@ -9,7 +9,10 @@ library.add(
faWrench
)
const TimelineQuickSettings = {
const QuickFilterSettings = {
props: {
conversation: Boolean
},
components: {
Popover
},
@ -64,4 +67,4 @@ const TimelineQuickSettings = {
}
}
export default TimelineQuickSettings
export default QuickFilterSettings

18
src/components/timeline/timeline_quick_settings.vue → src/components/quick_filter_settings/quick_filter_settings.vue
View File

@ -1,13 +1,14 @@
<template>
<Popover
trigger="click"
class="TimelineQuickSettings"
class="QuickFilterSettings"
:bound-to="{ x: 'container' }"
>
<template #content>
<div class="dropdown-menu">
<div v-if="loggedIn">
<button
v-if="!conversation"
class="button-default dropdown-item"
@click="replyVisibilityAll = true"
>
@ -17,6 +18,7 @@
/>{{ $t('settings.reply_visibility_all') }}
</button>
<button
v-if="!conversation"
class="button-default dropdown-item"
@click="replyVisibilityFollowing = true"
>
@ -26,6 +28,7 @@
/>{{ $t('settings.reply_visibility_following_short') }}
</button>
<button
v-if="!conversation"
class="button-default dropdown-item"
@click="replyVisibilitySelf = true"
>
@ -35,6 +38,7 @@
/>{{ $t('settings.reply_visibility_self_short') }}
</button>
<div
v-if="!conversation"
role="separator"
class="dropdown-divider"
/>
@ -70,13 +74,7 @@
class="button-default dropdown-item dropdown-item-icon"
@click="openTab('filtering')"
>
<FAIcon icon="font" />{{ $t('settings.word_filter') }}
</button>
<button
class="button-default dropdown-item dropdown-item-icon"
@click="openTab('general')"
>
<FAIcon icon="wrench" />{{ $t('settings.more_settings') }}
<FAIcon icon="font" />{{ $t('settings.word_filter_and_more') }}
</button>
</div>
</template>
@ -88,11 +86,11 @@
</Popover>
</template>
<script src="./timeline_quick_settings.js"></script>
<script src="./quick_filter_settings.js"></script>
<style lang="scss">
.TimelineQuickSettings {
.QuickFilterSettings {
> button {
line-height: 100%;

69
src/components/quick_view_settings/quick_view_settings.js Normal file
View File

@ -0,0 +1,69 @@
import Popover from '../popover/popover.vue'
import { mapGetters } from 'vuex'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faList, faFolderTree, faBars, faWrench } from '@fortawesome/free-solid-svg-icons'
library.add(
faList,
faFolderTree,
faBars,
faWrench
)
const QuickViewSettings = {
props: {
conversation: Boolean
},
components: {
Popover
},
methods: {
setConversationDisplay (visibility) {
this.$store.dispatch('setOption', { name: 'conversationDisplay', value: visibility })
},
openTab (tab) {
this.$store.dispatch('openSettingsModalTab', tab)
}
},
computed: {
...mapGetters(['mergedConfig']),
loggedIn () {
return !!this.$store.state.users.currentUser
},
conversationDisplay: {
get () { return this.mergedConfig.conversationDisplay },
set (newVal) { this.setConversationDisplay(newVal) }
},
autoUpdate: {
get () { return this.mergedConfig.streaming },
set () {
const value = !this.autoUpdate
this.$store.dispatch('setOption', { name: 'streaming', value })
}
},
collapseWithSubjects: {
get () { return this.mergedConfig.collapseMessageWithSubject },
set () {
const value = !this.collapseWithSubjects
this.$store.dispatch('setOption', { name: 'collapseMessageWithSubject', value })
}
},
showUserAvatars: {
get () { return this.mergedConfig.mentionLinkShowAvatar },
set () {
const value = !this.showUserAvatars
console.log(value)
this.$store.dispatch('setOption', { name: 'mentionLinkShowAvatar', value })
}
},
muteBotStatuses: {
get () { return this.mergedConfig.muteBotStatuses },
set () {
const value = !this.muteBotStatuses
this.$store.dispatch('setOption', { name: 'muteBotStatuses', value })
}
}
}
}
export default QuickViewSettings

94
src/components/quick_view_settings/quick_view_settings.vue Normal file
View File

@ -0,0 +1,94 @@
<template>
<Popover
trigger="click"
class="QuickViewSettings"
:bound-to="{ x: 'container' }"
>
<template #content>
<div class="dropdown-menu">
<button
class="button-default dropdown-item"
@click="conversationDisplay = 'tree'"
>
<span
class="menu-checkbox -radio"
:class="{ 'menu-checkbox-checked': conversationDisplay === 'tree' }"
/><FAIcon icon="folder-tree" /> {{ $t('settings.conversation_display_tree_quick') }}
</button>
<button
class="button-default dropdown-item"
@click="conversationDisplay = 'linear'"
>
<span
class="menu-checkbox -radio"
:class="{ 'menu-checkbox-checked': conversationDisplay === 'linear' }"
/><FAIcon icon="list" /> {{ $t('settings.conversation_display_linear_quick') }}
</button>
<div
role="separator"
class="dropdown-divider"
/>
<button
class="button-default dropdown-item"
@click="showUserAvatars = !showUserAvatars"
>
<span
class="menu-checkbox"
:class="{ 'menu-checkbox-checked': showUserAvatars }"
/>{{ $t('settings.mention_link_show_avatar_quick') }}
</button>
<button
v-if="!conversation"
class="button-default dropdown-item"
@click="autoUpdate = !autoUpdate"
>
<span
class="menu-checkbox"
:class="{ 'menu-checkbox-checked': autoUpdate }"
/>{{ $t('settings.auto_update') }}
</button>
<button
v-if="!conversation"
class="button-default dropdown-item"
@click="collapseWithSubjects = !collapseWithSubjects"
>
<span
class="menu-checkbox"
:class="{ 'menu-checkbox-checked': collapseWithSubjects }"
/>{{ $t('settings.collapse_subject') }}
</button>
<button
class="button-default dropdown-item dropdown-item-icon"
@click="openTab('general')"
>
<FAIcon icon="wrench" />{{ $t('settings.more_settings') }}
</button>
</div>
</template>
<template #trigger>
<button class="button-unstyled">
<FAIcon icon="bars" />
</button>
</template>
</Popover>
</template>
<script src="./quick_view_settings.js"></script>
<style lang="scss">
.QuickViewSettings {
> button {
line-height: 100%;
height: 100%;
width: var(--__panel-heading-height-inner);
text-align: center;
svg {
font-size: 1.2em;
}
}
}
</style>

6
src/components/timeline/timeline.js
View File

@ -2,7 +2,8 @@ import Status from '../status/status.vue'
import timelineFetcher from '../../services/timeline_fetcher/timeline_fetcher.service.js'
import Conversation from '../conversation/conversation.vue'
import TimelineMenu from '../timeline_menu/timeline_menu.vue'
import TimelineQuickSettings from './timeline_quick_settings.vue'
import QuickFilterSettings from '../quick_filter_settings/quick_filter_settings.vue'
import QuickViewSettings from '../quick_view_settings/quick_view_settings.vue'
import { debounce, throttle, keyBy } from 'lodash'
import { library } from '@fortawesome/fontawesome-svg-core'
import { faCircleNotch, faCog } from '@fortawesome/free-solid-svg-icons'
@ -38,7 +39,8 @@ const Timeline = {
Status,
Conversation,
TimelineMenu,
TimelineQuickSettings
QuickFilterSettings,
QuickViewSettings
},
computed: {
filteredVisibleStatuses () {

3
src/components/timeline/timeline.vue
View File

@ -16,7 +16,8 @@
>
{{ $t('timeline.up_to_date') }}
</div>
<TimelineQuickSettings v-if="!embedded" />
<QuickFilterSettings v-if="!embedded" />
<QuickViewSettings v-if="!embedded" />
</div>
<div :class="classes.body">
<div

7
src/i18n/en.json
View File

@ -376,7 +376,7 @@
"filtering": "Filtering",
"wordfilter": "Wordfilter",
"filtering_explanation": "All statuses containing these words will be muted, one per line",
"word_filter": "Word filter",
"word_filter_and_more": "Word filter and more...",
"follow_export": "Follow export",
"follow_export_button": "Export your follows to a csv file",
"follow_import": "Follow import",
@ -510,6 +510,7 @@
"subject_line_noop": "Do not copy",
"conversation_display": "Conversation display style",
"conversation_display_tree": "Tree-style",
"conversation_display_tree_quick": "Tree view",
"disable_sticky_headers": "Don't stick column headers to top of the screen",
"show_scrollbars": "Show side column's scrollbars",
"third_column_mode": "When there's enough space, show third column containing",
@ -519,6 +520,7 @@
"tree_advanced": "Allow more flexible navigation in tree view",
"tree_fade_ancestors": "Display ancestors of the current status in faint text",
"conversation_display_linear": "Linear-style",
"conversation_display_linear_quick": "Linear view",
"conversation_other_replies_button": "Show the \"other replies\" button",
"conversation_other_replies_button_below": "Below statuses",
"conversation_other_replies_button_inside": "Inside statuses",
@ -527,8 +529,10 @@
"sensitive_by_default": "Mark posts as sensitive by default",
"stop_gifs": "Pause animated images until you hover on them",
"streaming": "Automatically show new posts when scrolled to the top",
"auto_update": "Show new posts automatically",
"user_mutes": "Users",
"useStreamingApi": "Receive posts and notifications real-time",
"use_websockets": "Use websockets (Realtime updates)",
"text": "Text",
"theme": "Theme",
"theme_help": "Use hex color codes (#rrggbb) to customize your color theme.",
@ -550,6 +554,7 @@
"mention_link_display_full": "always as full names (e.g. {'@'}foo{'@'}example.org)",
"mention_link_use_tooltip": "Show user card when clicking mention links",
"mention_link_show_avatar": "Show user avatar beside the link",
"mention_link_show_avatar_quick": "Show user avatar next to mentions",
"mention_link_fade_domain": "Fade domains (e.g. {'@'}example.org in {'@'}foo{'@'}example.org)",
"mention_link_bolden_you": "Highlight mention of you when you are mentioned",
"user_popover_avatar_zoom": "Clicking on user avatar in popover zooms it instead of closing the popover",

72
yarn.lock
View File

@ -1375,29 +1375,29 @@
source-map "^0.6.1"
yaml-eslint-parser "^0.3.2"
"@intlify/core-base@9.2.0-beta.40":
version "9.2.0-beta.40"
resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.2.0-beta.40.tgz#85df2e183b2102716c5d40795848fc2359354580"
integrity sha512-vOR0lHgtJ3IkzvXLeMQeNeYreFSKG9v3SU8QOD//WKHdBy4QPISs9CZJkYzBeBVCJVZ/eM6OTSbXF8M2k53iCw==
"@intlify/core-base@9.2.0":
version "9.2.0"
resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.2.0.tgz#e652ef7f71597c5d6b123ae34f01e106bb8c5a1b"
integrity sha512-PkaiY9FAzZHAwPNaS+3csXR6L5k8LFBsSjn63/dy5BqE3pOJd07R4+NYtk8ezxymUemu7p5cS9YX77cmnQO6aQ==
dependencies:
"@intlify/devtools-if" "9.2.0-beta.40"
"@intlify/message-compiler" "9.2.0-beta.40"
"@intlify/shared" "9.2.0-beta.40"
"@intlify/vue-devtools" "9.2.0-beta.40"
"@intlify/devtools-if" "9.2.0"
"@intlify/message-compiler" "9.2.0"
"@intlify/shared" "9.2.0"
"@intlify/vue-devtools" "9.2.0"
"@intlify/devtools-if@9.2.0-beta.40":
version "9.2.0-beta.40"
resolved "https://registry.yarnpkg.com/@intlify/devtools-if/-/devtools-if-9.2.0-beta.40.tgz#bee42fefaaaa590aa5ac7fe2a98777fb84bfaf5e"
integrity sha512-EUiuLxlgortD1dhT0btm3YYIs2vk9kMdcGXiYYbHWRTylc8Iv7Yz47y5Y+IlbZzk51h/nYvuqXE1h9diZZWAvQ==
"@intlify/devtools-if@9.2.0":
version "9.2.0"
resolved "https://registry.yarnpkg.com/@intlify/devtools-if/-/devtools-if-9.2.0.tgz#55249fcea03b08a6c4d5f04a253f086c74090595"
integrity sha512-8yfusyhUaqInnn6Cma+NTTh5+EWyrnAkez36qADetbUnY4tCeGyAy+MmIAGh0uqmJVIeX94vd6L1AaA0p9McGg==
dependencies:
"@intlify/shared" "9.2.0-beta.40"
"@intlify/shared" "9.2.0"
"@intlify/message-compiler@9.2.0-beta.40":
version "9.2.0-beta.40"
resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.2.0-beta.40.tgz#d5d0c5652b9e74e0b4da07a2b8731e1f0e729029"
integrity sha512-6QWTSYewmkew4nsRqgkwTVuGFKzxVCOK8EXsPt15N+tN1g+OYjC3PfGA2dPB6cVkNxqA9mV/hNK02uHPWU9t0A==
"@intlify/message-compiler@9.2.0":
version "9.2.0"
resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.2.0.tgz#0516f144bed8274b3ea4c9eede4b9a6c08fd046d"
integrity sha512-KGwwZsl+Nw2O26ZOKdytncxzKnMZ236KmM70u4GePgbizI+pu8yAh0apKxljSPzEJ7WECKTVc9R+laG12EJQYA==
dependencies:
"@intlify/shared" "9.2.0-beta.40"
"@intlify/shared" "9.2.0"
source-map "0.6.1"
"@intlify/message-compiler@next":
@ -1408,23 +1408,23 @@
"@intlify/shared" "9.2.0-beta.34"
source-map "0.6.1"
"@intlify/shared@9.2.0":
version "9.2.0"
resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.2.0.tgz#bcd026e419a9eb2e577afe520481ceaca80b3aa9"
integrity sha512-71uObL3Sy2ZiBQBMVETbkspE4Plpy87Hvlj6FAUF3xdD+M82tuxe3MVJjaD3ucqhtHmQWBkAWEurVLdPYr8G2g==
"@intlify/shared@9.2.0-beta.34", "@intlify/shared@next":
version "9.2.0-beta.34"
resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.2.0-beta.34.tgz#e8e9a93455eadcc9785fe2e2437fe037fc267f7d"
integrity sha512-hbUKcVbTOkLVpnlSeZE1OPgEI7FpvhuZF/gb84xECTjXEImIa3u0fIcJKUUffv3dlAx8fMOE5xKgDzngidm0tw==
"@intlify/shared@9.2.0-beta.40":
version "9.2.0-beta.40"
resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.2.0-beta.40.tgz#a850936008e6e865310b2a49136d494dd326faab"
integrity sha512-xWz+SFjgt/LfaSbbHVn+V7gmvX4ZNP3cIFta790GWZ/tEgwJeC3tkV7i45iUbZ4ZimOerFgKH05b7qvJlKb6RQ==
"@intlify/vue-devtools@9.2.0-beta.40":
version "9.2.0-beta.40"
resolved "https://registry.yarnpkg.com/@intlify/vue-devtools/-/vue-devtools-9.2.0-beta.40.tgz#37457fd719b0b6afb0679c33ceb47b0ac77f457c"
integrity sha512-3A0D/E9quf+KWonzXUDk3xNP0+d1DMdtAwyXNTjzFcQPvjugC2Xn6fmsd0kNn7nHjgpB+vwIuamGiuE+S+OULw==
"@intlify/vue-devtools@9.2.0":
version "9.2.0"
resolved "https://registry.yarnpkg.com/@intlify/vue-devtools/-/vue-devtools-9.2.0.tgz#fb7f18e83378da3504d500210ce3994552e18d18"
integrity sha512-6P/tE/JdNNVo1z/sr/FnSd90OVlox2XuKMmzHR13nvpHGX7fjRn6pVv47L2jySOYG1cMezmYvJl14TAddKpw5Q==
dependencies:
"@intlify/core-base" "9.2.0-beta.40"
"@intlify/shared" "9.2.0-beta.40"
"@intlify/core-base" "9.2.0"
"@intlify/shared" "9.2.0"
"@intlify/vue-i18n-loader@^5.0.0":
version "5.0.0"
@ -10403,14 +10403,14 @@ vue-eslint-parser@^9.0.1:
lodash "^4.17.21"
semver "^7.3.6"
vue-i18n@9.2.0-beta.40:
version "9.2.0-beta.40"
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.2.0-beta.40.tgz#8088b19d619f47bf0e0f529f9bd1413460f2ff56"
integrity sha512-UwcGsbTTaDJry6BbFFzt115EVHN/bXi07DyUIZ4zrYeGMBPp2QAptMwVaGUQid1gaMmUreAKarGIqw46oCQEvg==
vue-i18n@9.2.0:
version "9.2.0"
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.2.0.tgz#18e746aa0d6739860fe73383daff8884b6fd3c47"
integrity sha512-vN8aW8Vn4r4eRhUgTLK1/kCIYMb3LQmuloa1YP4NsehiASCX0XCq50tgUAz1o0eBAZ8YvhdlaVPqlO7O0wCnkQ==
dependencies:
"@intlify/core-base" "9.2.0-beta.40"
"@intlify/shared" "9.2.0-beta.40"
"@intlify/vue-devtools" "9.2.0-beta.40"
"@intlify/core-base" "9.2.0"
"@intlify/shared" "9.2.0"
"@intlify/vue-devtools" "9.2.0"
"@vue/devtools-api" "^6.2.1"
vue-loader@^16.0.0: