update/fallback image

src/app/(main)/(home)/components/card-event/index.tsx

@@ -13,6 +13,10 @@ function CardEvent({ event }: { event: EventItem }) {
         src={`${BASE_URL.imageEndpoint}${event.image}`}
         alt={event.name}
         className='w-[100px] md:w-[130px] aspect-3/2 object-cover'
+        onError={(e) => {
+          e.currentTarget.onerror = null
+          e.currentTarget.src = "/fallback.png"
+        }}
       />
       <div className='flex-1'>
         <p className='text-[#0056b3] font-bold text-sm line-clamp-2'>

src/app/(main)/(home)/components/card-news/index.tsx

@@ -12,8 +12,13 @@ function CardNews({ news }: { news: NewsAdminItem }) {
       <img
         src={`${BASE_URL.imageEndpoint}${news.thumbnail}`}
         alt={news.title}
-        className='w-[100px] md:w-[130px] aspect-3/2 object-cover'
+        className="w-[100px] md:w-[130px] aspect-3/2 object-cover"
+        onError={(e) => {
+          e.currentTarget.onerror = null
+          e.currentTarget.src = "/fallback.png"
+        }}
       />
+
       <div className='flex-1'>
         <p className='text-[#0056b3] font-bold text-sm line-clamp-2'>
           {news.title}

src/app/(main)/(home)/page.tsx

@@ -30,7 +30,9 @@ const Page = () => {
   const swiperRef = useRef<SwiperType | null>(null)
 
   const { data: categoryData, isLoading: isLoadingCategory } = useGetCategory<GetCategoryAdminResponseType>()
-  const { data: newsData, isLoading: isLoadingNews } = useGetNews<GetNewsAdminResponseType>()
+  const { data: newsData, isLoading: isLoadingNews } = useGetNews<GetNewsAdminResponseType>(
+    { pageSize: '999' },
+  )
   const { data: eventData, isLoading: isLoadingEvent } = useGetEvents<EventApiResponse>()
 
   // filter category
@@ -178,6 +180,10 @@ const Page = () => {
                       src={`${BASE_URL.imageEndpoint}${news.thumbnail}`}
                       alt={news.title}
                       className="w-full h-full object-cover"
+                      onError={(e) => {
+                        e.currentTarget.onerror = null
+                        e.currentTarget.src = "/fallback.png"
+                      }}
                     />
                   </div>
 
@@ -281,7 +287,10 @@ const Page = () => {
                       src={`${BASE_URL.imageEndpoint}${event.image}`}
                       alt={event.name}
                       className="w-full h-full object-cover"
-                    />
+                      onError={(e) => {
+                        e.currentTarget.onerror = null
+                        e.currentTarget.src = "/fallback.png"
+                      }} />
                   </div>
 
                   <div className="flex-1">