While adding a Twitter component, getting error and site not loading

Question

While adding a Twitter component, I am getting Uncaught ReferenceError: process is not defined in my react hooks web app, could someone please advise on the issue ? I have tried adding below window.process in App.js too after looking on the internet questions. Tried few other options like removing the``` node_modules & package-lock.json`, updated react scripts to 5.0.1 version.

useEffect(() => {
    window.process = {
      ...window.process,
    };
  }, []);

npm version: 8.5.0 installed and below is my packkage.json

 "devDependencies": {
    "react-error-overlay": "^6.0.9"
  },
  "overrides": {
    "react-error-overlay": "6.0.9"
  }

//twitterFeeds.js

 import React from 'react';
    import TweetEmbed from 'react-tweet-embed'
    
    const TwitterFeeds = () => {
        return (
          <div className="wrapper">
              <div className="row">
                    <div className="twitterfeeds">
                    <TweetEmbed id="some_id" placeholder={'loading'} />
                    </div>
              </div>
          </div>
        )
      }
      export default TwitterFeeds

//BottomLevel.js

import React from 'react';
import Twitter from "../home/twitterFeeds";



const BottomLevels = () => {
    return (
             <div className="wrapper>
               <div className="row">
                <div className="column5">
                    <h3><div className='hyphen'></div>Skills</h3>
                    
                </div>
                <div className="column6">
                    <div className="soccerdays">
                    <img src="images/adv.png"></img>
                </div>
                </div>
            </div>

              <div className="row">
                <Twitter/>
            </div>
          </div>
)};
export default BottomLevels

//App.js

import React, { useEffect, useState } from 'react';
function App() {
  useEffect(() => {
    window.process = {
      ...window.process,
    };
  }, []);
  return (
    <BrowserRouter>
    <Navigation />
        <Routes>
          <Route path="/"  element={<Home />}>
          </Route>
          <Route path="/aboutUs"  element={<AboutUs />}>
          </Route>
        </Routes>
    </BrowserRouter>
  );
}
export default App;