how to setup my ads using the reactJS correctly my ad are not showing on my website

my google ads are not showing on the website. I used a reactJS. I made a react component with this code.

import React, { Component } from 'react';
import PropTypes from 'prop-types';

class GoogleAd extends Component {
    googleInit = null;

    componentDidMount() {
        const { timeout } = this.props;
        this.googleInit = setTimeout(() => {
            if (typeof window !== 'undefined')
                (window.adsbygoogle = window.adsbygoogle || []).push({});
        }, timeout);
    }

    componentWillUnmount() {
        if (this.googleInit) clearTimeout(this.googleInit);
    }

    render() {
        const { classNames, slot, googleAdId, style, format } = this.props;
        return (
            <div className={classNames}>
                <ins
                    className="adsbygoogle"
                    style={style || { display: 'block', textAlign: "center" }}
                    data-ad-client={googleAdId}
                    data-ad-slot={slot}
                    data-ad-format={format || "auto"}
                    data-full-width-responsive="true"
                ></ins>
            </div>
        );
    }
}
GoogleAd.propTypes = {
    classNames: PropTypes.string,
    slot: PropTypes.string,
    timeout: PropTypes.number,
    googleAdId: PropTypes.string,
};
GoogleAd.defaultProps = {
    classNames: '',
    timeout: 200,
};
export default GoogleAd;

and then i imported the component by calling it in App.js

<GoogleAd slot="i put my slot number" googleAdId="i put my google id num" />

then i npm run build, and uploaded the build folder to my public_html folder in hostgator. But ads are not showing, What could i do wrong. Thanks in advance.