Merge pull request #240 from WordPress/non-image-feature-flag

Add feature flag for non-image media types
WordPress · Sep 17, 2021 · 88383ea · 88383ea
2 parents bfe72da + 0c280dc
commit 88383ea
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 15 deletions.
diff --git a/nuxt.config.js b/nuxt.config.js
@@ -12,6 +12,8 @@ export const env = {
   filterStorageKey: 'openverse-filter-visibility',
   notificationStorageKey: 'openverse-show-notification',
   enableInternalAnalytics: process.env.ENABLE_INTERNAL_ANALYTICS || false,
+  /** Feature flag to enable non-image media */
+  allMediaFeature: process.env.ALL_MEDIA_FEATURE || true,
 }
 
 /**

diff --git a/src/components/HeroSection.vue b/src/components/HeroSection.vue
@@ -79,7 +79,7 @@ export default {
     onSubmit() {
       this.$store.commit(SET_QUERY, { query: { q: this.form.searchTerm } })
       const newPath = this.localePath({
-        path: '/search',
+        path: process.env.allMediaFeature ? '/search' : '/search/image',
         query: {
           q: this.form.searchTerm,
           ...filtersToQueryData(this.$store.state.filters, ALL_MEDIA),

diff --git a/src/components/SearchTypeTabs.vue b/src/components/SearchTypeTabs.vue
@@ -26,8 +26,12 @@ import { queryStringToSearchType } from '~/utils/search-query-transform'
 export default {
   name: 'SearchTypeTabs',
   data() {
+    let contentTypes = [IMAGE, AUDIO, VIDEO]
+    if (process.env.allMediaFeature) {
+      contentTypes.unshift(ALL_MEDIA)
+    }
     return {
-      contentTypes: [ALL_MEDIA, IMAGE, AUDIO, VIDEO],
+      contentTypes,
     }
   },
   computed: {

diff --git a/src/pages/search/audio.vue b/src/pages/search/audio.vue
@@ -1,7 +1,11 @@
 <template>
   <div id="tab-audio" role="tabpanel" aria-labelledby="audio">
-    <AudioResultsList :query="query" @onLoadMoreAudios="onLoadMoreAudios" />
-    <MetaSearchForm type="audio" :query="query" :supported="true" />
+    <AudioResultsList
+      v-if="supported"
+      :query="query"
+      @onLoadMoreAudios="onLoadMoreAudios"
+    />
+    <MetaSearchForm type="audio" :query="query" :supported="supported" />
   </div>
 </template>
 
@@ -11,6 +15,12 @@ import { AUDIO } from '~/constants/media'
 
 export default {
   name: 'AudioSearch',
+  data() {
+    return {
+      // Only show audio results if non-image results are supported
+      supported: process.env.allMediaFeature,
+    }
+  },
   computed: {
     query() {
       return this.$store.state.query
@@ -21,6 +31,7 @@ export default {
   },
   methods: {
     onLoadMoreAudios(searchParams) {
+      if (!this.supported) return
       this.$emit('onLoadMoreItems', searchParams)
     },
   },

diff --git a/src/store-modules/filter-store.js b/src/store-modules/filter-store.js
@@ -36,16 +36,18 @@ export const mediaFilterKeys = {
     'searchBy',
     'mature',
   ],
-  audio: [
-    'licenses',
-    'licenseTypes',
-    'audioCategories',
-    'audioExtensions',
-    'durations',
-    'audioProviders',
-    'searchBy',
-    'mature',
-  ],
+  audio: process.env.allMediaFeature
+    ? [
+        'licenses',
+        'licenseTypes',
+        'audioCategories',
+        'audioExtensions',
+        'durations',
+        'audioProviders',
+        'searchBy',
+        'mature',
+      ]
+    : [],
   video: [],
   all: ['licenses', 'licenseTypes', 'searchBy', 'mature'],
 }
@@ -58,7 +60,9 @@ export const mediaSpecificFilters = {
     'sizes',
     'imageProviders',
   ],
-  audio: ['audioCategories', 'audioExtensions', 'durations', 'audioProviders'],
+  audio: process.env.allMediaFeature
+    ? ['audioCategories', 'audioExtensions', 'durations', 'audioProviders']
+    : [],
   video: [],
 }