Portfolio/front/Tabs/About.ts

import { link } from "ansi-escapes";
import { newLine } from "..";
import ScrollComponent from "../ScrollComponent";
import FerorIcon from "../FerorIcon";

interface AboutProps {
	width: number;
	height: number;
	scrollPosition: number;
}

const age = new Date().getFullYear() - 2004 - (new Date().getMonth() > 10 ? 0 : 1);

const About = ({ width, height, scrollPosition }: AboutProps) => {
	const content =
		`  Hi there! My name is Jokin Suares, and I'm a software engineer.${newLine}` +
		`  I'm passionate about technology and I love to learn new things.${newLine}` +
		`  ${newLine}` +
		`  Welcome to my ssh portfolio! Here you can navigate through my projects and contact me.${newLine}` +
		`  You might be wondering how this works, right?${newLine}` +
		`  Or maybe you're just curious about why anyone would build a portfolio like this.${newLine}` +
		`  Well, the answer is simple: I love the terminal!${newLine}` +
		`  I spend most of my day in the terminal, so why not have my portfolio there too?${newLine}` +
		`  I hope you enjoy it so far!${newLine}` +
		`  By the way, you can scroll down to read more about me.${newLine}` +
		`  To do so, use the arrow keys on your keyboard.${newLine}` +
		`  ${newLine}` +
		`  Some background first: ${newLine}` +
		`    I'm a ${age} years old French 🇫🇷 software engineer ${newLine}` +
		`    I'm always looking for new challenges and opportunities to learn and grow.${newLine}` +
		`    At first, I started with backend development, and that was my main focus.${newLine}` +
		`    But I quickly diversified my skills and started working on many other things.${newLine}` +
		`  ${newLine}` +
		`  Here are some of the technologies I've worked with:${newLine}` +
		`    - Typescript (Bun, React, React Native, Angular, Svelte, ...)${newLine}` +
		`    - Python (Django, Flask, FastAPI, ...)${newLine}` +
		`    - Java ${newLine}` +
		`    - Docker${newLine}` +
		`    - Kubernetes${newLine}` +
		`    - Git${newLine}` +
		`    - Linux${newLine}` +
		`    - Ansible${newLine}` +
		`    - Jenkins${newLine}` +
		`    - Gitlab CI${newLine}` +
		`    - Travis CI${newLine}` +
		`    - Circle CI${newLine}` +
		`    - ...${newLine}` +
		`  ${newLine}` +
		`  I am also very passionate about open-source and self-hosting.${newLine}` +
		`  This portfolio is hosted on my own hardware, and I'm very proud of that.${newLine}` +
		`  If you want to see how it works, you can check out the source code on my ${link(
			"Forgejo",
			"https://forge.feror.fr/feror/Portfolio"
		)}.${newLine}` +
		`${newLine}` +
		`${FerorIcon({ width })}` +
		`${newLine}`;

	return ScrollComponent({
		width,
		height,
		scrollPosition,
		text: content,
	});
};
export default About;