diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/attachment/attachment.js | 2 | ||||
| -rw-r--r-- | src/components/attachment/attachment.vue | 2 | ||||
| -rw-r--r-- | src/components/conversation-page/conversation-page.js | 4 | ||||
| -rw-r--r-- | src/components/conversation/conversation.js | 36 | ||||
| -rw-r--r-- | src/components/status/status.js | 23 | ||||
| -rw-r--r-- | src/components/status/status.vue | 12 | ||||
| -rw-r--r-- | src/components/tab_switcher/tab_switcher.jsx | 28 | ||||
| -rw-r--r-- | src/components/user_profile/user_profile.js | 16 | ||||
| -rw-r--r-- | src/components/user_profile/user_profile.vue | 1 | ||||
| -rw-r--r-- | src/components/who_to_follow_panel/who_to_follow_panel.js | 6 |
10 files changed, 96 insertions, 34 deletions
diff --git a/src/components/attachment/attachment.js b/src/components/attachment/attachment.js index 0ae8f71a..47939852 100644 --- a/src/components/attachment/attachment.js +++ b/src/components/attachment/attachment.js @@ -14,7 +14,7 @@ const Attachment = { ], data () { return { - nsfwImage: this.$store.state.config.nsfwCensorImage || nsfwImage, + nsfwImage: this.$store.state.instance.nsfwCensorImage || nsfwImage, hideNsfwLocal: this.$store.state.config.hideNsfw, preloadImage: this.$store.state.config.preloadImage, loading: false, diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue index 56a49d2d..5a80db8a 100644 --- a/src/components/attachment/attachment.vue +++ b/src/components/attachment/attachment.vue @@ -27,7 +27,7 @@ :href="attachment.url" target="_blank" :title="attachment.description" > - <StillImage referrerpolicy="referrerPolicy" :mimetype="attachment.mimetype" :src="attachment.large_thumb_url || attachment.url"/> + <StillImage :referrerpolicy="referrerpolicy" :mimetype="attachment.mimetype" :src="attachment.large_thumb_url || attachment.url"/> </a> <a class="video-container" diff --git a/src/components/conversation-page/conversation-page.js b/src/components/conversation-page/conversation-page.js index beffa5bb..8f1ac3d9 100644 --- a/src/components/conversation-page/conversation-page.js +++ b/src/components/conversation-page/conversation-page.js @@ -1,5 +1,5 @@ import Conversation from '../conversation/conversation.vue' -import { find, toInteger } from 'lodash' +import { find } from 'lodash' const conversationPage = { components: { @@ -7,7 +7,7 @@ const conversationPage = { }, computed: { statusoid () { - const id = toInteger(this.$route.params.id) + const id = this.$route.params.id const statuses = this.$store.state.statuses.allStatuses const status = find(statuses, {id}) diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index 9d9f7bbe..c18781de 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -1,10 +1,25 @@ -import { reduce, filter, sortBy } from 'lodash' -import { statusType } from '../../modules/statuses.js' +import { reduce, filter } from 'lodash' import Status from '../status/status.vue' +const sortById = (a, b) => { + const seqA = Number(a.id) + const seqB = Number(b.id) + const isSeqA = !Number.isNaN(seqA) + const isSeqB = !Number.isNaN(seqB) + if (isSeqA && isSeqB) { + return seqA < seqB ? -1 : 1 + } else if (isSeqA && !isSeqB) { + return 1 + } else if (!isSeqA && isSeqB) { + return -1 + } else { + return a.id < b.id ? -1 : 1 + } +} + const sortAndFilterConversation = (conversation) => { - conversation = filter(conversation, (status) => statusType(status) !== 'retweet') - return sortBy(conversation, 'id') + conversation = filter(conversation, (status) => status.type !== 'retweet') + return conversation.filter(_ => _).sort(sortById) } const conversation = { @@ -18,10 +33,12 @@ const conversation = { 'collapsable' ], computed: { - status () { return this.statusoid }, + status () { + return this.statusoid + }, conversation () { if (!this.status) { - return false + return [] } const conversationId = this.status.statusnet_conversation_id @@ -32,7 +49,9 @@ const conversation = { replies () { let i = 1 return reduce(this.conversation, (result, {id, in_reply_to_status_id}) => { - const irid = Number(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({ @@ -69,7 +88,6 @@ const conversation = { } }, getReplies (id) { - id = Number(id) return this.replies[id] || [] }, focused (id) { @@ -80,7 +98,7 @@ const conversation = { } }, setHighlight (id) { - this.highlight = Number(id) + this.highlight = id } } } diff --git a/src/components/status/status.js b/src/components/status/status.js index 1db074e2..2d485616 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -76,6 +76,14 @@ const Status = { return (this.$store.state.config.hideAttachments && !this.inConversation) || (this.$store.state.config.hideAttachmentsInConv && this.inConversation) }, + userProfileLink () { + return this.generateUserProfileLink(this.status.user.id, this.status.user.screen_name) + }, + replyProfileLink () { + if (this.isReply) { + return this.generateUserProfileLink(this.status.in_reply_to_status_id, this.replyToName) + } + }, retweet () { return !!this.statusoid.retweeted_status }, retweeter () { return this.statusoid.user.name }, retweeterHtml () { return this.statusoid.user.name_html }, @@ -122,6 +130,14 @@ const Status = { isReply () { return !!this.status.in_reply_to_status_id }, + replyToName () { + const user = this.$store.state.users.usersObject[this.status.in_reply_to_user_id] + if (user) { + return user.screen_name + } else { + return this.status.in_reply_to_screen_name + } + }, hideReply () { if (this.$store.state.config.replyVisibility === 'all') { return false @@ -132,7 +148,7 @@ const Status = { if (this.status.user.id === this.$store.state.users.currentUser.id) { return false } - if (this.status.activity_type === 'repeat') { + if (this.status.type === 'retweet') { return false } var checkFollowing = this.$store.state.config.replyVisibility === 'following' @@ -281,7 +297,7 @@ const Status = { }, replyEnter (id, event) { this.showPreview = true - const targetId = Number(id) + const targetId = id const statuses = this.$store.state.statuses.allStatuses if (!this.preview) { @@ -300,7 +316,7 @@ const Status = { replyLeave () { this.showPreview = false }, - userProfileLink (id, name) { + generateUserProfileLink (id, name) { return generateProfileLink(id, name, this.$store.state.instance.restrictedNicknames) }, setMedia () { @@ -310,7 +326,6 @@ const Status = { }, watch: { 'highlight': function (id) { - id = Number(id) if (this.status.id === id) { let rect = this.$el.getBoundingClientRect() if (rect.top < 100) { diff --git a/src/components/status/status.vue b/src/components/status/status.vue index ba3b9a4a..c1800d64 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -3,7 +3,7 @@ <template v-if="muted && !noReplyLinks"> <div class="media status container muted"> <small> - <router-link :to="userProfileLink(status.user.id, status.user.screen_name)"> + <router-link :to="userProfileLink"> {{status.user.screen_name}} </router-link> </small> @@ -38,16 +38,16 @@ <h4 class="user-name" v-if="status.user.name_html" v-html="status.user.name_html"></h4> <h4 class="user-name" v-else>{{status.user.name}}</h4> <span class="links"> - <router-link :to="userProfileLink(status.user.id, status.user.screen_name)"> + <router-link :to="userProfileLink"> {{status.user.screen_name}} </router-link> - <span v-if="status.in_reply_to_screen_name" class="faint reply-info"> + <span v-if="isReply" class="faint reply-info"> <i class="icon-right-open"></i> - <router-link :to="userProfileLink(status.in_reply_to_user_id, status.in_reply_to_screen_name)"> - {{status.in_reply_to_screen_name}} + <router-link :to="replyProfileLink"> + {{replyToName}} </router-link> </span> - <a v-if="isReply && !noReplyLinks" href="#" @click.prevent="gotoOriginal(status.in_reply_to_status_id)" :title="$t('tool_tip.reply')"> + <a v-if="isReply && !noReplyLinks" href="#" @click.prevent="gotoOriginal(status.in_reply_to_status_id)" :aria-label="$t('tool_tip.reply')"> <i class="button-icon icon-reply" @mouseenter="replyEnter(status.in_reply_to_status_id, $event)" @mouseout="replyLeave()"></i> </a> </span> diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx index 2f362c4d..9038733c 100644 --- a/src/components/tab_switcher/tab_switcher.jsx +++ b/src/components/tab_switcher/tab_switcher.jsx @@ -6,18 +6,26 @@ export default Vue.component('tab-switcher', { name: 'TabSwitcher', data () { return { - active: 0 + active: this.$slots.default.findIndex(_ => _.tag) } }, methods: { - activateTab(index) { - return () => this.active = index; + activateTab (index) { + return () => { + this.active = index + } } }, - render(h) { + beforeUpdate () { + const currentSlot = this.$slots.default[this.active] + if (!currentSlot.tag) { + this.active = this.$slots.default.findIndex(_ => _.tag) + } + }, + render (h) { const tabs = this.$slots.default - .filter(slot => slot.data) .map((slot, index) => { + if (!slot.tag) return const classesTab = ['tab'] const classesWrapper = ['tab-wrapper'] @@ -25,20 +33,24 @@ export default Vue.component('tab-switcher', { classesTab.push('active') classesWrapper.push('active') } + return ( <div class={ classesWrapper.join(' ')}> <button onClick={this.activateTab(index)} class={ classesTab.join(' ') }>{slot.data.attrs.label}</button> </div> ) - }); - const contents = this.$slots.default.filter(_=>_.data).map(( slot, index ) => { + }) + + const contents = this.$slots.default.map((slot, index) => { + if (!slot.tag) return const active = index === this.active return ( <div class={active ? 'active' : 'hidden'}> {slot} </div> ) - }); + }) + return ( <div class="tab-switcher"> <div class="tabs"> diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js index bde20707..c9197a1c 100644 --- a/src/components/user_profile/user_profile.js +++ b/src/components/user_profile/user_profile.js @@ -5,24 +5,33 @@ import Timeline from '../timeline/timeline.vue' const UserProfile = { created () { this.$store.commit('clearTimeline', { timeline: 'user' }) + this.$store.commit('clearTimeline', { timeline: 'favorites' }) this.$store.dispatch('startFetching', ['user', this.fetchBy]) + this.$store.dispatch('startFetching', ['favorites', this.fetchBy]) if (!this.user.id) { this.$store.dispatch('fetchUser', this.fetchBy) } }, destroyed () { this.$store.dispatch('stopFetching', 'user') + this.$store.dispatch('stopFetching', 'favorites') }, computed: { timeline () { return this.$store.state.statuses.timelines.user }, + favorites () { + return this.$store.state.statuses.timelines.favorites + }, userId () { return this.$route.params.id || this.user.id }, userName () { return this.$route.params.name || this.user.screen_name }, + isUs () { + return this.userId === this.$store.state.users.currentUser.id + }, friends () { return this.user.friends }, @@ -62,21 +71,28 @@ const UserProfile = { } }, watch: { + // TODO get rid of this copypasta userName () { if (this.isExternal) { return } this.$store.dispatch('stopFetching', 'user') + this.$store.dispatch('stopFetching', 'favorites') this.$store.commit('clearTimeline', { timeline: 'user' }) + this.$store.commit('clearTimeline', { timeline: 'favorites' }) this.$store.dispatch('startFetching', ['user', this.fetchBy]) + this.$store.dispatch('startFetching', ['favorites', this.fetchBy]) }, userId () { if (!this.isExternal) { return } this.$store.dispatch('stopFetching', 'user') + this.$store.dispatch('stopFetching', 'favorites') this.$store.commit('clearTimeline', { timeline: 'user' }) + this.$store.commit('clearTimeline', { timeline: 'favorites' }) this.$store.dispatch('startFetching', ['user', this.fetchBy]) + this.$store.dispatch('startFetching', ['favorites', this.fetchBy]) }, user () { if (this.user.id && !this.user.followers) { diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue index 50619026..d64ce277 100644 --- a/src/components/user_profile/user_profile.vue +++ b/src/components/user_profile/user_profile.vue @@ -20,6 +20,7 @@ <i class="icon-spin3 animate-spin"></i> </div> </div> + <Timeline v-if="isUs" :label="$t('user_card.favorites')" :embedded="true" :title="$t('user_profile.favorites_title')" timeline-name="favorites" :timeline="favorites"/> </tab-switcher> </div> <div v-else class="panel user-profile-placeholder"> diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.js b/src/components/who_to_follow_panel/who_to_follow_panel.js index 5e204001..a56a27ea 100644 --- a/src/components/who_to_follow_panel/who_to_follow_panel.js +++ b/src/components/who_to_follow_panel/who_to_follow_panel.js @@ -1,12 +1,12 @@ import apiService from '../../services/api/api.service.js' import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator' -import _ from 'lodash' +import { shuffle } from 'lodash' function showWhoToFollow (panel, reply) { - _.shuffle(reply) + const shuffled = shuffle(reply) panel.usersToFollow.forEach((toFollow, index) => { - let user = reply[index] + let user = shuffled[index] let img = user.avatar || '/images/avi.png' let name = user.acct |
