diff --git a/src/components/auth_form/auth_form.js b/src/components/auth_form/auth_form.js
index a86a3dca..3b538e8e 100644
--- a/src/components/auth_form/auth_form.js
+++ b/src/components/auth_form/auth_form.js
@@ -6,13 +6,17 @@ import { mapGetters } from 'vuex'
const AuthForm = {
name: 'AuthForm',
- render () {
+ render() {
return h(resolveComponent(this.authForm))
},
computed: {
- authForm () {
- if (this.requiredTOTP) { return 'MFATOTPForm' }
- if (this.requiredRecovery) { return 'MFARecoveryForm' }
+ authForm() {
+ if (this.requiredTOTP) {
+ return 'MFATOTPForm'
+ }
+ if (this.requiredRecovery) {
+ return 'MFARecoveryForm'
+ }
return 'LoginForm'
},
...mapGetters('authFlow', ['requiredTOTP', 'requiredRecovery'])
diff --git a/src/components/autosuggest/autosuggest.js b/src/components/autosuggest/autosuggest.js
index f58f17bb..49974f7b 100644
--- a/src/components/autosuggest/autosuggest.js
+++ b/src/components/autosuggest/autosuggest.js
@@ -2,11 +2,13 @@ const debounceMilliseconds = 500
export default {
props: {
- query: { // function to query results and return a promise
+ query: {
+ // function to query results and return a promise
type: Function,
required: true
},
- filter: { // function to filter results in real time
+ filter: {
+ // function to filter results in real time
type: Function
},
placeholder: {
@@ -14,7 +16,7 @@ export default {
default: 'Search...'
}
},
- data () {
+ data() {
return {
term: '',
timeout: null,
@@ -23,29 +25,31 @@ export default {
}
},
computed: {
- filtered () {
+ filtered() {
return this.filter ? this.filter(this.results) : this.results
}
},
watch: {
- term (val) {
+ term(val) {
this.fetchResults(val)
}
},
methods: {
- fetchResults (term) {
+ fetchResults(term) {
clearTimeout(this.timeout)
this.timeout = setTimeout(() => {
this.results = []
if (term) {
- this.query(term).then((results) => { this.results = results })
+ this.query(term).then((results) => {
+ this.results = results
+ })
}
}, debounceMilliseconds)
},
- onInputClick () {
+ onInputClick() {
this.resultsVisible = true
},
- onClickOutside () {
+ onClickOutside() {
this.resultsVisible = false
}
}
diff --git a/src/components/autosuggest/autosuggest.vue b/src/components/autosuggest/autosuggest.vue
index f283ab82..2204a8da 100644
--- a/src/components/autosuggest/autosuggest.vue
+++ b/src/components/autosuggest/autosuggest.vue
@@ -8,7 +8,7 @@
:placeholder="placeholder"
class="autosuggest-input"
@click="onInputClick"
- >
+ />
-
+
diff --git a/src/components/color_input/color_input.scss b/src/components/color_input/color_input.scss
index 3451c5d9..12732a6d 100644
--- a/src/components/color_input/color_input.scss
+++ b/src/components/color_input/color_input.scss
@@ -8,7 +8,7 @@
flex: 0 0 0;
max-width: 9em;
align-items: stretch;
- padding: .2em 8px;
+ padding: 0.2em 8px;
input {
background: none;
@@ -40,9 +40,10 @@
}
.transparentIndicator {
// forgot to install counter-strike source, ooops
- background-color: #FF00FF;
+ background-color: #ff00ff;
position: relative;
- &::before, &::after {
+ &::before,
+ &::after {
display: block;
content: '';
background-color: #000000;
@@ -64,5 +65,4 @@
.label {
flex: 1 1 auto;
}
-
}
diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index e84603c3..2ce0d874 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -14,7 +14,12 @@
:model-value="present"
:disabled="disabled"
class="opt"
- @update:modelValue="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
+ @update:modelValue="
+ $emit(
+ 'update:modelValue',
+ typeof modelValue === 'undefined' ? fallback : undefined
+ )
+ "
/>
-
+
-
-
diff --git a/src/components/contrast_ratio/contrast_ratio.vue b/src/components/contrast_ratio/contrast_ratio.vue
index 374cb9ba..c534d931 100644
--- a/src/components/contrast_ratio/contrast_ratio.vue
+++ b/src/components/contrast_ratio/contrast_ratio.vue
@@ -43,11 +43,7 @@ import {
faThumbsUp
} from '@fortawesome/free-solid-svg-icons'
-library.add(
- faAdjust,
- faExclamationTriangle,
- faThumbsUp
-)
+library.add(faAdjust, faExclamationTriangle, faThumbsUp)
export default {
props: {
@@ -65,19 +61,35 @@ export default {
}
},
computed: {
- hint () {
- const levelVal = this.contrast.aaa ? 'aaa' : (this.contrast.aa ? 'aa' : 'bad')
+ hint() {
+ const levelVal = this.contrast.aaa
+ ? 'aaa'
+ : this.contrast.aa
+ ? 'aa'
+ : 'bad'
const level = this.$t(`settings.style.common.contrast.level.${levelVal}`)
const context = this.$t('settings.style.common.contrast.context.text')
const ratio = this.contrast.text
- return this.$t('settings.style.common.contrast.hint', { level, context, ratio })
+ return this.$t('settings.style.common.contrast.hint', {
+ level,
+ context,
+ ratio
+ })
},
- hint_18pt () {
- const levelVal = this.contrast.laaa ? 'aaa' : (this.contrast.laa ? 'aa' : 'bad')
+ hint_18pt() {
+ const levelVal = this.contrast.laaa
+ ? 'aaa'
+ : this.contrast.laa
+ ? 'aa'
+ : 'bad'
const level = this.$t(`settings.style.common.contrast.level.${levelVal}`)
const context = this.$t('settings.style.common.contrast.context.18pt')
const ratio = this.contrast.text
- return this.$t('settings.style.common.contrast.hint', { level, context, ratio })
+ return this.$t('settings.style.common.contrast.hint', {
+ level,
+ context,
+ ratio
+ })
}
}
}
diff --git a/src/components/conversation-page/conversation-page.js b/src/components/conversation-page/conversation-page.js
index 8f996be1..750e3b0b 100644
--- a/src/components/conversation-page/conversation-page.js
+++ b/src/components/conversation-page/conversation-page.js
@@ -5,7 +5,7 @@ const conversationPage = {
Conversation
},
computed: {
- statusId () {
+ statusId() {
return this.$route.params.id
}
}
diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index f8df9eb5..dc430fcf 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -11,11 +11,7 @@ import {
faChevronLeft
} from '@fortawesome/free-solid-svg-icons'
-library.add(
- faAngleDoubleDown,
- faAngleDoubleLeft,
- faChevronLeft
-)
+library.add(faAngleDoubleDown, faAngleDoubleLeft, faChevronLeft)
const sortById = (a, b) => {
const idA = a.type === 'retweet' ? a.retweeted_status.id : a.id
@@ -39,16 +35,17 @@ const sortAndFilterConversation = (conversation, statusoid) => {
if (statusoid.type === 'retweet') {
conversation = filter(
conversation,
- (status) => (status.type === 'retweet' || status.id !== statusoid.retweeted_status.id)
+ (status) =>
+ status.type === 'retweet' || status.id !== statusoid.retweeted_status.id
)
} else {
conversation = filter(conversation, (status) => status.type !== 'retweet')
}
- return conversation.filter(_ => _).sort(sortById)
+ return conversation.filter((_) => _).sort(sortById)
}
const conversation = {
- data () {
+ data() {
return {
highlight: null,
expanded: false,
@@ -66,74 +63,78 @@ const conversation = {
'profileUserId',
'virtualHidden'
],
- created () {
+ created() {
if (this.isPage) {
this.fetchConversation()
}
},
computed: {
- maxDepthToShowByDefault () {
+ maxDepthToShowByDefault() {
// maxDepthInThread = max number of depths that is *visible*
// since our depth starts with 0 and "showing" means "showing children"
// there is a -2 here
const maxDepth = this.$store.getters.mergedConfig.maxDepthInThread - 2
return maxDepth >= 1 ? maxDepth : 1
},
- streamingEnabled () {
- return this.mergedConfig.useStreamingApi && this.mastoUserSocketStatus === WSConnectionStatus.JOINED
+ streamingEnabled() {
+ return (
+ this.mergedConfig.useStreamingApi &&
+ this.mastoUserSocketStatus === WSConnectionStatus.JOINED
+ )
},
- displayStyle () {
+ displayStyle() {
return this.$store.getters.mergedConfig.conversationDisplay
},
- isTreeView () {
+ isTreeView() {
return !this.isLinearView
},
- treeViewIsSimple () {
+ treeViewIsSimple() {
return !this.$store.getters.mergedConfig.conversationTreeAdvanced
},
- isLinearView () {
+ isLinearView() {
return this.displayStyle === 'linear'
},
- shouldFadeAncestors () {
+ shouldFadeAncestors() {
return this.$store.getters.mergedConfig.conversationTreeFadeAncestors
},
- otherRepliesButtonPosition () {
+ otherRepliesButtonPosition() {
return this.$store.getters.mergedConfig.conversationOtherRepliesButton
},
- showOtherRepliesButtonBelowStatus () {
+ showOtherRepliesButtonBelowStatus() {
return this.otherRepliesButtonPosition === 'below'
},
- showOtherRepliesButtonInsideStatus () {
+ showOtherRepliesButtonInsideStatus() {
return this.otherRepliesButtonPosition === 'inside'
},
- suspendable () {
+ suspendable() {
if (this.isTreeView) {
- return Object.entries(this.statusContentProperties)
- .every(([k, prop]) => !prop.replying && prop.mediaPlaying.length === 0)
+ return Object.entries(this.statusContentProperties).every(
+ ([k, prop]) => !prop.replying && prop.mediaPlaying.length === 0
+ )
}
if (this.$refs.statusComponent && this.$refs.statusComponent[0]) {
- return this.$refs.statusComponent.every(s => s.suspendable)
+ return this.$refs.statusComponent.every((s) => s.suspendable)
} else {
return true
}
},
- hideStatus () {
+ hideStatus() {
return this.virtualHidden && this.suspendable
},
- status () {
+ status() {
return this.$store.state.statuses.allStatusesObject[this.statusId]
},
- originalStatusId () {
+ originalStatusId() {
if (this.status.retweeted_status) {
return this.status.retweeted_status.id
} else {
return this.statusId
}
},
- conversationId () {
+ conversationId() {
return this.getConversationId(this.statusId)
},
- conversation () {
+ conversation() {
if (!this.status) {
return []
}
@@ -142,155 +143,203 @@ const conversation = {
return [this.status]
}
- const conversation = clone(this.$store.state.statuses.conversationsObject[this.conversationId])
- const statusIndex = findIndex(conversation, { id: this.originalStatusId })
+ const conversation = clone(
+ this.$store.state.statuses.conversationsObject[this.conversationId]
+ )
+ const statusIndex = findIndex(conversation, {
+ id: this.originalStatusId
+ })
if (statusIndex !== -1) {
conversation[statusIndex] = this.status
}
return sortAndFilterConversation(conversation, this.status)
},
- statusMap () {
+ statusMap() {
return this.conversation.reduce((res, s) => {
res[s.id] = s
return res
}, {})
},
- threadTree () {
- const reverseLookupTable = this.conversation.reduce((table, status, index) => {
- table[status.id] = index
- return table
- }, {})
+ threadTree() {
+ const reverseLookupTable = this.conversation.reduce(
+ (table, status, index) => {
+ table[status.id] = index
+ return table
+ },
+ {}
+ )
- const threads = this.conversation.reduce((a, cur) => {
- const id = cur.id
- a.forest[id] = this.getReplies(id)
- .map(s => s.id)
+ const threads = this.conversation.reduce(
+ (a, cur) => {
+ const id = cur.id
+ a.forest[id] = this.getReplies(id).map((s) => s.id)
- return a
- }, {
- forest: {}
- })
-
- const walk = (forest, topLevel, depth = 0, processed = {}) => topLevel.map(id => {
- if (processed[id]) {
- return []
+ return a
+ },
+ {
+ forest: {}
}
+ )
- processed[id] = true
- return [{
- status: this.conversation[reverseLookupTable[id]],
- id,
- depth
- }, walk(forest, forest[id], depth + 1, processed)].reduce((a, b) => a.concat(b), [])
- }).reduce((a, b) => a.concat(b), [])
+ const walk = (forest, topLevel, depth = 0, processed = {}) =>
+ topLevel
+ .map((id) => {
+ if (processed[id]) {
+ return []
+ }
- const linearized = walk(threads.forest, this.topLevel.map(k => k.id))
+ processed[id] = true
+ return [
+ {
+ status: this.conversation[reverseLookupTable[id]],
+ id,
+ depth
+ },
+ walk(forest, forest[id], depth + 1, processed)
+ ].reduce((a, b) => a.concat(b), [])
+ })
+ .reduce((a, b) => a.concat(b), [])
+
+ const linearized = walk(
+ threads.forest,
+ this.topLevel.map((k) => k.id)
+ )
return linearized
},
- replyIds () {
- return this.conversation.map(k => k.id)
+ replyIds() {
+ return this.conversation
+ .map((k) => k.id)
.reduce((res, id) => {
- res[id] = (this.replies[id] || []).map(k => k.id)
+ res[id] = (this.replies[id] || []).map((k) => k.id)
return res
}, {})
},
- totalReplyCount () {
+ totalReplyCount() {
const sizes = {}
const subTreeSizeFor = (id) => {
if (sizes[id]) {
return sizes[id]
}
- sizes[id] = 1 + this.replyIds[id].map(cid => subTreeSizeFor(cid)).reduce((a, b) => a + b, 0)
+ sizes[id] =
+ 1 +
+ this.replyIds[id]
+ .map((cid) => subTreeSizeFor(cid))
+ .reduce((a, b) => a + b, 0)
return sizes[id]
}
- this.conversation.map(k => k.id).map(subTreeSizeFor)
+ this.conversation.map((k) => k.id).map(subTreeSizeFor)
return Object.keys(sizes).reduce((res, id) => {
res[id] = sizes[id] - 1 // exclude itself
return res
}, {})
},
- totalReplyDepth () {
+ totalReplyDepth() {
const depths = {}
const subTreeDepthFor = (id) => {
if (depths[id]) {
return depths[id]
}
- depths[id] = 1 + this.replyIds[id].map(cid => subTreeDepthFor(cid)).reduce((a, b) => a > b ? a : b, 0)
+ depths[id] =
+ 1 +
+ this.replyIds[id]
+ .map((cid) => subTreeDepthFor(cid))
+ .reduce((a, b) => (a > b ? a : b), 0)
return depths[id]
}
- this.conversation.map(k => k.id).map(subTreeDepthFor)
+ this.conversation.map((k) => k.id).map(subTreeDepthFor)
return Object.keys(depths).reduce((res, id) => {
res[id] = depths[id] - 1 // exclude itself
return res
}, {})
},
- depths () {
+ depths() {
return this.threadTree.reduce((a, k) => {
a[k.id] = k.depth
return a
}, {})
},
- topLevel () {
- const topLevel = this.conversation.reduce((tl, cur) =>
- tl.filter(k => this.getReplies(cur.id).map(v => v.id).indexOf(k.id) === -1), this.conversation)
+ topLevel() {
+ const topLevel = this.conversation.reduce(
+ (tl, cur) =>
+ tl.filter(
+ (k) =>
+ this.getReplies(cur.id)
+ .map((v) => v.id)
+ .indexOf(k.id) === -1
+ ),
+ this.conversation
+ )
return topLevel
},
- otherTopLevelCount () {
+ otherTopLevelCount() {
return this.topLevel.length - 1
},
- showingTopLevel () {
+ showingTopLevel() {
if (this.canDive && this.diveRoot) {
return [this.statusMap[this.diveRoot]]
}
return this.topLevel
},
- diveRoot () {
+ diveRoot() {
const statusId = this.inlineDivePosition || this.statusId
const isTopLevel = !this.parentOf(statusId)
return isTopLevel ? null : statusId
},
- diveDepth () {
+ diveDepth() {
return this.canDive && this.diveRoot ? this.depths[this.diveRoot] : 0
},
- diveMode () {
+ diveMode() {
return this.canDive && !!this.diveRoot
},
- shouldShowAllConversationButton () {
+ shouldShowAllConversationButton() {
// The "show all conversation" button tells the user that there exist
// other toplevel statuses, so do not show it if there is only a single root
- return this.isTreeView && this.isExpanded && this.diveMode && this.topLevel.length > 1
+ return (
+ this.isTreeView &&
+ this.isExpanded &&
+ this.diveMode &&
+ this.topLevel.length > 1
+ )
},
- shouldShowAncestors () {
- return this.isTreeView && this.isExpanded && this.ancestorsOf(this.diveRoot).length
+ shouldShowAncestors() {
+ return (
+ this.isTreeView &&
+ this.isExpanded &&
+ this.ancestorsOf(this.diveRoot).length
+ )
},
- replies () {
+ replies() {
let i = 1
// eslint-disable-next-line camelcase
- return reduce(this.conversation, (result, { id, in_reply_to_status_id }) => {
- /* eslint-disable camelcase */
- const irid = in_reply_to_status_id
- /* eslint-enable camelcase */
- if (irid) {
- result[irid] = result[irid] || []
- result[irid].push({
- name: `#${i}`,
- id: id
- })
- }
- i++
- return result
- }, {})
+ return reduce(
+ this.conversation,
+ (result, { id, in_reply_to_status_id }) => {
+ /* eslint-disable camelcase */
+ const irid = in_reply_to_status_id
+ /* eslint-enable camelcase */
+ if (irid) {
+ result[irid] = result[irid] || []
+ result[irid].push({
+ name: `#${i}`,
+ id: id
+ })
+ }
+ i++
+ return result
+ },
+ {}
+ )
},
- isExpanded () {
+ isExpanded() {
return !!(this.expanded || this.isPage)
},
- hiddenStyle () {
+ hiddenStyle() {
const height = (this.status && this.status.virtualHeight) || '120px'
return this.virtualHidden ? { height } : {}
},
- threadDisplayStatus () {
+ threadDisplayStatus() {
return this.conversation.reduce((a, k) => {
const id = k.id
const depth = this.depths[id]
@@ -298,7 +347,7 @@ const conversation = {
if (this.threadDisplayStatusObject[id]) {
return this.threadDisplayStatusObject[id]
}
- if ((depth - this.diveDepth) <= this.maxDepthToShowByDefault) {
+ if (depth - this.diveDepth <= this.maxDepthToShowByDefault) {
return 'showing'
} else {
return 'hidden'
@@ -309,7 +358,7 @@ const conversation = {
return a
}, {})
},
- statusContentProperties () {
+ statusContentProperties() {
return this.conversation.reduce((a, k) => {
const id = k.id
const props = (() => {
@@ -334,20 +383,20 @@ const conversation = {
return a
}, {})
},
- canDive () {
+ canDive() {
return this.isTreeView && this.isExpanded
},
- focused () {
+ focused() {
return (id) => {
- return (this.isExpanded) && id === this.highlight
+ return this.isExpanded && id === this.highlight
}
},
- maybeHighlight () {
+ maybeHighlight() {
return this.isExpanded ? this.highlight : null
},
...mapGetters(['mergedConfig']),
...mapState({
- mastoUserSocketStatus: state => state.api.mastoUserSocketStatus
+ mastoUserSocketStatus: (state) => state.api.mastoUserSocketStatus
})
},
components: {
@@ -355,53 +404,59 @@ const conversation = {
ThreadTree
},
watch: {
- statusId (newVal, oldVal) {
+ statusId(newVal, oldVal) {
const newConversationId = this.getConversationId(newVal)
const oldConversationId = this.getConversationId(oldVal)
- if (newConversationId && oldConversationId && newConversationId === oldConversationId) {
+ if (
+ newConversationId &&
+ oldConversationId &&
+ newConversationId === oldConversationId
+ ) {
this.setHighlight(this.originalStatusId)
} else {
this.fetchConversation()
}
},
- expanded (value) {
+ expanded(value) {
if (value) {
this.fetchConversation()
} else {
this.resetDisplayState()
}
},
- virtualHidden (value) {
- this.$store.dispatch(
- 'setVirtualHeight',
- { statusId: this.statusId, height: `${this.$el.clientHeight}px` }
- )
+ virtualHidden(value) {
+ this.$store.dispatch('setVirtualHeight', {
+ statusId: this.statusId,
+ height: `${this.$el.clientHeight}px`
+ })
}
},
methods: {
- fetchConversation () {
+ fetchConversation() {
if (this.status) {
- this.$store.state.api.backendInteractor.fetchConversation({ id: this.statusId })
+ this.$store.state.api.backendInteractor
+ .fetchConversation({ id: this.statusId })
.then(({ ancestors, descendants }) => {
this.$store.dispatch('addNewStatuses', { statuses: ancestors })
this.$store.dispatch('addNewStatuses', { statuses: descendants })
this.setHighlight(this.originalStatusId)
})
} else {
- this.$store.state.api.backendInteractor.fetchStatus({ id: this.statusId })
+ this.$store.state.api.backendInteractor
+ .fetchStatus({ id: this.statusId })
.then((status) => {
this.$store.dispatch('addNewStatuses', { statuses: [status] })
this.fetchConversation()
})
}
},
- getReplies (id) {
+ getReplies(id) {
return this.replies[id] || []
},
- getHighlight () {
+ getHighlight() {
return this.isExpanded ? this.highlight : null
},
- setHighlight (id) {
+ setHighlight(id) {
if (!id) return
this.highlight = id
@@ -412,32 +467,38 @@ const conversation = {
this.$store.dispatch('fetchFavsAndRepeats', id)
this.$store.dispatch('fetchEmojiReactionsBy', id)
},
- toggleExpanded () {
+ toggleExpanded() {
this.expanded = !this.expanded
},
- getConversationId (statusId) {
+ getConversationId(statusId) {
const status = this.$store.state.statuses.allStatusesObject[statusId]
- return get(status, 'retweeted_status.statusnet_conversation_id', get(status, 'statusnet_conversation_id'))
+ return get(
+ status,
+ 'retweeted_status.statusnet_conversation_id',
+ get(status, 'statusnet_conversation_id')
+ )
},
- setThreadDisplay (id, nextStatus) {
+ setThreadDisplay(id, nextStatus) {
this.threadDisplayStatusObject = {
...this.threadDisplayStatusObject,
[id]: nextStatus
}
},
- toggleThreadDisplay (id) {
+ toggleThreadDisplay(id) {
const curStatus = this.threadDisplayStatus[id]
const nextStatus = curStatus === 'showing' ? 'hidden' : 'showing'
this.setThreadDisplay(id, nextStatus)
},
- setThreadDisplayRecursively (id, nextStatus) {
+ setThreadDisplayRecursively(id, nextStatus) {
this.setThreadDisplay(id, nextStatus)
- this.getReplies(id).map(k => k.id).map(id => this.setThreadDisplayRecursively(id, nextStatus))
+ this.getReplies(id)
+ .map((k) => k.id)
+ .map((id) => this.setThreadDisplayRecursively(id, nextStatus))
},
- showThreadRecursively (id) {
+ showThreadRecursively(id) {
this.setThreadDisplayRecursively(id, 'showing')
},
- setStatusContentProperty (id, name, value) {
+ setStatusContentProperty(id, name, value) {
this.statusContentPropertiesObject = {
...this.statusContentPropertiesObject,
[id]: {
@@ -446,10 +507,14 @@ const conversation = {
}
}
},
- toggleStatusContentProperty (id, name) {
- this.setStatusContentProperty(id, name, !this.statusContentProperties[id][name])
+ toggleStatusContentProperty(id, name) {
+ this.setStatusContentProperty(
+ id,
+ name,
+ !this.statusContentProperties[id][name]
+ )
},
- leastVisibleAncestor (id) {
+ leastVisibleAncestor(id) {
let cur = id
let parent = this.parentOf(cur)
while (cur) {
@@ -463,18 +528,20 @@ const conversation = {
// nothing found, fall back to toplevel
return this.topLevel[0] ? this.topLevel[0].id : undefined
},
- diveIntoStatus (id, preventScroll) {
+ diveIntoStatus(id, preventScroll) {
this.tryScrollTo(id)
},
- diveToTopLevel () {
- this.tryScrollTo(this.topLevelAncestorOrSelfId(this.diveRoot) || this.topLevel[0].id)
+ diveToTopLevel() {
+ this.tryScrollTo(
+ this.topLevelAncestorOrSelfId(this.diveRoot) || this.topLevel[0].id
+ )
},
// only used when we are not on a page
- undive () {
+ undive() {
this.inlineDivePosition = null
this.setHighlight(this.statusId)
},
- tryScrollTo (id) {
+ tryScrollTo(id) {
if (!id) {
return
}
@@ -503,13 +570,13 @@ const conversation = {
this.setHighlight(id)
})
},
- goToCurrent () {
+ goToCurrent() {
this.tryScrollTo(this.diveRoot || this.topLevel[0].id)
},
- statusById (id) {
+ statusById(id) {
return this.statusMap[id]
},
- parentOf (id) {
+ parentOf(id) {
const status = this.statusById(id)
if (!status) {
return undefined
@@ -520,11 +587,11 @@ const conversation = {
}
return parentId
},
- parentOrSelf (id) {
+ parentOrSelf(id) {
return this.parentOf(id) || id
},
// Ancestors of some status, from top to bottom
- ancestorsOf (id) {
+ ancestorsOf(id) {
const ancestors = []
let cur = this.parentOf(id)
while (cur) {
@@ -533,7 +600,7 @@ const conversation = {
}
return ancestors
},
- topLevelAncestorOrSelfId (id) {
+ topLevelAncestorOrSelfId(id) {
let cur = id
let parent = this.parentOf(id)
while (parent) {
@@ -542,7 +609,7 @@ const conversation = {
}
return cur
},
- resetDisplayState () {
+ resetDisplayState() {
this.undive()
this.threadDisplayStatusObject = {}
}
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 1adbe250..c83d7e7a 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -3,7 +3,7 @@
v-if="!hideStatus"
:style="hiddenStyle"
class="Conversation"
- :class="{ '-expanded' : isExpanded, 'panel' : isExpanded }"
+ :class="{ '-expanded': isExpanded, panel: isExpanded }"
>
-
+
- {{ $tc('status.show_all_conversation', otherTopLevelCount, { numStatus: otherTopLevelCount }) }}
+ {{
+ $tc('status.show_all_conversation', otherTopLevelCount, {
+ numStatus: otherTopLevelCount
+ })
+ }}
@@ -54,14 +56,20 @@
v-for="status in ancestorsOf(diveRoot)"
:key="status.id"
class="thread-ancestor"
- :class="{'thread-ancestor-has-other-replies': getReplies(status.id).length > 1, '-faded': shouldFadeAncestors}"
+ :class="{
+ 'thread-ancestor-has-other-replies':
+ getReplies(status.id).length > 1,
+ '-faded': shouldFadeAncestors
+ }"
>
-
+
-
+
- {{ $tc('status.ancestor_follow', getReplies(status.id).length - 1, { numReplies: getReplies(status.id).length - 1 }) }}
+ {{
+ $tc(
+ 'status.ancestor_follow',
+ getReplies(status.id).length - 1,
+ { numReplies: getReplies(status.id).length - 1 }
+ )
+ }}
@@ -127,7 +157,6 @@
:key="status.id"
ref="statusComponent"
:depth="0"
-
:status="status"
:in-profile="inProfile"
:conversation="conversation"
@@ -135,13 +164,11 @@
:is-expanded="isExpanded"
:pinned-status-ids-object="pinnedStatusIdsObject"
:profile-user-id="profileUserId"
-
:focused="focused"
:get-replies="getReplies"
:highlight="maybeHighlight"
:set-highlight="setHighlight"
:toggle-expanded="toggleExpanded"
-
:simple="treeViewIsSimple"
:toggle-thread-display="toggleThreadDisplay"
:thread-display-status="threadDisplayStatus"
@@ -165,7 +192,9 @@
:inline-expanded="collapsable && isExpanded"
:statusoid="status"
:expandable="!isExpanded"
- :show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
+ :show-pinned="
+ pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]
+ "
:focused="focused(status.id)"
:in-conversation="isExpanded"
:highlight="getHighlight()"
@@ -173,7 +202,6 @@
:in-profile="inProfile"
:profile-user-id="profileUserId"
class="conversation-status status-fadein panel-body"
-
:toggle-thread-display="toggleThreadDisplay"
:thread-display-status="threadDisplayStatus"
:show-thread-recursively="showThreadRecursively"
@@ -182,7 +210,6 @@
:status-content-properties="statusContentProperties"
:set-status-content-property="setStatusContentProperty"
:toggle-status-content-property="toggleStatusContentProperty"
-
@goto="setHighlight"
@toggleExpanded="toggleExpanded"
/>
@@ -233,7 +260,8 @@
border-bottom-color: var(--border, $fallback--border);
border-radius: 0;
/* Make the button stretch along the whole row */
- &, &-inner {
+ &,
+ &-inner {
display: flex;
align-items: stretch;
flex-direction: column;
@@ -271,7 +299,8 @@
border-left-color: $fallback--cRed;
border-left-color: var(--cRed, $fallback--cRed);
border-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;
- border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
+ border-radius: 0 0 var(--panelRadius, $fallback--panelRadius)
+ var(--panelRadius, $fallback--panelRadius);
border-bottom: 1px solid var(--border, $fallback--border);
}
diff --git a/src/components/desktop_nav/desktop_nav.js b/src/components/desktop_nav/desktop_nav.js
index f4900c38..bacdf53b 100644
--- a/src/components/desktop_nav/desktop_nav.js
+++ b/src/components/desktop_nav/desktop_nav.js
@@ -46,76 +46,98 @@ export default {
},
data: () => ({
searchBarHidden: true,
- supportsMask: window.CSS && window.CSS.supports && (
- window.CSS.supports('mask-size', 'contain') ||
+ supportsMask:
+ window.CSS &&
+ window.CSS.supports &&
+ (window.CSS.supports('mask-size', 'contain') ||
window.CSS.supports('-webkit-mask-size', 'contain') ||
window.CSS.supports('-moz-mask-size', 'contain') ||
window.CSS.supports('-ms-mask-size', 'contain') ||
- window.CSS.supports('-o-mask-size', 'contain')
- ),
+ window.CSS.supports('-o-mask-size', 'contain')),
showingConfirmLogout: false
}),
computed: {
- enableMask () { return this.supportsMask && this.$store.state.instance.logoMask },
- logoStyle () {
+ enableMask() {
+ return this.supportsMask && this.$store.state.instance.logoMask
+ },
+ logoStyle() {
return {
- 'visibility': this.enableMask ? 'hidden' : 'visible'
+ visibility: this.enableMask ? 'hidden' : 'visible'
}
},
- logoMaskStyle () {
- return this.enableMask ? {
- 'mask-image': `url(${this.$store.state.instance.logo})`
- } : {
- 'background-color': this.enableMask ? '' : 'transparent'
- }
+ logoMaskStyle() {
+ return this.enableMask
+ ? {
+ 'mask-image': `url(${this.$store.state.instance.logo})`
+ }
+ : {
+ 'background-color': this.enableMask ? '' : 'transparent'
+ }
},
- logoBgStyle () {
- return Object.assign({
- 'margin': `${this.$store.state.instance.logoMargin} 0`,
- opacity: this.searchBarHidden ? 1 : 0
- }, this.enableMask ? {} : {
- 'background-color': this.enableMask ? '' : 'transparent'
- })
+ logoBgStyle() {
+ return Object.assign(
+ {
+ margin: `${this.$store.state.instance.logoMargin} 0`,
+ opacity: this.searchBarHidden ? 1 : 0
+ },
+ this.enableMask
+ ? {}
+ : {
+ 'background-color': this.enableMask ? '' : 'transparent'
+ }
+ )
},
- logo () { return this.$store.state.instance.logo },
- mergedConfig () {
+ logo() {
+ return this.$store.state.instance.logo
+ },
+ mergedConfig() {
return this.$store.getters.mergedConfig
},
- sitename () { return this.$store.state.instance.name },
- showNavShortcuts () {
+ sitename() {
+ return this.$store.state.instance.name
+ },
+ showNavShortcuts() {
return this.mergedConfig.showNavShortcuts
},
- showWiderShortcuts () {
+ showWiderShortcuts() {
return this.mergedConfig.showWiderShortcuts
},
- hideSiteFavicon () {
+ hideSiteFavicon() {
return this.mergedConfig.hideSiteFavicon
},
- hideSiteName () {
+ hideSiteName() {
return this.mergedConfig.hideSiteName
},
- hideSitename () { return this.$store.state.instance.hideSitename },
- logoLeft () { return this.$store.state.instance.logoLeft },
- currentUser () { return this.$store.state.users.currentUser },
- privateMode () { return this.$store.state.instance.private },
- shouldConfirmLogout () {
+ hideSitename() {
+ return this.$store.state.instance.hideSitename
+ },
+ logoLeft() {
+ return this.$store.state.instance.logoLeft
+ },
+ currentUser() {
+ return this.$store.state.users.currentUser
+ },
+ privateMode() {
+ return this.$store.state.instance.private
+ },
+ shouldConfirmLogout() {
return this.$store.getters.mergedConfig.modalOnLogout
},
- showBubbleTimeline () {
+ showBubbleTimeline() {
return this.$store.state.instance.localBubbleInstances.length > 0
}
},
methods: {
- scrollToTop () {
+ scrollToTop() {
window.scrollTo(0, 0)
},
- onSearchBarToggled (hidden) {
+ onSearchBarToggled(hidden) {
this.searchBarHidden = hidden
},
- openSettingsModal () {
+ openSettingsModal() {
this.$store.dispatch('openSettingsModal')
},
- openModModal () {
+ openModModal() {
this.$store.dispatch('openModModal')
}
}
diff --git a/src/components/desktop_nav/desktop_nav.scss b/src/components/desktop_nav/desktop_nav.scss
index 4d8c40e3..614eca00 100644
--- a/src/components/desktop_nav/desktop_nav.scss
+++ b/src/components/desktop_nav/desktop_nav.scss
@@ -15,7 +15,7 @@
display: grid;
grid-template-rows: var(--navbar-height);
grid-template-columns: 2fr auto 2fr;
- grid-template-areas: "nav-left logo actions";
+ grid-template-areas: 'nav-left logo actions';
box-sizing: border-box;
padding: 0 1.2em;
margin: auto;
@@ -24,11 +24,12 @@
&.-logoLeft .inner-nav {
grid-template-columns: auto 2fr 2fr;
- grid-template-areas: "logo nav-left actions";
+ grid-template-areas: 'logo nav-left actions';
}
.button-default {
- &, svg {
+ &,
+ svg {
color: $fallback--text;
color: var(--btnTopBarText, $fallback--text);
}
@@ -49,7 +50,7 @@
color: $fallback--text;
color: var(--btnToggledTopBarText, $fallback--text);
background-color: $fallback--fg;
- background-color: var(--btnToggledTopBar, $fallback--fg)
+ background-color: var(--btnToggledTopBar, $fallback--fg);
}
}
diff --git a/src/components/desktop_nav/desktop_nav.vue b/src/components/desktop_nav/desktop_nav.vue
index 92d3fa5b..7e365f3e 100644
--- a/src/components/desktop_nav/desktop_nav.vue
+++ b/src/components/desktop_nav/desktop_nav.vue
@@ -19,7 +19,7 @@
v-if="!hideSiteFavicon"
class="favicon"
src="/favicon.png"
- >
+ />
+ />
diff --git a/src/components/emoji_input/emoji_input.js b/src/components/emoji_input/emoji_input.js
index 846274b8..92563725 100644
--- a/src/components/emoji_input/emoji_input.js
+++ b/src/components/emoji_input/emoji_input.js
@@ -4,13 +4,9 @@ import { take } from 'lodash'
import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
import { library } from '@fortawesome/fontawesome-svg-core'
-import {
- faSmileBeam
-} from '@fortawesome/free-regular-svg-icons'
+import { faSmileBeam } from '@fortawesome/free-regular-svg-icons'
-library.add(
- faSmileBeam
-)
+library.add(faSmileBeam)
/**
* EmojiInput - augmented inputs for emoji and autocomplete support in inputs
@@ -105,7 +101,7 @@ const EmojiInput = {
default: false
}
},
- data () {
+ data() {
return {
input: undefined,
highlighted: 0,
@@ -123,29 +119,34 @@ const EmojiInput = {
EmojiPicker
},
computed: {
- padEmoji () {
+ padEmoji() {
return this.$store.getters.mergedConfig.padEmoji
},
- showSuggestions () {
- return this.focused &&
+ showSuggestions() {
+ return (
+ this.focused &&
this.suggestions &&
this.suggestions.length > 0 &&
!this.showPicker &&
!this.temporarilyHideSuggestions
+ )
},
- textAtCaret () {
+ textAtCaret() {
return (this.wordAtCaret || {}).word || ''
},
- wordAtCaret () {
+ wordAtCaret() {
if (this.modelValue && this.caret) {
- const word = Completion.wordAtPosition(this.modelValue, this.caret - 1) || {}
+ const word =
+ Completion.wordAtPosition(this.modelValue, this.caret - 1) || {}
return word
}
}
},
- mounted () {
+ mounted() {
const { root } = this.$refs
- const input = root.querySelector('.emoji-input > input') || root.querySelector('.emoji-input > textarea')
+ const input =
+ root.querySelector('.emoji-input > input') ||
+ root.querySelector('.emoji-input > textarea')
if (!input) return
this.input = input
this.resize()
@@ -158,7 +159,7 @@ const EmojiInput = {
input.addEventListener('transitionend', this.onTransition)
input.addEventListener('input', this.onInput)
},
- unmounted () {
+ unmounted() {
const { input } = this
if (input) {
input.removeEventListener('blur', this.onBlur)
@@ -183,27 +184,28 @@ const EmojiInput = {
// Async: cancel if textAtCaret has changed during wait
if (this.textAtCaret !== newWord) return
if (matchedSuggestions.length <= 0) return
- this.suggestions = take(matchedSuggestions, 5)
- .map(({ imageUrl, ...rest }) => ({
+ this.suggestions = take(matchedSuggestions, 5).map(
+ ({ imageUrl, ...rest }) => ({
...rest,
img: imageUrl || ''
- }))
+ })
+ )
},
suggestions: {
- handler (newValue) {
+ handler(newValue) {
this.$nextTick(this.resize)
},
deep: true
}
},
methods: {
- focusPickerInput () {
+ focusPickerInput() {
const pickerEl = this.$refs.picker.$el
if (!pickerEl) return
const pickerInput = pickerEl.querySelector('input')
if (pickerInput) pickerInput.focus()
},
- triggerShowPicker () {
+ triggerShowPicker() {
this.showPicker = true
this.$refs.picker.startEmojiLoad()
this.$nextTick(() => {
@@ -218,7 +220,7 @@ const EmojiInput = {
this.disableClickOutside = false
}, 0)
},
- togglePicker () {
+ togglePicker() {
this.input.focus()
this.showPicker = !this.showPicker
if (this.showPicker) {
@@ -227,12 +229,16 @@ const EmojiInput = {
this.$nextTick(this.focusPickerInput)
}
},
- replace (replacement) {
- const newValue = Completion.replaceWord(this.modelValue, this.wordAtCaret, replacement)
+ replace(replacement) {
+ const newValue = Completion.replaceWord(
+ this.modelValue,
+ this.wordAtCaret,
+ replacement
+ )
this.$emit('update:modelValue', newValue)
this.caret = 0
},
- insert ({ insertion, keepOpen, surroundingSpace = true }) {
+ insert({ insertion, keepOpen, surroundingSpace = true }) {
const before = this.modelValue.substring(0, this.caret) || ''
const after = this.modelValue.substring(this.caret) || ''
@@ -251,19 +257,25 @@ const EmojiInput = {
* them, masto seem to be rendering :emoji::emoji: correctly now so why not
*/
const isSpaceRegex = /\s/
- const spaceBefore = (surroundingSpace && !isSpaceRegex.exec(before.slice(-1)) && before.length && this.padEmoji > 0) ? ' ' : ''
- const spaceAfter = (surroundingSpace && !isSpaceRegex.exec(after[0]) && this.padEmoji) ? ' ' : ''
+ const spaceBefore =
+ surroundingSpace &&
+ !isSpaceRegex.exec(before.slice(-1)) &&
+ before.length &&
+ this.padEmoji > 0
+ ? ' '
+ : ''
+ const spaceAfter =
+ surroundingSpace && !isSpaceRegex.exec(after[0]) && this.padEmoji
+ ? ' '
+ : ''
- const newValue = [
- before,
- spaceBefore,
- insertion,
- spaceAfter,
- after
- ].join('')
+ const newValue = [before, spaceBefore, insertion, spaceAfter, after].join(
+ ''
+ )
this.keepOpen = keepOpen
this.$emit('update:modelValue', newValue)
- const position = this.caret + (insertion + spaceAfter + spaceBefore).length
+ const position =
+ this.caret + (insertion + spaceAfter + spaceBefore).length
if (!keepOpen) {
this.input.focus()
}
@@ -275,12 +287,17 @@ const EmojiInput = {
this.caret = position
})
},
- replaceText (e, suggestion) {
+ replaceText(e, suggestion) {
const len = this.suggestions.length || 0
if (len > 0 || suggestion) {
- const chosenSuggestion = suggestion || this.suggestions[this.highlighted]
+ const chosenSuggestion =
+ suggestion || this.suggestions[this.highlighted]
const replacement = chosenSuggestion.replacement
- const newValue = Completion.replaceWord(this.modelValue, this.wordAtCaret, replacement)
+ const newValue = Completion.replaceWord(
+ this.modelValue,
+ this.wordAtCaret,
+ replacement
+ )
this.$emit('update:modelValue', newValue)
this.highlighted = 0
const position = this.wordAtCaret.start + replacement.length
@@ -295,7 +312,7 @@ const EmojiInput = {
e.preventDefault()
}
},
- cycleBackward (e) {
+ cycleBackward(e) {
const len = this.suggestions.length || 0
if (len > 1) {
this.highlighted -= 1
@@ -307,7 +324,7 @@ const EmojiInput = {
this.highlighted = 0
}
},
- cycleForward (e) {
+ cycleForward(e) {
const len = this.suggestions.length || 0
if (len > 1) {
this.highlighted += 1
@@ -319,26 +336,28 @@ const EmojiInput = {
this.highlighted = 0
}
},
- scrollIntoView () {
+ scrollIntoView() {
const rootRef = this.$refs['picker'].$el
/* Scroller is either `window` (replies in TL), sidebar (main post form,
* replies in notifs) or mobile post form. Note that getting and setting
* scroll is different for `Window` and `Element`s
*/
- const scrollerRef = this.$el.closest('.sidebar-scroller') ||
- this.$el.closest('.post-form-modal-view') ||
- window
- const currentScroll = scrollerRef === window
- ? scrollerRef.scrollY
- : scrollerRef.scrollTop
- const scrollerHeight = scrollerRef === window
- ? scrollerRef.innerHeight
- : scrollerRef.offsetHeight
+ const scrollerRef =
+ this.$el.closest('.sidebar-scroller') ||
+ this.$el.closest('.post-form-modal-view') ||
+ window
+ const currentScroll =
+ scrollerRef === window ? scrollerRef.scrollY : scrollerRef.scrollTop
+ const scrollerHeight =
+ scrollerRef === window
+ ? scrollerRef.innerHeight
+ : scrollerRef.offsetHeight
const scrollerBottomBorder = currentScroll + scrollerHeight
// We check where the bottom border of root element is, this uses findOffset
// to find offset relative to scrollable container (scroller)
- const rootBottomBorder = rootRef.offsetHeight + findOffset(rootRef, scrollerRef).top
+ const rootBottomBorder =
+ rootRef.offsetHeight + findOffset(rootRef, scrollerRef).top
const bottomDelta = Math.max(0, rootBottomBorder - scrollerBottomBorder)
// could also check top delta but there's no case for it
@@ -360,10 +379,10 @@ const EmojiInput = {
}
})
},
- onTransition (e) {
+ onTransition(e) {
this.resize()
},
- onBlur (e) {
+ onBlur(e) {
// Clicking on any suggestion removes focus from autocomplete,
// preventing click handler ever executing.
this.blurTimeout = setTimeout(() => {
@@ -372,10 +391,10 @@ const EmojiInput = {
this.resize()
}, 200)
},
- onClick (e, suggestion) {
+ onClick(e, suggestion) {
this.replaceText(e, suggestion)
},
- onFocus (e) {
+ onFocus(e) {
if (this.blurTimeout) {
clearTimeout(this.blurTimeout)
this.blurTimeout = null
@@ -389,7 +408,7 @@ const EmojiInput = {
this.resize()
this.temporarilyHideSuggestions = false
},
- onKeyUp (e) {
+ onKeyUp(e) {
const { key } = e
this.setCaret(e)
this.resize()
@@ -402,11 +421,11 @@ const EmojiInput = {
this.temporarilyHideSuggestions = false
}
},
- onPaste (e) {
+ onPaste(e) {
this.setCaret(e)
this.resize()
},
- onKeyDown (e) {
+ onKeyDown(e) {
const { ctrlKey, shiftKey, key } = e
if (this.newlineOnCtrlEnter && ctrlKey && key === 'Enter') {
this.insert({ insertion: '\n', surroundingSpace: false })
@@ -453,31 +472,31 @@ const EmojiInput = {
this.showPicker = false
this.resize()
},
- onInput (e) {
+ onInput(e) {
this.showPicker = false
this.setCaret(e)
this.resize()
this.$emit('update:modelValue', e.target.value)
},
- onClickInput (e) {
+ onClickInput(e) {
this.showPicker = false
},
- onClickOutside (e) {
+ onClickOutside(e) {
if (this.disableClickOutside) return
this.showPicker = false
},
- onStickerUploaded (e) {
+ onStickerUploaded(e) {
this.showPicker = false
this.$emit('sticker-uploaded', e)
},
- onStickerUploadFailed (e) {
+ onStickerUploadFailed(e) {
this.showPicker = false
this.$emit('sticker-upload-Failed', e)
},
- setCaret ({ target: { selectionStart } }) {
+ setCaret({ target: { selectionStart } }) {
this.caret = selectionStart
},
- resize () {
+ resize() {
const panel = this.$refs.panel
if (!panel) return
const picker = this.$refs.picker.$el
@@ -488,9 +507,12 @@ const EmojiInput = {
this.setPlacement(panelBody, panel, offsetBottom)
this.setPlacement(picker, picker, offsetBottom)
},
- setPlacement (container, target, offsetBottom) {
+ setPlacement(container, target, offsetBottom) {
if (!container || !target) return
- if (this.placement === 'bottom' || (this.placement === 'auto' && !this.overflowsBottom(container))) {
+ if (
+ this.placement === 'bottom' ||
+ (this.placement === 'auto' && !this.overflowsBottom(container))
+ ) {
target.style.top = offsetBottom + 'px'
target.style.bottom = 'auto'
} else {
@@ -498,7 +520,7 @@ const EmojiInput = {
target.style.bottom = this.input.offsetHeight + 'px'
}
},
- overflowsBottom (el) {
+ overflowsBottom(el) {
return el.getBoundingClientRect().bottom > window.innerHeight
}
}
diff --git a/src/components/emoji_input/emoji_input.vue b/src/components/emoji_input/emoji_input.vue
index 078253c2..b90afb8f 100644
--- a/src/components/emoji_input/emoji_input.vue
+++ b/src/components/emoji_input/emoji_input.vue
@@ -42,11 +42,14 @@
:class="{ highlighted: index === highlighted }"
@click.stop.prevent="onClick($event, suggestion)"
>
-
+
![]()
+ />
{{ suggestion.replacement }}
@@ -77,7 +80,7 @@
position: absolute;
top: 0;
right: 0;
- margin: .2em .25em;
+ margin: 0.2em 0.25em;
font-size: 1.3em;
cursor: pointer;
line-height: 24px;
@@ -93,7 +96,7 @@
margin-top: 2px;
&.hide {
- display: none
+ display: none;
}
}
@@ -104,7 +107,7 @@
margin-top: 2px;
&.hide {
- display: none
+ display: none;
}
&-body {
@@ -178,7 +181,8 @@
}
}
- input, textarea {
+ input,
+ textarea {
flex: 1 0 auto;
}
}
diff --git a/src/components/emoji_input/suggestor.js b/src/components/emoji_input/suggestor.js
index a0fe7a5b..527f6f32 100644
--- a/src/components/emoji_input/suggestor.js
+++ b/src/components/emoji_input/suggestor.js
@@ -1,5 +1,26 @@
-const MFM_TAGS = ['blur', 'bounce', 'flip', 'font', 'jelly', 'jump', 'rainbow', 'rotate', 'shake', 'sparkle', 'spin', 'tada', 'twitch', 'x2', 'x3', 'x4']
- .map(tag => ({ displayText: tag, detailText: '$[' + tag + ' ]', replacement: '$[' + tag + ' ]', mfm: true }))
+const MFM_TAGS = [
+ 'blur',
+ 'bounce',
+ 'flip',
+ 'font',
+ 'jelly',
+ 'jump',
+ 'rainbow',
+ 'rotate',
+ 'shake',
+ 'sparkle',
+ 'spin',
+ 'tada',
+ 'twitch',
+ 'x2',
+ 'x3',
+ 'x4'
+].map((tag) => ({
+ displayText: tag,
+ detailText: '$[' + tag + ' ]',
+ replacement: '$[' + tag + ' ]',
+ mfm: true
+}))
/**
* suggest - generates a suggestor function to be used by emoji-input
@@ -13,10 +34,10 @@ const MFM_TAGS = ['blur', 'bounce', 'flip', 'font', 'jelly', 'jump', 'rainbow',
* doesn't support user linking you can just provide only emoji.
*/
-export default data => {
+export default (data) => {
const emojiCurry = suggestEmoji(data.emoji)
const usersCurry = data.store && suggestUsers(data.store)
- return input => {
+ return (input) => {
const firstChar = input[0]
if (firstChar === ':' && data.emoji) {
return emojiCurry(input)
@@ -25,14 +46,15 @@ export default data => {
return usersCurry(input)
}
if (firstChar === '$') {
- return MFM_TAGS
- .filter(({ replacement }) => replacement.toLowerCase().indexOf(input) !== -1)
+ return MFM_TAGS.filter(
+ ({ replacement }) => replacement.toLowerCase().indexOf(input) !== -1
+ )
}
return []
}
}
-export const suggestEmoji = emojis => input => {
+export const suggestEmoji = (emojis) => (input) => {
const noPrefix = input.toLowerCase().substr(1)
return emojis
.filter(({ displayText }) => displayText.toLowerCase().match(noPrefix))
@@ -85,7 +107,7 @@ export const suggestUsers = ({ dispatch, state }) => {
})
}
- return async input => {
+ return async (input) => {
const noPrefix = input.toLowerCase().substr(1)
if (previousQuery === noPrefix) return suggestions
@@ -99,36 +121,47 @@ export const suggestUsers = ({ dispatch, state }) => {
await debounceUserSearch(noPrefix)
}
- const newSuggestions = state.users.users.filter(
- user =>
- user.screen_name.toLowerCase().startsWith(noPrefix) ||
- user.name.toLowerCase().startsWith(noPrefix)
- ).slice(0, 20).sort((a, b) => {
- let aScore = 0
- let bScore = 0
+ const newSuggestions = state.users.users
+ .filter(
+ (user) =>
+ user.screen_name.toLowerCase().startsWith(noPrefix) ||
+ user.name.toLowerCase().startsWith(noPrefix)
+ )
+ .slice(0, 20)
+ .sort((a, b) => {
+ let aScore = 0
+ let bScore = 0
- // Matches on screen name (i.e. user@instance) makes a priority
- aScore += a.screen_name.toLowerCase().startsWith(noPrefix) ? 2 : 0
- bScore += b.screen_name.toLowerCase().startsWith(noPrefix) ? 2 : 0
+ // Matches on screen name (i.e. user@instance) makes a priority
+ aScore += a.screen_name.toLowerCase().startsWith(noPrefix) ? 2 : 0
+ bScore += b.screen_name.toLowerCase().startsWith(noPrefix) ? 2 : 0
- // Matches on name takes second priority
- aScore += a.name.toLowerCase().startsWith(noPrefix) ? 1 : 0
- bScore += b.name.toLowerCase().startsWith(noPrefix) ? 1 : 0
+ // Matches on name takes second priority
+ aScore += a.name.toLowerCase().startsWith(noPrefix) ? 1 : 0
+ bScore += b.name.toLowerCase().startsWith(noPrefix) ? 1 : 0
- const diff = (bScore - aScore) * 10
+ const diff = (bScore - aScore) * 10
- // Then sort alphabetically
- const nameAlphabetically = a.name > b.name ? 1 : -1
- const screenNameAlphabetically = a.screen_name > b.screen_name ? 1 : -1
+ // Then sort alphabetically
+ const nameAlphabetically = a.name > b.name ? 1 : -1
+ const screenNameAlphabetically = a.screen_name > b.screen_name ? 1 : -1
- return diff + nameAlphabetically + screenNameAlphabetically
- /* eslint-disable camelcase */
- }).map(({ screen_name, screen_name_ui, name, profile_image_url_original }) => ({
- displayText: screen_name_ui,
- detailText: name,
- imageUrl: profile_image_url_original,
- replacement: '@' + screen_name + ' '
- }))
+ return diff + nameAlphabetically + screenNameAlphabetically
+ /* eslint-disable camelcase */
+ })
+ .map(
+ ({
+ screen_name,
+ screen_name_ui,
+ name,
+ profile_image_url_original
+ }) => ({
+ displayText: screen_name_ui,
+ detailText: name,
+ imageUrl: profile_image_url_original,
+ replacement: '@' + screen_name + ' '
+ })
+ )
/* eslint-enable camelcase */
suggestions = newSuggestions || []
diff --git a/src/components/emoji_picker/emoji_picker.js b/src/components/emoji_picker/emoji_picker.js
index 6617a937..23bee7b9 100644
--- a/src/components/emoji_picker/emoji_picker.js
+++ b/src/components/emoji_picker/emoji_picker.js
@@ -8,11 +8,7 @@ import {
} from '@fortawesome/free-solid-svg-icons'
import { trim, escapeRegExp, startCase } from 'lodash'
-library.add(
- faBoxOpen,
- faStickyNote,
- faSmileBeam
-)
+library.add(faBoxOpen, faStickyNote, faSmileBeam)
// At widest, approximately 20 emoji are visible in a row,
// loading 3 rows, could be overkill for narrow picker
@@ -29,7 +25,7 @@ const EmojiPicker = {
default: false
}
},
- data () {
+ data() {
return {
keyword: '',
activeGroup: 'standard',
@@ -42,35 +38,39 @@ const EmojiPicker = {
}
},
components: {
- StickerPicker: defineAsyncComponent(() => import('../sticker_picker/sticker_picker.vue')),
+ StickerPicker: defineAsyncComponent(() =>
+ import('../sticker_picker/sticker_picker.vue')
+ ),
Checkbox
},
methods: {
- onStickerUploaded (e) {
+ onStickerUploaded(e) {
this.$emit('sticker-uploaded', e)
},
- onStickerUploadFailed (e) {
+ onStickerUploadFailed(e) {
this.$emit('sticker-upload-failed', e)
},
- onEmoji (emoji) {
- const value = emoji.imageUrl ? `:${emoji.displayText}:` : emoji.replacement
+ onEmoji(emoji) {
+ const value = emoji.imageUrl
+ ? `:${emoji.displayText}:`
+ : emoji.replacement
this.$emit('emoji', { insertion: value, keepOpen: this.keepOpen })
},
- onScroll (e) {
+ onScroll(e) {
const target = (e && e.target) || this.$refs['emoji-groups']
this.updateScrolledClass(target)
this.scrolledGroup(target)
this.triggerLoadMore(target)
},
- onWheel (e) {
+ onWheel(e) {
e.preventDefault()
this.$refs['emoji-tabs'].scrollBy(e.deltaY, 0)
},
- highlight (key) {
+ highlight(key) {
this.setShowStickers(false)
this.activeGroup = key
},
- updateScrolledClass (target) {
+ updateScrolledClass(target) {
if (target.scrollTop <= 5) {
this.groupsScrolledClass = 'scrolled-top'
} else if (target.scrollTop >= target.scrollTopMax - 5) {
@@ -79,7 +79,7 @@ const EmojiPicker = {
this.groupsScrolledClass = 'scrolled-middle'
}
},
- triggerLoadMore (target) {
+ triggerLoadMore(target) {
const ref = this.$refs['group-end-custom']
if (!ref) return
const bottom = ref.offsetTop + ref.offsetHeight
@@ -93,15 +93,16 @@ const EmojiPicker = {
// Always load when at the very top in case there's no scroll space yet
const atTop = scrollerTop < 5
// Don't load when looking at unicode category or at the very bottom
- const bottomAboveViewport = bottom < scrollerTop || scrollerBottom === scrollerMax
+ const bottomAboveViewport =
+ bottom < scrollerTop || scrollerBottom === scrollerMax
if (!bottomAboveViewport && (approachingBottom || atTop)) {
this.loadEmoji()
}
},
- scrolledGroup (target) {
+ scrolledGroup(target) {
const top = target.scrollTop + 5
this.$nextTick(() => {
- this.emojisView.forEach(group => {
+ this.emojisView.forEach((group) => {
const ref = this.$refs['group-' + group.id]
if (ref.offsetTop <= top) {
this.activeGroup = group.id
@@ -109,8 +110,9 @@ const EmojiPicker = {
})
})
},
- loadEmoji () {
- const allLoaded = this.customEmojiBuffer.length === this.filteredEmoji.length
+ loadEmoji() {
+ const allLoaded =
+ this.customEmojiBuffer.length === this.filteredEmoji.length
if (allLoaded) {
return
@@ -118,7 +120,7 @@ const EmojiPicker = {
this.customEmojiBufferSlice += LOAD_EMOJI_BY
},
- startEmojiLoad (forceUpdate = false) {
+ startEmojiLoad(forceUpdate = false) {
if (!forceUpdate) {
this.keyword = ''
}
@@ -132,46 +134,47 @@ const EmojiPicker = {
}
this.customEmojiBufferSlice = LOAD_EMOJI_BY
},
- toggleStickers () {
+ toggleStickers() {
this.showingStickers = !this.showingStickers
},
- setShowStickers (value) {
+ setShowStickers(value) {
this.showingStickers = value
},
- filterByKeyword (list) {
+ filterByKeyword(list) {
if (this.keyword === '') return list
const regex = new RegExp(escapeRegExp(trim(this.keyword)), 'i')
- return list.filter(emoji => {
- return (regex.test(emoji.displayText) || (!emoji.imageUrl && emoji.replacement === this.keyword))
+ return list.filter((emoji) => {
+ return (
+ regex.test(emoji.displayText) ||
+ (!emoji.imageUrl && emoji.replacement === this.keyword)
+ )
})
}
},
watch: {
- keyword () {
+ keyword() {
this.customEmojiLoadAllConfirmed = false
this.onScroll()
this.startEmojiLoad(true)
}
},
computed: {
- activeGroupView () {
+ activeGroupView() {
return this.showingStickers ? '' : this.activeGroup
},
- stickersAvailable () {
+ stickersAvailable() {
if (this.$store.state.instance.stickers) {
return this.$store.state.instance.stickers.length > 0
}
return 0
},
- filteredEmoji () {
- return this.filterByKeyword(
- this.$store.state.instance.customEmoji || []
- )
+ filteredEmoji() {
+ return this.filterByKeyword(this.$store.state.instance.customEmoji || [])
},
- customEmojiBuffer () {
+ customEmojiBuffer() {
return this.filteredEmoji.slice(0, this.customEmojiBufferSlice)
},
- emojis () {
+ emojis() {
const standardEmojis = this.$store.state.instance.emoji || []
const customEmojis = this.sortedEmoji
const emojiPacks = []
@@ -195,7 +198,7 @@ const EmojiPicker = {
}
].concat(emojiPacks)
},
- sortedEmoji () {
+ sortedEmoji() {
const customEmojis = this.$store.state.instance.customEmoji || []
const sortedEmojiGroups = new Map()
customEmojis.forEach((emoji) => {
@@ -207,19 +210,22 @@ const EmojiPicker = {
})
return new Map([...sortedEmojiGroups.entries()].sort())
},
- emojisView () {
+ emojisView() {
if (this.keyword === '') {
- return this.emojis.filter(pack => {
+ return this.emojis.filter((pack) => {
return pack.id === this.activeGroup
})
} else {
- return this.emojis.filter(pack => {
+ return this.emojis.filter((pack) => {
return pack.emojis.length > 0
})
}
},
- stickerPickerEnabled () {
- return (this.$store.state.instance.stickers || []).length !== 0 && this.enableStickerPicker
+ stickerPickerEnabled() {
+ return (
+ (this.$store.state.instance.stickers || []).length !== 0 &&
+ this.enableStickerPicker
+ )
}
}
}
diff --git a/src/components/emoji_picker/emoji_picker.scss b/src/components/emoji_picker/emoji_picker.scss
index ac7b8b5d..79310c3d 100644
--- a/src/components/emoji_picker/emoji_picker.scss
+++ b/src/components/emoji_picker/emoji_picker.scss
@@ -100,7 +100,7 @@
justify-content: center;
width: 32px;
height: 32px;
- padding: .4em;
+ padding: 0.4em;
cursor: pointer;
img {
@@ -133,7 +133,7 @@
}
.sticker-picker {
- flex: 1 1 auto
+ flex: 1 1 auto;
}
.stickers,
@@ -168,8 +168,8 @@
overflow: auto;
user-select: none;
mask: linear-gradient(to top, white 0, transparent 100%) bottom no-repeat,
- linear-gradient(to bottom, white 0, transparent 100%) top no-repeat,
- linear-gradient(to top, white, white);
+ linear-gradient(to bottom, white 0, transparent 100%) top no-repeat,
+ linear-gradient(to top, white, white);
transition: mask-size 150ms;
mask-size: 100% 20px, 100% 20px, auto;
// Autoprefixed seem to ignore this one, and also syntax is different
@@ -221,7 +221,5 @@
max-height: 100%;
}
}
-
}
-
}
diff --git a/src/components/emoji_picker/emoji_picker.vue b/src/components/emoji_picker/emoji_picker.vue
index 00ffb9d2..320da52e 100644
--- a/src/components/emoji_picker/emoji_picker.vue
+++ b/src/components/emoji_picker/emoji_picker.vue
@@ -2,9 +2,9 @@
- {{ group.first.replacement }}
+ {{
+ group.first.replacement
+ }}
![]()
+ />
@@ -40,7 +42,7 @@
+ />
+ />
diff --git a/src/components/emoji_reactions/emoji_reactions.js b/src/components/emoji_reactions/emoji_reactions.js
index 06e21f6e..634bcac8 100644
--- a/src/components/emoji_reactions/emoji_reactions.js
+++ b/src/components/emoji_reactions/emoji_reactions.js
@@ -14,18 +14,20 @@ const EmojiReactions = {
showAll: false
}),
computed: {
- tooManyReactions () {
+ tooManyReactions() {
return this.status.emoji_reactions.length > EMOJI_REACTION_COUNT_CUTOFF
},
- emojiReactions () {
+ emojiReactions() {
return this.showAll
? this.status.emoji_reactions
: this.status.emoji_reactions.slice(0, EMOJI_REACTION_COUNT_CUTOFF)
},
- showMoreString () {
- return `+${this.status.emoji_reactions.length - EMOJI_REACTION_COUNT_CUTOFF}`
+ showMoreString() {
+ return `+${
+ this.status.emoji_reactions.length - EMOJI_REACTION_COUNT_CUTOFF
+ }`
},
- accountsForEmoji () {
+ accountsForEmoji() {
return this.status.emoji_reactions.reduce((acc, reaction) => {
if (reaction.url) {
acc[reaction.url] = reaction.accounts || []
@@ -35,30 +37,30 @@ const EmojiReactions = {
return acc
}, {})
},
- loggedIn () {
+ loggedIn() {
return !!this.$store.state.users.currentUser
}
},
methods: {
- toggleShowAll () {
+ toggleShowAll() {
this.showAll = !this.showAll
},
- reactedWith (emoji) {
- return this.status.emoji_reactions.find(r => r.name === emoji).me
+ reactedWith(emoji) {
+ return this.status.emoji_reactions.find((r) => r.name === emoji).me
},
- fetchEmojiReactionsByIfMissing () {
- const hasNoAccounts = this.status.emoji_reactions.find(r => !r.accounts)
+ fetchEmojiReactionsByIfMissing() {
+ const hasNoAccounts = this.status.emoji_reactions.find((r) => !r.accounts)
if (hasNoAccounts) {
this.$store.dispatch('fetchEmojiReactionsBy', this.status.id)
}
},
- reactWith (emoji) {
+ reactWith(emoji) {
this.$store.dispatch('reactWithEmoji', { id: this.status.id, emoji })
},
- unreact (emoji) {
+ unreact(emoji) {
this.$store.dispatch('unreactWithEmoji', { id: this.status.id, emoji })
},
- emojiOnClick (emoji, event) {
+ emojiOnClick(emoji, event) {
if (!this.loggedIn) return
if (this.reactedWith(emoji)) {
diff --git a/src/components/emoji_reactions/emoji_reactions.vue b/src/components/emoji_reactions/emoji_reactions.vue
index d9c568f6..83fa9c3e 100644
--- a/src/components/emoji_reactions/emoji_reactions.vue
+++ b/src/components/emoji_reactions/emoji_reactions.vue
@@ -1,28 +1,35 @@
-
+
diff --git a/src/components/exporter/exporter.js b/src/components/exporter/exporter.js
index fc75372e..f65b47ed 100644
--- a/src/components/exporter/exporter.js
+++ b/src/components/exporter/exporter.js
@@ -1,9 +1,7 @@
import { library } from '@fortawesome/fontawesome-svg-core'
import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
-library.add(
- faCircleNotch
-)
+library.add(faCircleNotch)
const Exporter = {
props: {
@@ -18,26 +16,30 @@ const Exporter = {
exportButtonLabel: { type: String },
processingMessage: { type: String }
},
- data () {
+ data() {
return {
processing: false
}
},
methods: {
- process () {
+ process() {
this.processing = true
- this.getContent()
- .then((content) => {
- const fileToDownload = document.createElement('a')
- fileToDownload.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(content))
- fileToDownload.setAttribute('download', this.filename)
- fileToDownload.style.display = 'none'
- document.body.appendChild(fileToDownload)
- fileToDownload.click()
- document.body.removeChild(fileToDownload)
- // Add delay before hiding processing state since browser takes some time to handle file download
- setTimeout(() => { this.processing = false }, 2000)
- })
+ this.getContent().then((content) => {
+ const fileToDownload = document.createElement('a')
+ fileToDownload.setAttribute(
+ 'href',
+ 'data:text/plain;charset=utf-8,' + encodeURIComponent(content)
+ )
+ fileToDownload.setAttribute('download', this.filename)
+ fileToDownload.style.display = 'none'
+ document.body.appendChild(fileToDownload)
+ fileToDownload.click()
+ document.body.removeChild(fileToDownload)
+ // Add delay before hiding processing state since browser takes some time to handle file download
+ setTimeout(() => {
+ this.processing = false
+ }, 2000)
+ })
}
}
}
diff --git a/src/components/extra_buttons/extra_buttons.js b/src/components/extra_buttons/extra_buttons.js
index 4bc6144c..8b950c88 100644
--- a/src/components/extra_buttons/extra_buttons.js
+++ b/src/components/extra_buttons/extra_buttons.js
@@ -35,7 +35,7 @@ const ExtraButtons = {
Popover,
ConfirmModal
},
- data () {
+ data() {
return {
expanded: false,
showingDeleteDialog: false,
@@ -43,154 +43,205 @@ const ExtraButtons = {
}
},
methods: {
- deleteStatus () {
+ deleteStatus() {
if (this.shouldConfirmDelete) {
this.showDeleteStatusConfirmDialog()
} else {
this.doDeleteStatus()
}
},
- doDeleteStatus () {
+ doDeleteStatus() {
this.$store.dispatch('deleteStatus', { id: this.status.id })
this.hideDeleteStatusConfirmDialog()
},
- showDeleteStatusConfirmDialog () {
+ showDeleteStatusConfirmDialog() {
this.showingDeleteDialog = true
},
- hideDeleteStatusConfirmDialog () {
+ hideDeleteStatusConfirmDialog() {
this.showingDeleteDialog = false
},
- translateStatus () {
+ translateStatus() {
if (this.noTranslationTargetSet) {
- this.$store.dispatch('pushGlobalNotice', { messageKey: 'toast.no_translation_target_set', level: 'info' })
+ this.$store.dispatch('pushGlobalNotice', {
+ messageKey: 'toast.no_translation_target_set',
+ level: 'info'
+ })
}
- const translateTo = this.$store.getters.mergedConfig.translationLanguage || this.$store.state.instance.interfaceLanguage
- this.$store.dispatch('translateStatus', { id: this.status.id, language: translateTo })
+ const translateTo =
+ this.$store.getters.mergedConfig.translationLanguage ||
+ this.$store.state.instance.interfaceLanguage
+ this.$store
+ .dispatch('translateStatus', {
+ id: this.status.id,
+ language: translateTo
+ })
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- pinStatus () {
- this.$store.dispatch('pinStatus', this.status.id)
+ pinStatus() {
+ this.$store
+ .dispatch('pinStatus', this.status.id)
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- unpinStatus () {
- this.$store.dispatch('unpinStatus', this.status.id)
+ unpinStatus() {
+ this.$store
+ .dispatch('unpinStatus', this.status.id)
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- muteConversation () {
- this.$store.dispatch('muteConversation', this.status.id)
+ muteConversation() {
+ this.$store
+ .dispatch('muteConversation', this.status.id)
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- unmuteConversation () {
- this.$store.dispatch('unmuteConversation', this.status.id)
+ unmuteConversation() {
+ this.$store
+ .dispatch('unmuteConversation', this.status.id)
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- copyLink () {
- navigator.clipboard.writeText(this.statusLink)
+ copyLink() {
+ navigator.clipboard
+ .writeText(this.statusLink)
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- bookmarkStatus () {
- this.$store.dispatch('bookmark', { id: this.status.id })
+ bookmarkStatus() {
+ this.$store
+ .dispatch('bookmark', { id: this.status.id })
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- unbookmarkStatus () {
- this.$store.dispatch('unbookmark', { id: this.status.id })
+ unbookmarkStatus() {
+ this.$store
+ .dispatch('unbookmark', { id: this.status.id })
.then(() => this.$emit('onSuccess'))
- .catch(err => this.$emit('onError', err.error.error))
+ .catch((err) => this.$emit('onError', err.error.error))
},
- reportStatus () {
- this.$store.dispatch('openUserReportingModal', { userId: this.status.user.id, statusIds: [this.status.id] })
+ reportStatus() {
+ this.$store.dispatch('openUserReportingModal', {
+ userId: this.status.user.id,
+ statusIds: [this.status.id]
+ })
},
- editStatus () {
- this.$store.dispatch('fetchStatusSource', { id: this.status.id })
- .then(data => this.$store.dispatch('openEditStatusModal', {
- statusId: this.status.id,
- subject: data.spoiler_text,
- statusText: data.text,
- statusIsSensitive: this.status.nsfw,
- statusPoll: this.status.poll,
- statusFiles: [...this.status.attachments],
- visibility: this.status.visibility,
- statusContentType: data.content_type
- }))
+ editStatus() {
+ this.$store
+ .dispatch('fetchStatusSource', { id: this.status.id })
+ .then((data) =>
+ this.$store.dispatch('openEditStatusModal', {
+ statusId: this.status.id,
+ subject: data.spoiler_text,
+ statusText: data.text,
+ statusIsSensitive: this.status.nsfw,
+ statusPoll: this.status.poll,
+ statusFiles: [...this.status.attachments],
+ visibility: this.status.visibility,
+ statusContentType: data.content_type
+ })
+ )
},
- showStatusHistory () {
+ showStatusHistory() {
const originalStatus = { ...this.status }
- const stripFieldsList = ['attachments', 'created_at', 'emojis', 'text', 'raw_html', 'nsfw', 'poll', 'summary', 'summary_raw_html']
- stripFieldsList.forEach(p => delete originalStatus[p])
+ const stripFieldsList = [
+ 'attachments',
+ 'created_at',
+ 'emojis',
+ 'text',
+ 'raw_html',
+ 'nsfw',
+ 'poll',
+ 'summary',
+ 'summary_raw_html'
+ ]
+ stripFieldsList.forEach((p) => delete originalStatus[p])
this.$store.dispatch('openStatusHistoryModal', originalStatus)
},
- redraftStatus () {
+ redraftStatus() {
if (this.shouldConfirmDelete) {
this.showRedraftStatusConfirmDialog()
} else {
this.doRedraftStatus()
}
},
- doRedraftStatus () {
- this.$store.dispatch('fetchStatusSource', { id: this.status.id })
- .then(data => this.$store.dispatch('openPostStatusModal', {
- isRedraft: true,
- statusId: this.status.id,
- subject: data.spoiler_text,
- statusText: data.text,
- statusIsSensitive: this.status.nsfw,
- statusPoll: this.status.poll,
- statusFiles: [...this.status.attachments],
- statusScope: this.status.visibility,
- statusContentType: data.content_type
- }))
+ doRedraftStatus() {
+ this.$store
+ .dispatch('fetchStatusSource', { id: this.status.id })
+ .then((data) =>
+ this.$store.dispatch('openPostStatusModal', {
+ isRedraft: true,
+ statusId: this.status.id,
+ subject: data.spoiler_text,
+ statusText: data.text,
+ statusIsSensitive: this.status.nsfw,
+ statusPoll: this.status.poll,
+ statusFiles: [...this.status.attachments],
+ statusScope: this.status.visibility,
+ statusContentType: data.content_type
+ })
+ )
this.doDeleteStatus()
},
- showRedraftStatusConfirmDialog () {
+ showRedraftStatusConfirmDialog() {
this.showingRedraftDialog = true
},
- hideRedraftStatusConfirmDialog () {
+ hideRedraftStatusConfirmDialog() {
this.showingRedraftDialog = false
}
},
computed: {
- currentUser () { return this.$store.state.users.currentUser },
- canDelete () {
- if (!this.currentUser) { return }
- const superuser = this.currentUser.rights.moderator || this.currentUser.rights.admin
+ currentUser() {
+ return this.$store.state.users.currentUser
+ },
+ canDelete() {
+ if (!this.currentUser) {
+ return
+ }
+ const superuser =
+ this.currentUser.rights.moderator || this.currentUser.rights.admin
return superuser || this.status.user.id === this.currentUser.id
},
- ownStatus () {
+ ownStatus() {
return this.status.user.id === this.currentUser.id
},
- canPin () {
- return this.ownStatus && (this.status.visibility === 'public' || this.status.visibility === 'unlisted')
+ canPin() {
+ return (
+ this.ownStatus &&
+ (this.status.visibility === 'public' ||
+ this.status.visibility === 'unlisted')
+ )
},
- canMute () {
+ canMute() {
return !!this.currentUser
},
- canTranslate () {
+ canTranslate() {
return this.$store.state.instance.translationEnabled === true
},
- noTranslationTargetSet () {
+ noTranslationTargetSet() {
return this.$store.getters.mergedConfig.translationLanguage === undefined
},
- statusLink () {
+ statusLink() {
if (this.status.is_local) {
- return `${this.$store.state.instance.server}${this.$router.resolve({ name: 'conversation', params: { id: this.status.id } }).href}`
+ return `${this.$store.state.instance.server}${
+ this.$router.resolve({
+ name: 'conversation',
+ params: { id: this.status.id }
+ }).href
+ }`
} else {
return this.status.external_url
}
},
- shouldConfirmDelete () {
+ shouldConfirmDelete() {
return this.$store.getters.mergedConfig.modalOnDelete
},
- isEdited () {
+ isEdited() {
return this.status.edited_at !== null
},
- editingAvailable () { return this.$store.state.instance.editingAvailable }
+ editingAvailable() {
+ return this.$store.state.instance.editingAvailable
+ }
}
}
diff --git a/src/components/extra_buttons/extra_buttons.vue b/src/components/extra_buttons/extra_buttons.vue
index 9da2ad8c..39c3e9b9 100644
--- a/src/components/extra_buttons/extra_buttons.vue
+++ b/src/components/extra_buttons/extra_buttons.vue
@@ -7,7 +7,7 @@
:bound-to="{ x: 'container' }"
remove-padding
>
-
+
-
+
-
+
diff --git a/src/components/flash/flash.js b/src/components/flash/flash.js
index 87f940a7..29fddba5 100644
--- a/src/components/flash/flash.js
+++ b/src/components/flash/flash.js
@@ -5,14 +5,11 @@ import {
faExclamationTriangle
} from '@fortawesome/free-solid-svg-icons'
-library.add(
- faStop,
- faExclamationTriangle
-)
+library.add(faStop, faExclamationTriangle)
const Flash = {
- props: [ 'src' ],
- data () {
+ props: ['src'],
+ data() {
return {
player: false, // can be true, "hidden", false. hidden = element exists
loaded: false,
@@ -20,7 +17,7 @@ const Flash = {
}
},
methods: {
- openPlayer () {
+ openPlayer() {
if (this.player) return // prevent double-loading, or re-loading on failure
this.player = 'hidden'
RuffleService.getRuffle().then((ruffle) => {
@@ -32,17 +29,20 @@ const Flash = {
container.appendChild(player)
player.style.width = '100%'
player.style.height = '100%'
- player.load(this.src).then(() => {
- this.player = true
- }).catch((e) => {
- console.error('Error loading ruffle', e)
- this.player = 'error'
- })
+ player
+ .load(this.src)
+ .then(() => {
+ this.player = true
+ })
+ .catch((e) => {
+ console.error('Error loading ruffle', e)
+ this.player = 'error'
+ })
this.ruffleInstance = player
this.$emit('playerOpened')
})
},
- closePlayer () {
+ closePlayer() {
this.ruffleInstance && this.ruffleInstance.remove()
this.player = false
this.$emit('playerClosed')
diff --git a/src/components/follow_button/follow_button.js b/src/components/follow_button/follow_button.js
index 443aa9bc..6a29e005 100644
--- a/src/components/follow_button/follow_button.js
+++ b/src/components/follow_button/follow_button.js
@@ -1,24 +1,27 @@
import ConfirmModal from '../confirm_modal/confirm_modal.vue'
-import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate'
+import {
+ requestFollow,
+ requestUnfollow
+} from '../../services/follow_manipulate/follow_manipulate'
export default {
props: ['relationship', 'user', 'labelFollowing', 'buttonClass'],
components: {
ConfirmModal
},
- data () {
+ data() {
return {
inProgress: false,
showingConfirmUnfollow: false
}
},
computed: {
- shouldConfirmUnfollow () {
+ shouldConfirmUnfollow() {
return this.$store.getters.mergedConfig.modalOnUnfollow
},
- isPressed () {
+ isPressed() {
return this.inProgress || this.relationship.following
},
- title () {
+ title() {
if (this.inProgress || this.relationship.following) {
return this.$t('user_card.follow_unfollow')
} else if (this.relationship.requested) {
@@ -27,7 +30,7 @@ export default {
return this.$t('user_card.follow')
}
},
- label () {
+ label() {
if (this.inProgress) {
return this.$t('user_card.follow_progress')
} else if (this.relationship.following) {
@@ -38,39 +41,44 @@ export default {
return this.$t('user_card.follow')
}
},
- disabled () {
+ disabled() {
return this.inProgress || this.user.deactivated
}
},
methods: {
- showConfirmUnfollow () {
+ showConfirmUnfollow() {
this.showingConfirmUnfollow = true
},
- hideConfirmUnfollow () {
+ hideConfirmUnfollow() {
this.showingConfirmUnfollow = false
},
- onClick () {
- this.relationship.following || this.relationship.requested ? this.unfollow() : this.follow()
+ onClick() {
+ this.relationship.following || this.relationship.requested
+ ? this.unfollow()
+ : this.follow()
},
- follow () {
+ follow() {
this.inProgress = true
requestFollow(this.relationship.id, this.$store).then(() => {
this.inProgress = false
})
},
- unfollow () {
+ unfollow() {
if (this.shouldConfirmUnfollow) {
this.showConfirmUnfollow()
} else {
this.doUnfollow()
}
},
- doUnfollow () {
+ doUnfollow() {
const store = this.$store
this.inProgress = true
requestUnfollow(this.relationship.id, store).then(() => {
this.inProgress = false
- store.commit('removeStatus', { timeline: 'friends', userId: this.relationship.id })
+ store.commit('removeStatus', {
+ timeline: 'friends',
+ userId: this.relationship.id
+ })
})
this.hideConfirmUnfollow()
diff --git a/src/components/follow_button/follow_button.vue b/src/components/follow_button/follow_button.vue
index e421c15b..a16c2dcd 100644
--- a/src/components/follow_button/follow_button.vue
+++ b/src/components/follow_button/follow_button.vue
@@ -21,9 +21,7 @@
tag="span"
>
-
+
diff --git a/src/components/follow_card/follow_card.js b/src/components/follow_card/follow_card.js
index b26b27a7..aa6d169c 100644
--- a/src/components/follow_card/follow_card.js
+++ b/src/components/follow_card/follow_card.js
@@ -4,10 +4,7 @@ import FollowButton from '../follow_button/follow_button.vue'
import RemoveFollowerButton from '../remove_follower_button/remove_follower_button.vue'
const FollowCard = {
- props: [
- 'user',
- 'noFollowsYou'
- ],
+ props: ['user', 'noFollowsYou'],
components: {
BasicUserCard,
RemoteFollow,
@@ -15,13 +12,13 @@ const FollowCard = {
RemoveFollowerButton
},
computed: {
- isMe () {
+ isMe() {
return this.$store.state.users.currentUser.id === this.user.id
},
- loggedIn () {
+ loggedIn() {
return this.$store.state.users.currentUser
},
- relationship () {
+ relationship() {
return this.$store.getters.relationship(this.user.id)
}
}
diff --git a/src/components/follow_request_card/follow_request_card.js b/src/components/follow_request_card/follow_request_card.js
index b0873bb1..38e9244a 100644
--- a/src/components/follow_request_card/follow_request_card.js
+++ b/src/components/follow_request_card/follow_request_card.js
@@ -8,39 +8,41 @@ const FollowRequestCard = {
BasicUserCard,
ConfirmModal
},
- data () {
+ data() {
return {
showingApproveConfirmDialog: false,
showingDenyConfirmDialog: false
}
},
methods: {
- findFollowRequestNotificationId () {
+ findFollowRequestNotificationId() {
const notif = notificationsFromStore(this.$store).find(
- (notif) => notif.from_profile.id === this.user.id && notif.type === 'follow_request'
+ (notif) =>
+ notif.from_profile.id === this.user.id &&
+ notif.type === 'follow_request'
)
return notif && notif.id
},
- showApproveConfirmDialog () {
+ showApproveConfirmDialog() {
this.showingApproveConfirmDialog = true
},
- hideApproveConfirmDialog () {
+ hideApproveConfirmDialog() {
this.showingApproveConfirmDialog = false
},
- showDenyConfirmDialog () {
+ showDenyConfirmDialog() {
this.showingDenyConfirmDialog = true
},
- hideDenyConfirmDialog () {
+ hideDenyConfirmDialog() {
this.showingDenyConfirmDialog = false
},
- approveUser () {
+ approveUser() {
if (this.shouldConfirmApprove) {
this.showApproveConfirmDialog()
} else {
this.doApprove()
}
},
- doApprove () {
+ doApprove() {
this.$store.state.api.backendInteractor.approveUser({ id: this.user.id })
this.$store.dispatch('removeFollowRequest', this.user)
@@ -48,22 +50,23 @@ const FollowRequestCard = {
this.$store.dispatch('markSingleNotificationAsSeen', { id: notifId })
this.$store.dispatch('updateNotification', {
id: notifId,
- updater: notification => {
+ updater: (notification) => {
notification.type = 'follow'
}
})
this.hideApproveConfirmDialog()
},
- denyUser () {
+ denyUser() {
if (this.shouldConfirmDeny) {
this.showDenyConfirmDialog()
} else {
this.doDeny()
}
},
- doDeny () {
+ doDeny() {
const notifId = this.findFollowRequestNotificationId()
- this.$store.state.api.backendInteractor.denyUser({ id: this.user.id })
+ this.$store.state.api.backendInteractor
+ .denyUser({ id: this.user.id })
.then(() => {
this.$store.dispatch('dismissNotificationLocal', { id: notifId })
this.$store.dispatch('removeFollowRequest', this.user)
@@ -72,13 +75,13 @@ const FollowRequestCard = {
}
},
computed: {
- mergedConfig () {
+ mergedConfig() {
return this.$store.getters.mergedConfig
},
- shouldConfirmApprove () {
+ shouldConfirmApprove() {
return this.mergedConfig.modalOnApproveFollow
},
- shouldConfirmDeny () {
+ shouldConfirmDeny() {
return this.mergedConfig.modalOnDenyFollow
}
}
diff --git a/src/components/follow_requests/follow_requests.js b/src/components/follow_requests/follow_requests.js
index 704a76c6..1129c0f0 100644
--- a/src/components/follow_requests/follow_requests.js
+++ b/src/components/follow_requests/follow_requests.js
@@ -5,7 +5,7 @@ const FollowRequests = {
FollowRequestCard
},
computed: {
- requests () {
+ requests() {
return this.$store.state.api.followRequests
}
}
diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js
index 92ee3f30..64166efe 100644
--- a/src/components/font_control/font_control.js
+++ b/src/components/font_control/font_control.js
@@ -5,11 +5,9 @@ export default {
components: {
Select
},
- props: [
- 'name', 'label', 'modelValue', 'fallback', 'options', 'no-inherit'
- ],
+ props: ['name', 'label', 'modelValue', 'fallback', 'options', 'no-inherit'],
emits: ['update:modelValue'],
- data () {
+ data() {
return {
lValue: this.modelValue,
availableOptions: [
@@ -19,43 +17,45 @@ export default {
'serif',
'monospace',
'sans-serif'
- ].filter(_ => _)
+ ].filter((_) => _)
}
},
- beforeUpdate () {
+ beforeUpdate() {
this.lValue = this.modelValue
},
computed: {
- present () {
+ present() {
return typeof this.lValue !== 'undefined'
},
- dValue () {
+ dValue() {
return this.lValue || this.fallback || {}
},
family: {
- get () {
+ get() {
return this.dValue.family
},
- set (v) {
+ set(v) {
set(this.lValue, 'family', v)
this.$emit('update:modelValue', this.lValue)
}
},
- isCustom () {
+ isCustom() {
return this.preset === 'custom'
},
preset: {
- get () {
- if (this.family === 'serif' ||
- this.family === 'sans-serif' ||
- this.family === 'monospace' ||
- this.family === 'inherit') {
+ get() {
+ if (
+ this.family === 'serif' ||
+ this.family === 'sans-serif' ||
+ this.family === 'monospace' ||
+ this.family === 'inherit'
+ ) {
return this.family
} else {
return 'custom'
}
},
- set (v) {
+ set(v) {
this.family = v === 'custom' ? '' : v
}
}
diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index f100c3a9..3a9a755f 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -15,8 +15,13 @@
class="opt exlcude-disabled"
type="checkbox"
:checked="present"
- @change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
- >
+ @change="
+ $emit(
+ 'update:modelValue',
+ typeof modelValue === 'undefined' ? fallback : undefined
+ )
+ "
+ />
-
+
diff --git a/src/components/lists/lists.js b/src/components/lists/lists.js
index 09c49407..a2dff8c7 100644
--- a/src/components/lists/lists.js
+++ b/src/components/lists/lists.js
@@ -2,7 +2,7 @@ import ListCard from '../list_card/list_card.vue'
import ListNew from '../list_new/list_new.vue'
const Lists = {
- data () {
+ data() {
return {
isNew: false
}
@@ -11,19 +11,19 @@ const Lists = {
ListCard,
ListNew
},
- created () {
+ created() {
this.$store.dispatch('startFetchingLists')
},
computed: {
- lists () {
+ lists() {
return this.$store.state.lists.allLists
}
},
methods: {
- cancelNewList () {
+ cancelNewList() {
this.isNew = false
},
- newList () {
+ newList() {
this.isNew = true
}
}
diff --git a/src/components/lists/lists.vue b/src/components/lists/lists.vue
index f11a2a02..017ea78e 100644
--- a/src/components/lists/lists.vue
+++ b/src/components/lists/lists.vue
@@ -14,7 +14,7 @@
class="button-default"
@click="newList"
>
- {{ $t("lists.new") }}
+ {{ $t('lists.new') }}
diff --git a/src/components/local_bubble_panel/local_bubble_panel.js b/src/components/local_bubble_panel/local_bubble_panel.js
index 7fb5ada2..95d9cd0a 100644
--- a/src/components/local_bubble_panel/local_bubble_panel.js
+++ b/src/components/local_bubble_panel/local_bubble_panel.js
@@ -4,7 +4,7 @@ import { get } from 'lodash'
const LocalBubblePanel = {
computed: {
...mapState({
- bubbleInstances: state => get(state, 'instance.localBubbleInstances')
+ bubbleInstances: (state) => get(state, 'instance.localBubbleInstances')
})
}
}
diff --git a/src/components/local_bubble_panel/local_bubble_panel.scss b/src/components/local_bubble_panel/local_bubble_panel.scss
index 80ea01d4..a262ed1c 100644
--- a/src/components/local_bubble_panel/local_bubble_panel.scss
+++ b/src/components/local_bubble_panel/local_bubble_panel.scss
@@ -2,19 +2,21 @@
margin: 1em;
table {
- width:100%;
+ width: 100%;
text-align: left;
- padding-left:10px;
- padding-bottom:20px;
+ padding-left: 10px;
+ padding-bottom: 20px;
- th, td {
+ th,
+ td {
width: 180px;
max-width: 360px;
- overflow: hidden;
+ overflow: hidden;
vertical-align: text-top;
}
- th+th, td+td {
+ th + th,
+ td + td {
width: auto;
}
}
diff --git a/src/components/local_bubble_panel/local_bubble_panel.vue b/src/components/local_bubble_panel/local_bubble_panel.vue
index 4b9eaf51..4151c548 100644
--- a/src/components/local_bubble_panel/local_bubble_panel.vue
+++ b/src/components/local_bubble_panel/local_bubble_panel.vue
@@ -6,11 +6,11 @@
- {{ $t("about.bubble_instances") }}
+ {{ $t('about.bubble_instances') }}
-
{{ $t("about.bubble_instances_description")}}:
+
{{ $t('about.bubble_instances_description') }}:
- ({
@@ -15,25 +11,31 @@ const LoginForm = {
error: false
}),
computed: {
- isPasswordAuth () { return this.requiredPassword },
- isTokenAuth () { return this.requiredToken },
+ isPasswordAuth() {
+ return this.requiredPassword
+ },
+ isTokenAuth() {
+ return this.requiredToken
+ },
...mapState({
- registrationOpen: state => state.instance.registrationOpen,
- instance: state => state.instance,
- loggingIn: state => state.users.loggingIn,
- oauth: state => state.oauth
+ registrationOpen: (state) => state.instance.registrationOpen,
+ instance: (state) => state.instance,
+ loggingIn: (state) => state.users.loggingIn,
+ oauth: (state) => state.oauth
}),
- ...mapGetters(
- 'authFlow', ['requiredPassword', 'requiredToken', 'requiredMFA']
- )
+ ...mapGetters('authFlow', [
+ 'requiredPassword',
+ 'requiredToken',
+ 'requiredMFA'
+ ])
},
methods: {
...mapMutations('authFlow', ['requireMFA']),
...mapActions({ login: 'authFlow/login' }),
- submit () {
+ submit() {
this.isTokenAuth ? this.submitToken() : this.submitPassword()
},
- submitToken () {
+ submitToken() {
const { clientId, clientSecret } = this.oauth
const data = {
clientId,
@@ -42,10 +44,11 @@ const LoginForm = {
commit: this.$store.commit
}
- oauthApi.getOrCreateApp(data)
- .then((app) => { oauthApi.login({ ...app, ...data }) })
+ oauthApi.getOrCreateApp(data).then((app) => {
+ oauthApi.login({ ...app, ...data })
+ })
},
- submitPassword () {
+ submitPassword() {
const { clientId } = this.oauth
const data = {
clientId,
@@ -56,33 +59,38 @@ const LoginForm = {
this.error = false
oauthApi.getOrCreateApp(data).then((app) => {
- oauthApi.getTokenWithCredentials(
- {
+ oauthApi
+ .getTokenWithCredentials({
...app,
instance: data.instance,
username: this.user.username,
password: this.user.password
- }
- ).then((result) => {
- if (result.error) {
- if (result.error === 'mfa_required') {
- this.requireMFA({ settings: result })
- } else if (result.identifier === 'password_reset_required') {
- this.$router.push({ name: 'password-reset', params: { passwordResetRequested: true } })
- } else {
- this.error = result.error
- this.focusOnPasswordInput()
- }
- return
- }
- this.login(result).then(() => {
- this.$router.push({ name: 'friends' })
})
- })
+ .then((result) => {
+ if (result.error) {
+ if (result.error === 'mfa_required') {
+ this.requireMFA({ settings: result })
+ } else if (result.identifier === 'password_reset_required') {
+ this.$router.push({
+ name: 'password-reset',
+ params: { passwordResetRequested: true }
+ })
+ } else {
+ this.error = result.error
+ this.focusOnPasswordInput()
+ }
+ return
+ }
+ this.login(result).then(() => {
+ this.$router.push({ name: 'friends' })
+ })
+ })
})
},
- clearError () { this.error = false },
- focusOnPasswordInput () {
+ clearError() {
+ this.error = false
+ },
+ focusOnPasswordInput() {
let passwordInput = this.$refs.passwordInput
passwordInput.focus()
passwordInput.setSelectionRange(0, passwordInput.value.length)
diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue
index 21482977..83c28108 100644
--- a/src/components/login_form/login_form.vue
+++ b/src/components/login_form/login_form.vue
@@ -20,7 +20,7 @@
:disabled="loggingIn"
class="form-control"
:placeholder="$t('login.placeholder')"
- >
+ />
@@ -31,10 +31,10 @@
:disabled="loggingIn"
class="form-control"
type="password"
- >
+ />
-
+
{{ $t('password_reset.forgot_password') }}
@@ -52,7 +52,7 @@
{{ $t('login.register') }}
@@ -90,7 +90,7 @@
-
+
+
diff --git a/src/components/mention_link/mention_link.js b/src/components/mention_link/mention_link.js
index 55eea195..1e38e036 100644
--- a/src/components/mention_link/mention_link.js
+++ b/src/components/mention_link/mention_link.js
@@ -1,15 +1,14 @@
import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
import { mapGetters, mapState } from 'vuex'
-import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js'
+import {
+ highlightClass,
+ highlightStyle
+} from '../../services/user_highlighter/user_highlighter.js'
import UserAvatar from '../user_avatar/user_avatar.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
-import {
- faAt
-} from '@fortawesome/free-solid-svg-icons'
+import { faAt } from '@fortawesome/free-solid-svg-icons'
-library.add(
- faAt
-)
+library.add(faAt)
const MentionLink = {
name: 'MentionLink',
@@ -35,7 +34,7 @@ const MentionLink = {
}
},
methods: {
- onClick () {
+ onClick() {
const link = generateProfileLink(
this.userId || this.user.id,
this.userScreenName || this.user.screen_name
@@ -44,36 +43,42 @@ const MentionLink = {
}
},
computed: {
- user () {
- return this.url && this.$store && this.$store.getters.findUserByUrl(this.url)
+ user() {
+ return (
+ this.url && this.$store && this.$store.getters.findUserByUrl(this.url)
+ )
},
- isYou () {
+ isYou() {
// FIXME why user !== currentUser???
return this.user && this.user.id === this.currentUser.id
},
- userName () {
+ userName() {
return this.user && this.userNameFullUi.split('@')[0]
},
- serverName () {
+ serverName() {
// XXX assumed that domain does not contain @
- return this.user && (this.userNameFullUi.split('@')[1] || this.$store.getters.instanceDomain)
+ return (
+ this.user &&
+ (this.userNameFullUi.split('@')[1] ||
+ this.$store.getters.instanceDomain)
+ )
},
- userNameFull () {
+ userNameFull() {
return this.user && this.user.screen_name
},
- userNameFullUi () {
+ userNameFullUi() {
return this.user && this.user.screen_name_ui
},
- highlight () {
+ highlight() {
return this.user && this.mergedConfig.highlight[this.user.screen_name]
},
- highlightType () {
- return this.highlight && ('-' + this.highlight.type)
+ highlightType() {
+ return this.highlight && '-' + this.highlight.type
},
- highlightClass () {
+ highlightClass() {
if (this.highlight) return highlightClass(this.user)
},
- style () {
+ style() {
if (this.highlight) {
const {
backgroundColor,
@@ -84,7 +89,7 @@ const MentionLink = {
return rest
}
},
- classnames () {
+ classnames() {
return [
{
'-you': this.isYou && this.shouldBoldenYou,
@@ -93,40 +98,45 @@ const MentionLink = {
this.highlightType
]
},
- useAtIcon () {
+ useAtIcon() {
return this.mergedConfig.useAtIcon
},
- isRemote () {
+ isRemote() {
return this.userName !== this.userNameFull
},
- shouldShowFullUserName () {
+ shouldShowFullUserName() {
const conf = this.mergedConfig.mentionLinkDisplay
if (conf === 'short') {
return false
} else if (conf === 'full') {
return true
- } else { // full_for_remote
+ } else {
+ // full_for_remote
return this.isRemote
}
},
- shouldShowTooltip () {
- return this.mergedConfig.mentionLinkShowTooltip && this.mergedConfig.mentionLinkDisplay === 'short' && this.isRemote
+ shouldShowTooltip() {
+ return (
+ this.mergedConfig.mentionLinkShowTooltip &&
+ this.mergedConfig.mentionLinkDisplay === 'short' &&
+ this.isRemote
+ )
},
- shouldShowAvatar () {
+ shouldShowAvatar() {
return this.mergedConfig.mentionLinkShowAvatar
},
- shouldShowYous () {
+ shouldShowYous() {
return this.mergedConfig.mentionLinkShowYous
},
- shouldBoldenYou () {
+ shouldBoldenYou() {
return this.mergedConfig.mentionLinkBoldenYou
},
- shouldFadeDomain () {
+ shouldFadeDomain() {
return this.mergedConfig.mentionLinkFadeDomain
},
...mapGetters(['mergedConfig']),
...mapState({
- currentUser: state => state.users.currentUser
+ currentUser: (state) => state.users.currentUser
})
}
}
diff --git a/src/components/mention_link/mention_link.scss b/src/components/mention_link/mention_link.scss
index cbc68d17..fd382c0b 100644
--- a/src/components/mention_link/mention_link.scss
+++ b/src/components/mention_link/mention_link.scss
@@ -74,21 +74,23 @@
&.-striped {
& .shortName,
& .full {
- background-image:
- repeating-linear-gradient(
- 135deg,
- var(--____highlight-tintColor),
- var(--____highlight-tintColor) 5px,
- var(--____highlight-tintColor2) 5px,
- var(--____highlight-tintColor2) 10px
- );
+ background-image: repeating-linear-gradient(
+ 135deg,
+ var(--____highlight-tintColor),
+ var(--____highlight-tintColor) 5px,
+ var(--____highlight-tintColor2) 5px,
+ var(--____highlight-tintColor2) 10px
+ );
}
}
&.-solid {
& .shortName,
& .full {
- background-image: linear-gradient(var(--____highlight-tintColor2), var(--____highlight-tintColor2));
+ background-image: linear-gradient(
+ var(--____highlight-tintColor2),
+ var(--____highlight-tintColor2)
+ );
}
}
diff --git a/src/components/mention_link/mention_link.vue b/src/components/mention_link/mention_link.vue
index d2df9535..f31cb550 100644
--- a/src/components/mention_link/mention_link.vue
+++ b/src/components/mention_link/mention_link.vue
@@ -1,7 +1,5 @@
-
+
- @
+ @
{{ ' ' + $t('status.you') }}
-
-
+ {{ ' ' + $t('status.you') }}
+
-
+
@
-
+
-
+
diff --git a/src/components/mentions/mentions.js b/src/components/mentions/mentions.js
index 841d5aa4..9b76ef71 100644
--- a/src/components/mentions/mentions.js
+++ b/src/components/mentions/mentions.js
@@ -2,7 +2,7 @@ import Timeline from '../timeline/timeline.vue'
const Mentions = {
computed: {
- timeline () {
+ timeline() {
return this.$store.state.statuses.timelines.mentions
}
},
diff --git a/src/components/mentions_line/mentions_line.js b/src/components/mentions_line/mentions_line.js
index a4a0c724..66c6c097 100644
--- a/src/components/mentions_line/mentions_line.js
+++ b/src/components/mentions_line/mentions_line.js
@@ -16,19 +16,19 @@ const MentionsLine = {
MentionLink
},
computed: {
- mentionsComputed () {
+ mentionsComputed() {
return this.mentions.slice(0, MENTIONS_LIMIT)
},
- extraMentions () {
+ extraMentions() {
return this.mentions.slice(MENTIONS_LIMIT)
},
- manyMentions () {
+ manyMentions() {
return this.extraMentions.length > 0
},
...mapGetters(['mergedConfig'])
},
methods: {
- toggleShowMore () {
+ toggleShowMore() {
this.expanded = !this.expanded
}
}
diff --git a/src/components/mentions_line/mentions_line.vue b/src/components/mentions_line/mentions_line.vue
index 09b6a1d6..9ac039ae 100644
--- a/src/components/mentions_line/mentions_line.vue
+++ b/src/components/mentions_line/mentions_line.vue
@@ -20,14 +20,14 @@
class="mention-link"
:content="mention.content"
:url="mention.url"
- />
-
@@ -30,7 +30,7 @@
>
{{ $t('login.enter_two_factor_code') }}
-
+
-
+
diff --git a/src/components/mfa_form/totp_form.js b/src/components/mfa_form/totp_form.js
index 6ee823ed..3d61075e 100644
--- a/src/components/mfa_form/totp_form.js
+++ b/src/components/mfa_form/totp_form.js
@@ -1,13 +1,9 @@
import mfaApi from '../../services/new_api/mfa.js'
import { mapState, mapGetters, mapActions, mapMutations } from 'vuex'
import { library } from '@fortawesome/fontawesome-svg-core'
-import {
- faTimes
-} from '@fortawesome/free-solid-svg-icons'
+import { faTimes } from '@fortawesome/free-solid-svg-icons'
-library.add(
- faTimes
-)
+library.add(faTimes)
export default {
data: () => ({
@@ -26,8 +22,10 @@ export default {
methods: {
...mapMutations('authFlow', ['requireRecovery', 'abortMFA']),
...mapActions({ login: 'authFlow/login' }),
- clearError () { this.error = false },
- submit () {
+ clearError() {
+ this.error = false
+ },
+ submit() {
const { clientId, clientSecret } = this.oauth
const data = {
diff --git a/src/components/mfa_form/totp_form.vue b/src/components/mfa_form/totp_form.vue
index 709eb9b8..cc0d9b35 100644
--- a/src/components/mfa_form/totp_form.vue
+++ b/src/components/mfa_form/totp_form.vue
@@ -19,7 +19,7 @@
id="code"
v-model="code"
class="form-control"
- >
+ />
-
+
{{ $t('moderation.reports.no_reports') }}
diff --git a/src/components/modal/modal.vue b/src/components/modal/modal.vue
index 9394efff..b8dedc05 100644
--- a/src/components/modal/modal.vue
+++ b/src/components/modal/modal.vue
@@ -23,10 +23,10 @@ export default {
}
},
computed: {
- classes () {
+ classes() {
return {
'modal-background': !this.noBackground,
- 'open': this.isOpen
+ open: this.isOpen
}
}
}
diff --git a/src/components/moderation_tools/moderation_tools.js b/src/components/moderation_tools/moderation_tools.js
index 2469327a..ee10d1b0 100644
--- a/src/components/moderation_tools/moderation_tools.js
+++ b/src/components/moderation_tools/moderation_tools.js
@@ -15,10 +15,8 @@ const SANDBOX = 'mrf_tag:sandbox'
const QUARANTINE = 'mrf_tag:quarantine'
const ModerationTools = {
- props: [
- 'user'
- ],
- data () {
+ props: ['user'],
+ data() {
return {
tags: {
FORCE_NSFW,
@@ -38,66 +36,95 @@ const ModerationTools = {
Popover
},
computed: {
- tagsSet () {
+ tagsSet() {
return new Set(this.user.tags)
},
- hasTagPolicy () {
+ hasTagPolicy() {
return this.$store.state.instance.tagPolicyAvailable
}
},
methods: {
- hasTag (tagName) {
+ hasTag(tagName) {
return this.tagsSet.has(tagName)
},
- toggleTag (tag) {
+ toggleTag(tag) {
const store = this.$store
if (this.tagsSet.has(tag)) {
- store.state.api.backendInteractor.untagUser({ user: this.user, tag }).then(response => {
- if (!response.ok) { return }
- store.commit('untagUser', { user: this.user, tag })
- })
+ store.state.api.backendInteractor
+ .untagUser({ user: this.user, tag })
+ .then((response) => {
+ if (!response.ok) {
+ return
+ }
+ store.commit('untagUser', { user: this.user, tag })
+ })
} else {
- store.state.api.backendInteractor.tagUser({ user: this.user, tag }).then(response => {
- if (!response.ok) { return }
- store.commit('tagUser', { user: this.user, tag })
- })
+ store.state.api.backendInteractor
+ .tagUser({ user: this.user, tag })
+ .then((response) => {
+ if (!response.ok) {
+ return
+ }
+ store.commit('tagUser', { user: this.user, tag })
+ })
}
},
- toggleRight (right) {
+ toggleRight(right) {
const store = this.$store
if (this.user.rights[right]) {
- store.state.api.backendInteractor.deleteRight({ user: this.user, right }).then(response => {
- if (!response.ok) { return }
- store.commit('updateRight', { user: this.user, right, value: false })
- })
+ store.state.api.backendInteractor
+ .deleteRight({ user: this.user, right })
+ .then((response) => {
+ if (!response.ok) {
+ return
+ }
+ store.commit('updateRight', {
+ user: this.user,
+ right,
+ value: false
+ })
+ })
} else {
- store.state.api.backendInteractor.addRight({ user: this.user, right }).then(response => {
- if (!response.ok) { return }
- store.commit('updateRight', { user: this.user, right, value: true })
- })
+ store.state.api.backendInteractor
+ .addRight({ user: this.user, right })
+ .then((response) => {
+ if (!response.ok) {
+ return
+ }
+ store.commit('updateRight', {
+ user: this.user,
+ right,
+ value: true
+ })
+ })
}
},
- toggleActivationStatus () {
+ toggleActivationStatus() {
this.$store.dispatch('toggleActivationStatus', { user: this.user })
},
- deleteUserDialog (show) {
+ deleteUserDialog(show) {
this.showDeleteUserDialog = show
},
- deleteUser () {
+ deleteUser() {
const store = this.$store
const user = this.user
const { id, name } = user
- store.state.api.backendInteractor.deleteUser({ user })
- .then(e => {
- this.$store.dispatch('markStatusesAsDeleted', status => user.id === status.user.id)
- const isProfile = this.$route.name === 'external-user-profile' || this.$route.name === 'user-profile'
- const isTargetUser = this.$route.params.name === name || this.$route.params.id === id
- if (isProfile && isTargetUser) {
- window.history.back()
- }
- })
+ store.state.api.backendInteractor.deleteUser({ user }).then((e) => {
+ this.$store.dispatch(
+ 'markStatusesAsDeleted',
+ (status) => user.id === status.user.id
+ )
+ const isProfile =
+ this.$route.name === 'external-user-profile' ||
+ this.$route.name === 'user-profile'
+ const isTargetUser =
+ this.$route.params.name === name || this.$route.params.id === id
+ if (isProfile && isTargetUser) {
+ window.history.back()
+ }
+ })
},
- setToggled (value) {
+ setToggled(value) {
this.toggled = value
}
}
diff --git a/src/components/moderation_tools/moderation_tools.vue b/src/components/moderation_tools/moderation_tools.vue
index 75ea08cc..4648afed 100644
--- a/src/components/moderation_tools/moderation_tools.vue
+++ b/src/components/moderation_tools/moderation_tools.vue
@@ -8,20 +8,32 @@
@show="setToggled(true)"
@close="setToggled(false)"
>
-
+