Invalid hook call. Is it possible to call hooks or async functions outside body of function component?

Is there a way to make this work without changing my function component to a class based component:

export default function SendVerificationCode({  route,  navigation}: NativeStackScreenProps<  NativeStackParameterList,'SendVerificationCode'>): JSX.Element {  async function getVerificationCode(    passwordApi: PasswordApi,    agencyKey: number,    username: string,    email: string,    verificationCode: string  ): Promise<void> {    const response = await passwordApi.getReset(      new GetResetRequest({        agencyKey: agencyKey,        email: email,        username: username,        verificationCode: verificationCode      })    );    verifyCodeContext.userName = username;    navigation.navigate('VerifyCode', {      copyrightYear: 2021,      version: '0.0.0.1'    });  }  const onSubmit = (data: any) => {    getVerificationCode(      new PasswordApi(),      1234,      data.username,      data.email,'123'    );  };  return (<UnauthenticatedTemplate copyrightYear={year} version={version}><Form        style={styles.form}        submitText="Send Code"        onSubmit={onSubmit}        schema={SendVerificationCodeSchema}><FCTextField name="username" placeholder="Username" /><FCTextField name="email" placeholder="Email" /></Form></UnauthenticatedTemplate>  );}

The onSubmit works perfectly fine until I call getVerificationCode

my axios function getReset looks like:

public getReset(    getResetRequest: GetResetRequest,    cancelToken?: CancelToken  ): Promise<StandardResponse<GetResetResponse>> {    return this.get(      this.configuration.portal,'/mvc/api/password/reset',      classToPlain(getResetRequest, BaseApi.classTransformOptions),      cancelToken,      new StandardResponse<GetResetResponse>(GetResetResponse)    );  }