How to access a function from React Functional Component in a Normal Javascript File?

Greetings Javascript Developers. I'm stuck in a complex situation now where I need to access a function inside one of my functinal components outside in a normal js file.

Ok So here's what I'm doing: This is my Authorizer.js functional Component.

import React, { createContext, useState, useEffect, useContext } from "react";
import SplashScreen from "react-native-splash-screen";
import { useStore } from "../config/Store";
import { useDatabase } from "../config/Persistence";
import { getSessionCredentials } from "../config/Persistence";
import NavigationDrawer from "./NavigationDrawer";
import AuthStacks from "./AuthStacks";

const AuthContext = createContext();
export const useAuthorization = () => useContext(AuthContext);

export function Authorizer() {
  //TODO check whether user is already signed in or not.
  const realm = useDatabase();
  const { state, dispatch } = useStore();
  const [isAuthorized, setAuthorization] = useState(false);

  useEffect(() => {
  }, []);

  async function VerifyCredentials() {
    //TODO Check from Async Storage?
    var session = await getSessionCredentials();
    console.log("saved session", session);
    if (session) {
      await DispatchShopData();
      await setAuthorization(true);
    } else {
      await setAuthorization(false);
    sleep(1000).then(() => {

  async function DispatchShopData() {
    try {
      let shop = await realm.objects("Shop");
      await dispatch({ type: "UPDATE_SHOP_DETAILS", payload: shop[0] });
    } catch (error) {
      console.log("failed to retrieve shop object", error);

  function sleep(ms) {
    return new Promise((resolve) => setTimeout(resolve, ms));

  return (
    <AuthContext.Provider value={{ setAuthorization }}>
      {isAuthorized ? <NavigationDrawer /> : <AuthStacks />}

This component basically handles my Authentication Flow, whether to show the Navigation Drawer or the Login Screen. Now I have another simple javascript file ApiService.js which does not have any components, only simple js functions.

import Axios from "axios";
import { getAuthToken } from "../config/Persistence";
import { LogoutUser } from "../config/Persistence";
import { Alert } from "react-native";

const BASE_URL = "#########################";

/** Defined my Api Endpoints Here */

let service = Axios.create({
  baseURL: BASE_URL,
  timeout: 10000,

service.interceptors.response.use((response) => {
  console.log("[API] response intercepted data",;
  if (! && {
    //Auth token has Expired. Show user Alert for Session Expired & redirect to login screen.
      "Your Session has Expired!",
      "Don't worry though. You just need to login again & you're set.",
          text: "Continue",
          style: "default",
          onPress: () => {
              .then((success) => {
                if (success) {
                  //TODO Find a way to Access this function from Authorizer.js Component.
              .catch((error) => {
                console.log("failed to logout after session expiry", error);
  return response;

/** Defined my other api functions called inside my other components */

function TestSampleApi() {
  try {
    return new Promise(async function (resolve, reject) {
      const response = await service.get("");
      if ( != null) {
      } else {
  } catch (error) {
    console.log("request error", error.message);

export {
  /** Exporting other api functions as well */

In my ApiService.js file, I've setup a response interceptors whose job is to catch the default auth token expired response and SignOut user immediately and take him to the Login Screen. Here's now where my issue comes.

In normal scenarios, where I need to access functions from one component inside another component, I can manage is using CreateContext() and useContent() hooks. However, how do I access the useState function setAuthorization in my Authorizer.js components in my ApiService.js file as a normal js function.

I only need to call setAuthorization(false) from my response interceptor block to make the user return to the Login Screen. Problem is idk how to access that state setter function. So any help would be greatly appreciated.