import CompanyLink from "./CompanyLink";

type Experience = {
  title: string;
  company: string;
  date: string;
  country: string;
  body: React.ReactNode;
  website: string;
};
const ExperienceData: Experience[] = [
  {
    website: "https://www.enos.dk",
    title: "Frontend Engineer",
    company: "Enosoft",
    date: "Sep 2024 - Current",
    country: "Denmark",
    body: (
      <>
        Implementing <strong>Enos Restaurant Management System</strong> using
        React & React Native, improving user interaction speed by{" "}
        <strong>20%</strong>. Collaborated with backend developers to optimize
        API integration, ensuring seamless cross-platform functionality
      </>
    ),
  },
  {
    website: "https://dosoft.com.tr/",
    title: "Full Stack Engineer",
    company: "Dosoft",
    date: "Feb 2024 - Jun 2024",
    country: "Ankara, Turkey",
    body: (
      <>
        Redesigned user interfaces using{" "}
        <strong>Tailwind CSS, React, and Next.js</strong> across multiple web
        applications, improving usability by <strong>15%</strong> based on user
        feedback. Developed a real-time chat application using Socket.io and
        Express.js, enhancing client engagement and reducing response time by{" "}
        <strong>50%</strong>
      </>
    ),
  },
  {
    website: "https://www.digiole.com",
    title: "Machine Learning Trainee",
    company: "Digiole Oy",
    date: "Jun 2023 - Feb 2024",
    country: "Helsinki, Finland",
    body: (
      <>
        Developed and implemented an <strong>AI-powered SaaS</strong> to label
        and classify public procurements, reducing processing time by{" "}
        <strong>40%</strong> and achieving <strong>55%</strong>
        annual cost savings for the client organization
      </>
    ),
  },
  {
    website: "https://ankarabilim.edu.tr/en/index",
    title: "Student Teaching Assistant",
    company: "Ankara Science University",
    date: "Mar 2022 - Jun 2023",
    country: "Ankara, Turkey",
    body: (
      <>
        Designed and delivered a comprehensive curriculum that enhanced the
        understanding of Object-Oriented Programming (OOP) principles and Java
        application development for 8 students, all of whom achieved at least a
        B
      </>
    ),
  },
];
const Experience = () => {
  return (
    <div className="mt-8">
      {ExperienceData.map((item: Experience, index: number) => {
        return (
          <div
            key={index}
            className="max-w-[900px] h-auto py-4 px-6 bg-white shadow-[0_4px_4px_rgba(0,0,0,0.25)] rounded-[15px] flex flex-col mt-4"
          >
            <div className="flex justify-between ">
              <div>
                <div className="lg:text-[18px] font-bold text-header">
                  {item.title}
                </div>
                <div className="text-[16px flex items-center gap-1">
                  {item.company} <CompanyLink href={item.website} />
                </div>
              </div>
              <div>
                <div className="text-[14px] font-semibold flex items-center text-end">
                  {item.date}
                </div>
                <div className="flex justify-end text-[14px]">
                  {item.country}
                </div>
              </div>
            </div>
            <div className="my-4 text-[14px]">{item.body}</div>
          </div>
        );
      })}
    </div>
  );
};

export default Experience;


add a timeline for experiences using tailwind css