add Makefile

Makefile

@@ -0,0 +1,28 @@
+# Define variables for commands to keep it simple and centralized
+NPM := npm
+BUILD_DIR := dist
+
+# Default target executed when no arguments are given to make.
+default: build
+
+# Target for installing dependencies
+install_deps:
+	@echo "Installing project dependencies..."
+	@$(NPM) install
+
+# Target for building the project
+build: install_deps
+	@echo "Building the project..."
+	@$(NPM) run build
+	@$(MAKE) banner
+
+# Target for printing a completion banner with colors
+banner:
+	@echo -e "\033[1;36m================================================================================\033[0m"
+	@echo -e "\033[1;32m BUILD COMPLETED SUCCESSFULLY 🎉\033[0m"
+	@echo -e "\033[1;33m The $(BUILD_DIR) directory is ready to be served as a webroot.\033[0m"
+	@echo -e "\033[1;36m================================================================================\033[0m"
+
+
+# Phony targets are not files
+.PHONY: install_deps build banner

src/components/molecules/PersonInput.tsx

@@ -59,8 +59,7 @@ const PersonInput = ({person, setPerson}: { person: Person, setPerson: any }) =>
                            newPerson.setTaxId(event.target.value);
                            setPerson(newPerson);
                        }}/>
-            <DatePicker id="outlined-basic" label="Geburtsdatum" variant="outlined"
+            <DatePicker label="Geburtsdatum"
-                        error={!person.isBirthDateCorrect()} fullWidth
                         sx={styles.textfield}
                         onChange={(newvalue) => {
                             const newPerson = Object.assign(new Person(), person);

src/components/molecules/PostenInput.tsx

@@ -1,12 +1,10 @@
-import {TextField, Typography, Select, SelectChangeEvent, MenuItem, FormControl, Button} from "@mui/material";
+import {TextField, Select, SelectChangeEvent, MenuItem, Button} from "@mui/material";
 import {DatePicker} from '@mui/x-date-pickers/DatePicker';
-import DeleteIcon from '@mui/icons-material/Delete';
 import DeleteOutlineOutlinedIcon from '@mui/icons-material/DeleteOutlineOutlined';
-import {Sachkonto, sachkontoDescription} from "../../data/Sachkonto.ts";
 import Posten from "../../data/Posten.ts";
 import Zahlungsart from "../../data/Zahlungsart.ts";
 import dayjs from "dayjs";
-import {useEffect, useState} from "react";
+import {useState} from "react";
 
 const styles = {
     textfield: {
@@ -82,7 +80,7 @@ const PostenInput = ({thisPosten, posten, setPosten}: { thisPosten: Posten, post
 
     return (
         <>
-            <DatePicker id="outlined-basic" label="Datum" variant="outlined"
+            <DatePicker label="Datum"
                         sx={styles.textfield}
                         value={thisPosten.getBelegDay()}
                         onChange={(newvalue) => {
@@ -110,7 +108,7 @@ const PostenInput = ({thisPosten, posten, setPosten}: { thisPosten: Posten, post
                        }}/>
             <Select id={"outlined-basic"} label={"Zahlungsart"} variant={"outlined"}
                     sx={styles.textfield}
-                    value={thisPosten.getZahlungsart()}
+                    value={thisPosten.getZahlungsart() as unknown as HTMLInputElement}
                     onChange={(event: SelectChangeEvent<HTMLInputElement>) => {
                         const newList = posten.map((p) => {
                             if (p.getNummer() === thisPosten.getNummer()) {