Refactor: Swap `dispatch`/`commit` calls with mapped actions/mutations
This commit is contained in:
parent
e72fbcf0a4
commit
6ccc7e9fa4
|
@ -1,5 +1,5 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import { mapActions } from 'vuex'
|
import { mapActions, mapMutations } from 'vuex'
|
||||||
import { ObserveVisibility } from 'vue-observe-visibility'
|
import { ObserveVisibility } from 'vue-observe-visibility'
|
||||||
import FtFlexBox from './components/ft-flex-box/ft-flex-box.vue'
|
import FtFlexBox from './components/ft-flex-box/ft-flex-box.vue'
|
||||||
import TopNav from './components/top-nav/top-nav.vue'
|
import TopNav from './components/top-nav/top-nav.vue'
|
||||||
|
@ -82,11 +82,11 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted: function () {
|
mounted: function () {
|
||||||
this.$store.dispatch('grabUserSettings').then(() => {
|
this.grabUserSettings().then(() => {
|
||||||
this.$store.dispatch('grabAllProfiles', this.$t('Profile.All Channels')).then(async () => {
|
this.grabAllProfiles(this.$t('Profile.All Channels')).then(async () => {
|
||||||
this.$store.dispatch('grabHistory')
|
this.grabHistory()
|
||||||
this.$store.dispatch('grabAllPlaylists')
|
this.grabAllPlaylists()
|
||||||
this.$store.commit('setUsingElectron', useElectron)
|
this.setUsingElectron(useElectron)
|
||||||
this.checkThemeSettings()
|
this.checkThemeSettings()
|
||||||
await this.checkLocale()
|
await this.checkLocale()
|
||||||
|
|
||||||
|
@ -134,7 +134,7 @@ export default Vue.extend({
|
||||||
locale: this.$i18n.locale
|
locale: this.$i18n.locale
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('getRegionData', payload)
|
this.getRegionData(payload)
|
||||||
},
|
},
|
||||||
|
|
||||||
checkThemeSettings: function () {
|
checkThemeSettings: function () {
|
||||||
|
@ -301,7 +301,7 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
handleYoutubeLink: function (href) {
|
handleYoutubeLink: function (href) {
|
||||||
this.$store.dispatch('getYoutubeUrlInfo', href).then((result) => {
|
this.getYoutubeUrlInfo(href).then((result) => {
|
||||||
switch (result.urlType) {
|
switch (result.urlType) {
|
||||||
case 'video': {
|
case 'video': {
|
||||||
const { videoId, timestamp } = result
|
const { videoId, timestamp } = result
|
||||||
|
@ -393,7 +393,17 @@ export default Vue.extend({
|
||||||
|
|
||||||
...mapActions([
|
...mapActions([
|
||||||
'showToast',
|
'showToast',
|
||||||
'openExternalLink'
|
'openExternalLink',
|
||||||
|
'grabUserSettings',
|
||||||
|
'grabAllProfiles',
|
||||||
|
'grabHistory',
|
||||||
|
'grabAllPlaylists',
|
||||||
|
'getRegionData',
|
||||||
|
'getYoutubeUrlInfo'
|
||||||
|
]),
|
||||||
|
|
||||||
|
...mapMutations([
|
||||||
|
'setUsingElectron'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -291,7 +291,7 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
initializeSponsorBlock() {
|
initializeSponsorBlock() {
|
||||||
this.$store.dispatch('sponsorBlockSkipSegments', {
|
this.sponsorBlockSkipSegments({
|
||||||
videoId: this.videoId,
|
videoId: this.videoId,
|
||||||
categories: ['sponsor']
|
categories: ['sponsor']
|
||||||
}).then((skipSegments) => {
|
}).then((skipSegments) => {
|
||||||
|
@ -1341,7 +1341,8 @@ export default Vue.extend({
|
||||||
|
|
||||||
...mapActions([
|
...mapActions([
|
||||||
'showToast',
|
'showToast',
|
||||||
'calculateColorLuminance'
|
'calculateColorLuminance',
|
||||||
|
'sponsorBlockSkipSegments'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -105,7 +105,7 @@ export default Vue.extend({
|
||||||
searchInput.blur()
|
searchInput.blur()
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('getYoutubeUrlInfo', query).then((result) => {
|
this.getYoutubeUrlInfo(query).then((result) => {
|
||||||
switch (result.urlType) {
|
switch (result.urlType) {
|
||||||
case 'video': {
|
case 'video': {
|
||||||
const { videoId, timestamp } = result
|
const { videoId, timestamp } = result
|
||||||
|
@ -220,7 +220,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousAPICall', searchPayload).then((results) => {
|
this.invidiousAPICall(searchPayload).then((results) => {
|
||||||
this.searchSuggestionsDataList = results.suggestions
|
this.searchSuggestionsDataList = results.suggestions
|
||||||
}).catch((err) => {
|
}).catch((err) => {
|
||||||
console.log(err)
|
console.log(err)
|
||||||
|
@ -267,7 +267,9 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
...mapActions([
|
...mapActions([
|
||||||
'showToast'
|
'showToast',
|
||||||
|
'getYoutubeUrlInfo',
|
||||||
|
'invidiousAPICall'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -337,7 +337,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousAPICall', payload).then((response) => {
|
this.invidiousAPICall(payload).then((response) => {
|
||||||
const commentData = response.comments.map((comment) => {
|
const commentData = response.comments.map((comment) => {
|
||||||
comment.showReplies = false
|
comment.showReplies = false
|
||||||
comment.authorLink = comment.authorId
|
comment.authorLink = comment.authorId
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
|
import { mapActions } from 'vuex'
|
||||||
import FtLoader from '../ft-loader/ft-loader.vue'
|
import FtLoader from '../ft-loader/ft-loader.vue'
|
||||||
import FtCard from '../ft-card/ft-card.vue'
|
import FtCard from '../ft-card/ft-card.vue'
|
||||||
import FtButton from '../ft-button/ft-button.vue'
|
import FtButton from '../ft-button/ft-button.vue'
|
||||||
|
@ -183,7 +184,7 @@ export default Vue.extend({
|
||||||
console.log(this.comments.length)
|
console.log(this.comments.length)
|
||||||
|
|
||||||
if (typeof (comment.superchat) !== 'undefined') {
|
if (typeof (comment.superchat) !== 'undefined') {
|
||||||
this.$store.dispatch('getRandomColorClass').then((data) => {
|
this.getRandomColorClass().then((data) => {
|
||||||
comment.superchat.colorClass = data
|
comment.superchat.colorClass = data
|
||||||
|
|
||||||
this.superChatComments.unshift(comment)
|
this.superChatComments.unshift(comment)
|
||||||
|
@ -195,7 +196,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
|
|
||||||
if (comment.author.name[0] === 'Ge' || comment.author.name[0] === 'Ne') {
|
if (comment.author.name[0] === 'Ge' || comment.author.name[0] === 'Ne') {
|
||||||
this.$store.dispatch('getRandomColorClass').then((data) => {
|
this.getRandomColorClass().then((data) => {
|
||||||
comment.superChat = {
|
comment.superChat = {
|
||||||
amount: '$5.00',
|
amount: '$5.00',
|
||||||
colorClass: data
|
colorClass: data
|
||||||
|
@ -260,6 +261,10 @@ export default Vue.extend({
|
||||||
preventDefault: function (event) {
|
preventDefault: function (event) {
|
||||||
event.stopPropagation()
|
event.stopPropagation()
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
}
|
},
|
||||||
|
|
||||||
|
...mapActions([
|
||||||
|
'getRandomColorClass'
|
||||||
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -277,7 +277,7 @@ export default Vue.extend({
|
||||||
getPlaylistInformationLocal: function () {
|
getPlaylistInformationLocal: function () {
|
||||||
this.isLoading = true
|
this.isLoading = true
|
||||||
|
|
||||||
this.$store.dispatch('ytGetPlaylistInfo', this.playlistId).then((result) => {
|
this.ytGetPlaylistInfo(this.playlistId).then((result) => {
|
||||||
console.log('done')
|
console.log('done')
|
||||||
console.log(result)
|
console.log(result)
|
||||||
|
|
||||||
|
@ -338,7 +338,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousGetPlaylistInfo', payload).then((result) => {
|
this.invidiousGetPlaylistInfo(payload).then((result) => {
|
||||||
console.log('done')
|
console.log('done')
|
||||||
console.log(result)
|
console.log(result)
|
||||||
|
|
||||||
|
@ -399,7 +399,9 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
...mapActions([
|
...mapActions([
|
||||||
'showToast'
|
'showToast',
|
||||||
|
'ytGetPlaylistInfo',
|
||||||
|
'invidiousGetPlaylistInfo'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -341,7 +341,7 @@ export default Vue.extend({
|
||||||
this.isLoading = true
|
this.isLoading = true
|
||||||
this.apiUsed = 'invidious'
|
this.apiUsed = 'invidious'
|
||||||
|
|
||||||
this.$store.dispatch('invidiousGetChannelInfo', this.id).then((response) => {
|
this.invidiousGetChannelInfo(this.id).then((response) => {
|
||||||
console.log(response)
|
console.log(response)
|
||||||
this.channelName = response.author
|
this.channelName = response.author
|
||||||
this.id = response.authorId
|
this.id = response.authorId
|
||||||
|
@ -388,7 +388,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousAPICall', payload).then((response) => {
|
this.invidiousAPICall(payload).then((response) => {
|
||||||
this.latestVideos = this.latestVideos.concat(response)
|
this.latestVideos = this.latestVideos.concat(response)
|
||||||
this.latestVideosPage++
|
this.latestVideosPage++
|
||||||
this.isElementListLoading = false
|
this.isElementListLoading = false
|
||||||
|
@ -471,7 +471,7 @@ export default Vue.extend({
|
||||||
payload.params.continuation = this.playlistContinuationString
|
payload.params.continuation = this.playlistContinuationString
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousAPICall', payload).then((response) => {
|
this.invidiousAPICall(payload).then((response) => {
|
||||||
this.playlistContinuationString = response.continuation
|
this.playlistContinuationString = response.continuation
|
||||||
this.latestPlaylists = this.latestPlaylists.concat(response.playlists)
|
this.latestPlaylists = this.latestPlaylists.concat(response.playlists)
|
||||||
this.isElementListLoading = false
|
this.isElementListLoading = false
|
||||||
|
@ -680,7 +680,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousAPICall', payload).then((response) => {
|
this.invidiousAPICall(payload).then((response) => {
|
||||||
this.searchResults = this.searchResults.concat(response)
|
this.searchResults = this.searchResults.concat(response)
|
||||||
this.isElementListLoading = false
|
this.isElementListLoading = false
|
||||||
this.searchPage++
|
this.searchPage++
|
||||||
|
@ -707,7 +707,9 @@ export default Vue.extend({
|
||||||
|
|
||||||
...mapActions([
|
...mapActions([
|
||||||
'showToast',
|
'showToast',
|
||||||
'updateProfile'
|
'updateProfile',
|
||||||
|
'invidiousGetChannelInfo',
|
||||||
|
'invidiousAPICall'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
|
import { mapActions } from 'vuex'
|
||||||
import dateFormat from 'dateformat'
|
import dateFormat from 'dateformat'
|
||||||
import FtLoader from '../../components/ft-loader/ft-loader.vue'
|
import FtLoader from '../../components/ft-loader/ft-loader.vue'
|
||||||
import FtCard from '../../components/ft-card/ft-card.vue'
|
import FtCard from '../../components/ft-card/ft-card.vue'
|
||||||
|
@ -62,7 +63,7 @@ export default Vue.extend({
|
||||||
getPlaylistLocal: function () {
|
getPlaylistLocal: function () {
|
||||||
this.isLoading = true
|
this.isLoading = true
|
||||||
|
|
||||||
this.$store.dispatch('ytGetPlaylistInfo', this.playlistId).then((result) => {
|
this.ytGetPlaylistInfo(this.playlistId).then((result) => {
|
||||||
console.log('done')
|
console.log('done')
|
||||||
console.log(result)
|
console.log(result)
|
||||||
|
|
||||||
|
@ -120,7 +121,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousGetPlaylistInfo', payload).then((result) => {
|
this.invidiousGetPlaylistInfo(payload).then((result) => {
|
||||||
console.log('done')
|
console.log('done')
|
||||||
console.log(result)
|
console.log(result)
|
||||||
|
|
||||||
|
@ -180,6 +181,11 @@ export default Vue.extend({
|
||||||
this.shownResults = history.data
|
this.shownResults = history.data
|
||||||
this.nextPageRef = history.nextPageRef
|
this.nextPageRef = history.nextPageRef
|
||||||
this.isLoading = false
|
this.isLoading = false
|
||||||
}
|
},
|
||||||
|
|
||||||
|
...mapActions([
|
||||||
|
'ytGetPlaylistInfo',
|
||||||
|
'invidiousGetPlaylistInfo'
|
||||||
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
|
import { mapActions } from 'vuex'
|
||||||
import FtLoader from '../../components/ft-loader/ft-loader.vue'
|
import FtLoader from '../../components/ft-loader/ft-loader.vue'
|
||||||
import FtCard from '../../components/ft-card/ft-card.vue'
|
import FtCard from '../../components/ft-card/ft-card.vue'
|
||||||
import FtElementList from '../../components/ft-element-list/ft-element-list.vue'
|
import FtElementList from '../../components/ft-element-list/ft-element-list.vue'
|
||||||
|
@ -38,9 +39,10 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
|
|
||||||
this.isLoading = true
|
this.isLoading = true
|
||||||
const result = await this.$store.dispatch('invidiousAPICall', searchPayload).catch((err) => {
|
const result = await this.invidiousAPICall(searchPayload)
|
||||||
console.log(err)
|
.catch((err) => {
|
||||||
})
|
console.log(err)
|
||||||
|
})
|
||||||
|
|
||||||
if (!result) {
|
if (!result) {
|
||||||
this.isLoading = false
|
this.isLoading = false
|
||||||
|
@ -54,6 +56,10 @@ export default Vue.extend({
|
||||||
})
|
})
|
||||||
this.isLoading = false
|
this.isLoading = false
|
||||||
this.$store.commit('setPopularCache', this.shownResults)
|
this.$store.commit('setPopularCache', this.shownResults)
|
||||||
}
|
},
|
||||||
|
|
||||||
|
...mapActions([
|
||||||
|
'invidiousAPICall'
|
||||||
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -118,7 +118,7 @@ export default Vue.extend({
|
||||||
payload.options.pages = 1
|
payload.options.pages = 1
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('ytSearch', payload).then((result) => {
|
this.ytSearch(payload).then((result) => {
|
||||||
console.log(result)
|
console.log(result)
|
||||||
if (!result) {
|
if (!result) {
|
||||||
return
|
return
|
||||||
|
@ -230,7 +230,7 @@ export default Vue.extend({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousAPICall', searchPayload).then((result) => {
|
this.invidiousAPICall(searchPayload).then((result) => {
|
||||||
if (!result) {
|
if (!result) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -333,7 +333,9 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
...mapActions([
|
...mapActions([
|
||||||
'showToast'
|
'showToast',
|
||||||
|
'ytSearch',
|
||||||
|
'invidiousAPICall'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -112,7 +112,7 @@ export default Vue.extend({
|
||||||
params: { region: this.region }
|
params: { region: this.region }
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store.dispatch('invidiousAPICall', trendingPayload).then((result) => {
|
this.invidiousAPICall(trendingPayload).then((result) => {
|
||||||
if (!result) {
|
if (!result) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -149,7 +149,8 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
...mapActions([
|
...mapActions([
|
||||||
'showToast'
|
'showToast',
|
||||||
|
'invidiousAPICall'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -211,8 +211,7 @@ export default Vue.extend({
|
||||||
this.isLoading = true
|
this.isLoading = true
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$store
|
this.ytGetVideoInformation(this.videoId)
|
||||||
.dispatch('ytGetVideoInformation', this.videoId)
|
|
||||||
.then(async result => {
|
.then(async result => {
|
||||||
console.log(result)
|
console.log(result)
|
||||||
|
|
||||||
|
@ -516,8 +515,7 @@ export default Vue.extend({
|
||||||
this.dashSrc = this.createInvidiousDashManifest()
|
this.dashSrc = this.createInvidiousDashManifest()
|
||||||
this.videoStoryboardSrc = `${this.invidiousInstance}/api/v1/storyboards/${this.videoId}?height=90`
|
this.videoStoryboardSrc = `${this.invidiousInstance}/api/v1/storyboards/${this.videoId}?height=90`
|
||||||
|
|
||||||
this.$store
|
this.invidiousGetVideoInformation(this.videoId)
|
||||||
.dispatch('invidiousGetVideoInformation', this.videoId)
|
|
||||||
.then(result => {
|
.then(result => {
|
||||||
console.log(result)
|
console.log(result)
|
||||||
|
|
||||||
|
@ -776,8 +774,7 @@ export default Vue.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
getLegacyFormats: function () {
|
getLegacyFormats: function () {
|
||||||
this.$store
|
this.ytGetVideoInformation(this.videoId)
|
||||||
.dispatch('ytGetVideoInformation', this.videoId)
|
|
||||||
.then(result => {
|
.then(result => {
|
||||||
this.videoSourceList = result.player_response.streamingData.formats
|
this.videoSourceList = result.player_response.streamingData.formats
|
||||||
})
|
})
|
||||||
|
@ -1194,7 +1191,9 @@ export default Vue.extend({
|
||||||
'buildVTTFileLocally',
|
'buildVTTFileLocally',
|
||||||
'updateHistory',
|
'updateHistory',
|
||||||
'updateWatchProgress',
|
'updateWatchProgress',
|
||||||
'getUserDataPath'
|
'getUserDataPath',
|
||||||
|
'ytGetVideoInformation',
|
||||||
|
'invidiousGetVideoInformation'
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue