feat(search drawer stepper): extract const variables to constatns

src/components/Map/Drawer/SearchDrawerWrapper/SearchDrawerWrapper.component.tsx

+import { STEP } from '@/components/Map/Drawer/SearchDrawerWrapper/SearchDrawerWrapper.constants';
+import { BIO_ENTITY, DRUGS_CHEMICALS_MIRNA } from '@/constants';
 import {
   currentStepDrawerStateSelector,
   valueTypeDrawerSelector,
 } from '@/redux/drawer/drawer.selectors';
 import { useSelector } from 'react-redux';
 
-const BIO_ENTITY = 'bioEntity';
-const DRUGS_CHEMICALS_MIRNA = ['drugs', 'chemicals', 'mirna'];
-
-const FIRST_STEP = 1;
-const SECOND_STEP = 2;
-const THIRD_STEP = 3;
-
 export const SearchDrawerWrapper = (): JSX.Element => {
   const currentStep = useSelector(currentStepDrawerStateSelector);
   const valueType = useSelector(valueTypeDrawerSelector);
@@ -18,26 +13,24 @@ export const SearchDrawerWrapper = (): JSX.Element => {
   const isBioEntityType = valueType === BIO_ENTITY;
   const isChemicalsDrugsOrMirnaType = DRUGS_CHEMICALS_MIRNA.includes(valueType);
 
-  const isFirstStep = currentStep === FIRST_STEP;
-  const isSecondStep = currentStep === SECOND_STEP;
-  const isThirdStep = currentStep === THIRD_STEP;
-
   return (
     <div>
       {/* first step for displaying search results, drawers etc */}
-      {isFirstStep && <div data-testid="search-first-step">The first step</div>}
+      {currentStep === STEP.FIRST && <div data-testid="search-first-step">The first step</div>}
       {/* 2nd step for bioEntities aka content */}
-      {isSecondStep && isBioEntityType && (
+      {currentStep === STEP.SECOND && isBioEntityType && (
         <div data-testid="search-second-step">The second step</div>
       )}
       {/* 2nd step for drugs,chemicals,mirna */}
-      {isSecondStep && isChemicalsDrugsOrMirnaType && (
+      {currentStep === STEP.SECOND && isChemicalsDrugsOrMirnaType && (
         <div data-testid="search-second-step">The second step</div>
       )}
       {/* last step for bioentity */}
-      {isThirdStep && isBioEntityType && <div data-testid="search-third-step">The third step</div>}
+      {currentStep === STEP.THIRD && isBioEntityType && (
+        <div data-testid="search-third-step">The third step</div>
+      )}
       {/* last step for drugs,chemicals,mirna */}
-      {isThirdStep && isChemicalsDrugsOrMirnaType && (
+      {currentStep === STEP.THIRD && isChemicalsDrugsOrMirnaType && (
         <div data-testid="search-third-step">The third step</div>
       )}
     </div>

src/components/Map/Drawer/SearchDrawerWrapper/SearchDrawerWrapper.constants.ts

+export const STEP = {
+  FIRST: 1,
+  SECOND: 2,
+  THIRD: 3,
+};

src/constants/index.ts

 export const BASE_API_URL = process.env.NEXT_PUBLIC_BASE_API_URL || '';
 export const PROJECT_ID = process.env.NEXT_PUBLIC_PROJECT_ID || '';
 export const ZOD_SEED = 997;
+export const BIO_ENTITY = 'bioEntity';
+export const DRUGS_CHEMICALS_MIRNA = ['drugs', 'chemicals', 'mirna'];