chore: bump deps

astro.config.mjs

@@ -19,16 +19,8 @@ export default defineConfig({
 			},
 		}),
 	],
-	vite: {
-		define: {
-			"import.meta.env.PUBLIC_GOOGLE_ANALYTICS_ID":
-				process.env.PUBLIC_GOOGLE_ANALYTICS_ID,
-			"import.meta.env.PUBLIC_GOOGLE_RECAPTCHA_SITE_KEY":
-				process.env.PUBLIC_GOOGLE_RECAPTCHA_SITE_KEY,
-			"import.meta.env.GOOGLE_RECAPTCHA_SECRET_KEY":
-				process.env.GOOGLE_RECAPTCHA_SECRET_KEY,
-		},
-	},
 	output: "server",
-	adapter: cloudflare(),
+	adapter: cloudflare({
+		imageService: "cloudflare",
+	}),
 });

biome.json

@@ -11,6 +11,9 @@
 		"clientKind": "git",
 		"defaultBranch": "main"
 	},
+	"formatter": {
+		"lineWidth": 120
+	},
 	"linter": {
 		"rules": {
 			"recommended": true,

package.json

@@ -6,6 +6,7 @@
 		"typescript",
 		"css",
 		"cloudflare",
+		"NGO",
 		"blog",
 		"portfolio",
 		"marketing",
@@ -52,7 +53,7 @@
 		"@types/node": "^20.12.7",
 		"@types/react": "^18.2.77",
 		"@types/react-dom": "^18.2.25",
-		"astro": "^4.6.0",
+		"astro": "^4.6.1",
 		"firebase": "^10.11.0",
 		"firebase-admin": "^12.0.0",
 		"gsap": "^3.12.5",
@@ -75,7 +76,7 @@
 		"@commitlint/config-conventional": "^19.1.0",
 		"@testing-library/react": "^15.0.1",
 		"@testing-library/react-hooks": "^8.0.1",
-		"@types/markdown-it": "^14.0.0",
+		"@types/markdown-it": "^14.0.1",
 		"@types/three": "^0.163.0",
 		"husky": "^9.0.11",
 		"lint-staged": "^15.2.2",

scripts/get-tsconfig.cjs

@@ -4,9 +4,7 @@ const { readFileSync } = require("node:fs");
 const assert = require("node:assert");
 
 const tsconfigPath = require.resolve("../tsconfig.json");
-const { config, error } = ts.readConfigFile(tsconfigPath, (path) =>
-	readFileSync(path, "utf-8"),
-);
+const { config, error } = ts.readConfigFile(tsconfigPath, (path) => readFileSync(path, "utf-8"));
 
 assert(!error);
 

src/consts.ts

@@ -7,10 +7,7 @@ export const CONTACT_DETAILS: Record<string, string> = {
 	ENCODED_BIANCA_EMAIL: btoa("[email protected]"),
 };
 
-export const WORLD_GLOBE_CONFIG: Record<
-	string,
-	number | boolean | string | object
-> = {
+export const WORLD_GLOBE_CONFIG: Record<string, number | boolean | string | object> = {
 	ANIMATION_DURATION: 500,
 	MOVEMENT_OFFSET: 20,
 	ZOOM_OFFSET: 0.1,

src/pages/api/contact-form.ts

@@ -30,10 +30,7 @@ export const POST: APIRoute = async ({ request }) => {
 			message: formData.get("message"),
 		});
 
-		if (!contactValidation.success)
-			throw new Error(
-				contactValidation.error?.errors.join(", ") || "Invalid data",
-			);
+		if (!contactValidation.success) throw new Error(contactValidation.error?.errors.join(", ") || "Invalid data");
 
 		const { data } = contactValidation;
 		const database = getFirestore(app);
@@ -50,9 +47,7 @@ export const POST: APIRoute = async ({ request }) => {
 		const { data: emailData, error: emailError } = await sendEmail(data);
 
 		if (emailError && !emailData) {
-			throw new Error(
-				`Something went wrong sending the email. Error: ${emailError.message} (${emailError.name})`,
-			);
+			throw new Error(`Something went wrong sending the email. Error: ${emailError.message} (${emailError.name})`);
 		}
 
 		return new Response(null, { status: 200 });

src/pages/articles/[...slug].astro

@@ -30,16 +30,8 @@ const { currentArticle } = Astro.props as ArticleProps;
 const { featuredImage, author, title, publishDate, tags } = currentArticle.data;
 const { Content } = await currentArticle.render();
 const relatedArticles = articles
-	.filter(({ data }) =>
-		data.tags.some(
-			(tag) => data.title !== currentArticle.data.title && tags?.includes(tag),
-		),
-	)
-	.sort(
-		(a, b) =>
-			new Date(b.data.publishDate).valueOf() -
-			new Date(a.data.publishDate).valueOf(),
-	)
+	.filter(({ data }) => data.tags.some((tag) => data.title !== currentArticle.data.title && tags?.includes(tag)))
+	.sort((a, b) => new Date(b.data.publishDate).valueOf() - new Date(a.data.publishDate).valueOf())
 	.splice(0, MAX_RELATED_ARTICLES);
 ---
 

src/pages/articles/index.astro

@@ -17,29 +17,21 @@ enum ArticleType {
 const articles = await getCollection("articles");
 const images = import.meta.glob("/src/assets/**/*.{jpeg,jpg,png,gif}");
 
-articles.sort(
-	(a, b) =>
-		new Date(b.data.publishDate).valueOf() -
-		new Date(a.data.publishDate).valueOf(),
-);
+articles.sort((a, b) => new Date(b.data.publishDate).valueOf() - new Date(a.data.publishDate).valueOf());
 const {
 	body: featuredArticleBody,
 	data: featuredArticle,
 	slug: featuredArticleSlug,
-} = articles.find(
-	(article) => article.data.isFeatured && article.data.featuredImage,
-) ?? articles.find((article) => article.data.featuredImage);
+} = articles.find((article) => article.data.isFeatured && article.data.featuredImage) ??
+articles.find((article) => article.data.featuredImage);
 
 const parser: MarkdownIt = MarkdownIt("default", {});
 
 const { excerpt: featuredArticleExcerpt } = createExcerpt({
 	parser,
 	content: featuredArticleBody,
 });
-const publishedDate = featuredArticle.publishDate.toLocaleDateString(
-	"en",
-	DEFAULT_DATE_FORMAT,
-);
+const publishedDate = featuredArticle.publishDate.toLocaleDateString("en", DEFAULT_DATE_FORMAT);
 const featuredArticleHref = `/articles/${featuredArticleSlug}`;
 const featuredArticleShareUrl = new URL(featuredArticleHref, Astro.url).href;
 ---

src/pages/index.astro

@@ -6,7 +6,6 @@ import MyWork from "@components/organisms/myWork/MyWork.astro";
 import LatestArticles from "@components/organisms/latestArticles/LatestArticles.astro";
 
 // todo (current): related articles
-// todo: control errors in request
 // todo: responsive
 // todo: add resume (PDF) in about?
 // todo: dynamic content

src/pages/tags/[...tag].astro

@@ -11,9 +11,7 @@ interface TagProps {
 
 export async function getStaticPaths() {
 	const allPosts = await getCollection("articles");
-	const uniqueAuthors = [
-		...new Set(allPosts.flatMap((post) => post.data.author)),
-	];
+	const uniqueAuthors = [...new Set(allPosts.flatMap((post) => post.data.author))];
 	const uniqueTags = [...new Set(allPosts.flatMap((post) => post.data.tags))];
 
 	const tags = uniqueTags.map((tag) => ({

src/ui/components/atoms/spinner/Spinner.tsx

@@ -1,4 +1,4 @@
-import './spinner.css';
+import "./spinner.css";
 
 const Spinner = () => <div className="spinner" />;
 export default Spinner;

src/ui/components/atoms/worldGlobe/WorldGlobe.tsx

@@ -72,28 +72,15 @@ const WorldGlobe = memo(({ cities, width = 680 }: GlobeAllCitiesProps) => {
 	const handleAction = useCallback(
 		({ movementDirection, type }: HandleActionParams) => {
 			if (!worldGlobeReference.current) return;
-			const { lng: currentLongitude, altitude: currentZoom } =
-				worldGlobeReference.current.pointOfView();
+			const { lng: currentLongitude, altitude: currentZoom } = worldGlobeReference.current.pointOfView();
 
 			if (type === MovementType.MOVE) {
-				const offset =
-					movementDirection === Direction.CLOCKWISE
-						? MOVEMENT_OFFSET
-						: -MOVEMENT_OFFSET;
+				const offset = movementDirection === Direction.CLOCKWISE ? MOVEMENT_OFFSET : -MOVEMENT_OFFSET;
 				const newLongitude = currentLongitude + offset;
-				worldGlobeReference.current.pointOfView(
-					{ lng: newLongitude },
-					ANIMATION_DURATION,
-				);
+				worldGlobeReference.current.pointOfView({ lng: newLongitude }, ANIMATION_DURATION);
 			} else if (type === MovementType.ZOOM) {
-				const newZoom =
-					movementDirection === Zoom.IN
-						? currentZoom - ZOOM_OFFSET
-						: currentZoom + ZOOM_OFFSET;
-				worldGlobeReference.current.pointOfView(
-					{ altitude: newZoom },
-					ANIMATION_DURATION,
-				);
+				const newZoom = movementDirection === Zoom.IN ? currentZoom - ZOOM_OFFSET : currentZoom + ZOOM_OFFSET;
+				worldGlobeReference.current.pointOfView({ altitude: newZoom }, ANIMATION_DURATION);
 			}
 		},
 		[worldGlobeReference],
@@ -124,9 +111,7 @@ const WorldGlobe = memo(({ cities, width = 680 }: GlobeAllCitiesProps) => {
 				pointRadius="radius"
 				pointColor="color"
 				htmlElementsData={refineCities(cities)}
-				htmlElement={(data) =>
-					renderPin({ markerData: data as ReactGlobePoint })
-				}
+				htmlElement={(data) => renderPin({ markerData: data as ReactGlobePoint })}
 			/>
 			<div className="world-globe__controls flex row-wrap justify-center">
 				<div className="world-globe__controls__direction-wrapper flex row-wrap">

src/ui/components/atoms/worldGlobe/utils/calculateCenter/calculateCenter.ts

@@ -9,11 +9,8 @@ export function calculateCenter(data: CityValue[]): CalculateCenterReturnType {
 	const latitudes = data.map((point) => Number.parseFloat(point.latitude));
 	const longitudes = data.map((point) => Number.parseFloat(point.longitude));
 
-	const centerLatitude =
-		latitudes.reduce((acc, latitude) => acc + latitude, 0) / latitudes.length;
-	const centerLongitude =
-		longitudes.reduce((acc, longitude) => acc + longitude, 0) /
-		longitudes.length;
+	const centerLatitude = latitudes.reduce((acc, latitude) => acc + latitude, 0) / latitudes.length;
+	const centerLongitude = longitudes.reduce((acc, longitude) => acc + longitude, 0) / longitudes.length;
 
 	return { latitude: centerLatitude, longitude: centerLongitude };
 }

src/ui/components/molecules/aboutLatestArticlesSlider/AboutLatestArticlesSlider.tsx

@@ -47,9 +47,7 @@ const SLIDER_CONFIG: SwiperOptions = {
 const parser: MarkdownIt = MarkdownIt("default", {});
 
 // todo: isolate and use composition
-export const AboutLatestArticlesSlider = ({
-	articles,
-}: AboutLatestArticlesSLiderProps) => {
+export const AboutLatestArticlesSlider = ({ articles }: AboutLatestArticlesSLiderProps) => {
 	return (
 		<div className="about__latest-articles__slider">
 			<Swiper {...SLIDER_CONFIG}>
@@ -59,31 +57,17 @@ export const AboutLatestArticlesSlider = ({
 							parser,
 							content: content.body,
 						});
-						const variant: ArticleType = article.featuredImage
-							? ArticleType.DEFAULT
-							: ArticleType.NO_IMAGE;
-						const publishedDate = article.publishDate.toLocaleDateString(
-							"en",
-							DEFAULT_DATE_FORMAT,
-						);
+						const variant: ArticleType = article.featuredImage ? ArticleType.DEFAULT : ArticleType.NO_IMAGE;
+						const publishedDate = article.publishDate.toLocaleDateString("en", DEFAULT_DATE_FORMAT);
 						const href = `/articles/${slug}`;
 
 						return (
-							<li
-								key={slug}
-								className="about__latest-article__item__wrapper clickable"
-							>
+							<li key={slug} className="about__latest-article__item__wrapper clickable">
 								<SwiperSlide key={slug}>
-									<a
-										className="about__latest-article__link-card"
-										href={href}
-										aria-label={article.title}
-									/>
+									<a className="about__latest-article__link-card" href={href} aria-label={article.title} />
 									<article
 										className={`about__latest-article__item ${
-											variant === ArticleType.DEFAULT
-												? "--default-variant"
-												: "--no-image-variant"
+											variant === ArticleType.DEFAULT ? "--default-variant" : "--no-image-variant"
 										}`}
 									>
 										{article.featuredImage && (
@@ -95,29 +79,17 @@ export const AboutLatestArticlesSlider = ({
 												decoding="async"
 											/>
 										)}
-										<time
-											className="about__latest-article__item__publish-date"
-											dateTime={publishedDate}
-										>
+										<time className="about__latest-article__item__publish-date" dateTime={publishedDate}>
 											{publishedDate}
 										</time>
-										<h3 className="about__latest-article__title font-serif">
-											{article.title}
-										</h3>
+										<h3 className="about__latest-article__title font-serif">{article.title}</h3>
 										<p className="about__latest-article__author">
-											by{" "}
-											<a href={`/tags/${slugify(article.author)}`}>
-												{article.author}
-											</a>
+											by <a href={`/tags/${slugify(article.author)}`}>{article.author}</a>
 										</p>
 										<p className="about__latest-article__excerpt">{excerpt}</p>
 										<ul className="about__latest-article__item__tags__list">
 											{article.tags?.map((tag: string) => (
-												<a
-													className="about__latest-article__item__tag"
-													href={`/tags/${slugify(tag)}`}
-													key={tag}
-												>
+												<a className="about__latest-article__item__tag" href={`/tags/${slugify(tag)}`} key={tag}>
 													#{tag}
 												</a>
 											))}

src/ui/components/molecules/cityCard/CityCard.tsx

@@ -1,21 +1,9 @@
 import React, { type CSSProperties, type ReactNode } from "react";
 import "./city-card.css";
-import {
-	CityPeriod,
-	type CityPeriodProps,
-} from "src/ui/components/molecules/cityCard/components/cityPeriod";
-import {
-	CityName,
-	type CityTitleProps,
-} from "src/ui/components/molecules/cityCard/components/cityName";
-import {
-	CityImage,
-	type CityImageProps,
-} from "@components/molecules/cityCard/components/cityImage";
-import {
-	CityDescription,
-	type CityDescriptionProps,
-} from "@components/molecules/cityCard/components/cityDescription";
+import { CityPeriod, type CityPeriodProps } from "src/ui/components/molecules/cityCard/components/cityPeriod";
+import { CityName, type CityTitleProps } from "src/ui/components/molecules/cityCard/components/cityName";
+import { CityImage, type CityImageProps } from "@components/molecules/cityCard/components/cityImage";
+import { CityDescription, type CityDescriptionProps } from "@components/molecules/cityCard/components/cityDescription";
 
 interface CityCardProps {
 	children: ReactNode;
@@ -36,13 +24,9 @@ export const CityCard = ({ children, index, numCards }: CityCardProps) => {
 };
 
 const Image = (props: CityImageProps) => <CityImage {...props} />;
-const Period = ({ children }: CityPeriodProps) => (
-	<CityPeriod>{children}</CityPeriod>
-);
+const Period = ({ children }: CityPeriodProps) => <CityPeriod>{children}</CityPeriod>;
 const Title = ({ children }: CityTitleProps) => <CityName>{children}</CityName>;
-const Description = ({ children }: CityDescriptionProps) => (
-	<CityDescription>{children}</CityDescription>
-);
+const Description = ({ children }: CityDescriptionProps) => <CityDescription>{children}</CityDescription>;
 
 CityCard.Period = Period;
 CityCard.Title = Title;

src/ui/components/molecules/cityCard/components/cityImage/CityImage.tsx

@@ -4,11 +4,5 @@ import "./city-image.css";
 export type CityImageProps = Pick<HTMLImageElement, "src" | "alt">;
 
 export const CityImage = ({ src, alt }: CityImageProps) => (
-	<img
-		className="city-card__content__image"
-		src={src}
-		alt={alt}
-		decoding="async"
-		loading="lazy"
-	/>
+	<img className="city-card__content__image" src={src} alt={alt} decoding="async" loading="lazy" />
 );

src/ui/components/molecules/testimonial/components/testimonialDescription/testimonialDescription.tsx

@@ -5,8 +5,6 @@ export interface TestimonialDescriptionProps {
 	children: ReactNode;
 }
 
-export const TestimonialDescription = ({
-	children,
-}: TestimonialDescriptionProps) => (
+export const TestimonialDescription = ({ children }: TestimonialDescriptionProps) => (
 	<p className="testimonial__description">{children}</p>
 );

src/ui/components/molecules/testimonial/components/testimonialImage/testimonialImage.tsx

@@ -4,11 +4,5 @@ import "./testimonial-image.css";
 export type TestimonialImageProps = Pick<HTMLImageElement, "src" | "alt">;
 
 export const TestimonialImage = ({ src, alt }: TestimonialImageProps) => (
-	<img
-		className="testimonial__image"
-		src={src}
-		alt={alt}
-		decoding="async"
-		loading="lazy"
-	/>
+	<img className="testimonial__image" src={src} alt={alt} decoding="async" loading="lazy" />
 );