Can I replace context with hooks?

React provides a useContext hook to make use of Context, which has a signature like

const context = useContext(Context);

useContext accepts a context object (the value returned from React.createContext) and returns the current context value, as given by the nearest context provider for the given context.

When the provider updates, this Hook will trigger a rerender with the latest context value.

You can make use of it in your component like

import { ProfileContext } from 'src/shared/ProfileContext'

const Site = () => {
   const context = useContext(ProfileContext);
   // make use of context values here
}

However if you want to make use of the same context in every component and don't want to import the ProfileContext everywhere you could simply write a custom hook like

import { ProfileContext } from 'src/shared/ProfileContext'
const useProfileContext = () => {
   const context = useContext(ProfileContext);
   return context;
}

and use it in the components like

const Site = () => {
   const context = useProfileContext();
}

However as far a creating a hook which shares data among different component is concerned, Hooks have an instance of the data for them self and don'tshare it unless you make use of Context;

updated:

My previous answer was - You can use custom-hooks with useState for that purpose, but it was wrong because of this fact:

Do two components using the same Hook share state? No. Custom Hooks are a mechanism to reuse stateful logic (such as setting up a subscription and remembering the current value), but every time you use a custom Hook, all state and effects inside of it are fully isolated.

The right answer how to do it with useContext() provided @ShubhamKhatri