Invalid Hook Call Warning

Пытаюсь из одного скрипта передать параметры в другой

App.js

//... 
<Example id={ROUTES.HOME} fetchedState={fetchedState} fetchedUser={fetchedUser} go={go} snackbarError={snackbar}/>
//...

Home.js

class Example extends React.Component {



    constructor (props) {

        const fetchedState = props.fetchedState

        super(props);

        this.state = {
            activePanel: 'panel1',
            contextOpened: false,
            mode: 'all',
            activeTab4: 'all'
        };

        this.select = this.select.bind(this);
    }

    select(e) {
        const mode = e.currentTarget.dataset.mode;
        this.setState({ mode, contextOpened: false });
    }

//...
//... Тут ещё немного странного кода :)
//...

render()
    {

        Counter(this.props.fetchedState);
        function Counter(fetchedState) {
            // ✅ Good: top-level in a function component
            const DEFAULT_GROUP = '4ИСП-9';
            const [group, setGroup] = useState(fetchedState.hasOwnProperty('group') ? fetchedState.group : DEFAULT_GROUP); // ТУТ ОШИБКА
            // ...
        }


        return (<Panel id={this.id}>
//....

Мне надо из App.js передать в класс Home.js id, fetchedState, fetchedUser, go, snackbarError. И выполнить хук:

const [group, setGroup] = useState(fetchedState.hasOwnProperty('group') ? fetchedState.group : DEFAULT_GROUP);

Позже в return я буду использовать group и setGroup.

Но так как я сделал, происходит ошибка хука.... Возможно, глупый вопрос, но я в React пока не силен, и как в классе работать не совсем пока понял. Никак не могу разобраться в этой ошибке. Заранее спасибо.