React Swiper 슬라이드 Type Error `Cannot convert undefined or null to object` 에러 해결방법

import React, { useRef, useState } from 'react';
// Import Swiper React components
import { Swiper, SwiperSlide } from 'swiper/react';
 
// Import Swiper styles
import 'swiper/css';
import 'swiper/css/free-mode';
import 'swiper/css/navigation';
import 'swiper/css/thumbs';
 
import './styles.css';
 
// import required modules
import { FreeMode, Navigation, Thumbs } from 'swiper/modules';
 
export default function App() {
  const [thumbsSwiper, setThumbsSwiper] = useState(null);
 
  return (
    <>
      <Swiper
        style={{
          '--swiper-navigation-color': '#fff',
          '--swiper-pagination-color': '#fff',
        }}
        loop={true}
        spaceBetween={10}
        navigation={true}
        thumbs={{ swiper: thumbsSwiper }}
        modules={[FreeMode, Navigation, Thumbs]}
        className="mySwiper2"
      >
        <SwiperSlide>
          <img src="https://swiperjs.com/demos/images/nature-1.jpg" />
        </SwiperSlide>
        {/* more .. */}
      </Swiper>
      <Swiper
        onSwiper={setThumbsSwiper}
        loop={true}
        spaceBetween={10}
        slidesPerView={4}
        freeMode={true}
        watchSlidesProgress={true}
        modules={[FreeMode, Navigation, Thumbs]}
        className="mySwiper"
      >
        <SwiperSlide>
          <img src="https://swiperjs.com/demos/images/nature-1.jpg" />
        </SwiperSlide>
        {/* more .. */}
      </Swiper>
    </>
  );
}

// ... 내용 같음
const [thumbsSwiper, setThumbsSwiper] = useState<SwiperClass | null>(null);
// ... 내용 같음

// ... 내용 같음
<Swiper
  style={{
    '--swiper-navigation-color': '#fff',
    '--swiper-pagination-color': '#fff',
  }}
  loop={true}
  spaceBetween={10}
  navigation={true}
  thumbs={{ swiper: thumbsSwiper }} // <-- thumbs의 타입이 null이라서 발생한 문제
  modules={[FreeMode, Navigation, Thumbs]}
  className="mySwiper2"
>
  {/* ... More */}
</Swiper>

<Swiper
  style={{
    '--swiper-navigation-color': '#fff',
    '--swiper-pagination-color': '#fff',
  }}
  loop={true}
  spaceBetween={10}
  navigation={true}
  thumbs={{
    // 이 부분을 변경
    swiper: thumbsSwiper && !thumbsSwiper.destroyed ? thumbsSwiper : null,
  }}
  modules={[FreeMode, Navigation, Thumbs]}
  className="mySwiper2"
>
  {/* ... More */}
</Swiper>