ScheduleCarousel.js 1.79 KB
Newer Older
Kim, Subin's avatar
Kim, Subin committed
1
2
3
4
import { useState, useEffect } from "react";
import { useParams } from "react-router-dom";
import KU from "./KUSchedule.js";
import scheduleApi from "../../apis/schedule.api";
Kim, Subin's avatar
Kim, Subin committed
5
import catchErrors from "../../utils/catchErrors";
Kim, Subin's avatar
Kim, Subin committed
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

const ScheduleCarousel = () => {
    const [scheduleList, setScheduleList] = useState([])
    const [error, setError] = useState("")
    const { date } = useParams()

    useEffect(() => {
        getSchedule(date)
    }, [date])

    async function getSchedule(date) {
        try {
            setError("")
            const resList = await scheduleApi.getbyDate(date)
            setScheduleList(resList)
        } catch (error) {
            catchErrors(error, setError)
        }
    }

    return (
        <div id="scheduleListCarousel" className="carousel slide" data-bs-ride="carousel">
            <div className="carousel-inner">
                {scheduleList.length !== 0 ?
                    scheduleList.map((schedule, idx) =>
31
32
                        <div className={"carousel-item" + (idx === 0 ? " active" : " ")}>
                            <KU schedule={schedule} />
Kim, Subin's avatar
Kim, Subin committed
33
34
                        </div>) : null}
            </div>
35
36
37
38
39
40
41
42
            <button className="carousel-control-prev" type="button" data-bs-target="#scheduleListCarousel" data-bs-slide="prev">
                <span className="carousel-control-prev-icon" aria-hidden="true"></span>
                <span className="visually-hidden">Previous</span>
            </button>
            <button className="carousel-control-next" type="button" data-bs-target="#scheduleListCarousel" data-bs-slide="next">
                <span className="carousel-control-next-icon" aria-hidden="true"></span>
                <span className="visually-hidden">Next</span>
            </button>
Kim, Subin's avatar
Kim, Subin committed
43
44
45
46
47
        </div>
    )
}

export default ScheduleCarousel