Activate typescript strict mode for server

Should have been set from the start

README.md

@@ -34,7 +34,7 @@ An easy way to run simple picture gallery is with docker.
 
 ```shell
 docker pull docker pull ghcr.io/t-h-e/simple-picture-gallery:latest
-docker run -p 3005:3001 -v /mnt/path/to/pictures:/usr/src/app/public --name my-picture-gallery ghcr.io/t-h-e/simple-picture-gallery:latest
+docker run -d -p 3005:3001 -v /mnt/path/to/pictures:/usr/src/app/public --name my-picture-gallery ghcr.io/t-h-e/simple-picture-gallery:latest
 ```
 
 #### Customization
@@ -44,13 +44,13 @@ Create an environment file `.env` containing any of the following properties to
 ```properties
 VITE_TITLE=My Gallery
 VITE_APPBAR_COLOR=#F8AB2D
-VITE_FAVICON_HREF=<URL to your favicon>
+VITE_FAVICON_HREF=<URL to your favicon or remove this property>
 ```
 
 And run docker with `--env-file .env`
 
 ```shell
-docker run -p 3005:3001 -v /mnt/path/to/pictures:/usr/src/app/public --env-file .env --name my-picture-gallery ghcr.io/t-h-e/simple-picture-gallery:latest
+docker run -d -p 3005:3001 -v /mnt/path/to/pictures:/usr/src/app/public --env-file .env --name my-picture-gallery ghcr.io/t-h-e/simple-picture-gallery:latest
 ```
 
 ### Docker Compose

picture-gallery-client/tsconfig.json

@@ -1,16 +1,15 @@
 {
   "compilerOptions": {
+    "strict": true,
     "target": "es5",
     "lib": [
       "dom",
       "dom.iterable",
       "esnext"
     ],
-    "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
-    "strict": true,
     "forceConsistentCasingInFileNames": true,
     "noFallthroughCasesInSwitch": true,
     "module": "esnext",

picture-gallery-server/src/controller/common.ts

@@ -38,3 +38,16 @@ export const notEmpty = <TValue>(
 ): value is TValue => {
   return value !== null && value !== undefined;
 };
+
+export const definedOrError = <TValue>(
+  value: TValue | void | null | undefined,
+): TValue => {
+  if (notEmpty(value)) {
+    return value;
+  }
+  throw Error("Value was not defined.");
+};
+
+export const definedOrZero = (
+  value: number | void | null | undefined,
+): number => (notEmpty(value) ? value : 0);

picture-gallery-server/src/controller/directories.ts

@@ -4,7 +4,7 @@ import express from "express";
 import { a, FolderPreview, Folders, Image } from "../models";
 import { publicPath, thumbnailPath, thumbnailPublicPath } from "../paths";
 import { securityValidation } from "./securityChecks";
-import { getRequestedPath, notEmpty } from "./common";
+import { definedOrError, getRequestedPath, notEmpty } from "./common";
 import { consoleLogger } from "../logging";
 import { getImage } from "./images";
 
@@ -35,7 +35,7 @@ const getFirstImageInFolder = async (
 ): Promise<Image | void> => {
   const dirs = [dirPath];
   while (dirs.length > 0) {
-    const curPath = dirs.shift();
+    const curPath = definedOrError(dirs.shift());
     const dirContent = fs.readdirSync(path.posix.join(publicPath, curPath), {
       withFileTypes: true,
     });

picture-gallery-server/src/controller/images.ts

@@ -8,6 +8,7 @@ import { a, Folder, Image } from "../models";
 import { consoleLogger } from "../logging";
 import { securityValidation } from "./securityChecks";
 import {
+  definedOrZero,
   getRequestedPath,
   getSrc,
   getThumbnail,
@@ -21,12 +22,15 @@ const toImage = (
   f: Dirent,
   thumbnailExists: boolean,
 ): Image => {
-  const widthAndHeightSwap = metadata.orientation > 4; // see https://exiftool.org/TagNames/EXIF.html
+  const widthAndHeightSwap =
+    metadata.orientation !== undefined && metadata.orientation > 4; // see https://exiftool.org/TagNames/EXIF.html
   return a<Image>({
     src: getSrc(filePath, f),
     thumbnail: getThumbnail(filePath, f, thumbnailExists),
-    width: widthAndHeightSwap ? metadata.height : metadata.width,
-    height: widthAndHeightSwap ? metadata.width : metadata.height,
+    width: definedOrZero(widthAndHeightSwap ? metadata.height : metadata.width),
+    height: definedOrZero(
+      widthAndHeightSwap ? metadata.width : metadata.height,
+    ),
   });
 };
 

picture-gallery-server/src/thumbnails.ts

@@ -12,6 +12,9 @@ export const createThumbnailAsyncForImage = (image: string) => {
   sharp(publicImagePath)
     .metadata()
     .then((info) => {
+      if (info.width === undefined || info.height === undefined) {
+        return;
+      }
       const width = Math.max(
         Math.min(info.width, minimumPixelForThumbnail),
         Math.round((info.width * percentage) / 100),
@@ -25,6 +28,9 @@ export const createThumbnailAsyncForImage = (image: string) => {
         path.posix.join(thumbnailPublicPath, path.dirname(image)),
         { recursive: true },
         () => {
+          if (info.width === undefined || info.height === undefined) {
+            return;
+          }
           sharp(publicImagePath)
             .withMetadata()
             .resize(info.width > info.height ? { width } : { height })

picture-gallery-server/tsconfig.json

@@ -1,16 +1,17 @@
-{
-  "compilerOptions": {
-    "module": "commonjs",
-    "esModuleInterop": true,
-    "target": "es6",
-    "moduleResolution": "node",
-    "sourceMap": true,
-    "outDir": "dist"
-  },
-  "lib": ["es2015"],
-  "exclude": [
-    "src/**/*.test.ts",
-    "**/__test__",
-    "jest.config.ts"
-  ]
-}
+{
+  "compilerOptions": {
+    "strict": true,
+    "module": "commonjs",
+    "esModuleInterop": true,
+    "target": "es6",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "outDir": "dist"
+  },
+  "lib": ["es2015"],
+  "exclude": [
+    "src/**/*.test.ts",
+    "**/__test__",
+    "jest.config.ts"
+  ]
+}