Add lens support (#91)

resources/js/card.js

@@ -1,10 +1,20 @@
 import MegaFilterCard from './components/MegaFilterCard.vue'
-import resourceStore from '@/store/resources'
+import { registerMixin } from './components/MegaFilter'
 
-Nova.booting((Vue, store) => {
+Nova.booting(app => {
 
-    store.registerModule('mega-filter-store', resourceStore)
+    const componentFn = app.component
 
-    Vue.component('mega-filter-card', MegaFilterCard)
+    app.component = function (name, component) {
+
+        if (name === 'FilterMenu') {
+            registerMixin(component)
+        }
+
+        return componentFn.call(this, name, component)
+
+    }
+
+    app.component('mega-filter-card', MegaFilterCard)
 
 })

resources/js/components/MegaFilter.js

@@ -0,0 +1,40 @@
+import reduce from 'lodash/reduce'
+
+export function filtersAreApplied(store, resourceName, filterFunction) {
+
+    const filters = store.getters[ `${ resourceName }/filters` ].filter(filterFunction)
+
+    return reduce(filters, (result, filter) => {
+        const originalFilter = store.getters[ `${ resourceName }/getOriginalFilter` ](filter.class)
+        const originalFilterCloneValue = JSON.stringify(originalFilter.currentValue)
+        const currentFilterCloneValue = JSON.stringify(filter.currentValue)
+        return currentFilterCloneValue === originalFilterCloneValue ? result : result + 1
+    }, 0)
+
+}
+
+export function withoutMegaFilter(filter) {
+    return filter.megaFilter !== true
+}
+
+export function megaFilterOnly(filter) {
+    return filter.megaFilter === true
+}
+
+export function registerMixin(component) {
+
+    const filters = component.computed.filters
+
+    component.computed.filters = function () {
+        return filters.call(this).filter(withoutMegaFilter)
+    }
+
+    component.computed.activeFilterCount = function () {
+        return filtersAreApplied(this.$store, this.resourceName, withoutMegaFilter)
+    }
+
+    component.computed.filtersAreApplied = function () {
+        return this.activeFilterCount > 0
+    }
+
+}

resources/js/components/MegaFilter.vue

@@ -87,8 +87,8 @@
 
     import Filterable from '@/mixins/Filterable'
     import InteractsWithQueryString from '@/mixins/InteractsWithQueryString'
-    import { cleanUpInterceptors, interceptors } from './RequestHighjacker'
     import { Collapse } from 'vue-collapsed'
+    import { filtersAreApplied, megaFilterOnly } from './MegaFilter'
 
     export default {
         name: 'MegaFilter',
@@ -98,7 +98,6 @@
         props: [
             'filters',
             'columns',
-            'realResourceName',
             'resourceName',
             'viaResource',
             'viaResourceId',
@@ -127,42 +126,23 @@
         },
         computed: {
             filtersAreApplied() {
-                return this.$store.getters[ `${ this.resourceName }/filtersAreApplied` ]
+                return filtersAreApplied(this.$store, this.resourceName, megaFilterOnly)
             },
             initialEncodedFilters() {
                 return this.queryStringParams[ this.filterParameter ] || ''
             },
             pageParameter() {
                 return this.viaRelationship
                     ? this.viaRelationship + '_page'
-                    : this.realResourceName + '_page'
+                    : this.resourceName + '_page'
             },
         },
         async created() {
-
-            interceptors.push(config => {
-
-                if (config.params === undefined || config.params === null) {
-                    config.params = {}
-                }
-
-                if (config.method === 'get' && config.url === `/nova-api/${ this.realResourceName }`) {
-                    config.params.filters = this.encodedFilters
-                }
-
-                return config
-
-            })
-
             await this.initializeState()
-
         },
         beforeMount() {
             this.collapsed = this.filtersAreApplied
         },
-        unmounted() {
-            cleanUpInterceptors()
-        },
     }
 
 </script>

resources/js/components/MegaFilterCard.vue

@@ -2,10 +2,10 @@
 
     <MegaFilter
         class="nova-mega-filter"
+        :lens="lens"
         :filters="card.filters"
         :columns="card.columns"
-        :realResource-name="resourceName"
-        :resource-name="customResourceName"
+        :resource-name="resourceName"
         :via-resource="viaResource"
         :via-resource-id="viaResourceId"
         :via-relationship="viaRelationship"
@@ -22,19 +22,19 @@
         components: { MegaFilter },
         props: [
             'card',
+            'lens',
             'resourceName',
             'viaResource',
             'viaResourceId',
             'viaRelationship',
         ],
         created() {
-            this.$store.commit(`${ this.customResourceName }/clearFilters`)
-            this.$store.commit(`${ this.customResourceName }/storeFilters`, this.card.filters)
-        },
-        computed: {
-            customResourceName() {
-                return 'mega-filter-store'
-            },
+
+            const standardFilters = this.$store.getters[ `${ this.resourceName }/originalFilters` ]
+            const merged = standardFilters.concat(this.card.filters.map(filter => ({ ...filter, megaFilter: true })))
+
+            this.$store.commit(`${ this.resourceName }/storeFilters`, merged)
+
         },
     }