Validar Uso de Context Utilizando un Hook Personalizado y useContext React Hook

¿Qué ocurre si el usuario de un componente que utiliza la api Context y el hook useContext para definir sus componentes compuestos, renderizara uno de sus componentes fuera del componente principal? SI esto ocurriera, un error sería emitido ya que el componente no podrá acceder a los valores del contexto proporcionado por el proveedor correspondiente.

Existen dos opciones para solucionar este problema, una es utilizar valores por defecto y la otra es crear una validación. En este ejemplo implementamos la segunda opción utilizando un hook personalizado para encapsular la lógica necesaria y compartirla entre los diferentes componentes compuestos.