React Hook «React.useState» не может быть вызван внутри обратного вызова. React Hooks должен вызываться в функциональном компоненте React

Я пытаюсь создать состояние по умолчанию на основе пользовательского контекста, но мне не удалось использовать контекст вне обратного вызова <myContext.Consumer>{myContext => {}}</myContext.Consumer>. Я получаю указанную выше ошибку, когда пытаюсь использовать setState в обратном вызове.

Вот мой вариант использования:

import * as React from 'react'
import Box from '@mui/material/Box'
import PageTitle from '../01_shared/PageTitle'

import { appCtx } from '../01_shared/appContext'

const MyComponent = () => {

  const [options, setOptions] = React.useState({
    currency: userContext.currency, // <=I need user context information here
  })

  return <appCtx.Consumer>{translationContext => {
    // I cannot use React.useState here
    return (
      <Box>
        <PageTitle>Hello {userCtx.firstName} you have 3 {options.currency}</PageTitle>
      </Box>
    )
  }}</appCtx.Consumer>
};

export default MyComponent

Я знаю, что могу установить состояние сразу после доступа к userContext, но это больше похоже на обходной путь, чем на правильное решение.

Не могли бы вы указать мне правильное направление, пожалуйста?