import { Forecast } from "@/types/types";
import DailyCard from "./DailyCard";

export default function CardContainer(props: {weather: Forecast}) {
    const weather = props.weather;
    return (
        <div className="p-2 flex overflow-scroll md:justify-center w-full">
        {weather.daily && weather.daily.apparent_temperature_max.map((temp, index) => (
          index > 0 && 
          index < 7 && // Ensure we only render the next 6 days
          <DailyCard
            key={index}
            temperature={temp}
            weatherCode={weather.daily.weather_code[index]}
            time={weather.daily.time[index]}
          />
        ))}
      </div>
    )
};