diff --git a/public/portfolio/cities/London.png b/public/portfolio/cities/Greater London.png
similarity index 100%
rename from public/portfolio/cities/London.png
rename to public/portfolio/cities/Greater London.png
diff --git a/src/portfolio/data/workExperienceData.ts b/src/portfolio/data/workExperienceData.ts
index 39747bf..0adaf6f 100644
--- a/src/portfolio/data/workExperienceData.ts
+++ b/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 " +
diff --git a/src/portfolio/sections/Experience.tsx b/src/portfolio/sections/Experience.tsx
index 9830436..04c5340 100644
--- a/src/portfolio/sections/Experience.tsx
+++ b/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 (
Work Experience
-
- 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.
-
+
{workExperienceIntro}
{cityGroups.map((group, index) => (
diff --git a/src/portfolio/sections/Experience/helpers.ts b/src/portfolio/sections/Experience/helpers.ts
index 66cd8eb..c1daee4 100644
--- a/src/portfolio/sections/Experience/helpers.ts
+++ b/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 = {
"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 = {
+ "London": "Greater London",
+ "Upminster": "Greater London"
+};
+
const createCityGroup = (
city: string,
jobs: WorkExperienceArgs[],
- offset: "left" | "right",
- description?: string
+ offset: "left" | "right"
): 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,
- description
+ offsetDirection: offset
};
};
-export const getCityGroups = (): ICityGroup[] => {
- const manchesterJobs = workExperienceData.filter(job => job.city === "Manchester");
- 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");
-
- return [
- createCityGroup(
- "Manchester",
- manchesterJobs,
- "right",
- "After finishing my master's degree, I moved to Manchester because I really liked the culture and the city."
- ),
- createCityGroup(
- "Edinburgh",
- edinburghJobs,
- "left",
- "I moved to Edinburgh to pursue my Master's in Artificial Intelligence at the University of Edinburgh."
- ),
- createCityGroup(
- "London",
- londonJobs,
- "right",
- "After Warsaw, I moved to London for my bachelor's education at Queen Mary University."
- ),
- createCityGroup(
- "Warsaw",
- warsawJobs,
- "left",
- "Where my journey began - my first job experience in the hospitality industry."
- )
- ];
+const normalizeCityName = (city: string): string => {
+ return CITY_ALIASES[city] || city;
+};
+
+const parseDate = (dateString: string): Date => {
+ return new Date(dateString);
+};
+
+const getEarliestJobDate = (jobs: WorkExperienceArgs[]): Date => {
+ return jobs.reduce((earliest, job) => {
+ const jobDate = parseDate(job.startDate);
+ return jobDate < earliest ? jobDate : earliest;
+ }, parseDate(jobs[0].startDate));
+};
+
+export const getCityGroups = (): ICityGroup[] => {
+ const cityJobsMap = new Map();
+
+ workExperienceData.forEach(job => {
+ const normalizedCity = normalizeCityName(job.city);
+ if (!cityJobsMap.has(normalizedCity)) {
+ cityJobsMap.set(normalizedCity, []);
+ }
+ cityJobsMap.get(normalizedCity)!.push(job);
+ });
+
+ const cityOrder = Array.from(cityJobsMap.entries())
+ .map(([city, jobs]) => ({ city, earliestDate: getEarliestJobDate(jobs) }))
+ .sort((a, b) => b.earliestDate.getTime() - a.earliestDate.getTime())
+ .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]
+ ));
};