example of useContext

useContext.js

import React, { useState } from 'react';

// Create a Context
const MyContext = React.createContext();
// It returns an object with 2 values: { Provider, Consumer }

function ParentComponent() {
  const [counter, setCounter] = useState(0);

  // Create an object containing both the value and the setter
  const contextValue = {counter, setCounter};

  return (
    <MyContext.Provider value={contextValue}>
      <SomeChildComponent />
    </MyContext.Provider>
  )
}

// ---------- some other page --------- //

import React, { useContext } from 'react';

function NestedChildComponent() {
  const { counter, setCounter } = useContext(MyContext);

  // do something with the counter value and setter
}