Fabi0o solution

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib"
+}

components/VikingCard.tsx

@@ -0,0 +1,26 @@
+import { Viking } from "../types/viking";
+import styles from "../styles/VikingCard.module.css";
+const VikingCard = ({ viking }: { viking: Viking }) => {
+  return (
+    <div className={styles.card}>
+      <div className={styles.cardFullName}>{viking.fullName}</div>
+      <div className={styles.cardAge}>Age: {viking.age}</div>
+      <div className={styles.cardHomeTown}>Town: {viking.hometown}</div>
+      <div className={styles.cardChildren}>
+        {viking.presenceOfChildren ? "Has children" : "Childless"}
+      </div>
+      <div>
+        Fight with
+        {viking.canFightWithSword
+          ? " Sword"
+          : viking.canFightWithAxe
+          ? " Axe"
+          : viking.canFightWithSpear
+          ? " Spear"
+          : " Hammer"}
+      </div>
+    </div>
+  );
+};
+
+export default VikingCard;

lib/vikings.ts

@@ -0,0 +1,51 @@
+import { Viking } from "../types/viking";
+type vikingDataJSON = {
+  fullName: string;
+  village: string;
+  age: number;
+  valkyrie: string;
+  hasSon: boolean;
+};
+type vikingDataYaml = {
+  name: string;
+  weapon: "sword" | "spear" | "axe" | "hammer";
+  name_of_father: string;
+  has_home_in: string;
+  years_old: number;
+  number_of_children: number;
+};
+
+export const handleVikingList = (
+  vikingsJSON: Array<vikingDataJSON>,
+  vikingsYaml: Array<vikingDataYaml>
+) => {
+  const jsonVikingList: Array<Viking> = vikingsJSON.map((vikingJSON) => {
+    const fullViking = {
+      fullName: vikingJSON.fullName,
+      presenceOfChildren: vikingJSON.hasSon ? true : false,
+      age: vikingJSON.age,
+      hometown: vikingJSON.village,
+      canFightWithSword: vikingsJSON.indexOf(vikingJSON) <= 2 ? true : false,
+      canFightWithAxe: vikingsJSON.indexOf(vikingJSON) < 6 ? true : false,
+      canFightWithSpear: vikingsJSON.indexOf(vikingJSON) >= 6 ? true : false,
+    };
+    return fullViking;
+  });
+  const yamlVikingList: Array<Viking> = vikingsYaml.map((vikingYaml) => {
+    const fullViking = {
+      fullName: `${vikingYaml.name} ${vikingYaml.name_of_father}sson`,
+      presenceOfChildren: vikingYaml.number_of_children > 0 ? true : false,
+      age: vikingYaml.years_old,
+      hometown: vikingYaml.has_home_in,
+      canFightWithSword: vikingYaml.weapon == "sword" ? true : false,
+      canFightWithAxe: vikingYaml.weapon == "axe" ? true : false,
+      canFightWithSpear: vikingYaml.weapon == "spear" ? true : false,
+    };
+    return fullViking;
+  });
+  const fullVikingList: Array<Viking> = [...jsonVikingList, ...yamlVikingList];
+  const vikingList: Array<Viking> = fullVikingList.filter(
+    (viking) => viking.age > 25 && viking.age < 65
+  );
+  return vikingList;
+};

next.config.js

@@ -1,7 +1,8 @@
 /** @type {import('next').NextConfig} */
+const withYAML = require("next-yaml");
 const nextConfig = {
   reactStrictMode: true,
   swcMinify: true,
-}
-
-module.exports = nextConfig
+};
+module.exports = nextConfig;
+module.exports = withYAML();