Pass down slots into wrapped components

src/hocs/with_load_more/with_load_more.js

@@ -18,11 +18,15 @@ const withLoadMore = ({
           ...this.$props,
           [childPropName]: this.entries
         },
-        on: this.$listeners
+        on: this.$listeners,
+        scopedSlots: this.$scopedSlots
       }
+      const children = Object.keys(this.$slots).map(slot => createElement('template', { slot }, this.$slots[slot]))
       return (
         <div class="with-load-more">
-          <WrappedComponent {...props} />
+          <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"/>}

src/hocs/with_subscription/with_subscription.js

@@ -13,25 +13,39 @@ const withSubscription = ({
   const props = reject(originalProps, v => v === 'content')
 
   return Vue.component('withSubscription', {
+    props: [
+      ...props,
+      'refresh'               // boolean saying to force-fetch data whenever created
+    ],
     render (createElement) {
+      if (!this.error && !this.loading) {
         const props = {
           props: {
             ...omit(this.$props, 'refresh'),
             [childPropName]: this.fetchedData
           },
-        on: this.$listeners
+          on: this.$listeners,
+          scopedSlots: this.$scopedSlots
         }
+        const children = Object.keys(this.$slots).map(slot => createElement('template', { slot }, this.$slots[slot]))
         return (
           <div class="with-subscription">
-          {!this.error && !this.loading && <WrappedComponent {...props} />}
-          <div class="with-subscription-footer">
-            {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"/>}
-          </div>
+            <WrappedComponent {...props}>
+              {children}
+            </WrappedComponent>
           </div>
         )
+      } else {
+        return (
+          <div class="with-subscription-loading">
+            {this.error
+              ? <a onClick={this.fetchData} class="alert error">{this.$t('general.generic_error')}</a>
+              : <i class="icon-spin3 animate-spin"/>
+            }
+          </div>
+        )
+      }
     },
-    props: [...props, 'refresh'],
     data () {
       return {
         loading: false,