import { Splide, SplideSlide } from "@splidejs/react-splide";
import Project from "@/src/portfolio/helpers/Project";
import projectData from "@/src/portfolio/data/projectData";
import styles from "../styling/projects.module.scss";

const Projects = (): JSX.Element => {
	return (
		<div className={styles.section} id={"projects"}>
			<Splide
				options={{
					rewind: true,
					type: "slide",
					perPage: 1
				}}
			>
				{ projectData.map((entry, key) => {
					return (
						<SplideSlide key={key}>
							<Project {...entry}/>
						</SplideSlide> ); })
				}
			</Splide>
		</div>
	);
};

export default Projects;
