React Open Graph Preview not working in Facebook debugger

I am using react, and using react-helmet for generating dynamic meta tags, its meta tags showing in developers elements sections and not showing in a page source

When I deploy my app to the server and try to share my image, the open graph preview is not showing.

And when tested in Facebook Debugger it is showing warning :

Warning: The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags.

I am trying to update meta tags when I get a response from api. I want

Code :

import { Helmet } from 'react-helmet';

<Helmet>
                <meta name="title" content={title}/>
                <meta name="description" content={description}/>

                {/*  Non-Essential, But Recommended */}
                <meta property="og:site_name" content="Temp Title!"/>

                {/*  Non-Essential, But Required for Analytics */}
                <meta property="fb:app_id" content="4537338XXXXX" />

                {/* Open Graph / Facebook */}
                <meta property="og:type" content="website" />
                <meta property="og:url" content={window.location.href} />
                <meta property="og:title" content={title}/>
                <meta property="og:description" content={description} />
                <meta property="og:image:type" content="image/jpeg" />
                <meta property="og:image:secure_url" content={'https://images.unsplash.com/photo-1613415959194-0cb09aa135f1?ixid=MXwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwyfHx8ZW58MHx8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60'} />
                <meta property="og:image" content={'https://images.unsplash.com/photo-1613415959194-0cb09aa135f1?ixid=MXwxMjA3fDB8MHxlZGl0b3JpYWwtZmVlZHwyfHx8ZW58MHx8fA%3D%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60'} />

</Helmet>