결제 위젯이 생성되지 않습니다.

import { useQuery } from '@tanstack/react-query';
import { loadPaymentWidget } from '@tosspayments/payment-widget-sdk';
import { nanoid } from 'nanoid';

const clientKey = '클라이언트 키';
const customerKey = nanoid();

const usePaymentWidget = (clientKey: string, customerKey: string) => {
  useQuery({
    queryKey: ['paymentWidget', clientKey, customerKey],
    queryFn: () => {
      return loadPaymentWidget(clientKey, customerKey);
    },
  });
};

const TossPaymentWidget = () => {
  const data = usePaymentWidget(clientKey, customerKey);
  console.log(data);
  return <div>hi</div>;
};

export default TossPaymentWidget;