diff --git a/AsyncStorage/likeArtistStorage.tsx b/AsyncStorage/likeArtistStorage.tsx
new file mode 100644
index 0000000..f40ca0a
--- /dev/null
+++ b/AsyncStorage/likeArtistStorage.tsx
@@ -0,0 +1,54 @@
+import AsyncStorage from "@react-native-async-storage/async-storage";
+import {Artist} from "../Model/Artist";
+
+export const storeLikeArtists = async (artistsList) => {
+ try {
+ const jsonArtistsList = JSON.stringify(artistsList);
+ await AsyncStorage.setItem('likeArtists', jsonArtistsList);
+ } catch (e) {
+ console.log("An error occurred while storing artists list", e);
+ }
+};
+
+export const getLikeArtist = async () => {
+ try {
+ const jsonArtistsList = await AsyncStorage.getItem('likeArtists');
+ const artistsList = jsonArtistsList !== null ? JSON.parse(jsonArtistsList) : [];
+ console.log("get")
+ artistsList.map(artist => console.log(artist, artist._id,artist._name,artist._image));
+ return artistsList.map(artist => new Artist(artist._id,artist._name,artist._image));
+ } catch (e) {
+ console.log("An error occurred while retrieving artists list", e);
+ return [];
+ }
+}
+export const getLikeArtistJson = async () => {
+ try {
+ const jsonArtistsList = await AsyncStorage.getItem('likeArtists');
+ return jsonArtistsList !== null ? JSON.parse(jsonArtistsList) : [];
+ } catch (e) {
+ console.log("An error occurred while retrieving artists list", e);
+ return [];
+ }
+}
+
+export const addLikeArtist = async (artist) => {
+ try {
+ const artistsList = await getLikeArtistJson();
+ artistsList.push(artist);
+ await storeLikeArtists(artistsList);
+ } catch (e) {
+ console.log("An error occurred while adding artist to the list", e);
+ }
+};
+
+
+export const removeArtist = async (artistId) => {
+ try {
+ let artistsList = await getLikeArtistJson();
+ artistsList = artistsList.filter(artist => artist.id !== artistId);
+ await storeLikeArtists(artistsList);
+ } catch (e) {
+ console.log("An error occurred while removing artist from the list", e);
+ }
+}
\ No newline at end of file
diff --git a/Model/Artist.tsx b/Model/Artist.tsx
index f7dbf80..9aa4619 100644
--- a/Model/Artist.tsx
+++ b/Model/Artist.tsx
@@ -4,14 +4,11 @@ export class Artist {
private _id: number
private _name: string;
private _image: string;
- private _bio: string;
- private _listAlbum: Album[];
- constructor(id: number, name: string, image: string,bio: string) {
+ constructor(id: number, name: string, image: string) {
this._id = id;
this._name = name;
this._image = image;
- this._bio = bio;
}
get id(): number{
@@ -33,19 +30,4 @@ export class Artist {
this._image = value;
}
- get bio(): string {
- return this._bio;
- }
-
- set bio(value: string) {
- this._bio = value;
- }
-
- get listAlbum(): Album[] {
- return this._listAlbum;
- }
-
- set listAlbum(value: Album[]) {
- this._listAlbum = value;
- }
}
\ No newline at end of file
diff --git a/componente/Album/AlbumCard.tsx b/componente/Album/AlbumCard.tsx
index 2f2a6a6..d467b98 100644
--- a/componente/Album/AlbumCard.tsx
+++ b/componente/Album/AlbumCard.tsx
@@ -2,31 +2,43 @@
import React from 'react';
import {View, Image, Text, StyleSheet} from 'react-native';
+
+
+
const AlbumCard = ({ album }) => {
- console.log(album);
+ const date = new Date(album.date);
+ const formattedDate = date.toLocaleDateString('en-US', { month: 'long', day: 'numeric', year: 'numeric' });
+
return (
- {album.name}
+
+ {album.name}
+ {formattedDate}
+
);
};
const styles = StyleSheet.create({
container: {
+ margin: 10,
flexDirection: 'row',
alignItems: 'center',
- margin: 10,
},
- image: {
- width: 50,
- height: 50,
- marginRight: 10,
+ containerText:{
+ flexDirection: 'column',
+ alignItems: 'flex-start'
},
name: {
fontSize: 20,
fontWeight: 'bold',
},
+ image: {
+ width: 50,
+ height: 50,
+ marginRight: 10,
+ },
});
export default AlbumCard;
diff --git a/componente/Album/AlbumList.tsx b/componente/Album/AlbumList.tsx
index ec9fdbe..3dd4b4d 100644
--- a/componente/Album/AlbumList.tsx
+++ b/componente/Album/AlbumList.tsx
@@ -5,20 +5,19 @@ import AlbumCard from "./AlbumCard";
const ArtistList = ({ALBUM_LIST}) => {
return (
- (
-
+ (
+
)}
- keyExtractor={(item) => item.name}
/>
+
);
};
const styles = StyleSheet.create({
container: {
- height: 400,
+ width: '100%',
+ height: '70%',
}
});
diff --git a/componente/Artist/ArtistCard.tsx b/componente/Artist/ArtistCard.tsx
index ceca7a4..4a885d0 100644
--- a/componente/Artist/ArtistCard.tsx
+++ b/componente/Artist/ArtistCard.tsx
@@ -1,17 +1,15 @@
-// @ts-ignore
import React from 'react';
-import {View, Image, Text, StyleSheet, TouchableNativeFeedback} from 'react-native';
+import {View, Image, Text, StyleSheet, TouchableNativeFeedback, TouchableOpacity} from 'react-native';
const ArtistCard = ({ navigation, item }) => {
-
+ //console.log(item)
return (
- { navigation.navigate("ArtistDetail",{"artist":item});}}>
+ { console.log("ici");navigation.navigate("ArtistDetail",{"artist":item});console.log("non ici");}}>
{item.name}
-
-
+
);
};
diff --git a/componente/Artist/ArtistList.tsx b/componente/Artist/ArtistList.tsx
index 9a3b342..276edc5 100644
--- a/componente/Artist/ArtistList.tsx
+++ b/componente/Artist/ArtistList.tsx
@@ -1,38 +1,55 @@
-import React from "react";
-import {FlatList, ScrollView} from "react-native";
+import React, {useEffect, useState} from "react";
+import {FlatList, Text, View} from "react-native";
import {useSelector} from 'react-redux';
-import {useEffect} from 'react';
-
import ArtistCard from "./ArtistCard";
+import {getLikeArtist} from './../../AsyncStorage/likeArtistStorage'
+
+const ArtistList = ({ navigation, type }) => {
+ const [artistsList, setArtistsList] = useState([]);
+
+ const artists = useSelector((state) => {
+ if (type === "search") {
+ // @ts-ignore
+ return state.ReducerArtist.artistsSearch;
+ } else if (type === "liked") {
+ // @ts-ignore
+ return state.ReducerArtist.likedArtists;
+ }
+ return [];
+ });
-
-const ArtistList = ({navigation, type}) => {
- // @ts-ignore
- let ARTISTS_LIST = useSelector((state) => state.ReducerArtist.artists);
- if(type == "search") {
- // @ts-ignore
- ARTISTS_LIST = useSelector((state) => state.ReducerArtist.artistsSearch);
- }
+ useEffect(() => {
+ if (type === "liked") {
+ async function fetchLikedArtists() {
+ const likedArtists = await getLikeArtist();
+ setArtistsList(likedArtists);
+ }
+ fetchLikedArtists();
+ }
+ }, [type]);
useEffect(() => {
- console.log('ARTISTS_LIST has changed:', ARTISTS_LIST);
- }, [ARTISTS_LIST]);
+ setArtistsList(artists);
+ }, [artists]);
+
+ console.log('artistsList',artistsList)
+ if(artistsList == undefined){
+ console.log("Loading")
+ return Loading...
+ }
+ console.log('pas Loading')
- console.log("----")
- console.log(ARTISTS_LIST)
return (
-
+
(
-
+
)}
- keyExtractor={(item) => item.name}
+ keyExtractor={(item) => item.id}
/>
-
+
);
-
-
};
export default ArtistList;
diff --git a/componente/Artist/ArtistePage.tsx b/componente/Artist/ArtistePage.tsx
index ac7008c..f286a46 100644
--- a/componente/Artist/ArtistePage.tsx
+++ b/componente/Artist/ArtistePage.tsx
@@ -1,40 +1,67 @@
-// @ts-ignore
-import React, {useEffect} from 'react';
+import React, {useEffect, useState} from 'react';
import { View, Image, Text, StyleSheet } from 'react-native';
import {getAlbumByArtist, getArtistInfo} from "../../redux/actions/action";
import {useDispatch} from "react-redux";
-import ArtistList from "../Album/AlbumList";
+import AlbumList from "../Album/AlbumList";
+import LikeButton from "./likeButton";
export default function ArtistPage({ route }) {
+ const [bio, setBio] = useState("");
+ const [albumList, setAlbumList] = useState("");
const artist = route.params.artist;
const dispatch = useDispatch();
useEffect(() => {
const load = async () => {
// @ts-ignore
- await dispatch(getArtistInfo(artist));
+ const bio = await dispatch(getArtistInfo(artist));
+ if (bio) {
+ // @ts-ignore
+ setBio(bio);
+ }
+
// @ts-ignore
- await dispatch(getAlbumByArtist(artist));
+ const albumList = await dispatch(getAlbumByArtist(artist));
+ if (albumList) {
+ console.log(albumList)
+ // @ts-ignore
+ setAlbumList(albumList)
+ }
};
load();
- })
+ }, [artist, dispatch])
return (
+
+
+
{artist.name}
- {artist.bio}
+ {bio}
Liste Album
-
+
);
-};
+}
+
const styles = StyleSheet.create({
container: {
marginTop:10,
- alignItems: 'center'
+ alignItems: 'center',
+ position: 'relative'
+ },
+ likeButtonContainer: {
+ position: 'absolute',
+ right: 10,
+ backgroundColor: 'white',
+ borderRadius: 20,
+ borderWidth: 2,
+ borderColor: 'black',
+ padding: 10,
+ margin: 10
},
image: {
width: 100,
@@ -56,4 +83,4 @@ const styles = StyleSheet.create({
fontSize: 20,
fontWeight: "bold"
}
-});
\ No newline at end of file
+});
diff --git a/componente/Artist/likeButton.tsx b/componente/Artist/likeButton.tsx
new file mode 100644
index 0000000..1c0e55b
--- /dev/null
+++ b/componente/Artist/likeButton.tsx
@@ -0,0 +1,39 @@
+import React, {useEffect, useState} from 'react';
+import { TouchableOpacity, View } from 'react-native';
+import {AntDesign} from "@expo/vector-icons";
+import {addLikeArtist, getLikeArtist, removeArtist} from '../../AsyncStorage/likeArtistStorage';
+
+const LikeButton = ({ artist }) => {
+ const [isLiked, setIsLiked] = useState(false);
+ const [likedArtists, setLikedArtists] = useState([]);
+
+ useEffect(() => {
+ const fetchLikedArtists = async () => {
+ const artists = await getLikeArtist();
+ setLikedArtists(artists);
+ setIsLiked(artists.some((a) => a._id === artist._id));
+ };
+ fetchLikedArtists();
+ }, [artist]);
+
+ const handleLike = () => {
+ setIsLiked(true);
+ addLikeArtist(artist);
+ };
+
+ const handleDislike = () => {
+ setIsLiked(false);
+ removeArtist(artist._id);
+ };
+
+ return (
+
+
+
+
+
+ );
+}
+
+
+export default LikeButton;
\ No newline at end of file
diff --git a/componente/HomePage.tsx b/componente/HomePage.tsx
index 5efea50..8d2d298 100644
--- a/componente/HomePage.tsx
+++ b/componente/HomePage.tsx
@@ -1,13 +1,13 @@
-import React, {useState} from 'react';
-import {View, Text, StyleSheet, TextInput} from 'react-native';
+import React from 'react';
+import {View, StyleSheet, Text} from 'react-native';
import ArtistList from "./Artist/ArtistList";
-import SearchBar from "./SearchBar";
const HomePage = ({navigation}) => {
return (
-
+ Artiste favori
+
);
};
@@ -22,6 +22,10 @@ const styles = StyleSheet.create({
fontWeight: 'bold',
textAlign: 'center',
},
+ titre: {
+ fontSize: 20,
+ fontWeight: "bold"
+ }
});
export default HomePage;
diff --git a/componente/Navigation/NavigationBar.tsx b/componente/Navigation/NavigationBar.tsx
index 491fb65..21281ae 100644
--- a/componente/Navigation/NavigationBar.tsx
+++ b/componente/Navigation/NavigationBar.tsx
@@ -5,7 +5,7 @@ import SettingsPage from "../SettingsPage";
import StackNavigationHomePage from "./StackNavigationHomePage";
import StackNavigationSearchPage from "./StackNavigationSearchPage";
-export default function NavigationBar() {
+function NavigationBar() {
const BottomTabNavigator = createBottomTabNavigator();
return (
@@ -18,12 +18,9 @@ export default function NavigationBar() {
title: 'Search',
tabBarIcon: () => ()
}}/>
- ()
- }}/>
)
}
+export default NavigationBar;
diff --git a/componente/Navigation/StackNavigationSearchPage.tsx b/componente/Navigation/StackNavigationSearchPage.tsx
index 82ec4d3..67f20d7 100644
--- a/componente/Navigation/StackNavigationSearchPage.tsx
+++ b/componente/Navigation/StackNavigationSearchPage.tsx
@@ -7,11 +7,13 @@ import SearchPage from "../SearchPage";
const Stack = createStackNavigator();
-export default function StackNavigationSearchPage() {
+function StackNavigationSearchPage() {
return (
-
+
)
-}
\ No newline at end of file
+}
+
+export default StackNavigationSearchPage;
\ No newline at end of file
diff --git a/componente/SearchBar.tsx b/componente/SearchBar.tsx
index bc465a6..b1d8810 100644
--- a/componente/SearchBar.tsx
+++ b/componente/SearchBar.tsx
@@ -9,7 +9,6 @@ const SearchBar = () => {
const dispatch = useDispatch();
const handleSearch = () => {
- console.log(searchText)
const loadArtist = async () => {
// @ts-ignore
await dispatch(searchArtists(searchText));
diff --git a/package-lock.json b/package-lock.json
index e7b881c..e0976be 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,10 +11,12 @@
"@expo/ngrok": "^4.1.0",
"@expo/vector-icons": "^13.0.0",
"@extra-fs/promises": "^3.1.4",
+ "@react-native-async-storage/async-storage": "1.17.11",
"@react-navigation/bottom-tabs": "^6.5.7",
"@react-navigation/native": "^6.1.6",
"@react-navigation/stack": "^6.3.16",
"@reduxjs/toolkit": "^1.9.3",
+ "date-fns": "^2.29.3",
"expo": "^48.0.5",
"expo-cli": "^6.3.2",
"expo-status-bar": "~1.4.4",
@@ -4036,6 +4038,17 @@
"node": ">=10"
}
},
+ "node_modules/@react-native-async-storage/async-storage": {
+ "version": "1.17.11",
+ "resolved": "https://registry.npmjs.org/@react-native-async-storage/async-storage/-/async-storage-1.17.11.tgz",
+ "integrity": "sha512-bzs45n5HNcDq6mxXnSsOHysZWn1SbbebNxldBXCQs8dSvF8Aor9KCdpm+TpnnGweK3R6diqsT8lFhX77VX0NFw==",
+ "dependencies": {
+ "merge-options": "^3.0.4"
+ },
+ "peerDependencies": {
+ "react-native": "^0.0.0-0 || 0.60 - 0.71 || 1000.0.0"
+ }
+ },
"node_modules/@react-native-community/cli": {
"version": "10.1.3",
"resolved": "https://registry.npmjs.org/@react-native-community/cli/-/cli-10.1.3.tgz",
@@ -8353,6 +8366,18 @@
"resolved": "https://registry.npmjs.org/dag-map/-/dag-map-1.0.2.tgz",
"integrity": "sha512-+LSAiGFwQ9dRnRdOeaj7g47ZFJcOUPukAP8J3A3fuZ1g9Y44BG+P1sgApjLXTQPOzC4+7S9Wr8kXsfpINM4jpw=="
},
+ "node_modules/date-fns": {
+ "version": "2.29.3",
+ "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz",
+ "integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==",
+ "engines": {
+ "node": ">=0.11"
+ },
+ "funding": {
+ "type": "opencollective",
+ "url": "https://opencollective.com/date-fns"
+ }
+ },
"node_modules/dateformat": {
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/dateformat/-/dateformat-3.0.3.tgz",
@@ -13286,6 +13311,25 @@
"resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
"integrity": "sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w=="
},
+ "node_modules/merge-options": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/merge-options/-/merge-options-3.0.4.tgz",
+ "integrity": "sha512-2Sug1+knBjkaMsMgf1ctR1Ujx+Ayku4EdJN4Z+C2+JzoeF7A3OZ9KM2GY0CpQS51NR61LTurMJrRKPhSs3ZRTQ==",
+ "dependencies": {
+ "is-plain-obj": "^2.1.0"
+ },
+ "engines": {
+ "node": ">=10"
+ }
+ },
+ "node_modules/merge-options/node_modules/is-plain-obj": {
+ "version": "2.1.0",
+ "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-2.1.0.tgz",
+ "integrity": "sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==",
+ "engines": {
+ "node": ">=8"
+ }
+ },
"node_modules/merge-stream": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -23634,6 +23678,14 @@
}
}
},
+ "@react-native-async-storage/async-storage": {
+ "version": "1.17.11",
+ "resolved": "https://registry.npmjs.org/@react-native-async-storage/async-storage/-/async-storage-1.17.11.tgz",
+ "integrity": "sha512-bzs45n5HNcDq6mxXnSsOHysZWn1SbbebNxldBXCQs8dSvF8Aor9KCdpm+TpnnGweK3R6diqsT8lFhX77VX0NFw==",
+ "requires": {
+ "merge-options": "^3.0.4"
+ }
+ },
"@react-native-community/cli": {
"version": "10.1.3",
"resolved": "https://registry.npmjs.org/@react-native-community/cli/-/cli-10.1.3.tgz",
@@ -26962,6 +27014,11 @@
"resolved": "https://registry.npmjs.org/dag-map/-/dag-map-1.0.2.tgz",
"integrity": "sha512-+LSAiGFwQ9dRnRdOeaj7g47ZFJcOUPukAP8J3A3fuZ1g9Y44BG+P1sgApjLXTQPOzC4+7S9Wr8kXsfpINM4jpw=="
},
+ "date-fns": {
+ "version": "2.29.3",
+ "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.29.3.tgz",
+ "integrity": "sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA=="
+ },
"dateformat": {
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/dateformat/-/dateformat-3.0.3.tgz",
@@ -30803,6 +30860,21 @@
"resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz",
"integrity": "sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w=="
},
+ "merge-options": {
+ "version": "3.0.4",
+ "resolved": "https://registry.npmjs.org/merge-options/-/merge-options-3.0.4.tgz",
+ "integrity": "sha512-2Sug1+knBjkaMsMgf1ctR1Ujx+Ayku4EdJN4Z+C2+JzoeF7A3OZ9KM2GY0CpQS51NR61LTurMJrRKPhSs3ZRTQ==",
+ "requires": {
+ "is-plain-obj": "^2.1.0"
+ },
+ "dependencies": {
+ "is-plain-obj": {
+ "version": "2.1.0",
+ "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-2.1.0.tgz",
+ "integrity": "sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA=="
+ }
+ }
+ },
"merge-stream": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
diff --git a/package.json b/package.json
index 631f6e6..537f3b1 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
"@react-navigation/native": "^6.1.6",
"@react-navigation/stack": "^6.3.16",
"@reduxjs/toolkit": "^1.9.3",
+ "date-fns": "^2.29.3",
"expo": "^48.0.5",
"expo-cli": "^6.3.2",
"expo-status-bar": "~1.4.4",
@@ -27,7 +28,8 @@
"react-native-safe-area-context": "4.5.0",
"react-native-web": "~0.18.11",
"react-redux": "^8.0.5",
- "redux": "^4.2.1"
+ "redux": "^4.2.1",
+ "@react-native-async-storage/async-storage": "1.17.11"
},
"devDependencies": {
"@babel/core": "^7.12.9",
diff --git a/redux/actions/action.tsx b/redux/actions/action.tsx
index 8e55721..1118218 100644
--- a/redux/actions/action.tsx
+++ b/redux/actions/action.tsx
@@ -1,9 +1,9 @@
-import {FETCH_ARTISTE_SEARCH,ACCESS_TOKEN} from '../constants';
+import {FETCH_ARTISTE_SEARCH, ACCESS_TOKEN} from '../constants';
import {Artist} from "../../Model/Artist";
import {Album} from "../../Model/Album";
-export const setArtistList = (artistList: Artist[]) => {
+export const setArtistSearchList = (artistList: Artist[]) => {
return {
type: FETCH_ARTISTE_SEARCH,
payload: artistList,
@@ -11,7 +11,6 @@ export const setArtistList = (artistList: Artist[]) => {
}
export const searchArtists = (recherche) => {
- console.log("getArtistList");
return async dispatch => {
try{
const response = await fetch(`https://genius.com/api/search/artists?page=1&q=${encodeURIComponent(recherche)}`);
@@ -21,69 +20,56 @@ export const searchArtists = (recherche) => {
}
const artistListJson = await response.json();
- console.log(artistListJson);
- console.log("ici")
const artistList: Artist[] = artistListJson.response.sections[0].hits.map(hit =>
new Artist(hit.result.id, hit.result.name, hit.result.image_url,"")
);
- dispatch(setArtistList(artistList));
- } catch (error) {
+ dispatch(setArtistSearchList(artistList));
+
+ } catch (error) {
console.error('Error:', error);
}
}
}
export const getArtistInfo = (artist) => {
- console.log(artist._id)
- return async dispatch => {
- try{
- const response = await fetch(`https://api.genius.com/artists/${artist._id}`, {
- headers: {
- 'Authorization': `Bearer ${ACCESS_TOKEN}`,
- 'Content-Type': 'application/json'
+ return async (dispatch) => {
+ try {
+ const response = await fetch(
+ `https://api.genius.com/artists/${artist.id}`,
+ {
+ headers: {
+ Authorization: `Bearer ${ACCESS_TOKEN}`,
+ "Content-Type": "application/json",
+ },
}
- })
+ );
if (!response.ok) {
console.log(response);
- throw new Error('[getArtistInfo] Network response was not ok');
+ throw new Error("[getArtistInfo] Network response was not ok");
}
const artistInfoJson = await response.json();
- artist.bio = artistInfoJson.response.artist.description.dom.children[0].children[0];
-
- } catch (error) {
- console.error('Error:', error);
- }
- }
-}
-export const getSongByArtist = (artist) => {
- return async dispatch => {
- try{
- const response = await fetch(`https://api.genius.com/artists/${artist.id}/songs`, {
- headers: {
- 'Authorization': `Bearer ${ACCESS_TOKEN}`,
- 'Content-Type': 'application/json'
+ var bio = "";
+ artistInfoJson.response.artist.description.dom.children[0].children.map(
+ (b) => {
+ if (typeof b === "object") {
+ bio += b.children[0];
+ } else {
+ bio += b;
+ }
}
- })
-
- if (!response.ok) {
- console.log(response);
- throw new Error('[getSongByArtist] Network response was not ok');
- }
-
- const artistSongsJson = await response.json();
- console.log(artistSongsJson);
- artistSongsJson.response.songs.map((hit: any) => console.log(hit));
+ );
+ return bio; // Return the JSON object
} catch (error) {
- console.error('Error:', error);
+ console.error("Error:", error);
}
- }
-}
+ };
+};
export const getAlbumByArtist = (artist) => {
return async dispatch => {
@@ -96,6 +82,7 @@ export const getAlbumByArtist = (artist) => {
}
const artistAlbumJson = await response.json();
+
const albumList: Album[] = artistAlbumJson.response.albums.map((album: any) =>
new Album(album.id,
album.name,
@@ -104,9 +91,8 @@ export const getAlbumByArtist = (artist) => {
Date(album.release_date_components.day, album.release_date_components.month, album.release_date_components.year)
)
);
- artist.listAlbum = albumList;
- console.log(artist.listAlbum);
+ return albumList;
} catch (error) {
console.error('Error:', error);
}
diff --git a/redux/constants.tsx b/redux/constants.tsx
index 777ee41..57f183d 100644
--- a/redux/constants.tsx
+++ b/redux/constants.tsx
@@ -1,5 +1,2 @@
-export const FETCH_ARTISTE = 'FETCH_ARTISTE';
export const FETCH_ARTISTE_SEARCH = 'FETCH_ARTISTE_SEARCH';
-
-
export const ACCESS_TOKEN = 'M0GAzZXbwqfifGOTxfB7lLmEWlRNadkFGV99E9SQCgirIX58kbcvEFYhu2WajbGH';
\ No newline at end of file
diff --git a/redux/reducers/reducerArtist.tsx b/redux/reducers/reducerArtist.tsx
index 14a6ed0..d288924 100644
--- a/redux/reducers/reducerArtist.tsx
+++ b/redux/reducers/reducerArtist.tsx
@@ -1,19 +1,15 @@
-import {FETCH_ARTISTE, FETCH_ARTISTE_SEARCH} from '../constants';
+import { FETCH_ARTISTE_SEARCH} from '../constants';
const initialState = {
- artists: [],
artistsSearch: []
}
export default function ReducerArtist(state = initialState, action){
switch (action.type) {
- case FETCH_ARTISTE:
- // @ts-ignore
- return {...state, artists: action.payload};
case FETCH_ARTISTE_SEARCH:
return {...state, artistsSearch: action.payload};
-
default:
+ console.log("nothing")
return state;
}
}
\ No newline at end of file