react: Validate use of Context the use of a customized hook and the useContext React hook

What occurs if the consumer of an element that makes use of the Context api and the useContext hook to outline its compound parts, renders one of its parts outdoor of the context supplier? If this took place, an error can be thrown for the reason that part will be unable to get admission to the values of the context supplied by means of the guardian part.

There are two choices to unravel this drawback, one is to make use of default values and the opposite is to create a validation technique.
We will use a customized hook to encapsulate the essential common sense to retrieve and validate the context values and percentage it between the other compound parts.