portfolio/src/components/Experience.tsx
2024-10-14 22:01:55 -05:00

87 lines
3.7 KiB
TypeScript

'use strict';
'use client';
import { useState } from 'react';
const experience = [
`
@@@@@@@@@@
@@@@@*:@@@@@
@#*@+**-@:@@
@#@@@ @@@**@**@:*@@ @@@*@
@@+@@@:@@@@@*%*@**@*.%@@@@@:@@@+@@
@@@@@@@@@@@@@@*@*:#*@@@@@***:@#@@@**:*@*@@@@@@@@@@@%@@ Company Name: Team Hydra
@@@%%@@***********@@********@@**+*******+@@**@@@ Position: Software Developer
@@@#%@********+*@********@*************@@@ Start Date: 2020-09-01
@@@@%********.*@*%**@*@+.*********@@@@ End: Present
@@@@#**@*%**+@@*@@@@+@@+****@**+@@@@ About:
@@@@**@@*****@@*@@=@@*****@@%*@@@@ I've worked with team hydra on a variety of projects,
@ @@+*@@@*****@#@@*****@@@#*@@ @ including developing web applications, mobile apps, discord bots,
@@@ @@%%@@@@@***@@***@@@@@%@@@ @@@ and APIs. It's a great team to work with, and I've learned a lot.
@@@%@@@@*****+**@@@@%@@@ I highly recommend them to anyone looking for software development
@@@%%%***#@**@****%%%@@@ services and a career in software development.
@@@@@@@@@@@@@@@@@@@@@@@@@@
@@ @@
`,
`
*###########*
################*
######## *####
###### *
*####*
##### #########
##### ######### ordon food services
#####* ######### Position: Network Engineer/IT Specialist
###### *#### Start Date: 2022-06-01
#######* =###### End: 2024-06-01
################# About: I worked with Gordon food services to help maintain their network infrastructure
############* and provide IT support to their employees. I was responsible for troubleshooting network
####### issues, setting up new network equipment, and providing support to employees with IT issues.
#### I was laid off, but I enjoyed my time there and learned a lot about network engineering and
* IT support.
`,
];
export default function Experience() {
const [index, setIndex] = useState(0);
const handleNext = () => {
if (index < experience.length - 1) {
setIndex(index + 1);
}
};
const handlePrev = () => {
if (index > 0) {
setIndex(index - 1);
}
};
return (
<div>
<h1 className='text-2xl font-bold font-mono'>Experience</h1>
<p className='text-gray-500'>
Use the buttons below to navigate through my experience.
</p>
<div className='flex justify-between'>
<button
onClick={handlePrev}
className='text-blue-500 hover:underline'
disabled={index === 0}
>
Previous
</button>
<button
onClick={handleNext}
className='text-blue-500 hover:underline'
disabled={index === experience.length - 1}
>
Next
</button>
</div>
<div className=''>
<pre className='whitespace-pre-wrap'>{experience[index]}</pre>
</div>
</div>
);
}