diff options
| author | Henry Jameson <me@hjkos.com> | 2019-07-05 10:02:14 +0300 |
|---|---|---|
| committer | Henry Jameson <me@hjkos.com> | 2019-07-05 10:02:14 +0300 |
| commit | 2c2b84d31dbe906b89dfb995394d887af110e04c (patch) | |
| tree | 18e70da867cbd2498326cc947916d8ef8b1c6669 /src/hocs/with_load_more | |
| parent | 6bea363b9db1c372e0e3add4458ff4c819b7c500 (diff) | |
npm eslint --fix .
Diffstat (limited to 'src/hocs/with_load_more')
| -rw-r--r-- | src/hocs/with_load_more/with_load_more.js | 56 |
1 files changed, 28 insertions, 28 deletions
diff --git a/src/hocs/with_load_more/with_load_more.js b/src/hocs/with_load_more/with_load_more.js index 74979b87..1e1b2a74 100644 --- a/src/hocs/with_load_more/with_load_more.js +++ b/src/hocs/with_load_more/with_load_more.js @@ -4,39 +4,16 @@ import { getComponentProps } from '../../services/component_utils/component_util import './with_load_more.scss' const withLoadMore = ({ - fetch, // function to fetch entries and return a promise - select, // function to select data from store - destroy, // function called at "destroyed" lifecycle - childPropName = 'entries', // name of the prop to be passed into the wrapped component - additionalPropNames = [] // additional prop name list of the wrapper component + fetch, // function to fetch entries and return a promise + select, // function to select data from store + destroy, // function called at "destroyed" lifecycle + childPropName = 'entries', // name of the prop to be passed into the wrapped component + additionalPropNames = [] // additional prop name list of the wrapper component }) => (WrappedComponent) => { const originalProps = Object.keys(getComponentProps(WrappedComponent)) const props = originalProps.filter(v => v !== childPropName).concat(additionalPropNames) return Vue.component('withLoadMore', { - render (createElement) { - const props = { - props: { - ...this.$props, - [childPropName]: this.entries - }, - on: this.$listeners, - scopedSlots: this.$scopedSlots - } - const children = Object.entries(this.$slots).map(([key, value]) => createElement('template', { slot: key }, value)) - return ( - <div class="with-load-more"> - <WrappedComponent {...props}> - {children} - </WrappedComponent> - <div class="with-load-more-footer"> - {this.error && <a onClick={this.fetchEntries} class="alert error">{this.$t('general.generic_error')}</a>} - {!this.error && this.loading && <i class="icon-spin3 animate-spin"/>} - {!this.error && !this.loading && !this.bottomedOut && <a onClick={this.fetchEntries}>{this.$t('general.more')}</a>} - </div> - </div> - ) - }, props, data () { return { @@ -87,6 +64,29 @@ const withLoadMore = ({ this.fetchEntries() } } + }, + render (createElement) { + const props = { + props: { + ...this.$props, + [childPropName]: this.entries + }, + on: this.$listeners, + scopedSlots: this.$scopedSlots + } + const children = Object.entries(this.$slots).map(([key, value]) => createElement('template', { slot: key }, value)) + return ( + <div class="with-load-more"> + <WrappedComponent {...props}> + {children} + </WrappedComponent> + <div class="with-load-more-footer"> + {this.error && <a onClick={this.fetchEntries} class="alert error">{this.$t('general.generic_error')}</a>} + {!this.error && this.loading && <i class="icon-spin3 animate-spin"/>} + {!this.error && !this.loading && !this.bottomedOut && <a onClick={this.fetchEntries}>{this.$t('general.more')}</a>} + </div> + </div> + ) } }) } |
