Updated container port setting

Dockerfile

@@ -12,5 +12,4 @@ FROM node:alpine
 RUN npm install serve -g --silent
 WORKDIR /app
 COPY --from=builder /app/build .
-EXPOSE 80
+CMD serve -p ${PORT:-8080} -s .
-CMD ["serve", "-p", "80", "-s", "."]

package.json

@@ -7,7 +7,7 @@
     "h": "cat ./webpack.config.dev.js"
   },
   "devDependencies": {
-    "@svgr/webpack": "^5.5.0",
+    "@svgr/webpack": "^6.3.1",
     "@types/react": "^17.0.15",
     "@types/react-dom": "^17.0.9",
     "copy-webpack-plugin": "^9.0.1",
@@ -16,10 +16,9 @@
     "fork-ts-checker-webpack-plugin": "^6.2.13",
     "style-loader": "^3.2.1",
     "typescript": "^4.3.5",
-    "typescript-plugin-css-modules": "^3.4.0",
     "webpack": "^5.46.0",
     "webpack-cli": "^4.7.2",
-    "webpack-dev-server": "^3.11.2"
+    "webpack-dev-server": "^4.11.1"
   },
   "dependencies": {
     "idb": "^6.1.2",

public/manifest.json

@@ -29,18 +29,18 @@
   "description": "eBook reader supporting EPUB and FB2 files",
   "screenshots": [
     {
-      "src": "/images/screenshot1.jpg",
+      "src": "/images/screenshot1.webp",
-      "type": "image/jpg",
+      "type": "image/webp",
       "sizes": "1080x2400"
     },
     {
-      "src": "/images/screenshot2.jpg",
+      "src": "/images/screenshot2.webp",
-      "type": "image/jpg",
+      "type": "image/webp",
       "sizes": "1080x2400"
     },
     {
-      "src": "/images/screenshot3.jpg",
+      "src": "/images/screenshot3.webp",
-      "type": "image/jpg",
+      "type": "image/webp",
       "sizes": "1080x2400"
     }
   ]

src/pages/UploadForm/index.tsx

@@ -23,7 +23,11 @@ export const UploadForm = ({ setLoading }: IPageProps) => {
       }
     } catch (err) {
       setLoading(false);
+
+      if (err instanceof Error)
         setError(err.message);
+      else 
+        setError(String(err))
     }
   };
 

src/serviceWorker/utils.ts

@@ -8,8 +8,8 @@ export const getHash = (path: string) => {
   return path.substr("/book/".length, hashLength);
 };
 
-export const composeResponseStatus = (err: Error): ResponseInit => {
+export const composeResponseStatus = (err: unknown): ResponseInit => {
-  if (err.name === "NetowrkError")
+  if (err instanceof Error && err.name === "NetowrkError")
     return { status: 503, statusText: err.message };
   else return { status: 500, statusText: "Something bad happened (IDK)" };
 };

src/utils/api.ts

@@ -34,7 +34,9 @@ export const submitFile = async (
 
     return await res.json();
   } catch (err) {
+    if (err instanceof Error)
       console.error("Network error:", err.message);
+      
     throw err;
   }
 };

webpack.config.dev.js

@@ -8,11 +8,10 @@ module.exports = {
   mode: "development",
   watchOptions: { ignored: /node_modules/ },
   devServer: {
-    contentBase: path.join(__dirname, "build"),
+    static: path.join(__dirname, "build"),
     compress: true,
     port: 8080,
     hot: false,
-    inline: false,
     historyApiFallback: {
       index: "index.html",
     },