diff --git a/.changeset/angry-panthers-prove.md b/.changeset/angry-panthers-prove.md new file mode 100644 index 000000000..b09085bb1 --- /dev/null +++ b/.changeset/angry-panthers-prove.md @@ -0,0 +1,7 @@ +--- +"druxt-views": minor +--- + +feat(#639): added druxt/views/flushResults mutation +feat(#639): added bypassCache option to druxt/views/getResults action +feat(#639): added druxt.query.bypassCache option to DruxtView diff --git a/packages/views/src/components/DruxtView.vue b/packages/views/src/components/DruxtView.vue index bc066e186..9de3c8cd8 100644 --- a/packages/views/src/components/DruxtView.vue +++ b/packages/views/src/components/DruxtView.vue @@ -329,6 +329,14 @@ export default { }, }, + created() { + // If static, re-fetch data allowing for cache-bypass. + // @TODO - Don't re-fetch in serverless configuration. + if (this.$store.app.context.isStatic) { + this.$fetch() + } + }, + methods: { /** * Builds the query for the JSON:API request. @@ -446,12 +454,22 @@ export default { async fetchData(settings) { const viewId = this.viewId || (((this.view || {}).data || {}).attributes || {}).drupal_internal__id if (viewId) { + // Check if we need to bypass cache. + let bypassCache = false + if (typeof settings.query.bypassCache === 'boolean') { + bypassCache = settings.query.bypassCache + } + + // Build query. const query = this.getQuery(settings) + + // Execute the resquest. this.resource = await this.getResults({ displayId: this.displayId, prefix: this.lang, query: stringify(query), - viewId + viewId, + bypassCache }) } }, @@ -474,8 +492,15 @@ export default { /** * Component settings. */ - settings: ({ $druxt }, wrapperSettings) => { + settings: (context, wrapperSettings) => { + const { $druxt } = context const settings = merge($druxt.settings.views || {}, wrapperSettings, { arrayMerge: (dest, src) => src }) + + // Evaluate the bypass cache function. + if (typeof settings.query.bypassCache === 'function') { + settings.query.bypassCache = !!settings.query.bypassCache(context) + } + return { query: settings.query || {}, } diff --git a/packages/views/src/stores/views.js b/packages/views/src/stores/views.js index 08f645bf7..0cc1ed165 100644 --- a/packages/views/src/stores/views.js +++ b/packages/views/src/stores/views.js @@ -53,7 +53,22 @@ const DruxtViewsStore = ({ store }) => { if (!state.results[viewId][displayId]) Vue.set(state.results[viewId], displayId, {}) if (!state.results[viewId][displayId][prefix]) Vue.set(state.results[viewId][displayId], prefix, {}) Vue.set(state.results[viewId][displayId][prefix], hash, results) - } + }, + + /** + * @name flushResults + * @mutator {object} addResults=results Removes JSON:API Views results from the Vuex state object. + * + * @example @lang js + * this.$store.commit('druxt/views/flushResults', { viewId, displayId, prefix, hash }) + */ + flushResults (state, { viewId, displayId, prefix, hash }) { + if (!viewId) Vue.set(state, 'results', {}) + else if (viewId && !displayId) Vue.set(state.results, viewId, {}) + else if (viewId && displayId && !prefix) Vue.set(state.results[viewId], displayId, {}) + else if (viewId && displayId && prefix && !hash) Vue.set(state.results[viewId][displayId], prefix, {}) + else if (viewId && displayId && prefix && hash) Vue.set(state.results[viewId][displayId][prefix], hash, {}) + }, }, /** @@ -79,9 +94,9 @@ const DruxtViewsStore = ({ store }) => { * query * }) */ - async getResults ({ commit, state }, { viewId, displayId, query, prefix }) { + async getResults ({ commit, state }, { viewId, displayId, query, prefix, bypassCache = false }) { const hash = query ? md5(this.$druxt.buildQueryUrl('', query)) : '_default' - if (typeof (((state.results[viewId] || {})[displayId] || {})[prefix] || {})[hash] !== 'undefined') { + if (!bypassCache && typeof (((state.results[viewId] || {})[displayId] || {})[prefix] || {})[hash] !== 'undefined') { return state.results[viewId][displayId][prefix][hash] }