TypeError: null is not an object (evaluating 'variableRegex.exec(foundTranslation)[0]') replaceDynamicString

Question

I was messing around with a UIkit react app. I changed some text on the front end website then got this error.

Is the issue that the text in question has no translation available so it is listed as null?

I'm simply an amateur and just poking around on a github app I found.

Thanks for any help.

---Error---

TypeError: null is not an object (evaluating 'variableRegex.exec(foundTranslation)[0]') replaceDynamicString

src/utils/translateTextHelpers.ts:7

   4 | const variableRegex = /%(.*?)%/
   5 | 
   6 | const replaceDynamicString = (foundTranslation: string, fallback: string) => {
>  7 |   const stringToReplace = variableRegex.exec(foundTranslation)[0]
   8 |   // const indexToReplace = foundTranslation.split(' ').indexOf(stringToReplace)
   9 |   const fallbackValueAtIndex = fallback.split(' ')[0]
  10 |   return foundTranslation.replace(stringToReplace, fallbackValueAtIndex)

src/views/Farms/Farms.tsx:107

  104 |     TranslateString(320, 'Stake LP tokens to earn XXXXX')
  105 |   }
  106 | </Heading>
> 107 | <Heading as="h2" color="secondary" mb="50px" style={{ textAlign: 'center' }}>
      | ^  108 |   {TranslateString(10000, 'Please understand the risks before participating.')}
  109 | </Heading>
  110 | <FarmTabButtons stakedOnly={stakedOnly} setStakedOnly={setStakedOnly}/>

(anonymous function) src/contexts/Localisation/languageContext.tsx:68

  65 |   if (translationApiResponse.data.length < 1) {
  66 |     setTranslations(['error'])
  67 |   } else {
> 68 |     setTranslations(translationApiResponse.data)
     | ^  69 |   }
  70 | })
  71 | .then(() => setTranslatedLanguage(selectedLanguage))

Answer 1

From MDN:

The RegExp.prototype.exec() method executes a search for a match in a specified string. Returns a result array, or null.

So, you need to check for the null. An example using optional chaining and nullish coalescing operators:

const stringToReplace = variableRegex.exec(foundTranslation)?.[0] ?? ''