Swiper in modal (React)

Question

I'm trying to display the swiper in a modal window. . I did the same as in the documentation. https://swiperjs.com/react#thumbs

My code:

// imports...
SwiperCore.use([Keyboard]);

function ShowSwiper({ images, isOpen, startImage, close }: Props) {
  const [swiper, setSwiper] = useState<SwiperClass | null>(null);
  const [thumbsSwiper, setThumbsSwiper] = useState<SwiperClass | null>(null);

  const slides = images.map((image, idx) => {
    return (
      <SwiperSlide key={slide-${idx}} tag='li'>
        <Image src={image.url} layout='fill' objectFit='cover' alt='' />
      </SwiperSlide>
    );
  });

  const thumbs = images.map((image, idx) => {
    return (
      <SwiperSlide key={thumb-${idx}} tag='li'>
        <Image src={image.url} layout='fill' objectFit='cover' alt='' />
      </SwiperSlide>
    );
  });

  return (
    <Modal
      isOpen={isOpen}
      onClose={close}
      isCloseButton={false}
      customButtonContent={<button onClick={close}><span>×</span></button>}
      isFullScreen={true} 
    >
      <div className='modal-content'>
        // left button...

        <div className='slider'>
          <Swiper
             modules={[Virtual, Keyboard, Navigation, Thumbs]}
             thumbs={{ swiper: thumbsSwiper }}
             virtual
          >
            {slides}    
          </Swiper>
          <Swiper 
        modules={[Thumbs]}
        watchSlidesProgress={true} 
        onSwiper={setThumbsSwiper} >
            {thumbs}
          </Swiper>
        </div>
        // right button...
      </div>
    </Modal>
  );
}

Slider will not appear. Only the navigation buttons are shown. What did I do wrong?