From 3b66ecfbdd630bf35669a007695991014f97d6f4 Mon Sep 17 00:00:00 2001 From: Dejvino Date: Sun, 28 May 2023 06:29:59 +0200 Subject: [PATCH] Improved accordion list style --- src/PersonalData.ts | 27 ++++++++---- src/PersonalDataTypes.ts | 3 +- src/app/components/job/JobsAccordion.tsx | 52 +++++++----------------- 3 files changed, 36 insertions(+), 46 deletions(-) diff --git a/src/PersonalData.ts b/src/PersonalData.ts index dcc91cd..cffc1c2 100644 --- a/src/PersonalData.ts +++ b/src/PersonalData.ts @@ -14,17 +14,30 @@ export const personalData: PersonalData = { ], jobs: { current: { - position: 'Janitor', - company: 'Cleaners Limited', + position: 'Senior Software Development Manager', + company: 'Oracle|NetSuite', timerange: '2022 - present', - description: 'Cleanup duty 24/7.', + description: 'Lead role in the development of internal UI frameworks, components and tools.', + tags: ['TypeScript', 'Preact', 'NodeJs/NPM'] }, previous: [ { - position: 'CEO', - company: 'CryptoDancers', - timerange: '2019 - 2022', - description: 'Revolutionizing the crypto world.', + position: 'Software Development Manager', + company: 'Oracle|NetSuite', + timerange: '2017 - 2022', + description: '', + }, + { + position: 'Senior Software Engineer', + company: 'Oracle|NetSuite', + timerange: '2013 - 2017', + description: '', + }, + { + position: 'Software Engineer', + company: 'Q2 Interactive', + timerange: '2009 - 2013', + description: '', } ] }, diff --git a/src/PersonalDataTypes.ts b/src/PersonalDataTypes.ts index dabd4cf..67b3658 100644 --- a/src/PersonalDataTypes.ts +++ b/src/PersonalDataTypes.ts @@ -7,7 +7,8 @@ export type Job = { position: string, company: string, timerange: string, - description: string + description: string, + tags?: string[], } export type Jobs = { diff --git a/src/app/components/job/JobsAccordion.tsx b/src/app/components/job/JobsAccordion.tsx index 8b95060..b196cc0 100644 --- a/src/app/components/job/JobsAccordion.tsx +++ b/src/app/components/job/JobsAccordion.tsx @@ -1,13 +1,7 @@ import React from 'react'; -import Container from 'react-bootstrap/Container'; -import Col from 'react-bootstrap/Col'; -import Row from 'react-bootstrap/Row'; -import JobCard from './JobCard'; -import { partition } from '../../utils'; -import { Job, Jobs } from '@/PersonalDataTypes'; -import useSize from '../../hooks/Size'; -import { Accordion } from 'react-bootstrap'; +import { Job } from '@/PersonalDataTypes'; +import { Accordion, Row } from 'react-bootstrap'; import { JobListProps } from './types'; @@ -20,42 +14,24 @@ const defaultProps = { currentHeading: 'Currently', } -function FullList(props: JobListProps) { - const {jobs} = props - const config = {...defaultProps, ...props} - return ( - - {jobs.current && ( - - - - - - )} - {partition(jobs.previous, config.entriesPerRow).map((jobs, index) => ( - - {(jobs.map((job, subindex) => ( - - - - )))} - - ))} - - ) -} - export default function JobsAccordion(props: JobListProps) { const {jobs} = props const config = {...defaultProps, ...props} - function jobTitle(job: Job) { - return `${job.position} at ${job.company}, ${job.timerange}` + function JobTitle(props: {job: Job, heading?: string}) { + const {job, heading} = props + return ( +
+
{job.position}
+
{job.company}, {job.timerange}
+ {heading && (
({heading})
)} +
+ ) } return ( - + {jobs.current && ( - {config.currentHeading}:
{jobTitle(jobs.current)}
+ {jobs.current.position} @@ -63,7 +39,7 @@ export default function JobsAccordion(props: JobListProps) { )} {jobs.previous?.map((job, index) => ( - {jobTitle(job)} + {job.description}