Add feature flag for fake marking results as sensitive

frontend/feat/feature-flags.json

@@ -1,5 +1,13 @@
 {
   "features": {
+    "fake_sensitive": {
+      "status": {
+        "staging": "switchable",
+        "production": "disabled"
+      },
+      "description": "Mark 50% of results as mature to test content safety.",
+      "defaultState": "off"
+    },
     "external_sources": {
       "status": {
         "staging": "switchable",

frontend/src/stores/media/index.ts

@@ -19,6 +19,8 @@ import { initServices } from "~/stores/media/services"
 import { isSearchTypeSupported, useSearchStore } from "~/stores/search"
 import { useRelatedMediaStore } from "~/stores/media/related-media"
 import { deepFreeze } from "~/utils/deep-freeze"
+import { useFeatureFlagStore } from "~/stores/feature-flag"
+import { markFakeSensitive } from "~/utils/content-safety"
 
 export type MediaStoreResult = {
   count: number
@@ -426,6 +428,13 @@ export const useMediaStore = defineStore("media", {
           page = undefined
         }
         this._updateFetchState(mediaType, "end", errorMessage)
+
+        // Fake ~50% of results as mature. This leaves actual mature results unchanged.
+        const featureFlagStore = useFeatureFlagStore()
+        if (featureFlagStore.isOn("fake_sensitive")) {
+          Object.values(data.results).forEach(markFakeSensitive)
+        }
+
         this.setMedia({
           mediaType,
           media: data.results,

frontend/src/stores/media/single-result.ts

@@ -9,6 +9,8 @@ import { initServices } from "~/stores/media/services"
 import { useMediaStore } from "~/stores/media/index"
 import { useRelatedMediaStore } from "~/stores/media/related-media"
 import { useProviderStore } from "~/stores/provider"
+import { useFeatureFlagStore } from "~/stores/feature-flag"
+import { markFakeSensitive } from "~/utils/content-safety"
 
 export type MediaItemState =
   | {
@@ -115,7 +117,15 @@ export const useSingleResultStore = defineStore("single-result", {
         this._updateFetchState("start")
         const accessToken = this.$nuxt.$openverseApiToken
         const service = initServices[type](accessToken)
-        this.mediaItem = this._addProviderName(await service.getMediaDetail(id))
+        const item = this._addProviderName(await service.getMediaDetail(id))
+
+        // Fake ~50% of results as mature. This leaves actual mature results unchanged.
+        const featureFlagStore = useFeatureFlagStore()
+        if (featureFlagStore.isOn("fake_sensitive")) {
+          markFakeSensitive(item)
+        }
+
+        this.mediaItem = item
         this.mediaType = type
 
         this._updateFetchState("end")

frontend/src/types/media.ts

@@ -44,6 +44,8 @@ export interface Media {
 
   tags: Tag[]
   fields_matched?: string[]
+
+  mature: boolean
 }
 
 export interface ImageDetail extends Media {

frontend/src/utils/content-safety.ts

@@ -0,0 +1,23 @@
+/**
+ * Contains utilities related to content safety.
+ */
+
+import type { Media } from "~/types/media"
+import { hash, rand as prng } from "~/utils/prng"
+import { log } from "~/utils/console"
+
+/**
+ * Marks the given item as mature based on a random number seeded with the
+ * item's UUID v4 identifier. The `frac` param controls the probability of an
+ * item being marked as mature.
+ *
+ * @param item - the item to mark as mature
+ * @param frac - the fraction of items to mark as mature
+ */
+export const markFakeSensitive = (item: Media, frac = 0.5) => {
+  const random = prng(hash(item.id))()
+  if (random < frac) {
+    item.mature = true
+    log("Fake mature", item.frontendMediaType, item.id)
+  }
+}