From e2e0940136a96fff6b813e9dce9365c31128a5c3 Mon Sep 17 00:00:00 2001
From: m-tartari <37861893+m-tartari@users.noreply.github.com>
Date: Sat, 17 Feb 2024 10:30:59 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(atoms):=20add=20`Extracurricol?=
 =?UTF-8?q?ar`=20entry?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../atoms/Extracurricular/Extracurricular.tsx | 27 +++++++++++++++++++
 .../atoms/Extracurricular/index.tsx           |  1 +
 2 files changed, 28 insertions(+)
 create mode 100644 src/components/atoms/Extracurricular/Extracurricular.tsx
 create mode 100644 src/components/atoms/Extracurricular/index.tsx

diff --git a/src/components/atoms/Extracurricular/Extracurricular.tsx b/src/components/atoms/Extracurricular/Extracurricular.tsx
new file mode 100644
index 0000000..8ac334f
--- /dev/null
+++ b/src/components/atoms/Extracurricular/Extracurricular.tsx
@@ -0,0 +1,27 @@
+import React from 'react'
+import { Box, SxProps, Theme, Typography, TypographyProps } from '@mui/material'
+
+type ExtracurricularProps = {
+  title: string
+  year?: string | number
+  titleProps?: TypographyProps
+  Component?: React.ElementType
+  sx?: SxProps<Theme>
+}
+
+const Extracurricular = ({ Component = Box, ...props }: ExtracurricularProps) => {
+  return (
+    <Component sx={{ pl: 2, ...props.sx }} display="flex" columnGap={1} alignItems="flex-start">
+      <Typography variant="body1" flexGrow={1} {...props.titleProps}>
+        {props.title}
+      </Typography>
+      {props.year && (
+        <Typography variant="subtitle1" color="primary.main">
+          {props.year}
+        </Typography>
+      )}
+    </Component>
+  )
+}
+
+export default Extracurricular
diff --git a/src/components/atoms/Extracurricular/index.tsx b/src/components/atoms/Extracurricular/index.tsx
new file mode 100644
index 0000000..edb63ba
--- /dev/null
+++ b/src/components/atoms/Extracurricular/index.tsx
@@ -0,0 +1 @@
+export { default } from './Extracurricular'