diff options
| author | Shpuld Shpludson <shp@cock.li> | 2019-02-22 14:54:12 +0000 |
|---|---|---|
| committer | Shpuld Shpludson <shp@cock.li> | 2019-02-22 14:54:12 +0000 |
| commit | e34e1ccdae06302ee734414267a357ff5b7c888c (patch) | |
| tree | f1882a022a155a10ad10a3bb92d75f6a4a1f7f5a /src/hocs/with_list/with_list.js | |
| parent | 3768a4623fc227614b0b3920c2cb92ca16404a69 (diff) | |
| parent | 22851a3a967cc5364a95c71bda48eccc3808bf41 (diff) | |
Merge branch '227-manage-blocks-mutes' into 'develop'
Add Blocks / Mutes management tabs under user settings page
See merge request pleroma/pleroma-fe!578
Diffstat (limited to 'src/hocs/with_list/with_list.js')
| -rw-r--r-- | src/hocs/with_list/with_list.js | 40 |
1 files changed, 40 insertions, 0 deletions
diff --git a/src/hocs/with_list/with_list.js b/src/hocs/with_list/with_list.js new file mode 100644 index 00000000..896f8fc8 --- /dev/null +++ b/src/hocs/with_list/with_list.js @@ -0,0 +1,40 @@ +import Vue from 'vue' +import map from 'lodash/map' +import isEmpty from 'lodash/isEmpty' +import './with_list.scss' + +const defaultEntryPropsGetter = entry => ({ entry }) +const defaultKeyGetter = entry => entry.id + +const withList = ({ + getEntryProps = defaultEntryPropsGetter, // function to accept entry and index values and return props to be passed into the item component + getKey = defaultKeyGetter // funciton to accept entry and index values and return key prop value +}) => (ItemComponent) => ( + Vue.component('withList', { + props: [ + 'entries', // array of entry + 'entryProps', // additional props to be passed into each entry + 'entryListeners' // additional event listeners to be passed into each entry + ], + render (createElement) { + return ( + <div class="with-list"> + {map(this.entries, (entry, index) => { + const props = { + key: getKey(entry, index), + props: { + ...this.$props.entryProps, + ...getEntryProps(entry, index) + }, + on: this.$props.entryListeners + } + return <ItemComponent {...props} /> + })} + {isEmpty(this.entries) && this.$slots.empty && <div class="with-list-empty-content faint">{this.$slots.empty}</div>} + </div> + ) + } + }) +) + +export default withList |
