Using context state in class component, variable not defined error

Question

I'm a little unfamiliar with class components in react.

I am trying to figure out how to pass down a prop via context. This state contains an array of 2 objects, representing 2 different users.

When this state is updated I would like to render certain data from these two objects (text).

Here is my code:

In Context:

const PropDrilling = createContext();
export default PropDrilling;
export const PropDrillingProvider = ({ children }) => {
    const [fighters, setFighters] = useState([])

    let contextData = {
        fighters: fighters,
        setFighters: setFighters
    }

    return(
        <PropDrilling.Provider value={contextData} >
            { children }
        </PropDrilling.Provider>
    )
}

This is where I would like to render the component:

import PropDrilling from "contexts/PropDrilling"
class Landing extends React.Component {
  state = {};
  static contextType = PropDrilling
  componentDidMount() {
    const fighters = this.context
    console.log('test', fighters)
  }
  render() {
    return (
      <>
       ...
       <div className="icon icon-shape icon-shape-primary rounded-circle mb-4">
          <i className="ni ni-check-bold" />
       </div>
       <h6 className="text-primary text-uppercase">
          {fighters[0].name}
       </h6>

I am getting this error message:

src\views\pages\Landing.js
  Line 102:30:  'fighters' is not defined  no-undef