adrianhajdin/project_music_player

get artist details deprecated...in rapid api..version 2 is working but how to implement

githubsayan7776969 opened this issue · 23 comments

we will then be having 2 different base urls..since this has got v2 in it...
Screenshot 2022-12-08 134327

I fixed this by editing the baseUrl to: baseUrl: 'https://shazam-core.p.rapidapi.com',
and then editing the builder queries like so:
getTopCharts: builder.query({ query: () => '/v1/charts/world' }),
...
getArtistDetails: builder.query({ query: (artistId) =>'/v2/artists/details?artist_id=${artistId}' }),

Adding the back ticks in the appropriate places

I fixed this by editing the baseUrl to: baseUrl: 'https://shazam-core.p.rapidapi.com', and then editing the builder queries like so: getTopCharts: builder.query({ query: () => '/v1/charts/world' }), ... getArtistDetails: builder.query({ query: (artistId) =>'/v2/artists/details?artist_id=${artistId}' }),

Adding the back ticks in the appropriate places

I did that also, but what u changed in ArtistDetails.jsx for RelatedSongs data={Object.values(artistData?.songs)}

Screenshot 2022-12-10 115309
nodata fetched..blank screen now.

Screenshot 2022-12-10 120042
CHECK THE EXTENSION RESULT IN VS CODE..ABOVE

also when i try to use back ticks the formatting error goes away but i get a white blank screen and the app crashes..
Screenshot 2022-12-10 122547

the comma and the closing braces and bracs are there just not visible in the screen shot

I fixed this by editing the baseUrl to: baseUrl: 'https://shazam-core.p.rapidapi.com', and then editing the builder queries like so: getTopCharts: builder.query({ query: () => '/v1/charts/world' }), ... getArtistDetails: builder.query({ query: (artistId) =>'/v2/artists/details?artist_id=${artistId}' }),
Adding the back ticks in the appropriate places

I did that also, but what u changed in ArtistDetails.jsx for RelatedSongs data={Object.values(artistData?.songs)}

We can do one thing since there are no related songs in the new API call(which is - v2 one)
We can display that artist's Top songs instead of related songs.
For that u can declare a new variable called 'topSongsData'. Like this:

const topSongsData = artistData?.data[0]?.views['top-songs']?.data

Now u can pass this variable as data in RelatedSongs Component. Like this:
<RelatedSongs
data={topSongsData}
artistId={artistId}
isPlaying={isPlaying}
activeSong={activeSong}

One Final change has to be done in RelatedSongs component since there is no 'key' present in topSongsData, instead we can use 'id' value from topSongsData. Change in RelatedSongs data mapping looks like this.

{data?.map((song,i)=>(
<SongBar key={${song.key}-${song.id}-${artistId}}
song ={song }
i={i}
artistId={artistId}
isPlaying={isPlaying}
activeSong={activeSong}
handlePauseClick={handlePauseClick}
handlePlayClick ={handlePlayClick}
/>
))}
Only the bolded line is changed. rest of the code is the same.
Hope this works.

Please give the clear code or the screenshot of what have you implied
And I have the same issue

Please give the clear code or the screenshot of what have you implied And I have the same issue

artistdetails
relatedsongs
shazamcore

Hope these screenshots help u to understand my previous comment.
Let me know if u face any issues.

Please give the clear code or the screenshot of what have you implied And I have the same issue

artistdetails relatedsongs shazamcore

Hope these screenshots help u to understand my previous comment. Let me know if u face any issues.

Can you also post screenshot of your DetailsHeader file? I'm getting an error that the artistId in that element is undefined

Please give the clear code or the screenshot of what have you implied And I have the same issue

artistdetails relatedsongs shazamcore

Hope these screenshots help u to understand my previous comment. Let me know if u face any issues.

The error is still there and as soon as the shazamCore.js is updated the whole stops working and it shows the same error. And how have you removed the v1 from the baseUrl in line 6? Could you please help me in that

Screenshot (154)

And if the API needs to be updated, could you please record a loom video of yours explaining it? It would be helpful

Please give the clear code or the screenshot of what have you implied And I have the same issue

artistdetails relatedsongs shazamcore
Hope these screenshots help u to understand my previous comment. Let me know if u face any issues.

The error is still there and as soon as the shazamCore.js is updated the whole stops working and it shows the same error. And how have you removed the v1 from the baseUrl in line 6? Could you please help me in that

Screenshot (154)

And if the API needs to be updated, could you please record a loom video of yours explaining it? It would be helpful

detailsheader

i removed 'v1' from baseurl and updated in all queries. U can see that in shazamcore screenshot. Whatever issues u face please paste the screenshots here.

https://www.loom.com/share/56f12c2f8087425488ce5583b0f1fc44 -- Please watch this by pasting the link in your new tab and you will get the idea of the problem I am facing
The other screenshot data have even been changed but it is still not functioning properly

Screenshot (158)

Screenshot (159)
Screenshot (160)
Screenshot (161)
Screenshot (162)

Please give the clear code or the screenshot of what have you implied And I have the same issue

artistdetails relatedsongs shazamcore
Hope these screenshots help u to understand my previous comment. Let me know if u face any issues.

The error is still there and as soon as the shazamCore.js is updated the whole stops working and it shows the same error. And how have you removed the v1 from the baseUrl in line 6? Could you please help me in that
Screenshot (154)
And if the API needs to be updated, could you please record a loom video of yours explaining it? It would be helpful

detailsheader

i removed 'v1' from baseurl and updated in all queries. U can see that in shazamcore screenshot. Whatever issues u face please paste the screenshots here.

If you could please go through the video and look at the screenshots and identify the error and help me find the solution it would really be a great help

Send me the SS of error which is logged in console

Send me the SS of error which is logged in console
Screenshot (163)

And if I remove 0 then the artwork is the issue

the issue still persists...the screenshots have been implement in eact however the status of the app has not changed....

i meant impleneted in react as per screenshots above
Screenshot 2022-12-18 233600

i meant impleneted in react as per screenshots above Screenshot 2022-12-18 233600

I guess the error has been in the TopPlay component which is unable to fetch the 0th element using adamid @adrianhajdin @PavanKalyan717 could you please help us with this issue #24

Send me the SS of error which is logged in console
Screenshot (163)

And if I remove 0 then the artwork is the issue

In the Details Header component change the src of img tag to artistId ? artistData?.data[0].attributes?.artwork?.url

Hope this helps

Screenshot 2022-12-10 120042 CHECK THE EXTENSION RESULT IN VS CODE..ABOVE

hey bro can you please provide me your api key of the shazam core api. I want to build this project for my resume. please.....