Embed isnt working correctly in react app

In my react app I want to use a html code for an embed

here is the button in my functional component

import React from 'react'
import './SideshiftStyle.css'

export default function Sideshift() {
  
  return (
    <div>
      Sideshift
    <hr/>
      <button onClick="window.sideshift.show()" id="sideshift-modal-button"> Shift Crypto</button>
                                                                             
                                                                              

    </div>
    
  )
}

this component is rendered in the app.js file in order for this button to work I had to include this in the head section of my site, so I included it in index.html

<script type="text/javascript">
  window.__SIDESHIFT__ = {
    parentAffiliateId: "secretkey",
    defaultDepositMethodId: "btc",
    defaultSettleMethodId: "eth",
    settleAddress: undefined,
    type: "variable",
    settleAmount: undefined,
  }
</script>
<script src="https://sideshift.ai/static/js/main.js"></script>

THis is the error when clicking the button

react-dom.development.js:4045 Uncaught Error: Expected `onClick` listener to be a function, instead got a value of `string` type.
    at getListener (react-dom.development.js:4045:1)
    at accumulateSinglePhaseListeners (react-dom.development.js:9308:1)
    at extractEvents$4 (react-dom.development.js:8968:1)
    at extractEvents$5 (react-dom.development.js:8995:1)
    at dispatchEventsForPlugins (react-dom.development.js:9087:1)
    at react-dom.development.js:9280:1
    at batchedUpdates$1 (react-dom.development.js:26133:1)
    at batchedUpdates (react-dom.development.js:3983:1)
    at dispatchEventForPluginEventSystem (react-dom.development.js:9279:1)
    at dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay (react-dom.development.js:6457:1)

so what is the correct way to use this embed in my react project? I set up my react project with npx create-react-app appname