Show which slide show hours is fetched

web/src/harmonie/SlideShow.tsx

@@ -4,21 +4,23 @@ import styles from './harmonie.module.css'
 
 export const SlideShow: Component<{
     getCanvas: Accessor<HTMLCanvasElement | undefined>,
-    getImgList: Accessor<[string, ImageBitmap][]>,
+    getImgList: Accessor<[string, ImageBitmap | undefined][]>,
 }> = ({
     getCanvas,
     getImgList
 }) => {
-    function draw(img: ImageBitmap) {
+    function draw(img: ImageBitmap | undefined) {
         const canvas = getCanvas()!
         const ctx = canvas.getContext('2d')!
         ctx.clearRect(0, 0, canvas.width, canvas.height)
+        if (!img) return;
+
         ctx.drawImage(img, 0, 0)
     }
 
     return <ul class={styles.slideShow}>
         { getImgList().map(([forecastDate, img]) =>
-        <li onClick={() => draw(img)}>
+        <li class={img ? styles.withImg : ''} onClick={() => draw(img)}>
             { format(forecastDate) }
         </li>)}
     </ul>