aboutsummaryrefslogtreecommitdiff
path: root/src/hocs/with_list/with_list.js
diff options
context:
space:
mode:
authorShpuld Shpludson <shp@cock.li>2019-03-07 15:11:11 +0000
committerShpuld Shpludson <shp@cock.li>2019-03-07 15:11:11 +0000
commit7e9c8c3d219aa3b787c5606efbb54a73c1738b07 (patch)
tree1847fa78707d800e28997bd8828327cf5c890838 /src/hocs/with_list/with_list.js
parent4800169f36e0a71c322b9707a797c3b1ad48bf58 (diff)
parentc44f0a9bde08c50598207494b121ae4bdf1f0fb1 (diff)
Merge branch 'develop' into 'master'
Update master See merge request pleroma/pleroma-fe!646
Diffstat (limited to 'src/hocs/with_list/with_list.js')
-rw-r--r--src/hocs/with_list/with_list.js40
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