Chrome developer tools , React component not showing component structure

I'm new to React and i made a simple React app.

class App extends React.Component {
state = {
    counter: 0
}
render() {
    return (
      <div>
        <h1>Hello!</h1>
      </div>
    );
 }
}



ReactDOM.render(<App />, document.getElementById('root'))

Output in browser seems to be okay.(React Element has been rendered and it's visible on browser)- DOM elements has been created but in developer tools in Bookmark Components App is shown with red triangle and you cannot see a structure of component created, hovering on triangle showing message:"This component is not running in strict mode.."

Should be rather something like that(my tutor screenshot)

I added strict mode to component in Visual studio code ide (no result):

   <React.StrictMode>
      <div>
        <h1>Hello!</h1>
      </div>
  </React.StrictMode>