I’m running a MERN project and while everything else is working fine, the Console is giving an Invalid Hook error.

//C:UsersomDesktopReact-ProjectclientsrcApp.js
import React from "react";
import "./App.css";
import { Container, AppBar, Grow, Grid, Typography } from "@material-ui/core";
import memories from "./images/memories.jpeg";

function App() {
  return (
    <Container maxidth="lg">
      <AppBar position="static" color="inherit">
        <Typography variant="h2" align="center"></Typography>
        <img src={memories} alt="memories" height={60} />
      </AppBar>
    </Container>
  );
}

export default App;

I really don’t understand what the problem is. I tried to read the documentation as well, but the language is too technical for a beginner like me.

I tried to find files using useState, but I didn’t find any. From all accounts, there are no hooks in the entire program.

I also checked whether react and react-dom versions in package.json are the same. They are. There are no conflicts there.