Skip to content

Draft: Add mock service worker to mock APIs

Adds MSW to intercept fetch requests and return mock data instead.

This change should allow us to significantly reduce the amount of times we need to discriminate between the production environment and staging/dev environments in our source code.

Below is the output of grep -r "REACT_ONLY" in the /src directory. I would say most of these checks could be removed with the introduction of MSW.

Constants/Constants.js:export const MODE_REACT_ONLY = 'MODE_REACT_ONLY';
Constants/Constants.js:  return MODE_REACT_ONLY;
Constants/Constants.js:export const FULL_WORKING_GROUP_LIST_FOR_REACT_ONLY = [
components/UIComponents/FormPreprocess/FormChooser.js:  MODE_REACT_ONLY,
components/UIComponents/FormPreprocess/FormChooser.js:      if (getCurrentMode() === MODE_REACT_ONLY) {
components/Application/CompanyInformation/CompanyInformation.js:  MODE_REACT_ONLY,
components/Application/CompanyInformation/CompanyInformation.js:      if (getCurrentMode() === MODE_REACT_ONLY) {
components/Application/SignIn/SignIn.js:  MODE_REACT_ONLY,
components/Application/SignIn/SignIn.js:        {getCurrentMode() === MODE_REACT_ONLY && (
components/Application/WorkingGroups/WorkingGroupsWrapper.js:  MODE_REACT_ONLY,
components/Application/WorkingGroups/WorkingGroupsWrapper.js:  FULL_WORKING_GROUP_LIST_FOR_REACT_ONLY,
components/Application/WorkingGroups/WorkingGroupsWrapper.js:  if (getCurrentMode() === MODE_REACT_ONLY) {
components/Application/WorkingGroups/WorkingGroupsWrapper.js:  if (getCurrentMode() === MODE_REACT_ONLY) {
components/Application/WorkingGroups/WorkingGroupsWrapper.js:    setFullWorkingGroupList(FULL_WORKING_GROUP_LIST_FOR_REACT_ONLY);
components/Application/Application.js:  MODE_REACT_ONLY,
components/Application/Application.js:    if (getCurrentMode() === MODE_REACT_ONLY) {
components/Portal/Portal.tsx:  MODE_REACT_ONLY,
components/Portal/Portal.tsx:    if (getCurrentMode() === MODE_REACT_ONLY) {
components/Portal/Portal.tsx:    getCurrentMode() === MODE_REACT_ONLY && setIsFetchingUser(false);
components/Portal/NavBar/AppTopBar.tsx:import { darkOrange, getCurrentMode, MODE_REACT_ONLY, themeBlack } from '../../../Constants/Constants';
components/Portal/NavBar/AppTopBar.tsx:    if (getCurrentMode() === MODE_REACT_ONLY) {
components/Portal/NavBar/AppTopBar.tsx:    if (getCurrentMode() !== MODE_REACT_ONLY && currentUserPortal?.name) {
components/Portal/YourProjects/YourProjects.tsx:  MODE_REACT_ONLY,
components/Portal/YourProjects/YourProjects.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/OrgProfile/OrgProfilesLinks.tsx:  MODE_REACT_ONLY,
components/Portal/OrgProfile/OrgProfilesLinks.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/OrgProfile/OrgProfilesBasicInfo.tsx:  MODE_REACT_ONLY,
components/Portal/OrgProfile/OrgProfilesBasicInfo.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/Dashboard/Dashboard.tsx:  MODE_REACT_ONLY,
components/Portal/Dashboard/Dashboard.tsx:      getCurrentMode() === MODE_REACT_ONLY
components/Portal/Dashboard/DashboardIntro.tsx:  MODE_REACT_ONLY,
components/Portal/Dashboard/DashboardIntro.tsx:      getCurrentMode() === MODE_REACT_ONLY
components/Portal/Dashboard/DashboardIntro.tsx:      getCurrentMode() === MODE_REACT_ONLY
components/Portal/Dashboard/DashboardProjectsAndWG/DashboardProjects.tsx:  MODE_REACT_ONLY,
components/Portal/Dashboard/DashboardProjectsAndWG/DashboardProjects.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/Dashboard/DashboardProjectsAndWG/DashboardWGs.tsx:  MODE_REACT_ONLY,
components/Portal/Dashboard/DashboardProjectsAndWG/DashboardWGs.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/Dashboard/DashboardCommittersAndContributors/DashboardCommittersAndContributorsChart.tsx:  MODE_REACT_ONLY,
components/Portal/Dashboard/DashboardCommittersAndContributors/DashboardCommittersAndContributorsChart.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/Dashboard/DashboardCommittersAndContributors/DashboardCommittersAndContributors.tsx:  MODE_REACT_ONLY,
components/Portal/Dashboard/DashboardCommittersAndContributors/DashboardCommittersAndContributors.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/ContactManagement/ContactManagement.tsx:  MODE_REACT_ONLY,
components/Portal/ContactManagement/ContactManagement.tsx:const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
components/Portal/ContactManagement/ContactManagement.tsx:    const isReactOnlyMode = getCurrentMode() === MODE_REACT_ONLY;
index.tsx:  if (getCurrentMode() === 'MODE_REACT_ONLY') {
index.tsx:// worker is ready (if in MODE_REACT_ONLY) to prevent race conditions with HTTP
Utils/formFunctionHelpers.js:  MODE_REACT_ONLY,
Utils/formFunctionHelpers.js:  if (getCurrentMode() === MODE_REACT_ONLY) {
Utils/formFunctionHelpers.js:  if (getCurrentMode() === MODE_REACT_ONLY && index) {
App.js:  MODE_REACT_ONLY,
App.js:    if (getCurrentMode() === MODE_REACT_ONLY) {

Merge request reports