Merge pull request #1827 from hackforla/saumildhankar-1824-implementi…

…ng-feature-flags

added feature flag using useFeatureFlag hook

.gitignore

@@ -247,6 +247,8 @@ dotenv
 # required for GitHub action to build react app.
 !/client/.env
 
+/client/.env.local
+
 .eslintcache
 
 # End of project-specific exclusions

client/src/components/FoodSeeker/SearchResults/ResultsMap/ResultsMap.js

@@ -37,6 +37,7 @@ import {
 } from "../../../../appReducer";
 import "mapbox-gl/dist/mapbox-gl.css";
 import { useNavigate, useLocation } from "react-router-dom";
+import useFeatureFlag from "hooks/useFeatureFlag";
 
 const ResultsMap = (
   {
@@ -78,6 +79,8 @@ const ResultsMap = (
   const regionGeoJSON = neighborhood?.geojson;
   const startIconCoordinates = searchCoordinates || userCoordinates;
 
+  const hasAdvancedFilterFeatureFlag = useFeatureFlag("advancedFilter");
+
   useEffect(() => {
     analytics.postEvent("showMap");
   }, []);
@@ -202,15 +205,18 @@ const ResultsMap = (
           <Map.Layer {...regionBorderStyle} />
         </Map.Source>
       )}
-      <Button
-        variant="outlined"
-        onClick={searchMapArea}
-        size="small"
-        className={classes.searchButton}
-        disabled={loading}
-      >
-        Search this area
-      </Button>
+
+      {!hasAdvancedFilterFeatureFlag && (
+        <Button
+          variant="outlined"
+          onClick={searchMapArea}
+          size="small"
+          className={classes.searchButton}
+          disabled={loading}
+        >
+          Search this area
+        </Button>
+      )}
     </ReactMapGL>
   );
 };

client/src/hooks/useFeatureFlag.js

@@ -0,0 +1,5 @@
+export default function useFeatureFlag(flagName) {
+    const featureFlags = JSON.parse(process.env.REACT_APP_FEATURE_FLAGS || "[]");
+
+    return featureFlags.includes(flagName);
+}