add prettier for auto formatting (#231)

* [Prettier] Add "prettier"

Makes the formatting of the code consistent.
By using the eslint-plugin-prettier formatting issues will be highlighted as a lint error.
These errors will be auto fixed by running "lint --fix" (which can be done automatically on file save)

* [Prettier] Add "prettier" - Fix formatting

src/components/util/SpinnerImage.tsx

@@ -12,21 +12,19 @@ import { Theme } from '@mui/system/createTheme';
 import { SxProps } from '@mui/system/styleFunctionSx';
 
 interface IProps {
-    src: string
-    alt: string
+    src: string;
+    alt: string;
 
-    imgRef?: React.RefObject<HTMLImageElement>
+    imgRef?: React.RefObject<HTMLImageElement>;
 
-    spinnerStyle?: SxProps<Theme>
-    imgStyle?: CSSProperties
+    spinnerStyle?: SxProps<Theme>;
+    imgStyle?: CSSProperties;
 
-    onImageLoad?: () => void
+    onImageLoad?: () => void;
 }
 
 export default function SpinnerImage(props: IProps) {
-    const {
-        src, alt, onImageLoad, imgRef, spinnerStyle, imgStyle,
-    } = props;
+    const { src, alt, onImageLoad, imgRef, spinnerStyle, imgStyle } = props;
     const [imageSrc, setImagsrc] = useState<string>('');
 
     useEffect(() => {
@@ -61,14 +59,7 @@ export default function SpinnerImage(props: IProps) {
         return <Box sx={spinnerStyle} />;
     }
 
-    return (
-        <img
-            style={imgStyle}
-            ref={imgRef}
-            src={imageSrc}
-            alt={alt}
-        />
-    );
+    return <img style={imgStyle} ref={imgRef} src={imageSrc} alt={alt} />;
 }
 
 SpinnerImage.defaultProps = {