How to add AMP User Events with NextJs

Question

<amp-script layout="container" script="hello-world">
    <div style={{ width: "90%" , display: "flex" , justifyContent: "end" , alignItems: "center" , marginBottom: 10,
      cursor: "pointer" , on="tap:hello-world.xyz" tabindex="0" role="button">
      Report this Job
    </div>
  </amp-script>

  <script id="hello-world" type="text/plain" target="amp-script">
    `function xyz() {
      console.log("Clicked!!")
    `}
  </script>

I want to call this xyz function defined inside script tag, which is supposed to do something for user like navigate to different page or fetch some new data etc...

Currently when I click on this div I get the error which says

[Action] Target ( SCRIPT ) doesn't support "xyz" action.

(https://i.stack.imgur.com/ZfhDK.png)