React component not rending in my chrome extension popup

Question

I am trying to create a chrome extension that gets the lists of videos on a webpage and returns the number of videos on that page while scrolling through the page. I have been able to get it to work but the problem is that new data when the component's state is updated does not show up on the extension popup. Only the initial component state data shows up on the extension popup. When the state changes, it renders those new changes at the bottom of the website page I am working on instead of rendering it on the popup. Which I don't want.

Here is my Index.js code

import React from 'react'
import ReactDOM from 'react-dom'
import './index.css'
import App from './App'

const rootEl = document.createElement('div');
rootEl.id = 'react-chrome-ext';
document.body.appendChild(rootEl);

ReactDOM.render(<App />, rootEl);

Manifest.json

{
  "manifest_version": 2,

  "name": "Video Downloader",
  "description": "Download Videos",
  "version": "1.0.0",
  "content_security_policy": "script-src 'self' 'sha256-mEgr58JwybOwXu0XeZjAVRPnU4TiP3wysHF+9Hc3eHU='; object-src 'self'",

  "browser_action": {
    "default_popup": "index.html",
    "default_title": "Video Downloader"
  },
  "background": {
    "scripts": ["background.js"]
  },
  "icons": {
    "16": "favicon.ico",
    "48": "logo192.png",
    "128": "logo512.png"
  },
  "permissions": ["tabs", "activeTab"],
  "content_scripts": [
    {
      "matches": ["https://*/*"],
      "js": [
        "static/js/2.chunk.js",
        "static/js/main.chunk.js",
        "static/js/runtime-main.js"
      ]
    }
  ]
}

App.js

import React, { useEffect, useState } from "react";

function App() {
  const [videos, setVideos] = useState([]);

  const handleScroll = () => {
    const result = document.getElementsByClassName("videos");
    setVideos([...result]);
  };
  useEffect(() => {
    window.addEventListener("scroll", handleScroll);
  }, []);

console.log(videos);

  return (
    <div>
      <h1>hello</h1>
      <h1>{videos.length}</h1>
    </div>
  );
}

export default App;