chore: code cleanup

src/portfolio/data/workExperienceData.ts

@@ -116,6 +116,10 @@ const workExperienceData : WorkExperienceArgs[] = [
 	}
 ];
 
+export const workExperienceIntro =
+	"Growing up in Warsaw, I moved to London at 18. Since then, my career and education has taken me through " +
+	"Edinburgh and Manchester, shaping my journey across the UK.";
+
 export const workExperienceParagraph =
 	"Since the age of 16, I have actively engaged in various professional roles across multiple industries, " +
 	"including Artificial Intelligence, Software, Education, and Hospitality. My journey began in the hospitality " +

src/portfolio/sections/Experience.tsx

@@ -1,6 +1,7 @@
 import styles from "../styling/experience.module.scss";
 import { getCityGroups } from "./Experience/helpers";
 import CityGroup from "./Experience/CityGroup";
+import { workExperienceIntro } from "@/src/portfolio/data/workExperienceData";
 
 const Experience = (): JSX.Element => {
 	const cityGroups = getCityGroups();
@@ -8,10 +9,7 @@ const Experience = (): JSX.Element => {
 	return (
 		<div className={styles.section} id={"experience"}>
 			<h2>Work Experience</h2>
-			<p className={styles.intro}>
+			<p className={styles.intro}>{workExperienceIntro}</p>
-				Growing up in Warsaw, I moved to London at 18. Since then, my career and education has taken me through 
-				Edinburgh and Manchester, shaping my journey across the UK.
-			</p>
 			<div className={styles.cityGroupsContainer}>
 				{cityGroups.map((group, index) => (
 					<CityGroup key={index} group={group} />

src/portfolio/sections/Experience/helpers.ts

@@ -9,21 +9,24 @@ export interface ICityGroup {
 	hiddenCount: number;
 	imageUrl: string;
 	offsetDirection: "left" | "right";
-	description?: string;
 }
 
 const CITY_IMAGES: Record<string, string> = {
 	"Manchester": "/portfolio/cities/Manchester.png",
 	"Edinburgh": "/portfolio/cities/Edinburgh.png",
-	"London": "/portfolio/cities/London.png",
+	"Greater London": "/portfolio/cities/Greater London.png",
 	"Warsaw": "/portfolio/cities/Warsaw.png"
 };
 
+const CITY_ALIASES: Record<string, string> = {
+	"London": "Greater London",
+	"Upminster": "Greater London"
+};
+
 const createCityGroup = (
 	city: string,
 	jobs: WorkExperienceArgs[],
-	offset: "left" | "right",
+	offset: "left" | "right"
-	description?: string
 ): ICityGroup => {
 	const importantJobs = jobs.filter(job => job.isImportant);
 	const nonImportantJobs = jobs.filter(job => !job.isImportant);
@@ -39,41 +42,46 @@ const createCityGroup = (
 		hasMore: remainingNonImportant.length > 0,
 		hiddenCount: remainingNonImportant.length,
 		imageUrl: CITY_IMAGES[city] || "",
-		offsetDirection: offset,
+		offsetDirection: offset
-		description
 	};
 };
 
-export const getCityGroups = (): ICityGroup[] => {
+const normalizeCityName = (city: string): string => {
-	const manchesterJobs = workExperienceData.filter(job => job.city === "Manchester");
+	return CITY_ALIASES[city] || city;
-	const edinburghJobs = workExperienceData.filter(job => job.city === "Edinburgh");
+};
-	const londonJobs = workExperienceData.filter(job => job.city === "London" || job.city === "Upminster");
+
-	const warsawJobs = workExperienceData.filter(job => job.city === "Warsaw");
+const parseDate = (dateString: string): Date => {
-
+	return new Date(dateString);
-	return [
+};
-		createCityGroup(
+
-			"Manchester",
+const getEarliestJobDate = (jobs: WorkExperienceArgs[]): Date => {
-			manchesterJobs,
+	return jobs.reduce((earliest, job) => {
-			"right",
+		const jobDate = parseDate(job.startDate);
-			"After finishing my master's degree, I moved to Manchester because I really liked the culture and the city."
+		return jobDate < earliest ? jobDate : earliest;
-		),
+	}, parseDate(jobs[0].startDate));
-		createCityGroup(
+};
-			"Edinburgh",
+
-			edinburghJobs,
+export const getCityGroups = (): ICityGroup[] => {
-			"left",
+	const cityJobsMap = new Map<string, WorkExperienceArgs[]>();
-			"I moved to Edinburgh to pursue my Master's in Artificial Intelligence at the University of Edinburgh."
+
-		),
+	workExperienceData.forEach(job => {
-		createCityGroup(
+		const normalizedCity = normalizeCityName(job.city);
-			"London",
+		if (!cityJobsMap.has(normalizedCity)) {
-			londonJobs,
+			cityJobsMap.set(normalizedCity, []);
-			"right",
+		}
-			"After Warsaw, I moved to London for my bachelor's education at Queen Mary University."
+		cityJobsMap.get(normalizedCity)!.push(job);
-		),
+	});
-		createCityGroup(
+
-			"Warsaw",
+	const cityOrder = Array.from(cityJobsMap.entries())
-			warsawJobs,
+		.map(([city, jobs]) => ({ city, earliestDate: getEarliestJobDate(jobs) }))
-			"left",
+		.sort((a, b) => b.earliestDate.getTime() - a.earliestDate.getTime())
-			"Where my journey began - my first job experience in the hospitality industry."
+		.map(entry => entry.city);
-		)
+
-	];
+	const offsetPattern: ("left" | "right")[] = ["right", "left", "right", "left"];
+
+	return cityOrder.map((city, index) => createCityGroup(
+		city,
+		cityJobsMap.get(city)!,
+		offsetPattern[index % offsetPattern.length]
+	));
 };