upgraded redux store to typescript

package-lock.json

@@ -9,6 +9,10 @@
       "version": "1.0.0",
       "license": "ISC",
       "dependencies": {
+        "@types/jest": "^29.2.3",
+        "@types/node": "^18.11.9",
+        "@types/react": "^18.0.25",
+        "@types/react-dom": "^18.0.9",
         "axios": "^1.2.0",
         "dotenv": "^16.0.3",
         "firebase": "^9.14.0",
@@ -22,7 +26,9 @@
         "redux": "^4.2.0",
         "redux-promise": "^0.6.0",
         "redux-thunk": "^2.4.2",
-        "swiper": "^8.4.5"
+        "swiper": "^8.4.5",
+        "ts-loader": "^9.4.1",
+        "typescript": "^4.9.3"
       },
       "devDependencies": {
         "@babel/core": "^7.20.2",
@@ -3187,6 +3193,25 @@
         "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
       }
     },
+    "node_modules/@jest/expect-utils": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/@jest/expect-utils/-/expect-utils-29.3.1.tgz",
+      "integrity": "sha512-wlrznINZI5sMjwvUoLVk617ll/UYfGIZNxmbU+Pa7wmkL4vYzhV9R2pwVqUh4NWWuLQWkI8+8mOkxs//prKQ3g==",
+      "dependencies": {
+        "jest-get-type": "^29.2.0"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@jest/expect-utils/node_modules/jest-get-type": {
+      "version": "29.2.0",
+      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-29.2.0.tgz",
+      "integrity": "sha512-uXNJlg8hKFEnDgFsrCjznB+sTxdkuqiCL6zMgA75qEbAJjJYTs9XPrvDctrEig2GDow22T/LvHgO57iJhXB/UA==",
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
     "node_modules/@jest/fake-timers": {
       "version": "27.5.1",
       "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-27.5.1.tgz",
@@ -3327,7 +3352,6 @@
       "version": "29.0.0",
       "resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-29.0.0.tgz",
       "integrity": "sha512-3Ab5HgYIIAnS0HjqJHQYZS+zXc4tUmTmBH3z83ajI6afXp8X3ZtdLX+nXx+I7LNkJD7uN9LAVhgnjDgZa2z0kA==",
-      "dev": true,
       "dependencies": {
         "@sinclair/typebox": "^0.24.1"
       },
@@ -3995,8 +4019,7 @@
     "node_modules/@sinclair/typebox": {
       "version": "0.24.51",
       "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.51.tgz",
-      "integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA==",
+      "integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA=="
-      "dev": true
     },
     "node_modules/@sindresorhus/is": {
       "version": "0.7.0",
@@ -4610,6 +4633,226 @@
         "@types/istanbul-lib-report": "*"
       }
     },
+    "node_modules/@types/jest": {
+      "version": "29.2.3",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-29.2.3.tgz",
+      "integrity": "sha512-6XwoEbmatfyoCjWRX7z0fKMmgYKe9+/HrviJ5k0X/tjJWHGAezZOfYaxqQKuzG/TvQyr+ktjm4jgbk0s4/oF2w==",
+      "dependencies": {
+        "expect": "^29.0.0",
+        "pretty-format": "^29.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/@jest/types": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.3.1.tgz",
+      "integrity": "sha512-d0S0jmmTpjnhCmNpApgX3jrUZgZ22ivKJRvL2lli5hpCRoNnp1f85r2/wpKfXuYu8E7Jjh1hGfhPyup1NM5AmA==",
+      "dependencies": {
+        "@jest/schemas": "^29.0.0",
+        "@types/istanbul-lib-coverage": "^2.0.0",
+        "@types/istanbul-reports": "^3.0.0",
+        "@types/node": "*",
+        "@types/yargs": "^17.0.8",
+        "chalk": "^4.0.0"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/@types/yargs": {
+      "version": "17.0.14",
+      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.14.tgz",
+      "integrity": "sha512-9Pj7abXoW1RSTcZaL2Hk6G2XyLMlp5ECdVC/Zf2p/KBjC3srijLGgRAXOBjtFrJoIrvxdTKyKDA14bEcbxBaWw==",
+      "dependencies": {
+        "@types/yargs-parser": "*"
+      }
+    },
+    "node_modules/@types/jest/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@types/jest/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/@types/jest/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+    },
+    "node_modules/@types/jest/node_modules/diff-sequences": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-29.3.1.tgz",
+      "integrity": "sha512-hlM3QR272NXCi4pq+N4Kok4kOp6EsgOM3ZSpJI7Da3UAs+Ttsi8MRmB6trM/lhyzUxGfOgnpkHtgqm5Q/CTcfQ==",
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/expect": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-29.3.1.tgz",
+      "integrity": "sha512-gGb1yTgU30Q0O/tQq+z30KBWv24ApkMgFUpvKBkyLUBL68Wv8dHdJxTBZFl/iT8K/bqDHvUYRH6IIN3rToopPA==",
+      "dependencies": {
+        "@jest/expect-utils": "^29.3.1",
+        "jest-get-type": "^29.2.0",
+        "jest-matcher-utils": "^29.3.1",
+        "jest-message-util": "^29.3.1",
+        "jest-util": "^29.3.1"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@types/jest/node_modules/jest-diff": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-29.3.1.tgz",
+      "integrity": "sha512-vU8vyiO7568tmin2lA3r2DP8oRvzhvRcD4DjpXc6uGveQodyk7CKLhQlCSiwgx3g0pFaE88/KLZ0yaTWMc4Uiw==",
+      "dependencies": {
+        "chalk": "^4.0.0",
+        "diff-sequences": "^29.3.1",
+        "jest-get-type": "^29.2.0",
+        "pretty-format": "^29.3.1"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/jest-get-type": {
+      "version": "29.2.0",
+      "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-29.2.0.tgz",
+      "integrity": "sha512-uXNJlg8hKFEnDgFsrCjznB+sTxdkuqiCL6zMgA75qEbAJjJYTs9XPrvDctrEig2GDow22T/LvHgO57iJhXB/UA==",
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/jest-matcher-utils": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-29.3.1.tgz",
+      "integrity": "sha512-fkRMZUAScup3txIKfMe3AIZZmPEjWEdsPJFK3AIy5qRohWqQFg1qrmKfYXR9qEkNc7OdAu2N4KPHibEmy4HPeQ==",
+      "dependencies": {
+        "chalk": "^4.0.0",
+        "jest-diff": "^29.3.1",
+        "jest-get-type": "^29.2.0",
+        "pretty-format": "^29.3.1"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/jest-message-util": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-29.3.1.tgz",
+      "integrity": "sha512-lMJTbgNcDm5z+6KDxWtqOFWlGQxD6XaYwBqHR8kmpkP+WWWG90I35kdtQHY67Ay5CSuydkTBbJG+tH9JShFCyA==",
+      "dependencies": {
+        "@babel/code-frame": "^7.12.13",
+        "@jest/types": "^29.3.1",
+        "@types/stack-utils": "^2.0.0",
+        "chalk": "^4.0.0",
+        "graceful-fs": "^4.2.9",
+        "micromatch": "^4.0.4",
+        "pretty-format": "^29.3.1",
+        "slash": "^3.0.0",
+        "stack-utils": "^2.0.3"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/jest-util": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-29.3.1.tgz",
+      "integrity": "sha512-7YOVZaiX7RJLv76ZfHt4nbNEzzTRiMW/IiOG7ZOKmTXmoGBxUDefgMAxQubu6WPVqP5zSzAdZG0FfLcC7HOIFQ==",
+      "dependencies": {
+        "@jest/types": "^29.3.1",
+        "@types/node": "*",
+        "chalk": "^4.0.0",
+        "ci-info": "^3.2.0",
+        "graceful-fs": "^4.2.9",
+        "picomatch": "^2.2.3"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/pretty-format": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.3.1.tgz",
+      "integrity": "sha512-FyLnmb1cYJV8biEIiRyzRFvs2lry7PPIvOqKVe1GCUEYg4YGmlx1qG9EJNMxArYm7piII4qb8UV1Pncq5dxmcg==",
+      "dependencies": {
+        "@jest/schemas": "^29.0.0",
+        "ansi-styles": "^5.0.0",
+        "react-is": "^18.0.0"
+      },
+      "engines": {
+        "node": "^14.15.0 || ^16.10.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/pretty-format/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@types/jest/node_modules/react-is": {
+      "version": "18.2.0",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
+      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
+    },
+    "node_modules/@types/jest/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.9",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.9.tgz",
@@ -4643,9 +4886,9 @@
       "devOptional": true
     },
     "node_modules/@types/node": {
-      "version": "14.0.22",
+      "version": "18.11.9",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-14.0.22.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.9.tgz",
-      "integrity": "sha512-emeGcJvdiZ4Z3ohbmw93E/64jRzUHAItSHt8nF7M4TGgQTiWqFVGB8KNpLGFmUHmHLvjvBgFwVlqNcq+VuGv9g=="
+      "integrity": "sha512-CRpX21/kGdzjOpFsZSkcrXMGIBWMGNIHXXBVFSH+ggkftxg+XYP20TESbh+zFvFj3EQOl5byk0HTRn1IL6hbqg=="
     },
     "node_modules/@types/normalize-package-data": {
       "version": "2.4.1",
@@ -4693,6 +4936,14 @@
         "csstype": "^3.0.2"
       }
     },
+    "node_modules/@types/react-dom": {
+      "version": "18.0.9",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.9.tgz",
+      "integrity": "sha512-qnVvHxASt/H7i+XG1U1xMiY5t+IHcPGUK7TDMDzom08xa7e86eCeKOiLZezwCKVxJn6NEiiy2ekgX8aQssjIKg==",
+      "dependencies": {
+        "@types/react": "*"
+      }
+    },
     "node_modules/@types/resolve": {
       "version": "1.17.1",
       "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz",
@@ -22950,6 +23201,102 @@
       "resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.1.tgz",
       "integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA=="
     },
+    "node_modules/ts-loader": {
+      "version": "9.4.1",
+      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-9.4.1.tgz",
+      "integrity": "sha512-384TYAqGs70rn9F0VBnh6BPTfhga7yFNdC5gXbQpDrBj9/KsT4iRkGqKXhziofHOlE2j6YEaiTYVGKKvPhGWvw==",
+      "dependencies": {
+        "chalk": "^4.1.0",
+        "enhanced-resolve": "^5.0.0",
+        "micromatch": "^4.0.0",
+        "semver": "^7.3.4"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "typescript": "*",
+        "webpack": "^5.0.0"
+      }
+    },
+    "node_modules/ts-loader/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/ts-loader/node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/ts-loader/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/ts-loader/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+    },
+    "node_modules/ts-loader/node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/ts-loader/node_modules/semver": {
+      "version": "7.3.8",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+      "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/ts-loader/node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/tsconfig-paths": {
       "version": "3.14.1",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz",
@@ -23065,7 +23412,6 @@
       "version": "4.9.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz",
       "integrity": "sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA==",
-      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -26737,6 +27083,21 @@
         "jest-mock": "^27.5.1"
       }
     },
+    "@jest/expect-utils": {
+      "version": "29.3.1",
+      "resolved": "https://registry.npmjs.org/@jest/expect-utils/-/expect-utils-29.3.1.tgz",
+      "integrity": "sha512-wlrznINZI5sMjwvUoLVk617ll/UYfGIZNxmbU+Pa7wmkL4vYzhV9R2pwVqUh4NWWuLQWkI8+8mOkxs//prKQ3g==",
+      "requires": {
+        "jest-get-type": "^29.2.0"
+      },
+      "dependencies": {
+        "jest-get-type": {
+          "version": "29.2.0",
+          "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-29.2.0.tgz",
+          "integrity": "sha512-uXNJlg8hKFEnDgFsrCjznB+sTxdkuqiCL6zMgA75qEbAJjJYTs9XPrvDctrEig2GDow22T/LvHgO57iJhXB/UA=="
+        }
+      }
+    },
     "@jest/fake-timers": {
       "version": "27.5.1",
       "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-27.5.1.tgz",
@@ -26841,7 +27202,6 @@
       "version": "29.0.0",
       "resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-29.0.0.tgz",
       "integrity": "sha512-3Ab5HgYIIAnS0HjqJHQYZS+zXc4tUmTmBH3z83ajI6afXp8X3ZtdLX+nXx+I7LNkJD7uN9LAVhgnjDgZa2z0kA==",
-      "dev": true,
       "requires": {
         "@sinclair/typebox": "^0.24.1"
       }
@@ -27318,8 +27678,7 @@
     "@sinclair/typebox": {
       "version": "0.24.51",
       "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.51.tgz",
-      "integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA==",
+      "integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA=="
-      "dev": true
     },
     "@sindresorhus/is": {
       "version": "0.7.0",
@@ -27790,6 +28149,176 @@
         "@types/istanbul-lib-report": "*"
       }
     },
+    "@types/jest": {
+      "version": "29.2.3",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-29.2.3.tgz",
+      "integrity": "sha512-6XwoEbmatfyoCjWRX7z0fKMmgYKe9+/HrviJ5k0X/tjJWHGAezZOfYaxqQKuzG/TvQyr+ktjm4jgbk0s4/oF2w==",
+      "requires": {
+        "expect": "^29.0.0",
+        "pretty-format": "^29.0.0"
+      },
+      "dependencies": {
+        "@jest/types": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/@jest/types/-/types-29.3.1.tgz",
+          "integrity": "sha512-d0S0jmmTpjnhCmNpApgX3jrUZgZ22ivKJRvL2lli5hpCRoNnp1f85r2/wpKfXuYu8E7Jjh1hGfhPyup1NM5AmA==",
+          "requires": {
+            "@jest/schemas": "^29.0.0",
+            "@types/istanbul-lib-coverage": "^2.0.0",
+            "@types/istanbul-reports": "^3.0.0",
+            "@types/node": "*",
+            "@types/yargs": "^17.0.8",
+            "chalk": "^4.0.0"
+          }
+        },
+        "@types/yargs": {
+          "version": "17.0.14",
+          "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.14.tgz",
+          "integrity": "sha512-9Pj7abXoW1RSTcZaL2Hk6G2XyLMlp5ECdVC/Zf2p/KBjC3srijLGgRAXOBjtFrJoIrvxdTKyKDA14bEcbxBaWw==",
+          "requires": {
+            "@types/yargs-parser": "*"
+          }
+        },
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.2",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        },
+        "diff-sequences": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-29.3.1.tgz",
+          "integrity": "sha512-hlM3QR272NXCi4pq+N4Kok4kOp6EsgOM3ZSpJI7Da3UAs+Ttsi8MRmB6trM/lhyzUxGfOgnpkHtgqm5Q/CTcfQ=="
+        },
+        "expect": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/expect/-/expect-29.3.1.tgz",
+          "integrity": "sha512-gGb1yTgU30Q0O/tQq+z30KBWv24ApkMgFUpvKBkyLUBL68Wv8dHdJxTBZFl/iT8K/bqDHvUYRH6IIN3rToopPA==",
+          "requires": {
+            "@jest/expect-utils": "^29.3.1",
+            "jest-get-type": "^29.2.0",
+            "jest-matcher-utils": "^29.3.1",
+            "jest-message-util": "^29.3.1",
+            "jest-util": "^29.3.1"
+          }
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ=="
+        },
+        "jest-diff": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-29.3.1.tgz",
+          "integrity": "sha512-vU8vyiO7568tmin2lA3r2DP8oRvzhvRcD4DjpXc6uGveQodyk7CKLhQlCSiwgx3g0pFaE88/KLZ0yaTWMc4Uiw==",
+          "requires": {
+            "chalk": "^4.0.0",
+            "diff-sequences": "^29.3.1",
+            "jest-get-type": "^29.2.0",
+            "pretty-format": "^29.3.1"
+          }
+        },
+        "jest-get-type": {
+          "version": "29.2.0",
+          "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-29.2.0.tgz",
+          "integrity": "sha512-uXNJlg8hKFEnDgFsrCjznB+sTxdkuqiCL6zMgA75qEbAJjJYTs9XPrvDctrEig2GDow22T/LvHgO57iJhXB/UA=="
+        },
+        "jest-matcher-utils": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-29.3.1.tgz",
+          "integrity": "sha512-fkRMZUAScup3txIKfMe3AIZZmPEjWEdsPJFK3AIy5qRohWqQFg1qrmKfYXR9qEkNc7OdAu2N4KPHibEmy4HPeQ==",
+          "requires": {
+            "chalk": "^4.0.0",
+            "jest-diff": "^29.3.1",
+            "jest-get-type": "^29.2.0",
+            "pretty-format": "^29.3.1"
+          }
+        },
+        "jest-message-util": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-29.3.1.tgz",
+          "integrity": "sha512-lMJTbgNcDm5z+6KDxWtqOFWlGQxD6XaYwBqHR8kmpkP+WWWG90I35kdtQHY67Ay5CSuydkTBbJG+tH9JShFCyA==",
+          "requires": {
+            "@babel/code-frame": "^7.12.13",
+            "@jest/types": "^29.3.1",
+            "@types/stack-utils": "^2.0.0",
+            "chalk": "^4.0.0",
+            "graceful-fs": "^4.2.9",
+            "micromatch": "^4.0.4",
+            "pretty-format": "^29.3.1",
+            "slash": "^3.0.0",
+            "stack-utils": "^2.0.3"
+          }
+        },
+        "jest-util": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-29.3.1.tgz",
+          "integrity": "sha512-7YOVZaiX7RJLv76ZfHt4nbNEzzTRiMW/IiOG7ZOKmTXmoGBxUDefgMAxQubu6WPVqP5zSzAdZG0FfLcC7HOIFQ==",
+          "requires": {
+            "@jest/types": "^29.3.1",
+            "@types/node": "*",
+            "chalk": "^4.0.0",
+            "ci-info": "^3.2.0",
+            "graceful-fs": "^4.2.9",
+            "picomatch": "^2.2.3"
+          }
+        },
+        "pretty-format": {
+          "version": "29.3.1",
+          "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-29.3.1.tgz",
+          "integrity": "sha512-FyLnmb1cYJV8biEIiRyzRFvs2lry7PPIvOqKVe1GCUEYg4YGmlx1qG9EJNMxArYm7piII4qb8UV1Pncq5dxmcg==",
+          "requires": {
+            "@jest/schemas": "^29.0.0",
+            "ansi-styles": "^5.0.0",
+            "react-is": "^18.0.0"
+          },
+          "dependencies": {
+            "ansi-styles": {
+              "version": "5.2.0",
+              "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+              "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA=="
+            }
+          }
+        },
+        "react-is": {
+          "version": "18.2.0",
+          "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
+          "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        }
+      }
+    },
     "@types/json-schema": {
       "version": "7.0.9",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.9.tgz",
@@ -27823,9 +28352,9 @@
       "devOptional": true
     },
     "@types/node": {
-      "version": "14.0.22",
+      "version": "18.11.9",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-14.0.22.tgz",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.9.tgz",
-      "integrity": "sha512-emeGcJvdiZ4Z3ohbmw93E/64jRzUHAItSHt8nF7M4TGgQTiWqFVGB8KNpLGFmUHmHLvjvBgFwVlqNcq+VuGv9g=="
+      "integrity": "sha512-CRpX21/kGdzjOpFsZSkcrXMGIBWMGNIHXXBVFSH+ggkftxg+XYP20TESbh+zFvFj3EQOl5byk0HTRn1IL6hbqg=="
     },
     "@types/normalize-package-data": {
       "version": "2.4.1",
@@ -27873,6 +28402,14 @@
         "csstype": "^3.0.2"
       }
     },
+    "@types/react-dom": {
+      "version": "18.0.9",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.9.tgz",
+      "integrity": "sha512-qnVvHxASt/H7i+XG1U1xMiY5t+IHcPGUK7TDMDzom08xa7e86eCeKOiLZezwCKVxJn6NEiiy2ekgX8aQssjIKg==",
+      "requires": {
+        "@types/react": "*"
+      }
+    },
     "@types/resolve": {
       "version": "1.17.1",
       "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz",
@@ -41235,6 +41772,70 @@
       "resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.1.tgz",
       "integrity": "sha512-c3zayb8/kWWpycWYg87P71E1S1ZL6b6IJxfb5fvsUgsf0S2MVGaDhDXXjDMpdCpfWXqptc+4mXwmiy1ypXqRAA=="
     },
+    "ts-loader": {
+      "version": "9.4.1",
+      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-9.4.1.tgz",
+      "integrity": "sha512-384TYAqGs70rn9F0VBnh6BPTfhga7yFNdC5gXbQpDrBj9/KsT4iRkGqKXhziofHOlE2j6YEaiTYVGKKvPhGWvw==",
+      "requires": {
+        "chalk": "^4.1.0",
+        "enhanced-resolve": "^5.0.0",
+        "micromatch": "^4.0.0",
+        "semver": "^7.3.4"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.2",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ=="
+        },
+        "semver": {
+          "version": "7.3.8",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+          "integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+          "requires": {
+            "lru-cache": "^6.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        }
+      }
+    },
     "tsconfig-paths": {
       "version": "3.14.1",
       "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz",
@@ -41324,8 +41925,7 @@
     "typescript": {
       "version": "4.9.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.3.tgz",
-      "integrity": "sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA==",
+      "integrity": "sha512-CIfGzTelbKNEnLpLdGFgdyKhG23CKdKgQPOBc+OUNrkJ2vr+KSzsSV5kq5iWhEQbok+quxgGzrAtGWCyU7tHnA=="
-      "peer": true
     },
     "unbox-primitive": {
       "version": "1.0.2",

package.json

@@ -6,13 +6,17 @@
   "scripts": {
     "build:dev": "webpack --mode development --config webpack.config.js",
     "build:prod": "webpack --mode development",
-    "run:dev": "webpack serve --mode development --config webpack.config.js --open",
+    "start:dev": "webpack serve --mode development --config webpack.config.js --open",
-    "run:prod": "webpack serve --mode production --open",
+    "start:prod": "webpack serve --mode production --open",
     "lint": "eslint --fix . && echo 'Lint complete.'"
   },
   "author": "Andres Alcocer",
   "license": "ISC",
   "dependencies": {
+    "@types/jest": "^29.2.3",
+    "@types/node": "^18.11.9",
+    "@types/react": "^18.0.25",
+    "@types/react-dom": "^18.0.9",
     "axios": "^1.2.0",
     "dotenv": "^16.0.3",
     "firebase": "^9.14.0",
@@ -26,7 +30,9 @@
     "redux": "^4.2.0",
     "redux-promise": "^0.6.0",
     "redux-thunk": "^2.4.2",
-    "swiper": "^8.4.5"
+    "swiper": "^8.4.5",
+    "ts-loader": "^9.4.1",
+    "typescript": "^4.9.3"
   },
   "devDependencies": {
     "@babel/core": "^7.20.2",

src/axios-movies.js

@@ -1,8 +0,0 @@
-import axios from 'axios';
-
-/** base url to make requests to the the movie database */
-const instance = axios.create({
-  baseURL: 'https://api.themoviedb.org/3',
-});
-
-export default instance;

src/axios-movies.ts

@@ -0,0 +1,8 @@
+import axios from 'axios'
+
+/** base url to make requests to the movie database */
+const instance = axios.create({
+  baseURL: 'https://api.themoviedb.org/3',
+})
+
+export default instance

src/getMovie.js

@@ -1,30 +0,0 @@
-import MovieGenre from './components/MovieGenre';
-import React from 'react';
-
-export function getMovieRows(movies, url) {
-  const movieRow = movies.map((movie) => {
-    let movieImageUrl =
-      'https://image.tmdb.org/t/p/w500/' + movie.backdrop_path;
-    if (
-      url === `/discover/tv?api_key=${process.env.API_KEY}&with_networks=213`
-    ) {
-      movieImageUrl =
-        'https://image.tmdb.org/t/p/original/' + movie.poster_path;
-    }
-
-    if (movie.poster_path && movie.backdrop_path !== null) {
-      const movieComponent = (
-        <MovieGenre
-          key={movie.id}
-          url={url}
-          posterUrl={movieImageUrl}
-          movie={movie}
-        />
-      );
-
-      return movieComponent;
-    }
-  });
-
-  return movieRow;
-}

src/index.html

@@ -1,16 +1,17 @@
 <!DOCTYPE html>
 <html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link
+      href="https://fonts.googleapis.com/css?family=Hind:400,500,700|Ramabhadra"
+      rel="stylesheet"
+    />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+    <title>Netflix Clone</title>
+  </head>
 
-<head>
+  <body>
-   <meta charset="UTF-8">
+    <div id="app"></div>
-   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  </body>
-   <link href="https://fonts.googleapis.com/css?family=Hind:400,500,700|Ramabhadra" rel="stylesheet">
+</html>
-   <meta http-equiv="X-UA-Compatible" content="ie=edge">
-   <title>Netflix Clone</title>
-</head>
-
-<body>
-   <div id="app"></div>
-</body>
-
-</html>

src/store/actions/index.ts

@@ -22,8 +22,8 @@ const media_type = {
   movie: 'movie',
 }
 
-export const fetchMovieDetails = (mediaType, mediaId) => {
+export const fetchMovieDetails = (mediaType: string, mediaId: string) => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       dispatch({ type: FETCH_MOVIE_DETAILS })
       let urlPath
@@ -31,7 +31,7 @@ export const fetchMovieDetails = (mediaType, mediaId) => {
         urlPath = `/movie/${mediaId}?api_key=${process.env.API_KEY}`
       if (mediaType === media_type.tv)
         urlPath = `/tv/${mediaId}?api_key=${process.env.API_KEY}`
-
+      console.log('media type', mediaType, urlPath)
       const request = await axios.get(urlPath)
       dispatch({ type: FETCH_MOVIE_DETAILS_SUCCESS, payload: request })
     } catch (error) {
@@ -41,8 +41,8 @@ export const fetchMovieDetails = (mediaType, mediaId) => {
   }
 }
 
-export const fetchSearchMovie = (searchTerm) => {
+export const fetchSearchMovie = (searchTerm: string) => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       dispatch({ type: FETCH_SEARCH_MOVIE })
       const request = await axios.get(
@@ -57,7 +57,7 @@ export const fetchSearchMovie = (searchTerm) => {
 }
 
 export const fetchNetflixOriginals = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/discover/tv?api_key=${process.env.API_KEY}&with_networks=213`
@@ -71,7 +71,7 @@ export const fetchNetflixOriginals = () => {
 }
 
 export const fetchTrending = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/trending/all/week?api_key=${process.env.API_KEY}&language=en-US`
@@ -82,7 +82,7 @@ export const fetchTrending = () => {
 }
 
 export const fetchTopRated = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/movie/top_rated?api_key=${process.env.API_KEY}&language=en-US`
@@ -93,7 +93,7 @@ export const fetchTopRated = () => {
 }
 
 export const fetchActionMovies = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/discover/movie?api_key=${process.env.API_KEY}&with_genres=28`
@@ -105,7 +105,7 @@ export const fetchActionMovies = () => {
 }
 
 export const fetchComedyMovies = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/discover/movie?api_key=${process.env.API_KEY}&with_genres=35`
@@ -117,7 +117,7 @@ export const fetchComedyMovies = () => {
 }
 
 export const fetchHorrorMovies = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/discover/movie?api_key=${process.env.API_KEY}&with_genres=27`
@@ -128,7 +128,7 @@ export const fetchHorrorMovies = () => {
 }
 
 export const fetchRomanceMovies = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/discover/movie?api_key=${process.env.API_KEY}&with_genres=10749`
@@ -139,7 +139,7 @@ export const fetchRomanceMovies = () => {
 }
 
 export const fetchDocumentaries = () => {
-  return async (dispatch) => {
+  return async (dispatch: any) => {
     try {
       const request = await axios.get(
         `/discover/movie?api_key=${process.env.API_KEY}&with_genres=99`

src/store/reducers/reducerActionMovies.js

@@ -1,11 +0,0 @@
-import { FETCH_ACTION_MOVIES } from '../actions/index';
-
-export default function (state = {}, action) {
-  switch (action.type) {
-    case FETCH_ACTION_MOVIES:
-      const data = action.payload.data.results;
-      return { ...state, data };
-    default:
-      return state;
-  }
-}

src/store/reducers/reducerActionMovies.ts

@@ -0,0 +1,11 @@
+import { FETCH_ACTION_MOVIES } from '../actions/index'
+
+export default function (state = {}, action: any) {
+  switch (action.type) {
+    case FETCH_ACTION_MOVIES:
+      const data = action.payload.data.results
+      return { ...state, data }
+    default:
+      return state
+  }
+}

src/store/reducers/reducerComedyMovies.js

@@ -1,11 +0,0 @@
-import { FETCH_COMEDY_MOVIES } from '../actions/index';
-
-export default function (state = {}, action) {
-  switch (action.type) {
-    case FETCH_COMEDY_MOVIES:
-      const data = action.payload.data.results;
-      return { ...state, data };
-    default:
-      return state;
-  }
-}

src/store/reducers/reducerComedyMovies.ts

@@ -0,0 +1,11 @@
+import { FETCH_COMEDY_MOVIES } from '../actions/index'
+
+export default function (state = {}, action: any) {
+  switch (action.type) {
+    case FETCH_COMEDY_MOVIES:
+      const data = action.payload.data.results
+      return { ...state, data }
+    default:
+      return state
+  }
+}

src/store/reducers/reducerDocumentary.js

@@ -1,11 +0,0 @@
-import { FETCH_DOCUMENTARIES } from '../actions/index';
-
-export default function (state = {}, action) {
-  switch (action.type) {
-    case FETCH_DOCUMENTARIES:
-      const data = action.payload.data.results;
-      return { ...state, data };
-    default:
-      return state;
-  }
-}

src/store/reducers/reducerDocumentary.ts

@@ -0,0 +1,11 @@
+import { FETCH_DOCUMENTARIES } from '../actions/index'
+
+export default function (state = {}, action: any) {
+  switch (action.type) {
+    case FETCH_DOCUMENTARIES:
+      const data = action.payload.data.results
+      return { ...state, data }
+    default:
+      return state
+  }
+}

src/store/reducers/reducerHorrorMovies.js

@@ -1,11 +0,0 @@
-import { FETCH_HORROR_MOVIES } from '../actions/index';
-
-export default function (state = {}, action) {
-  switch (action.type) {
-    case FETCH_HORROR_MOVIES:
-      const data = action.payload.data.results;
-      return { ...state, data };
-    default:
-      return state;
-  }
-}

src/store/reducers/reducerHorrorMovies.ts

@@ -0,0 +1,11 @@
+import { FETCH_HORROR_MOVIES } from '../actions/index'
+
+export default function (state = {}, action: any) {
+  switch (action.type) {
+    case FETCH_HORROR_MOVIES:
+      const data = action.payload.data.results
+      return { ...state, data }
+    default:
+      return state
+  }
+}

src/store/reducers/reducerMovieDetails.ts

@@ -4,12 +4,17 @@ import {
   FETCH_MOVIE_DETAILS_FAIL,
 } from '../actions/index'
 
-const initialState = {
+interface IInitialState {
+  isLoading: boolean
+  movieDetails: []
+}
+
+const initialState: IInitialState = {
   isLoading: false,
   movieDetails: [],
 }
 
-export default function (state = initialState, action) {
+export default function (state = initialState, action: any) {
   switch (action.type) {
     case FETCH_MOVIE_DETAILS:
       return { ...state, isLoading: true }

src/store/reducers/reducerNetflixOriginals.ts

@@ -1,6 +1,6 @@
 import { FETCH_NETFLIX_ORIGINALS } from '../actions/index'
 
-export default function (state = {}, action) {
+export default function (state = {}, action: any) {
   switch (action.type) {
     case FETCH_NETFLIX_ORIGINALS:
       const data = action.payload.data.results

src/store/reducers/reducerRomanceMovies.js

@@ -1,11 +0,0 @@
-import { FETCH_ROMANCE_MOVIES } from '../actions/index';
-
-export default function (state = {}, action) {
-  switch (action.type) {
-    case FETCH_ROMANCE_MOVIES:
-      const data = action.payload.data.results;
-      return { ...state, data };
-    default:
-      return state;
-  }
-}

src/store/reducers/reducerRomanceMovies.ts

@@ -0,0 +1,11 @@
+import { FETCH_ROMANCE_MOVIES } from '../actions/index'
+
+export default function (state = {}, action: any) {
+  switch (action.type) {
+    case FETCH_ROMANCE_MOVIES:
+      const data = action.payload.data.results
+      return { ...state, data }
+    default:
+      return state
+  }
+}

src/store/reducers/reducerSearchMovie.ts

@@ -4,12 +4,17 @@ import {
   FETCH_SEARCH_MOVIE_SUCCESS,
 } from '../actions/index'
 
-const initialState = {
+interface IInitialState {
+  isLoading: boolean
+  searchResults: []
+}
+
+const initialState: IInitialState = {
   isLoading: false,
   searchResults: [],
 }
 
-export default function (state = initialState, action) {
+export default function (state = initialState, action: any) {
   switch (action.type) {
     case FETCH_SEARCH_MOVIE:
       return { ...state, isLoading: true }

src/store/reducers/reducerTopRated.js

@@ -1,11 +0,0 @@
-import { FETCH_TOP_RATED } from '../actions/index';
-
-export default function (state = {}, action) {
-  switch (action.type) {
-    case FETCH_TOP_RATED:
-      const data = action.payload.data.results;
-      return { ...state, data };
-    default:
-      return state;
-  }
-}

src/store/reducers/reducerTopRated.ts

@@ -0,0 +1,11 @@
+import { FETCH_TOP_RATED } from '../actions/index'
+
+export default function (state = {}, action: any) {
+  switch (action.type) {
+    case FETCH_TOP_RATED:
+      const data = action.payload.data.results
+      return { ...state, data }
+    default:
+      return state
+  }
+}

src/store/reducers/reducerTrending.js

@@ -1,11 +0,0 @@
-import { FETCH_TRENDING } from '../actions/index';
-
-export default function (state = {}, action) {
-  switch (action.type) {
-    case FETCH_TRENDING:
-      const data = action.payload.data.results;
-      return { ...state, data };
-    default:
-      return state;
-  }
-}

src/store/reducers/reducerTrending.ts

@@ -0,0 +1,11 @@
+import { FETCH_TRENDING } from '../actions/index'
+
+export default function (state = {}, action: any) {
+  switch (action.type) {
+    case FETCH_TRENDING:
+      const data = action.payload.data.results
+      return { ...state, data }
+    default:
+      return state
+  }
+}

tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "outDir": "./dist/",
+    "noImplicitAny": true,
+    "module": "es6",
+    "target": "es5",
+    "jsx": "react",
+    "sourceMap": true,
+    "allowJs": true,
+    "moduleResolution": "node",
+    "typeRoots": ["types/", "node_modules/@types"],
+    "allowSyntheticDefaultImports": true
+  }
+}

types/custom.d.ts

@@ -0,0 +1,4 @@
+declare module '*.svg' {
+  const content: any
+  export default content
+}

webpack.config.js

@@ -23,6 +23,9 @@ module.exports = () => {
       path: path.resolve(__dirname, 'dist'),
       clean: true,
     },
+    resolve: {
+      extensions: ['.tsx', '.ts', '.js'],
+    },
     optimization: {
       runtimeChunk: 'single',
       moduleIds: 'deterministic',
@@ -82,6 +85,11 @@ module.exports = () => {
             loader: 'babel-loader',
           },
         },
+        {
+          test: /\.tsx?$/,
+          use: 'ts-loader',
+          exclude: /node_modules/,
+        },
         {
           test: /\.svg$/,
           exclude: /node_modules/,