Feature Flags

Implementing feature flags is a way to deploy a piece of code in production while restricting access to only a subset of users. ⁽¹⁾

Next few points are a discussion on how this was implemented in our project to selectively remove the "Search this area" button:

• To implement feature flags, we created a custom react hook useFeatureFlag which returns a boolean, based on if the environment variable REACT_APP_FEATURE_FLAGS is present in the .env.local file (the .env.local file was added to the local environment with the aforementioned environment variable).
• The /client/.env.local path was also added to the .gitignore file so that the file is not part of the repo, however, .env.local file can be added in another environment, to use the environment variables as required. (A copy of .env.local file, named dotenvdotlocal, used for PR 1827, can be found in the development folder of our google drive here).
• Finally, we passed the advancedFilter parameter in the custom hook function within the resultmap.js file as follows: const hasAdvancedFilterFeatureFlag = useFeatureFlag("advancedFilter"); reference link. The boolean value thus returned (depending on if the env variable is present in .env.local file) was then used with the "search this area" button (in this line) to turn on or off its visibility.

Similarly, this custom hook can be used while developing other features.

References/Resources

1. https://www.oreilly.com/library/view/managing-feature-flags/9781492028598/ch01.html
2. PR where this was implemented.
3. Link to development folder in Google drive.