Fix issue in types

drik98 · Jul 31, 2024 · e33a58e · e33a58e · github-actions · Jul 31, 2024
1 parent 8dcb893
commit e33a58e
Show file tree

Hide file tree

Showing 8 changed files with 48 additions and 29 deletions.
diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
@@ -12,9 +12,11 @@ import Header from "@/components/Header";
 import Projects from "@/components/Projects";
 import Skills from "@/components/Skills";
 
-export async function generateMetadata(
-  { params }: { params: { locale: Locale } }
-): Promise<Metadata> {
+export async function generateMetadata({
+  params,
+}: {
+  params: { locale: Locale };
+}): Promise<Metadata> {
   const messages = await getMessages(params.locale);
   return messages.metadata;
 }

diff --git a/components/Banner.tsx b/components/Banner.tsx
@@ -13,7 +13,10 @@ export default function Banner({
       <div className={styles.bannerContent}>
         <h1>Hendrik Schmitz</h1>
         <h2>{messages.banner.jobTitle}</h2>
-        <a href={`/cv_hendrik_schmitz_${locale}.pdf`} download="cv-hendrik-schmitz.pdf">
+        <a
+          href={`/cv_hendrik_schmitz_${locale}.pdf`}
+          download="cv-hendrik-schmitz.pdf"
+        >
           {messages.banner.downloadCv}
         </a>
       </div>

diff --git a/components/Education.tsx b/components/Education.tsx
@@ -3,8 +3,8 @@ import rawEducation from "@/content/education.json";
 import styles from "./Education.module.scss";
 import {
   Locale,
-  MultilingualList,
-  MultilingualString,
+  MaybeMultilingualList,
+  MaybeMultilingualString,
   getMultilingualContent,
 } from "@/util/i18n";
 
@@ -34,13 +34,13 @@ export default function Education({
 }
 
 interface EducationItem {
-  educator: MultilingualString;
+  educator: MaybeMultilingualString;
   endDate?: Date;
   image: string;
-  keyPoints: MultilingualList;
+  keyPoints: MaybeMultilingualList;
   startDate: Date;
-  title: MultilingualString;
-  url?: MultilingualString;
+  title: MaybeMultilingualString;
+  url?: MaybeMultilingualString;
 }
 
 function EducationTimelineItem({

diff --git a/components/Experience.tsx b/components/Experience.tsx
@@ -5,8 +5,8 @@ import { formatDateRange } from "@/util/date-time";
 import styles from "./Experience.module.scss";
 import {
   Locale,
-  MultilingualList,
-  MultilingualString,
+  MaybeMultilingualList,
+  MaybeMultilingualString,
   getMultilingualContent,
 } from "@/util/i18n";
 
@@ -42,11 +42,11 @@ export default function ExperienceTimeline({
 interface ExperienceItem {
   startDate: Date;
   endDate?: Date;
-  url?: MultilingualString;
+  url?: MaybeMultilingualString;
   image: StaticImageData | string;
-  company: MultilingualString;
-  title: MultilingualString;
-  keyPoints: MultilingualList;
+  company: MaybeMultilingualString;
+  title: MaybeMultilingualString;
+  keyPoints: MaybeMultilingualList;
 }
 
 function ExperienceTimelineItem({

diff --git a/components/Projects.tsx b/components/Projects.tsx
@@ -4,7 +4,7 @@ import projects from "@/content/projects.json";
 import styles from "./Projects.module.scss";
 import {
   Locale,
-  MultilingualString,
+  MaybeMultilingualString,
   getMultilingualContent,
 } from "@/util/i18n";
 
@@ -45,12 +45,12 @@ function ProjectItem({
   messages,
   locale,
 }: {
-  description: MultilingualString;
+  description: MaybeMultilingualString;
   image: StaticImageData | string;
   projectUrl?: string;
   sourceCodeUrl?: string;
   technologies: Technology[];
-  title: MultilingualString;
+  title: MaybeMultilingualString;
   messages: any;
   locale: Locale;
 }) {

diff --git a/package-lock.json b/package-lock.json
diff --git a/util/date-time.ts b/util/date-time.ts
@@ -1,4 +1,4 @@
-import { defaultLocale } from "./i18n";
+import { Locale, defaultLocale } from "./i18n";
 
 export function formatDate(date?: Date, locale = defaultLocale): string {
   if (!date) return "Heute";
@@ -11,7 +11,7 @@ export function formatDate(date?: Date, locale = defaultLocale): string {
 export function formatDateRange(
   startDate?: Date,
   endDate?: Date,
-  locale?: string
+  locale?: Locale
 ): string {
   return [startDate, endDate]
     .map((date) => formatDate(date, locale))

diff --git a/util/i18n.ts b/util/i18n.ts
@@ -1,19 +1,33 @@
-export type Locale = "de" | "en";
-export const supportedLocales: Locale[] = ["de", "en"];
-export const [defaultLocale] = supportedLocales;
+export enum Locale {
+  de = "de",
+  en = "en",
+}
+export const supportedLocales = Object.values(Locale);
+export const defaultLocale = Locale.de;
 
-export type MultilingualContent<T> = Partial<Record<Locale, T>> | T;
+/**
+ * Makes sure that at least the translation for the default locale is set.
+ * Translations for all other locales are optional.
+ * Use getMultilingualContent to get the translation of a locale or fallback to the default locale.
+ */
+export type MultilingualContent<T> = { [Locale.de]: T } & Partial<
+  Record<Locale, T>
+>;
 export type MultilingualString = MultilingualContent<string>;
 export type MultilingualList = MultilingualContent<string[]>;
 
+export type MaybeMultiLingualContent<T> = MultilingualContent<T> | T;
+export type MaybeMultilingualString = MaybeMultiLingualContent<string>;
+export type MaybeMultilingualList = MaybeMultiLingualContent<string[]>;
+
 function isMultiLingualContent<T>(
-  content: MultilingualContent<T>
-): content is Record<Locale, T> {
+  content: MaybeMultiLingualContent<T>
+): content is MultilingualContent<T> {
   return content && typeof content === "object" && defaultLocale in content;
 }
 
 export function getMultilingualContent<T>(
-  content: MultilingualContent<T>,
+  content: MaybeMultiLingualContent<T>,
   locale: Locale
 ): T {
   if (isMultiLingualContent(content)) {