I have an authProtected boolean variable that I need in my app.js which has a class component. But I can not use context in a class based component.

My context file:

import React, { useState, createContext } from "react";

export const AuthContext = createContext();

export const AuthProvider = (props) => {
  const [authToken, setAuthToken] = useState("");
  const [authProtected, setAuthprotected] = useState(true);

  return (
    <AuthContext.Provider
      value={{
        token: [authToken, setAuthToken],
        authProtect: [authProtected, setAuthprotected],
      }}
    >
      {props.children}
    </AuthContext.Provider>
  );
};

I have to import authProtected into my app.js file. How do I do that?