diff --git a/App.tsx b/App.tsx
index 7d62845..386e4f2 100644
--- a/App.tsx
+++ b/App.tsx
@@ -6,6 +6,8 @@ import Navigation from './navigation';
import {View, Text, ScrollView, FlatList} from "react-native";
import {useEffect, useState} from "react";
import * as React from "react";
+import {Provider} from "react-redux";
+import store from "./redux/store"
export default function App() {
const isLoadingComplete = useCachedResources();
@@ -16,10 +18,12 @@ export default function App() {
return null;
} else {
return (
-
-
-
-
+
+
+
+
+
+
);
}
}
diff --git a/components/Movie.tsx b/components/Movie.tsx
index 463f519..c9c9db1 100644
--- a/components/Movie.tsx
+++ b/components/Movie.tsx
@@ -1,4 +1,4 @@
-import apiTMBD from "../api/tmdb";
+
class Movie {
id: string
@@ -6,16 +6,12 @@ class Movie {
poster_path: string
runtime: number
vote_average: number
-
- director: string | undefined
-
- constructor(id: string, original_title: string, poster_path: string, runtime: number, vote_average: number, director: string | undefined) {
+ constructor(id: string, original_title: string, poster_path: string, runtime: number, vote_average: number) {
this.id = id;
this.original_title = original_title;
this.poster_path = poster_path;
this.runtime = runtime;
this.vote_average = vote_average;
- this.director = director;
}
diff --git a/components/MovieList.tsx b/components/MovieList.tsx
index f171461..074b0d7 100644
--- a/components/MovieList.tsx
+++ b/components/MovieList.tsx
@@ -2,7 +2,7 @@ import {useEffect, useState} from "react";
import {FlatList, View} from "react-native";
import {ListWidget} from "./ListWidget";
import axios from "axios";
-import apiTMBD from "../api/tmdb";
+import apiTMBD from "../services/tmdb";
interface idMovie {
diff --git a/package-lock.json b/package-lock.json
index 5380fff..f903fc9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -18,6 +18,7 @@
"@react-navigation/native": "^6.0.2",
"@react-navigation/native-stack": "^6.1.0",
"@reacticons/ionicons": "^6.0.4",
+ "@reduxjs/toolkit": "^1.9.2",
"axios": "^1.3.0",
"expo": "~47.0.12",
"expo-asset": "~8.7.0",
@@ -38,6 +39,8 @@
"react-native-screens": "~3.18.0",
"react-native-svg": "^13.7.0",
"react-native-web": "~0.18.9",
+ "react-redux": "^8.0.5",
+ "redux": "^4.2.1",
"rive-react-native": "^3.0.41"
},
"devDependencies": {
@@ -5422,6 +5425,29 @@
"resolved": "https://registry.npmjs.org/@reacticons/ionicons/-/ionicons-6.0.4.tgz",
"integrity": "sha512-FN4/D6a/kS2dEMwVltAGCKiYArDESGW1fgsV2bgz2ZHFAlmBF7o2p7Ckr+clOHzIEg1odWm+gdc+DBtYc80ENQ=="
},
+ "node_modules/@reduxjs/toolkit": {
+ "version": "1.9.2",
+ "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.2.tgz",
+ "integrity": "sha512-5ZAZ7hwAKWSii5T6NTPmgIBUqyVdlDs+6JjThz6J6dmHLDm6zCzv2OjHIFAi3Vvs1qjmXU0bm6eBojukYXjVMQ==",
+ "dependencies": {
+ "immer": "^9.0.16",
+ "redux": "^4.2.0",
+ "redux-thunk": "^2.4.2",
+ "reselect": "^4.1.7"
+ },
+ "peerDependencies": {
+ "react": "^16.9.0 || ^17.0.0 || ^18",
+ "react-redux": "^7.2.1 || ^8.0.2"
+ },
+ "peerDependenciesMeta": {
+ "react": {
+ "optional": true
+ },
+ "react-redux": {
+ "optional": true
+ }
+ }
+ },
"node_modules/@segment/loosely-validate-event": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/@segment/loosely-validate-event/-/loosely-validate-event-2.0.0.tgz",
@@ -5531,6 +5557,15 @@
"@types/node": "*"
}
},
+ "node_modules/@types/hoist-non-react-statics": {
+ "version": "3.3.1",
+ "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
+ "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+ "dependencies": {
+ "@types/react": "*",
+ "hoist-non-react-statics": "^3.3.0"
+ }
+ },
"node_modules/@types/istanbul-lib-coverage": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@@ -5572,8 +5607,7 @@
"node_modules/@types/prop-types": {
"version": "15.7.5",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
- "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==",
- "dev": true
+ "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
},
"node_modules/@types/qs": {
"version": "6.9.7",
@@ -5584,7 +5618,6 @@
"version": "18.0.27",
"resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.27.tgz",
"integrity": "sha512-3vtRKHgVxu3Jp9t718R9BuzoD4NcQ8YJ5XRzsSKxNDiDonD2MXIT1TmSkenxuCycZJoQT5d2vE8LwWJxBC1gmA==",
- "dev": true,
"dependencies": {
"@types/prop-types": "*",
"@types/scheduler": "*",
@@ -5603,8 +5636,7 @@
"node_modules/@types/scheduler": {
"version": "0.16.2",
"resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
- "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==",
- "dev": true
+ "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
},
"node_modules/@types/stack-utils": {
"version": "2.0.1",
@@ -5612,6 +5644,11 @@
"integrity": "sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==",
"dev": true
},
+ "node_modules/@types/use-sync-external-store": {
+ "version": "0.0.3",
+ "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz",
+ "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
+ },
"node_modules/@types/yargs": {
"version": "15.0.15",
"resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-15.0.15.tgz",
@@ -7443,8 +7480,7 @@
"node_modules/csstype": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
- "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
- "dev": true
+ "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw=="
},
"node_modules/dag-map": {
"version": "1.0.2",
@@ -9205,6 +9241,14 @@
"node": ">= 8"
}
},
+ "node_modules/hoist-non-react-statics": {
+ "version": "3.3.2",
+ "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+ "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+ "dependencies": {
+ "react-is": "^16.7.0"
+ }
+ },
"node_modules/hosted-git-info": {
"version": "3.0.8",
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-3.0.8.tgz",
@@ -9367,6 +9411,15 @@
"node": ">=4.0"
}
},
+ "node_modules/immer": {
+ "version": "9.0.19",
+ "resolved": "https://registry.npmjs.org/immer/-/immer-9.0.19.tgz",
+ "integrity": "sha512-eY+Y0qcsB4TZKwgQzLaE/lqYMlKhv5J9dyd2RhhtGhNo2njPXDqU9XPfcNfa3MIDsdtZt5KlkIsirlo4dHsWdQ==",
+ "funding": {
+ "type": "opencollective",
+ "url": "https://opencollective.com/immer"
+ }
+ },
"node_modules/import-fresh": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-2.0.0.tgz",
@@ -14990,6 +15043,49 @@
"async-limiter": "~1.0.0"
}
},
+ "node_modules/react-redux": {
+ "version": "8.0.5",
+ "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.0.5.tgz",
+ "integrity": "sha512-Q2f6fCKxPFpkXt1qNRZdEDLlScsDWyrgSj0mliK59qU6W5gvBiKkdMEG2lJzhd1rCctf0hb6EtePPLZ2e0m1uw==",
+ "dependencies": {
+ "@babel/runtime": "^7.12.1",
+ "@types/hoist-non-react-statics": "^3.3.1",
+ "@types/use-sync-external-store": "^0.0.3",
+ "hoist-non-react-statics": "^3.3.2",
+ "react-is": "^18.0.0",
+ "use-sync-external-store": "^1.0.0"
+ },
+ "peerDependencies": {
+ "@types/react": "^16.8 || ^17.0 || ^18.0",
+ "@types/react-dom": "^16.8 || ^17.0 || ^18.0",
+ "react": "^16.8 || ^17.0 || ^18.0",
+ "react-dom": "^16.8 || ^17.0 || ^18.0",
+ "react-native": ">=0.59",
+ "redux": "^4"
+ },
+ "peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ },
+ "@types/react-dom": {
+ "optional": true
+ },
+ "react-dom": {
+ "optional": true
+ },
+ "react-native": {
+ "optional": true
+ },
+ "redux": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/react-redux/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/react-refresh": {
"version": "0.4.3",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz",
@@ -15192,6 +15288,22 @@
"node": ">= 4"
}
},
+ "node_modules/redux": {
+ "version": "4.2.1",
+ "resolved": "https://registry.npmjs.org/redux/-/redux-4.2.1.tgz",
+ "integrity": "sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==",
+ "dependencies": {
+ "@babel/runtime": "^7.9.2"
+ }
+ },
+ "node_modules/redux-thunk": {
+ "version": "2.4.2",
+ "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.4.2.tgz",
+ "integrity": "sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q==",
+ "peerDependencies": {
+ "redux": "^4"
+ }
+ },
"node_modules/regenerate": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
@@ -21689,6 +21801,17 @@
"resolved": "https://registry.npmjs.org/@reacticons/ionicons/-/ionicons-6.0.4.tgz",
"integrity": "sha512-FN4/D6a/kS2dEMwVltAGCKiYArDESGW1fgsV2bgz2ZHFAlmBF7o2p7Ckr+clOHzIEg1odWm+gdc+DBtYc80ENQ=="
},
+ "@reduxjs/toolkit": {
+ "version": "1.9.2",
+ "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.2.tgz",
+ "integrity": "sha512-5ZAZ7hwAKWSii5T6NTPmgIBUqyVdlDs+6JjThz6J6dmHLDm6zCzv2OjHIFAi3Vvs1qjmXU0bm6eBojukYXjVMQ==",
+ "requires": {
+ "immer": "^9.0.16",
+ "redux": "^4.2.0",
+ "redux-thunk": "^2.4.2",
+ "reselect": "^4.1.7"
+ }
+ },
"@segment/loosely-validate-event": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/@segment/loosely-validate-event/-/loosely-validate-event-2.0.0.tgz",
@@ -21795,6 +21918,15 @@
"@types/node": "*"
}
},
+ "@types/hoist-non-react-statics": {
+ "version": "3.3.1",
+ "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
+ "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+ "requires": {
+ "@types/react": "*",
+ "hoist-non-react-statics": "^3.3.0"
+ }
+ },
"@types/istanbul-lib-coverage": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz",
@@ -21836,8 +21968,7 @@
"@types/prop-types": {
"version": "15.7.5",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
- "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==",
- "dev": true
+ "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
},
"@types/qs": {
"version": "6.9.7",
@@ -21848,7 +21979,6 @@
"version": "18.0.27",
"resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.27.tgz",
"integrity": "sha512-3vtRKHgVxu3Jp9t718R9BuzoD4NcQ8YJ5XRzsSKxNDiDonD2MXIT1TmSkenxuCycZJoQT5d2vE8LwWJxBC1gmA==",
- "dev": true,
"requires": {
"@types/prop-types": "*",
"@types/scheduler": "*",
@@ -21867,8 +21997,7 @@
"@types/scheduler": {
"version": "0.16.2",
"resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
- "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==",
- "dev": true
+ "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
},
"@types/stack-utils": {
"version": "2.0.1",
@@ -21876,6 +22005,11 @@
"integrity": "sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw==",
"dev": true
},
+ "@types/use-sync-external-store": {
+ "version": "0.0.3",
+ "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz",
+ "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
+ },
"@types/yargs": {
"version": "15.0.15",
"resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-15.0.15.tgz",
@@ -23307,8 +23441,7 @@
"csstype": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
- "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
- "dev": true
+ "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw=="
},
"dag-map": {
"version": "1.0.2",
@@ -24632,6 +24765,14 @@
}
}
},
+ "hoist-non-react-statics": {
+ "version": "3.3.2",
+ "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+ "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+ "requires": {
+ "react-is": "^16.7.0"
+ }
+ },
"hosted-git-info": {
"version": "3.0.8",
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-3.0.8.tgz",
@@ -24748,6 +24889,11 @@
"resolved": "https://registry.npmjs.org/image-size/-/image-size-0.6.3.tgz",
"integrity": "sha512-47xSUiQioGaB96nqtp5/q55m0aBQSQdyIloMOc/x+QVTDZLNmXE892IIDrJ0hM1A5vcNUDD5tDffkSP5lCaIIA=="
},
+ "immer": {
+ "version": "9.0.19",
+ "resolved": "https://registry.npmjs.org/immer/-/immer-9.0.19.tgz",
+ "integrity": "sha512-eY+Y0qcsB4TZKwgQzLaE/lqYMlKhv5J9dyd2RhhtGhNo2njPXDqU9XPfcNfa3MIDsdtZt5KlkIsirlo4dHsWdQ=="
+ },
"import-fresh": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-2.0.0.tgz",
@@ -29072,6 +29218,26 @@
"styleq": "^0.1.2"
}
},
+ "react-redux": {
+ "version": "8.0.5",
+ "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-8.0.5.tgz",
+ "integrity": "sha512-Q2f6fCKxPFpkXt1qNRZdEDLlScsDWyrgSj0mliK59qU6W5gvBiKkdMEG2lJzhd1rCctf0hb6EtePPLZ2e0m1uw==",
+ "requires": {
+ "@babel/runtime": "^7.12.1",
+ "@types/hoist-non-react-statics": "^3.3.1",
+ "@types/use-sync-external-store": "^0.0.3",
+ "hoist-non-react-statics": "^3.3.2",
+ "react-is": "^18.0.0",
+ "use-sync-external-store": "^1.0.0"
+ },
+ "dependencies": {
+ "react-is": {
+ "version": "18.2.0",
+ "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
+ "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
+ }
+ }
+ },
"react-refresh": {
"version": "0.4.3",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz",
@@ -29229,6 +29395,20 @@
"tslib": "^2.0.1"
}
},
+ "redux": {
+ "version": "4.2.1",
+ "resolved": "https://registry.npmjs.org/redux/-/redux-4.2.1.tgz",
+ "integrity": "sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==",
+ "requires": {
+ "@babel/runtime": "^7.9.2"
+ }
+ },
+ "redux-thunk": {
+ "version": "2.4.2",
+ "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.4.2.tgz",
+ "integrity": "sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q==",
+ "requires": {}
+ },
"regenerate": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
diff --git a/package.json b/package.json
index 7d7888a..f096450 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
"@react-navigation/native": "^6.0.2",
"@react-navigation/native-stack": "^6.1.0",
"@reacticons/ionicons": "^6.0.4",
+ "@reduxjs/toolkit": "^1.9.2",
"axios": "^1.3.0",
"expo": "~47.0.12",
"expo-asset": "~8.7.0",
@@ -43,6 +44,8 @@
"react-native-screens": "~3.18.0",
"react-native-svg": "^13.7.0",
"react-native-web": "~0.18.9",
+ "react-redux": "^8.0.5",
+ "redux": "^4.2.1",
"rive-react-native": "^3.0.41"
},
"devDependencies": {
diff --git a/redux/actions/actionGetTrendingMovie.ts b/redux/actions/actionGetTrendingMovie.ts
new file mode 100644
index 0000000..89b3e4e
--- /dev/null
+++ b/redux/actions/actionGetTrendingMovie.ts
@@ -0,0 +1,10 @@
+import {FETCH_TRENDINGMOVIE} from '../constants';
+import Movie from "../../components/Movie";
+
+export const setTrendingMovieList = (trendingList: Movie[])=> {
+ return {
+ type: FETCH_TRENDINGMOVIE,
+ payload: trendingList,
+
+ };
+}
diff --git a/redux/constants.ts b/redux/constants.ts
index e69de29..6b3735e 100644
--- a/redux/constants.ts
+++ b/redux/constants.ts
@@ -0,0 +1 @@
+export const FETCH_TRENDINGMOVIE : string = "FETCH_TRENDINGMOVIE";
\ No newline at end of file
diff --git a/redux/reducers/appReducer.ts b/redux/reducers/appReducer.ts
new file mode 100644
index 0000000..5ca8d88
--- /dev/null
+++ b/redux/reducers/appReducer.ts
@@ -0,0 +1,19 @@
+import {FETCH_TRENDINGMOVIE} from "../constants";
+
+
+const initialState = {
+ trendingMovies : [],
+ favoriteMovies : [],
+ watchLaterMovies : [],
+}
+
+// @ts-ignore
+export default appReducer = (state = initialState, action)=> {
+ switch (action.type){
+ case FETCH_TRENDINGMOVIE:
+ // @ts-ignore
+ return {...state, trendingMovies: action.payload};
+ default:
+ return state;
+ }
+}
\ No newline at end of file
diff --git a/redux/reducers/appReducers.ts b/redux/reducers/appReducers.ts
deleted file mode 100644
index e69de29..0000000
diff --git a/redux/store.ts b/redux/store.ts
deleted file mode 100644
index e69de29..0000000
diff --git a/redux/store.tsx b/redux/store.tsx
new file mode 100644
index 0000000..09fd4f2
--- /dev/null
+++ b/redux/store.tsx
@@ -0,0 +1,14 @@
+import { configureStore } from '@reduxjs/toolkit'
+import appReducer from "./reducers/appReducer";
+
+const reducer = {
+ appReducer: appReducer,
+}
+
+
+const store= configureStore({
+ // @ts-ignore
+ reducer,
+},);
+
+export default store;
\ No newline at end of file
diff --git a/screens/FavoriteScreen.tsx b/screens/FavoriteScreen.tsx
index 0989dd8..f94d6e2 100644
--- a/screens/FavoriteScreen.tsx
+++ b/screens/FavoriteScreen.tsx
@@ -20,7 +20,7 @@ export default function FavoriteScreen({ navigation }: RootTabScreenProps<'Favor
-
+
) {
const insets = useSafeAreaInsets();
-
const styles = StyleSheet.create({
container: {
flex: 1,
@@ -35,6 +37,23 @@ export default function WatchLaterScreen({ navigation }: RootTabScreenProps<'Wat
},
});
+
+ // @ts-ignore
+ const nList = useSelector(state => state.appReducer.trendingMovies);
+
+ const dispatch = useDispatch();
+
+ useEffect(()=>{
+ const loadTrendingMovie = async () => {
+ // @ts-ignore
+ await dispatch(getTrendingMovieList());
+ };
+ loadTrendingMovie();
+ }, [dispatch]);
+
+
+
+
return (
@@ -45,23 +64,14 @@ export default function WatchLaterScreen({ navigation }: RootTabScreenProps<'Wat
-
+
}
+ data={nList}
+ renderItem={({item}) => }
/>
);
@@ -70,13 +80,25 @@ export default function WatchLaterScreen({ navigation }: RootTabScreenProps<'Wat
type ListWidgetProps = {
- name : String
+ imageURL: string
+ name: String
+
+ runtime: number
+
+ director: string
}
export function ListWidget(props: ListWidgetProps) {
const insets = useSafeAreaInsets();
+ function formatTime(time: number) {
+ console.log(time);
+ const hours = Math.floor(time / 60);
+ const minutes = time % 60;
+ return `${hours}h ${minutes < 10 ? `0${minutes}` : minutes}m`;
+ }
+
const styles = StyleSheet.create({
filmCard: {
width: 70,
@@ -87,21 +109,39 @@ export function ListWidget(props: ListWidgetProps) {
},
});
return (
-
-
-
- {props.name}
- {props.name}
-
-
-
-
+
+
+
+ {props.name}
+ {formatTime(props.runtime)}
+
+
+
+
);
diff --git a/services/api.tsx b/services/api.tsx
new file mode 100644
index 0000000..078d23f
--- /dev/null
+++ b/services/api.tsx
@@ -0,0 +1,23 @@
+import Config from "../constants/config";
+import Movie from "../components/Movie";
+import {setTrendingMovieList} from "../redux/actions/actionGetTrendingMovie";
+
+
+
+
+export const getTrendingMovieList = () =>{
+ // @ts-ignore
+ return async dispatch => {
+ try {
+ const trendingMoviePromise = await fetch(Config.base_url + "trending/all/day?api_key=" + Config.api_key);
+
+ const trendingListJson = await trendingMoviePromise.json();
+ console.log('json----------',trendingListJson);
+ // @ts-ignore
+ const trendingList: Movie[] = trendingListJson.results.map(elt => new Movie(elt["id"],elt["original_title"],elt["poster_path"], elt["runtime"],elt["vote_average"]));
+ dispatch(setTrendingMovieList(trendingList));
+ } catch (error) {
+ console.log('Error----------',error);
+ }
+ }
+}
\ No newline at end of file