'How integrate Smartsupp chat to a React Site (Gatsby)

I want to integrate the smartsupp chat in my Gatsby site (React), but the site only give you the following code... For a better performance would add some 5sec wait before loading.

<script type="text/javascript">
  var _smartsupp = _smartsupp || {};
  _smartsupp.key = "YOUR_SMARTSUPP_CODE";
  // ...
  // your configuration
  // ...
  window.smartsupp||(function(d) {
    var s,c,o=smartsupp=function(){ o._.push(arguments)};o._=[];
    s=d.getElementsByTagName('script')[0];c=d.createElement('script');
    c.type='text/javascript';c.charset='utf-8';c.async=true;
    c.src='https://www.smartsuppchat.com/loader.js?';s.parentNode.insertBefore(c,s);
  })(document);
</script>

I could hardcode a <script dangerouslySetInnerHTML={{__html: ... /> or put it inside the tag and make this thing done but I think there's a better way to having as a component



Solution 1:[1]

Copy .cache/default-html.js to src/html.js.
You can customise it code in ....

Inserting HTML into the <head>
Anything you render in the html.js component will not be made “live” in the client like other components. If you want to dynamically update your <head> we recommend using React Helmet
- Gatsby Docs

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Zach Jensz