Update fake_sensitive feature flag based on updated API response sc…

…hema (#2613)

frontend/src/constants/content-safety.ts

@@ -0,0 +1,16 @@
+/**
+ * Contains constants pertaining to the content safety feature. These include
+ * different types of sensitivities.
+ */
+
+export const USER_REPORTED = "user_reported_sensitive"
+export const PROVIDER_SUPPLIED = "provider_supplied_sensitive"
+export const TEXT_FILTERED = "sensitive_text"
+
+export const SENSITIVITIES = [
+  USER_REPORTED,
+  PROVIDER_SUPPLIED,
+  TEXT_FILTERED,
+] as const
+
+export type Sensitivity = (typeof SENSITIVITIES)[number]

frontend/src/stores/media/index.ts

@@ -19,8 +19,6 @@ 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
@@ -438,12 +436,6 @@ export const useMediaStore = defineStore("media", {
         }
         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,8 +9,6 @@ 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 =
   | {
@@ -119,12 +117,6 @@ export const useSingleResultStore = defineStore("single-result", {
         const service = initServices[type](accessToken)
         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
 

frontend/src/types/media.ts

@@ -1,5 +1,6 @@
 import type { SupportedMediaType } from "~/constants/media"
 import type { License, LicenseVersion } from "~/constants/license"
+import type { Sensitivity } from "~/constants/content-safety"
 
 export interface Tag {
   name: string
@@ -46,6 +47,8 @@ export interface Media {
   fields_matched?: string[]
 
   mature: boolean
+  sensitivity: Sensitivity[]
+  isSensitive: boolean
 }
 
 export interface ImageDetail extends Media {
@@ -90,7 +93,10 @@ export type DetailFromMediaType<T extends SupportedMediaType> =
  * being decoded in the `decodeMediaData` function.
  */
 export interface ApiMedia
-  extends Omit<Media, "frontendMediaType" | "title" | "originalTitle"> {
+  extends Omit<
+    Media,
+    "frontendMediaType" | "title" | "originalTitle" | "isSensitive"
+  > {
   title?: string
   originalTitle?: string
 }

frontend/src/utils/content-safety.ts

@@ -2,22 +2,43 @@
  * 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"
+import {
+  USER_REPORTED,
+  PROVIDER_SUPPLIED,
+  TEXT_FILTERED,
+  Sensitivity,
+} from "~/constants/content-safety"
 
 /**
- * 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.
+ * Get an array of randomly selected sensitive content flags for an item with
+ * the given UUID v4 identifier. The `frac` param controls the probability of an
+ * item having sensitivity flags.
  *
- * @param item - the item to mark as mature
- * @param frac - the fraction of items to mark as mature
+ * @param id - the ID of the item for which to calculate the flags
+ * @param frac - the fraction of items to probabilistically flag
+ * @returns an array of strings representing the mature flags
  */
-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)
+export const getFakeSensitivities = (id: string, frac = 0.5): Sensitivity[] => {
+  const random = prng(hash(id))()
+
+  if (random > frac) {
+    return []
+  }
+
+  const sensitivityMask = Math.floor((random * 7) / frac) + 1
+  const sensitivity: Sensitivity[] = []
+  if ((sensitivityMask & 4) !== 0) {
+    sensitivity.push(USER_REPORTED)
   }
+  if ((sensitivityMask & 2) !== 0) {
+    sensitivity.push(PROVIDER_SUPPLIED)
+  }
+  if ((sensitivityMask & 1) !== 0) {
+    sensitivity.push(TEXT_FILTERED)
+  }
+
+  log("Fake mature", id, sensitivity)
+  return sensitivity
 }

frontend/src/utils/decode-media-data.ts

@@ -4,6 +4,8 @@ import { decodeData as decodeString } from "~/utils/decode-data"
 import type { ApiMedia, Media, Tag } from "~/types/media"
 import type { MediaType } from "~/constants/media"
 import { AUDIO, IMAGE, MODEL_3D, VIDEO } from "~/constants/media"
+import { useFeatureFlagStore } from "~/stores/feature-flag"
+import { getFakeSensitivities } from "~/utils/content-safety"
 
 const mediaTypeExtensions: Record<MediaType, string[]> = {
   [IMAGE]: ["jpg", "jpeg", "png", "gif", "svg"],
@@ -83,8 +85,15 @@ const mediaTitle = (
 export const decodeMediaData = <T extends Media>(
   media: ApiMedia,
   mediaType: T["frontendMediaType"]
-): T =>
-  ({
+): T => {
+  // Fake ~50% of results as mature.
+  const featureFlagStore = useFeatureFlagStore()
+  const sensitivity = featureFlagStore.isOn("fake_sensitive")
+    ? getFakeSensitivities(media.id)
+    : []
+  const isSensitive = sensitivity.length > 0
+
+  return {
     ...media,
     ...mediaTitle(media, mediaType),
     frontendMediaType: mediaType,
@@ -94,4 +103,7 @@ export const decodeMediaData = <T extends Media>(
       ...tag,
       name: decodeString(tag.name),
     })),
-  } as T)
+    sensitivity,
+    isSensitive,
+  } as T
+}

frontend/test/unit/specs/utils/decode-image-data.spec.js

@@ -1,3 +1,5 @@
+import { createPinia, setActivePinia } from "~~/test/unit/test-utils/pinia"
+
 import { decodeMediaData } from "~/utils/decode-media-data"
 import { IMAGE } from "~/constants/media"
 
@@ -15,10 +17,17 @@ const requiredFields = {
   detail_url: "url",
   related_url: "url",
 
+  sensitivity: [],
+  isSensitive: false,
+
   tags: [],
 }
 
 describe("decodeImageData", () => {
+  beforeEach(() => {
+    setActivePinia(createPinia())
+  })
+
   it("decodes symbols correctly", () => {
     const data = {
       ...requiredFields,