flisk/akkoma-fe
1
0
Fork 0
forked from AkkomaGang/akkoma-fe
Code Issues Pull requests Packages Projects Releases Wiki Activity

Add a prop to force-refresh data to withSubscription hoc

Browse source
This commit is contained in:
taehoon 2019-02-13 21:21:56 -05:00
parent 8c8a6edc78
commit 09315b2780
2 changed files with 8 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -164,7 +164,7 @@
</div> </div>
<div :label="$t('settings.blocks_tab')"> <div :label="$t('settings.blocks_tab')">
<block-list id="123" /> <block-list :refresh="true" />
</div> </div>
</tab-switcher> </tab-switcher>
</div> </div>

13
src/hocs/with_subscription/with_subscription.js
View file

@ -1,24 +1,25 @@
import Vue from 'vue' import Vue from 'vue'
import filter from 'lodash/filter' import reject from 'lodash/reject'
import isEmpty from 'lodash/isEmpty' import isEmpty from 'lodash/isEmpty'
import omit from 'lodash/omit'
import './with_subscription.scss' import './with_subscription.scss'
const withSubscription = (Component, fetch, select, contentPropName = 'content') => { const withSubscription = (Component, fetch, select, contentPropName = 'content') => {
const originalProps = Component.props || [] const originalProps = Component.props || []
const props = filter(originalProps, v => v !== 'content') const props = reject(originalProps, v => v === 'content')
return Vue.component('withSubscription', { return Vue.component('withSubscription', {
render (createElement) { render (createElement) {
const props = { const props = {
props: { props: {
...this.$props, ...omit(this.$props, 'refresh'),
[contentPropName]: this.fetchedData [contentPropName]: this.fetchedData
}, },
on: this.$listeners on: this.$listeners
} }
return ( return (
<div class="with-subscription"> <div class="with-subscription">
<Component {...props} /> {!this.error && !this.loading && <Component {...props} />}
<div class="with-subscription-footer"> <div class="with-subscription-footer">
{this.error && <a onClick={this.fetchData} class="alert error">{this.$t('general.generic_error')}</a>} {this.error && <a onClick={this.fetchData} class="alert error">{this.$t('general.generic_error')}</a>}
{!this.error && this.loading && <i class="icon-spin3 animate-spin"/>} {!this.error && this.loading && <i class="icon-spin3 animate-spin"/>}
@ -26,7 +27,7 @@ const withSubscription = (Component, fetch, select, contentPropName = 'content')
</div> </div>
) )
}, },
props, props: [...props, 'refresh'],
data () { data () {
return { return {
loading: false, loading: false,
@ -39,7 +40,7 @@ const withSubscription = (Component, fetch, select, contentPropName = 'content')
} }
}, },
created () { created () {
if (isEmpty(this.fetchedData)) { if (this.refresh || isEmpty(this.fetchedData)) {
this.fetchData() this.fetchData()
} }
}, },