feat: update ProjectsSection to use localized project data and enhance project interface
This commit is contained in:
parent
e57f0e7753
commit
b863dd9186
|
|
@ -1,6 +1,5 @@
|
||||||
import { GitBranch, ExternalLink } from 'lucide-react';
|
import { GitBranch, ExternalLink } from 'lucide-react';
|
||||||
import { useLanguage } from '../../contexts/LanguageContext';
|
import { useLanguage } from '../../contexts/LanguageContext';
|
||||||
import { projectsData } from '../../config/projects-config';
|
|
||||||
import type { Project } from '../../data/Project';
|
import type { Project } from '../../data/Project';
|
||||||
import { useScreenReaderAnnouncements } from '../../hooks/useScreenReaderAnnouncements';
|
import { useScreenReaderAnnouncements } from '../../hooks/useScreenReaderAnnouncements';
|
||||||
import { useProjectKeyboardNavigation } from '../../hooks/useProjectKeyboardNavigation';
|
import { useProjectKeyboardNavigation } from '../../hooks/useProjectKeyboardNavigation';
|
||||||
|
|
@ -16,12 +15,22 @@ export default function ProjectsSection(props: ProjectsSectionProps = {}) {
|
||||||
const { texts: allTexts } = useLanguage();
|
const { texts: allTexts } = useLanguage();
|
||||||
const texts = allTexts.projects;
|
const texts = allTexts.projects;
|
||||||
const accessibilityTexts = allTexts.accessibility;
|
const accessibilityTexts = allTexts.accessibility;
|
||||||
|
const localizedProjectsData: Project[] = texts.projectItems.map((item) => ({
|
||||||
|
id: item.id,
|
||||||
|
title: item.title,
|
||||||
|
description: item.description,
|
||||||
|
image: item.image || '',
|
||||||
|
technologies: item.technologies || [],
|
||||||
|
year: item.year,
|
||||||
|
github: item.github,
|
||||||
|
live: item.live,
|
||||||
|
}));
|
||||||
|
|
||||||
// Use centralized texts as defaults, allow props to override
|
// Use centralized texts as defaults, allow props to override
|
||||||
const {
|
const {
|
||||||
title = texts.title,
|
title = texts.title,
|
||||||
subtitle = texts.subtitle,
|
subtitle = texts.subtitle,
|
||||||
projects = [...projectsData].sort((a, b) => {
|
projects = [...localizedProjectsData].sort((a, b) => {
|
||||||
const yearA = Number.parseInt(a.year || '0');
|
const yearA = Number.parseInt(a.year || '0');
|
||||||
const yearB = Number.parseInt(b.year || '0');
|
const yearB = Number.parseInt(b.year || '0');
|
||||||
return yearB - yearA; // Descending order (newest first)
|
return yearB - yearA; // Descending order (newest first)
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,4 @@
|
||||||
import portfolioImage from '@/assets/portfolio.PNG';
|
import portfolioImage from '@/assets/portfolio.PNG';
|
||||||
import ergoVRImage from '@/assets/ErgoVR.PNG';
|
|
||||||
import icaraceImage from '@/assets/icarace.PNG';
|
|
||||||
import dancaAlegriaImage from '@/assets/Danca-Alegria.png';
|
import dancaAlegriaImage from '@/assets/Danca-Alegria.png';
|
||||||
import lukasImage from '@/assets/lukas.png';
|
import lukasImage from '@/assets/lukas.png';
|
||||||
import a11yhubImage from '@/assets/a11yhub.png';
|
import a11yhubImage from '@/assets/a11yhub.png';
|
||||||
|
|
@ -24,26 +22,6 @@ export const projects = {
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 2,
|
id: 2,
|
||||||
title: 'ErgoVR',
|
|
||||||
description:
|
|
||||||
'Eine Virtual-Reality-Anwendung zur Analyse von Motion Sickness in VR-Umgebungen aus dem Jahr 2015.',
|
|
||||||
image: ergoVRImage,
|
|
||||||
technologies: ['Unity3D', 'C#', 'Oculus SDK'],
|
|
||||||
year: '2015',
|
|
||||||
github: 'https://github.com/LuciusShadow/ErgoVR',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
title: 'Icarace',
|
|
||||||
description:
|
|
||||||
'Beteiligung an der Entwicklung einer Web-Plattform für ein Fitness-Rennspiel für die Icaros GmbH bis 2018.',
|
|
||||||
image: icaraceImage,
|
|
||||||
technologies: ['Angular 4', 'Typescript', 'HTML', 'CSS'],
|
|
||||||
year: '2018',
|
|
||||||
github: '',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
title: 'Danca Alegria Vereins-Website',
|
title: 'Danca Alegria Vereins-Website',
|
||||||
description:
|
description:
|
||||||
'Unterstützung bei freiwilligen Änderungen zur Einhaltung der WCAG 2.1 Level AA Barrierefreiheit.',
|
'Unterstützung bei freiwilligen Änderungen zur Einhaltung der WCAG 2.1 Level AA Barrierefreiheit.',
|
||||||
|
|
@ -53,7 +31,7 @@ export const projects = {
|
||||||
live: 'https://www.danca-alegria.de',
|
live: 'https://www.danca-alegria.de',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 5,
|
id: 3,
|
||||||
title: 'Squarespace-Page für Massage-Service',
|
title: 'Squarespace-Page für Massage-Service',
|
||||||
description:
|
description:
|
||||||
'Design, Erstellung und Styling einer Landingpage, Angeboten und Scheduling via Squarespace',
|
'Design, Erstellung und Styling einer Landingpage, Angeboten und Scheduling via Squarespace',
|
||||||
|
|
@ -63,7 +41,7 @@ export const projects = {
|
||||||
live: 'https://www.lukasmobilemassage.de',
|
live: 'https://www.lukasmobilemassage.de',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 6,
|
id: 4,
|
||||||
title: 'Plattform für Bildungsangebote zu digitaler Barrierefreiheit',
|
title: 'Plattform für Bildungsangebote zu digitaler Barrierefreiheit',
|
||||||
description:
|
description:
|
||||||
'Viele Events, Webinar und Co. haben keinen zentralen Ort, wo sie aufgerufen werden. Dieses Projekt in Zusammenarbeit mit Benjamin Christi soll helfen dieses Problem zu lösen.',
|
'Viele Events, Webinar und Co. haben keinen zentralen Ort, wo sie aufgerufen werden. Dieses Projekt in Zusammenarbeit mit Benjamin Christi soll helfen dieses Problem zu lösen.',
|
||||||
|
|
|
||||||
|
|
@ -148,6 +148,11 @@ export interface TextConfig {
|
||||||
id: number;
|
id: number;
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string;
|
||||||
|
image?: string;
|
||||||
|
technologies?: string[];
|
||||||
|
github?: string;
|
||||||
|
live?: string;
|
||||||
|
year?: string;
|
||||||
}>;
|
}>;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,6 +2,8 @@ import portfolioImage from '@/assets/portfolio.PNG';
|
||||||
import ergoVRImage from '@/assets/ErgoVR.PNG';
|
import ergoVRImage from '@/assets/ErgoVR.PNG';
|
||||||
import icaraceImage from '@/assets/icarace.PNG';
|
import icaraceImage from '@/assets/icarace.PNG';
|
||||||
import dancaAlegriaImage from '@/assets/Danca-Alegria.png';
|
import dancaAlegriaImage from '@/assets/Danca-Alegria.png';
|
||||||
|
import lukasImage from '@/assets/lukas.png';
|
||||||
|
import a11yhubImage from '@/assets/a11yhub.png';
|
||||||
|
|
||||||
export const projects = {
|
export const projects = {
|
||||||
title: 'Featured Projects',
|
title: 'Featured Projects',
|
||||||
|
|
@ -22,26 +24,6 @@ export const projects = {
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 2,
|
id: 2,
|
||||||
title: 'ErgoVR',
|
|
||||||
description:
|
|
||||||
'A virtual reality application for analysis of motion sickness in VR environments from 2015.',
|
|
||||||
image: ergoVRImage,
|
|
||||||
technologies: ['Unity3D', 'C#', 'Oculus SDK'],
|
|
||||||
year: '2015',
|
|
||||||
github: 'https://github.com/LuciusShadow/ErgoVR',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
title: 'Icarace',
|
|
||||||
description:
|
|
||||||
'Participated in the development of a web-platform for a fitness racing game for Icaros GmbH until 2018.',
|
|
||||||
image: icaraceImage,
|
|
||||||
technologies: ['Angular 4', 'Typescript', 'HTML', 'CSS'],
|
|
||||||
year: '2018',
|
|
||||||
live: 'https://live.icarace.com/home',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
title: 'Danca Alegria Association Website',
|
title: 'Danca Alegria Association Website',
|
||||||
description:
|
description:
|
||||||
'Assist in volunatary changes to accomodate WCAG 2.1 Level AA accessibility.',
|
'Assist in volunatary changes to accomodate WCAG 2.1 Level AA accessibility.',
|
||||||
|
|
@ -49,6 +31,26 @@ export const projects = {
|
||||||
technologies: ['Wordpress', 'PHP', 'HTML', 'CSS'],
|
technologies: ['Wordpress', 'PHP', 'HTML', 'CSS'],
|
||||||
year: '2025',
|
year: '2025',
|
||||||
live: 'https://www.danca-alegria.de',
|
live: 'https://www.danca-alegria.de',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
title: 'Squarespace Page for Mobile Massage Service',
|
||||||
|
description:
|
||||||
|
'Designed and built a service landing page, offer presentation, and appointment scheduling with Squarespace.',
|
||||||
|
image: lukasImage,
|
||||||
|
technologies: ['Squarespace', 'CSS', 'Figma'],
|
||||||
|
year: '2026',
|
||||||
|
live: 'https://www.lukasmobilemassage.de',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
title: 'Platform for Digital Accessibility Education Offers',
|
||||||
|
description:
|
||||||
|
'A collaboration project with Benjamin Christi to provide one central place for events, webinars, and training offers about digital accessibility.',
|
||||||
|
image: a11yhubImage,
|
||||||
|
technologies: ['Payload', 'CSS', 'Typescript'],
|
||||||
|
year: '2026',
|
||||||
|
live: 'https://www.a11y-hub.de',
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue