usePublish infinite loop

OceanMVP.tsx

import React, { useMemo } from 'react';
import { useOcean, usePublish } from '@oceanprotocol/react';
import { Metadata } from "@oceanprotocol/lib"

type MVPProps = {
  dtName?: string;
  dtSymbol?: string;
}

const MVP: React.FC<MVPProps> = ({ dtName, dtSymbol }) => {
  // const { accountId } = useOcean();
  const { publish } = usePublish();
  const extraDtOptions = useMemo(() => ({ dtName, dtSymbol }), [dtName, dtSymbol]);

  const metadata: Metadata = {
    main: {
      name: 'High Frequency Coinbase Data',
      type: 'dataset',
      dateCreated: '10/09/2020',
      datePublished: '10/09/2020',
      author: "NAZ",
      license: "MIT",
      files: [
        {
          name: "l1 ob",
          url: "https://naz.life",
          index: 0,
          contentType: "html",
        }
      ]
    },
    additionalInformation: {
      description: 'L1 OB data gathered from 10/09/2015 to now. Frequency: every 1 minute',
    },
    // dataTokenOptions: {
    //   cap: "10000",
    //   ...extraDtOptions
    // }
  };
  const priceOptions = {
    price: 10,
    tokensToMint: 10,
    type: 'fixed',
    weightOnDataToken: '',
    liquidityProviderFee: '',
  };

  const handlePublish = async () => {
    await publish(metadata, priceOptions, 'metadata');
  };

  return (
    <ul>
      {/* <li>Your account: {accountId}</li> */}
      <li>
        <button onClick={handlePublish}>Publish</button>
      </li>
    </ul>
  );
};

export default MVP;