From a5c392ef2504176293d970be450837acc426b1b8 Mon Sep 17 00:00:00 2001
From: zeyadetman <zeyadetman@gmail.com>
Date: Thu, 16 Sep 2021 05:11:10 +0200
Subject: [PATCH] update career section

---
 components/CareerStack/index.tsx | 23 ++++++++---------
 components/Navbar/index.tsx      | 35 +++++++++++++++-----------
 pages/admin.tsx                  |  2 +-
 pages/index.tsx                  |  6 +++++
 utils/career.ts                  | 42 ++++++++++++++++++++++++++++++++
 utils/drive.ts                   |  1 +
 6 files changed, 81 insertions(+), 28 deletions(-)
 create mode 100644 utils/career.ts

diff --git a/components/CareerStack/index.tsx b/components/CareerStack/index.tsx
index f21f8fc..7318f60 100644
--- a/components/CareerStack/index.tsx
+++ b/components/CareerStack/index.tsx
@@ -1,22 +1,19 @@
-import { Stack, Text } from '@chakra-ui/layout';
+import { HStack, Stack, Text } from '@chakra-ui/layout';
 import React from 'react';
 
 interface Props {}
 
-function CareerStack(props: Props) {
-	const {} = props;
+function CareerStack(props: { career: { company: string; date: string } }) {
+	const { company, date } = props.career;
 
 	return (
-		<Stack>
-			{
-				// icon
-				// company name
-				// company website
-				// company working period
-				// company stack
-				// description
-			}
-			<Text>Bla</Text>
+		<Stack key={company}>
+			<HStack justify="space-between">
+				<Text>{company}</Text>
+				<Text color="gray.500" fontSize="sm">
+					{date}
+				</Text>
+			</HStack>
 		</Stack>
 	);
 }
diff --git a/components/Navbar/index.tsx b/components/Navbar/index.tsx
index e465957..902a140 100644
--- a/components/Navbar/index.tsx
+++ b/components/Navbar/index.tsx
@@ -20,6 +20,7 @@ import {
 import { HamburgerIcon, CloseIcon, AddIcon } from '@chakra-ui/icons';
 import { signOut } from 'next-auth/client';
 import ColorModeIcon from '../ColorModeIcon';
+import { useRouter } from 'next/router';
 
 const authLinks = [
 	{ name: 'Dashboard', url: '/dashboard' },
@@ -32,20 +33,26 @@ const visitorLinks = [
 	{ name: 'Gallery', url: '/gallery' },
 ];
 
-const NavLink = ({ children, url }: { children: ReactNode }) => (
-	<Link
-		px={2}
-		py={1}
-		rounded={'md'}
-		_hover={{
-			textDecoration: 'none',
-			bg: useColorModeValue('gray.200', 'gray.700'),
-		}}
-		href={url}
-	>
-		{children}
-	</Link>
-);
+const NavLink = ({ children, url }: { children: ReactNode; url: string }) => {
+	const router = useRouter();
+
+	return (
+		<Link
+			px={2}
+			py={1}
+			rounded={'md'}
+			_hover={{
+				textDecoration: 'none',
+				bg: useColorModeValue('gray.200', 'gray.700'),
+			}}
+			href={url}
+			onClick={() => router.push(url)}
+			as="button"
+		>
+			{children}
+		</Link>
+	);
+};
 
 export default function Navbar({ user }: any) {
 	const { isOpen, onOpen, onClose } = useDisclosure();
diff --git a/pages/admin.tsx b/pages/admin.tsx
index 5280678..7ed7dbc 100644
--- a/pages/admin.tsx
+++ b/pages/admin.tsx
@@ -20,7 +20,7 @@ export async function getServerSideProps(ctx: NextPageContext) {
 	};
 }
 
-function Admin(props: Props) {
+function Admin(props: { google: string }) {
 	const [session, loading] = useSession();
 	const { google } = props;
 	console.log({ google });
diff --git a/pages/index.tsx b/pages/index.tsx
index 30bf551..b47df1b 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -5,6 +5,8 @@ import { getSession, useSession } from 'next-auth/client';
 import Layout from '../components/Layout';
 import { AiFillSound } from 'react-icons/ai';
 import { Icon } from '@chakra-ui/react';
+import { careers } from '../utils/career';
+import CareerStack from '../components/CareerStack';
 
 export async function getServerSideProps(ctx: NextPageContext) {
 	const session = await getSession(ctx);
@@ -51,6 +53,10 @@ export default function Home({ user }: any) {
 			<Heading as="h2" size="xl">
 				Career
 			</Heading>
+
+			{careers.map((career) => (
+				<CareerStack career={career} />
+			))}
 		</Layout>
 	);
 }
diff --git a/utils/career.ts b/utils/career.ts
new file mode 100644
index 0000000..368ca11
--- /dev/null
+++ b/utils/career.ts
@@ -0,0 +1,42 @@
+const careers = [
+	{
+		title: 'Front-End Engineer',
+		company: 'Rubikal - Roadtrip Nation',
+		// logo: LOGOS.rubikal,
+		date: 'Jul 2019 – Present',
+		techStack: [],
+	},
+	{
+		title: 'Front-End Engineer',
+		company: 'Cognitev',
+		// logo: LOGOS.cognitev,
+		date: 'Jul 2019 – Present',
+		techStack: [],
+	},
+	{
+		title: 'Front-End Engineer',
+		company: 'Bosta',
+		url: 'https://www.bosta.co/',
+		// logo: LOGOS.bosta,
+		date: 'May 2019 – Apr 2020',
+		techStack: [],
+	},
+	{
+		title: 'Front-End Engineer',
+		company: 'Lynks',
+		url: 'https://lynks.com',
+		// logo: LOGOS.lynks,
+		date: 'Jan 2019 – May 2019',
+		techStack: [],
+	},
+	{
+		title: 'Front-End Engineer',
+		company: 'ArqamFC',
+		url: 'https://www.arqamfc.com/',
+		// logo: LOGOS.arqamfc,
+		date: 'Jun 2018 – Nov 2018',
+		techStack: ['nodejs', 'reactjs'],
+	},
+];
+
+export { careers };
diff --git a/utils/drive.ts b/utils/drive.ts
index ca4fed5..7dd58d9 100644
--- a/utils/drive.ts
+++ b/utils/drive.ts
@@ -26,3 +26,4 @@
 // 		}
 // 	}
 // );
+export default {};