feat: Put price estimate range behind feature flag (#6439)

* feat: Put price estimate range behind feature flag

* fix test

src/app/Scenes/MyCollection/Screens/Artwork/Components/ArtworkAbout/MyCollectionArtworkAboutWork.tsx

@@ -1,6 +1,7 @@
 import { MyCollectionArtworkAboutWork_artwork$key } from "__generated__/MyCollectionArtworkAboutWork_artwork.graphql"
 import { MyCollectionArtworkAboutWork_marketPriceInsights$key } from "__generated__/MyCollectionArtworkAboutWork_marketPriceInsights.graphql"
 import { formatCentsToDollars } from "app/Scenes/MyCollection/utils/formatCentsToDollars"
+import { useFeatureFlag } from "app/store/GlobalStore"
 import { capitalize } from "lodash"
 import { Flex, Text } from "palette"
 import React from "react"
@@ -34,6 +35,8 @@ export const MyCollectionArtworkAboutWork: React.FC<MyCollectionArtworkAboutWork
     props.marketPriceInsights
   )
 
+  const enablePriceEstimateRange = useFeatureFlag("AREnablePriceEstimateRange")
+
   const { category, medium, dimensions, date, provenance } = artwork
 
   const dimensionsText = getDimensionsText(dimensions)
@@ -49,7 +52,7 @@ export const MyCollectionArtworkAboutWork: React.FC<MyCollectionArtworkAboutWork
         About the work
       </Text>
 
-      <Field label="Estimate Range" value={estimatePrice} />
+      {!!enablePriceEstimateRange && <Field label="Estimate Range" value={estimatePrice} />}
       <Field label="Medium" value={capitalize(category!)} />
       <Field label="Materials" value={capitalize(medium!)} />
       <Field label="Dimensions" value={dimensionsText} />

src/app/Scenes/MyCollection/Screens/Artwork/MyCollectionArtworkAbout.tests.tsx

@@ -1,4 +1,5 @@
 import { MyCollectionArtworkAboutTestsQuery } from "__generated__/MyCollectionArtworkAboutTestsQuery.graphql"
+import { __globalStoreTestUtils__ } from "app/store/GlobalStore"
 import { renderWithWrappersTL } from "app/tests/renderWithWrappers"
 import React from "react"
 import { graphql, QueryRenderer } from "react-relay"
@@ -48,6 +49,10 @@ describe("MyCollectionArtworkAbout", () => {
   }
 
   it("renders about the work section", () => {
+    __globalStoreTestUtils__?.injectFeatureFlags({
+      AREnablePriceEstimateRange: true,
+    })
+
     const { getByText } = renderWithWrappersTL(<TestRenderer />)
 
     resolveData({
@@ -83,6 +88,36 @@ describe("MyCollectionArtworkAbout", () => {
     expect(getByText("Signed, Sealed, Delivered!")).toBeTruthy()
   })
 
+  it("renders no estimate range when feature flag is disabled", async () => {
+    __globalStoreTestUtils__?.injectFeatureFlags({
+      AREnablePriceEstimateRange: false,
+    })
+
+    const { queryByText } = renderWithWrappersTL(<TestRenderer />)
+
+    resolveData({
+      Query: () => ({
+        artwork: {
+          category: "Oil on Canvas",
+          medium: "Painting",
+          date: "2007",
+          provenance: "Signed, Sealed, Delivered!",
+          dimensions: {
+            in: "39 2/5 × 40 9/10 in",
+            cm: "100 × 104 cm",
+          },
+        },
+        marketPriceInsights: {
+          lowRangeCents: 1780000,
+          highRangeCents: 4200000,
+        },
+      }),
+    })
+
+    expect(await queryByText("Estimate Range")).toBeFalsy()
+    expect(await queryByText("$17,800 - $42,000")).toBeFalsy()
+  })
+
   it("renders purchase details section", () => {
     const { getByText } = renderWithWrappersTL(<TestRenderer />)
 

src/app/store/config/features.ts

@@ -198,6 +198,11 @@ export const features = defineFeatures({
     description: "Show demand index hints",
     showInAdminMenu: true,
   },
+  AREnablePriceEstimateRange: {
+    readyForRelease: false,
+    description: "Enable My Collection Price Estimate Range",
+    showInAdminMenu: true,
+  },
 })
 
 export interface DevToggleDescriptor {