import React from "react";
import { defineMessages, useIntl } from "react-intl";

import { Content } from "../common/Content";
import { Headline, SubHeadline } from "../common/Headline";
import { Spacer } from "../common/Spacer";
import { Paragraph } from "../common/Text";

const messages = defineMessages({
  skills: {
    defaultMessage: "Skills",
    id: "Experience.skills",
  },
  yourpass: {
    defaultMessage: "July 2021 - Present ({count} years)",
    id: "Experience.yourpass",
  },
  yoursystem: {
    defaultMessage: "February 2016 - December 2021 (5 years)",
    id: "Experience.yoursystem",
  },
  past: {
    defaultMessage: "Birth - February 2016",
    id: "Experience.past",
  },
  pastDescription: {
    defaultMessage:
      "Working on smaller projects such as chats, forum based websites, web based presentations, most notably a system for handling the driver training center and driving school agenda... Tinkering...",
    id: "Experience.pastDescription",
  },
});

const approxCurrentYears = Math.round(
  (Date.now() - new Date("2021-06-01").getTime()) / 1000 / 60 / 60 / 24 / 365
);

const yourpassSkills = [
  "DevOps",
  "Front-End Development",
  "Back-end Operations",
  "Software Development",
  "Kubernetes",
  "TypeScript",
  "Go",
  "Linux",
  "Linux Server",
  "Linux System Administration",
  "Back-End Web Development",
  "Git",
  "PostgreSQL",
  "Node.js",
  "React.js",
  "Amazon Web Services (AWS)",
  "Amazon EKS",
];

const yoursystemSkills = [
  "DevOps",
  "Front-End Development",
  "Back-end Operations",
  "Software Development",
  "Kubernetes",
  "TypeScript",
  "Linux",
  "Linux Server",
  "Linux System Administration",
  "Back-End Web Development",
  "Git",
  "Node.js",
  "Vue.js",
  "PHP",
  "Bash",
  "Amazon Web Services (AWS)",
  "Amazon EKS",
];

const Experience: React.FC = () => {
  const intl = useIntl();

  return (
    <>
      <Headline level={3}>YOUR PASS s.r.o.</Headline>
      <SubHeadline level={4}>DevOps Engineer</SubHeadline>
      <Content>
        <Paragraph>
          {intl.formatMessage(messages.yourpass, {
            count: approxCurrentYears,
          })}
        </Paragraph>
        <Paragraph>
          <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
          {yourpassSkills.join(" · ")}
        </Paragraph>
      </Content>

      <Spacer />

      <Headline level={3}>YOUR SYSTEM s.r.o.</Headline>
      <SubHeadline level={4}>Lead Developer/Architect</SubHeadline>

      <Content>
        <Paragraph>{intl.formatMessage(messages.yoursystem)}</Paragraph>
        <Paragraph>
          <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
          {yoursystemSkills.join(" · ")}
        </Paragraph>
      </Content>

      <Headline level={3}>Past experience</Headline>
      <SubHeadline level={4}>Developer</SubHeadline>

      <Content>
        <Paragraph>{intl.formatMessage(messages.past)}</Paragraph>
        <Paragraph>{intl.formatMessage(messages.pastDescription)}</Paragraph>
      </Content>
    </>
  );
};

export default Experience;