formatting done

picture-gallery-client/.eslintrc.json

@@ -40,6 +40,12 @@
           ".tsx"
         ]
       }
+    ],
+    "no-unused-vars": [
+      "error",
+      {
+        "argsIgnorePattern": "^_"
+      }
     ]
   },
   "settings": {

picture-gallery-client/package.json

@@ -29,8 +29,8 @@
     "build-client": "react-scripts build",
     "test-client": "react-scripts test",
     "eject-client": "react-scripts eject",
-    "lint": "eslint src/*",
+    "lint": "eslint src/**",
-    "lint:fix": "eslint --fix src/*",
+    "lint:fix": "eslint --fix src/**",
     "format": "prettier --write \"**/*.+(ts|tsx)\""
   },
   "eslintConfig": {

picture-gallery-client/src/ImageGallery/ImageGallery.tsx

@@ -1,21 +1,17 @@
 import PhotoAlbum, { Photo } from "react-photo-album";
+import React from "react";
 
 function ImageGallery({ images }: { images: Photo[] }) {
   //  For all kind of settings see:
   // https://react-photo-album.com/examples/playground
   // https://codesandbox.io/s/github/igordanchenko/react-photo-album/tree/main/examples/playground
 
-  return (
+  return images.length === 0 ? (
-    <>
-      {images.length === 0 ? (
     <p>
-          No images available. You may want to add images in your root
+      No images available. You may want to add images in your root directory.
-          directory.
     </p>
   ) : (
     <PhotoAlbum layout="masonry" photos={images} />
-      )}
-    </>
   );
 }
 

picture-gallery-client/src/ImageGallery/ImageGalleryAppBar.tsx

@@ -2,6 +2,7 @@ import Toolbar from "@mui/material/Toolbar";
 import IconButton from "@mui/material/IconButton";
 import MenuIcon from "@mui/icons-material/Menu";
 import Typography from "@mui/material/Typography";
+import React from "react";
 import AppBar from "../MuiLayout/AppBar";
 
 function ImageGalleryAppBar({

picture-gallery-client/src/ImageGallery/ImageGalleryDrawer.tsx

@@ -1,5 +1,4 @@
 import Drawer from "@mui/material/Drawer";
-import DrawerHeader from "../MuiLayout/DrawerHeader";
 import IconButton from "@mui/material/IconButton";
 import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
 import ChevronRightIcon from "@mui/icons-material/ChevronRight";
@@ -8,9 +7,10 @@ import FolderOpenIcon from "@mui/icons-material/FolderOpen";
 import Divider from "@mui/material/Divider";
 import { useTheme } from "@mui/material/styles";
 import { TreeItem, TreeView } from "@mui/lab";
-import { Folders } from "./models";
 import { useLocation, useNavigate } from "react-router-dom";
-import { useState } from "react";
+import React, { useState } from "react";
+import { Folders } from "./models";
+import DrawerHeader from "../MuiLayout/DrawerHeader";
 
 function getDefaultExpanded(pathname: string): string[] {
   const pathParts = [];
@@ -24,7 +24,7 @@ function getDefaultExpanded(pathname: string): string[] {
 
 function generateTreeViewChildren(
   folders: Folders[],
-  navigateAndToggleExpand: (path: string, navigationAllowed: boolean) => void
+  navigateAndToggleExpand: (_path: string, _navigationAllowed: boolean) => void
 ) {
   return (
     <>
@@ -88,7 +88,7 @@ function GenerateTreeView({ root }: { root: Folders }) {
 
   return (
     <TreeView
-      disableSelection={true}
+      disableSelection
       defaultCollapseIcon={<FolderOpenIcon />}
       defaultExpandIcon={<FolderIcon />}
       expanded={expanded}
@@ -102,6 +102,7 @@ function GenerateTreeView({ root }: { root: Folders }) {
       {root.children.length > 0 ? (
         generateTreeViewChildren(root.children, navigateAndToggleExpand)
       ) : (
+        // eslint-disable-next-line react/jsx-no-useless-fragment
         <></>
       )}
     </TreeView>

picture-gallery-server/package.json

@@ -9,8 +9,8 @@
     "start-server": "node dist/app.js",
     "watch-server": "npx nodemon src/app.ts",
     "run-server": "npm run build-server && npm run start-server",
-    "lint": "eslint src/*",
+    "lint": "eslint src/**",
-    "lint:fix": "eslint --fix src/*",
+    "lint:fix": "eslint --fix src/**",
     "format": "prettier --write \"**/*.+(ts|tsx)\""
   },
   "keywords": [],