Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

197
Views
How to return props from a Function component in React Native?

I am quite new to react/ReactNative. I am trying to return props from an array based on a particular error type.

This is how I am accessing the props returned through an array:

  const errorModalProps = IDV_USER_ERROR_STATES[errorType](handleExit, closeModalAndLogout);

This is the actual array which returns the props:

const t = geti18nClient();
export const IDV_USER_ERROR_STATES: {
  [key: string]: (onPress?: () => Promise<void>, onSecondaryPress?: () => Promise<void>) => IErrorModalProps;
} = {
  [IDVValidationErrorTypes.AGE_REQUIREMENT_NOT_MET]: onPress => ({
      svg: 'AgeLimitError', // new svg inclusion
      title: t('ageLimitError.title'),
      description: t('ageLimitError.description'),
    controls: (
      <>
        <Button onPress={onPress}>{t('common:logout')}</Button>
      </>
    ),
  }),
  [IDVValidationErrorTypes.NON_CANADIAN_PASSPORT]: (onPress, onSecondaryPress) => ({
    svg: 'AgeLimitError', // new svg inclusion
    title: t('ageLimitError.title'),
    description: t('ageLimitError.description'),
    controls: (
        <>
          <Button mb={10} onPress={onPress}>
            {t('common:tryAgain')}
          </Button>
          <Button variant="secondary" onPress={onSecondaryPress}>
            {t('common:logout')}
          </Button>
        </>
    ),
  }),
};

I noticed that the geti18nClient is not getting initialized as it needs to be inside a function component. How can I refactor the array to act as a function component and return the props?

I tried doing something like this:

const returnIDVProps = (key: string): (onPress?: () => Promise<void>, onSecondaryPress?: () => Promise<void>) => IErrorModalProps => {
    const t = geti18nClient();
    switch (key) {
        case IDVValidationErrorTypes.AGE_REQUIREMENT_NOT_MET:
            return (onPress, onSecondaryPress) => ({
                svg: 'AgeLimitError', // new svg inclusion
                title: t('ageLimitError.title'),
                description: t('ageLimitError.description'),
                controls: (
                    <>
                        <Button mb={10} onPress={onPress}>
                            {t('common:tryAgain')}
                        </Button>
                        <Button variant="secondary" onPress={onSecondaryPress}>
                            {t('common:logout')}
                        </Button>
                    </>
                ),
            });

    }

};

But getting this error :

S2366: Function lacks ending return statement and return type does not include 'undefined'.
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!