Comments (1)
jerelmiller
commented on June 9, 2024
Hey @mabuyo 👋
Unfortunately its an undocumented field. I added the types based on the JSON response from their API directly.
Here is a sample playlist directly from their API:
Response JSON
{
collaborative: false,
description: '',
external_urls: {
spotify: 'https://open.spotify.com/playlist/7ztqQ9YOM05hRje13ZUg7J'
},
followers: { href: null, total: 0 },
href: 'https://api.spotify.com/v1/playlists/7ztqQ9YOM05hRje13ZUg7J',
id: '7ztqQ9YOM05hRje13ZUg7J',
images: [
{
height: 640,
url: 'https://i.scdn.co/image/ab67616d0000b273f72cd22e67f690f7a2f95829',
width: 640
}
],
name: 'TEST - Mix of songs and episodes',
owner: {
display_name: 'Jerel Miller',
external_urls: {
spotify: 'https://open.spotify.com/user/1228247189'
},
href: 'https://api.spotify.com/v1/users/1228247189',
id: '1228247189',
type: 'user',
uri: 'spotify:user:1228247189'
},
primary_color: null,
public: false,
snapshot_id: 'NCwwYTZlZjVhNzE1YjBmOWExZmVhNDkxNDQwMWM2ZDI3MGY5ZWI3MTJj',
tracks: {
href: 'https://api.spotify.com/v1/playlists/7ztqQ9YOM05hRje13ZUg7J/tracks?offset=0&limit=100&locale=en-US',
items: [
{
added_at: '2022-12-15T00:00:12Z',
added_by: {
external_urls: {
spotify: 'https://open.spotify.com/user/1228247189'
},
href: 'https://api.spotify.com/v1/users/1228247189',
id: '1228247189',
type: 'user',
uri: 'spotify:user:1228247189'
},
is_local: false,
primary_color: null,
track: {
album: {
album_type: 'single',
artists: [
{
external_urls: {
spotify: 'https://open.spotify.com/artist/2vKiJjsgjgqIECUyYeIVvO'
},
href: 'https://api.spotify.com/v1/artists/2vKiJjsgjgqIECUyYeIVvO',
id: '2vKiJjsgjgqIECUyYeIVvO',
name: 'Crown The Empire',
type: 'artist',
uri: 'spotify:artist:2vKiJjsgjgqIECUyYeIVvO'
}
],
available_markets: [],
external_urls: {
spotify: 'https://open.spotify.com/album/3kJDQqifVrTnTEOj1alM13'
},
href: 'https://api.spotify.com/v1/albums/3kJDQqifVrTnTEOj1alM13',
id: '3kJDQqifVrTnTEOj1alM13',
images: [
{
height: 640,
url: 'https://i.scdn.co/image/ab67616d0000b27349a4637ad0514e78085b4ddc',
width: 640
},
{
height: 300,
url: 'https://i.scdn.co/image/ab67616d00001e0249a4637ad0514e78085b4ddc',
width: 300
},
{
height: 64,
url: 'https://i.scdn.co/image/ab67616d0000485149a4637ad0514e78085b4ddc',
width: 64
}
],
name: 'Immortalize',
release_date: '2022-12-02',
release_date_precision: 'day',
total_tracks: 3,
type: 'album',
uri: 'spotify:album:3kJDQqifVrTnTEOj1alM13'
},
artists: [
{
external_urls: {
spotify: 'https://open.spotify.com/artist/2vKiJjsgjgqIECUyYeIVvO'
},
href: 'https://api.spotify.com/v1/artists/2vKiJjsgjgqIECUyYeIVvO',
id: '2vKiJjsgjgqIECUyYeIVvO',
name: 'Crown The Empire',
type: 'artist',
uri: 'spotify:artist:2vKiJjsgjgqIECUyYeIVvO'
}
],
available_markets: [],
disc_number: 1,
duration_ms: 215154,
episode: false,
explicit: false,
external_ids: { isrc: 'QMRSZ2200976' },
external_urls: {
spotify: 'https://open.spotify.com/track/1AR0d9urAEX4a1WdTzmbKz'
},
href: 'https://api.spotify.com/v1/tracks/1AR0d9urAEX4a1WdTzmbKz',
id: '1AR0d9urAEX4a1WdTzmbKz',
is_local: false,
name: 'Immortalize',
popularity: 29,
preview_url: null,
track: true,
track_number: 1,
type: 'track',
uri: 'spotify:track:1AR0d9urAEX4a1WdTzmbKz'
},
video_thumbnail: { url: null }
},
{
added_at: '2022-12-15T00:00:18Z',
added_by: {
external_urls: {
spotify: 'https://open.spotify.com/user/1228247189'
},
href: 'https://api.spotify.com/v1/users/1228247189',
id: '1228247189',
type: 'user',
uri: 'spotify:user:1228247189'
},
is_local: false,
primary_color: null,
track: {
album: {
album_type: 'compilation',
artists: [
{
external_urls: {
spotify: 'https://open.spotify.com/show/3kUJiCxp9sy2JfheQ6hIb0'
},
href: 'https://api.spotify.com/v1/shows/3kUJiCxp9sy2JfheQ6hIb0',
id: '3kUJiCxp9sy2JfheQ6hIb0',
name: 'Broncos Country Tonight',
type: 'show',
uri: 'spotify:show:3kUJiCxp9sy2JfheQ6hIb0'
}
],
available_markets: [
'AD', 'AE', 'AG', 'AL', 'AM', 'AO', 'AR', 'AT',
'AU', 'AZ', 'BA', 'BB', 'BE', 'BF', 'BG', 'BH',
'BI', 'BJ', 'BN', 'BO', 'BR', 'BS', 'BT', 'BW',
'BZ', 'CA', 'CH', 'CI', 'CL', 'CM', 'CO', 'CR',
'CV', 'CW', 'CY', 'CZ', 'DE', 'DJ', 'DK', 'DM',
'DO', 'DZ', 'EC', 'EE', 'EG', 'ES', 'FI', 'FJ',
'FM', 'FR', 'GA', 'GB', 'GD', 'GE', 'GH', 'GM',
'GN', 'GQ', 'GR', 'GT', 'GW', 'GY', 'HK', 'HN',
'HR', 'HT', 'HU', 'ID', 'IE', 'IL', 'IN', 'IS',
'IT', 'JM', 'JO', 'JP', 'KE', 'KH', 'KI', 'KM',
'KN', 'KR', 'KW', 'LA', 'LB', 'LC', 'LI', 'LR',
'LS', 'LT', 'LU', 'LV', 'MA', 'MC', 'ME', 'MG',
'MH', 'MK', 'ML', 'MN', 'MO', 'MR', 'MT', 'MU',
'MV', 'MW', 'MX', 'MY', 'MZ', 'NA', 'NE', 'NG',
'NI', 'NL', 'NO', 'NP', 'NR', 'NZ', 'OM', 'PA',
'PE', 'PG', 'PH', 'PL', 'PS', 'PT', 'PW', 'PY',
'QA', 'RO', 'RS', 'RW', 'SA', 'SB', 'SC', 'SE',
'SG', 'SI', 'SK', 'SL', 'SM', 'SN', 'SR', 'ST',
'SV', 'SZ', 'TD', 'TG', 'TH', 'TL', 'TN', 'TO',
'TR', 'TT', 'TV', 'TW', 'TZ', 'UA', 'US', 'UY',
'UZ', 'VC', 'VN', 'VU', 'WS', 'XK', 'ZA', 'ZM',
'ZW'
],
external_urls: {
spotify: 'https://open.spotify.com/show/3kUJiCxp9sy2JfheQ6hIb0'
},
href: 'https://api.spotify.com/v1/shows/3kUJiCxp9sy2JfheQ6hIb0',
id: '3kUJiCxp9sy2JfheQ6hIb0',
images: [
{
height: 640,
url: 'https://i.scdn.co/image/ab6765630000ba8a16b9a523e035becd31cecf3c',
width: 640
},
{
height: 300,
url: 'https://i.scdn.co/image/ab67656300005f1f16b9a523e035becd31cecf3c',
width: 300
},
{
height: 64,
url: 'https://i.scdn.co/image/ab6765630000f68d16b9a523e035becd31cecf3c',
width: 64
}
],
is_playable: false,
name: 'Broncos Country Tonight',
release_date: null,
release_date_precision: null,
restrictions: { reason: 'product' },
total_tracks: 1,
type: 'show',
uri: 'spotify:show:3kUJiCxp9sy2JfheQ6hIb0'
},
artists: [
{
external_urls: {
spotify: 'https://open.spotify.com/show/3kUJiCxp9sy2JfheQ6hIb0'
},
href: 'https://api.spotify.com/v1/shows/3kUJiCxp9sy2JfheQ6hIb0',
id: '3kUJiCxp9sy2JfheQ6hIb0',
name: 'Broncos Country Tonight',
type: 'show',
uri: 'spotify:show:3kUJiCxp9sy2JfheQ6hIb0'
}
],
available_markets: [
'AD', 'AE', 'AG', 'AL', 'AM', 'AO', 'AR', 'AT',
'AU', 'AZ', 'BA', 'BB', 'BE', 'BF', 'BG', 'BH',
'BI', 'BJ', 'BN', 'BO', 'BR', 'BS', 'BT', 'BW',
'BZ', 'CA', 'CH', 'CI', 'CL', 'CM', 'CO', 'CR',
'CV', 'CW', 'CY', 'CZ', 'DE', 'DJ', 'DK', 'DM',
'DO', 'DZ', 'EC', 'EE', 'EG', 'ES', 'FI', 'FJ',
'FM', 'FR', 'GA', 'GB', 'GD', 'GE', 'GH', 'GM',
'GN', 'GQ', 'GR', 'GT', 'GW', 'GY', 'HK', 'HN',
'HR', 'HT', 'HU', 'ID', 'IE', 'IL', 'IN', 'IS',
'IT', 'JM', 'JO', 'JP', 'KE', 'KH', 'KI', 'KM',
'KN', 'KR', 'KW', 'LA', 'LB', 'LC', 'LI', 'LR',
'LS', 'LT', 'LU', 'LV', 'MA', 'MC', 'ME', 'MG',
'MH', 'MK', 'ML', 'MN', 'MO', 'MR', 'MT', 'MU',
'MV', 'MW', 'MX', 'MY', 'MZ', 'NA', 'NE', 'NG',
'NI', 'NL', 'NO', 'NP', 'NR', 'NZ', 'OM', 'PA',
'PE', 'PG', 'PH', 'PL', 'PS', 'PT', 'PW', 'PY',
'QA', 'RO', 'RS', 'RW', 'SA', 'SB', 'SC', 'SE',
'SG', 'SI', 'SK', 'SL', 'SM', 'SN', 'SR', 'ST',
'SV', 'SZ', 'TD', 'TG', 'TH', 'TL', 'TN', 'TO',
'TR', 'TT', 'TV', 'TW', 'TZ', 'UA', 'US', 'UY',
'UZ', 'VC', 'VN', 'VU', 'WS', 'XK', 'ZA', 'ZM',
'ZW'
],
disc_number: 0,
duration_ms: 1457711,
episode: false,
explicit: false,
external_ids: {
spotify: 'https://open.spotify.com/episode/1CwDjPKXfQGDlitW2gaPYY'
},
external_urls: {
spotify: 'https://open.spotify.com/episode/1CwDjPKXfQGDlitW2gaPYY'
},
href: 'https://api.spotify.com/v1/episodes/1CwDjPKXfQGDlitW2gaPYY',
id: '1CwDjPKXfQGDlitW2gaPYY',
is_local: false,
is_playable: false,
name: '12-08-22 Bonus Hour of Broncos Country Tonight',
popularity: 0,
preview_url: 'https://podz-content.spotifycdn.com/audio/clips/7AUcRFQCmS3LJhxVOctnF8/clip_1235400_1281100.mp3',
track: true,
track_number: 0,
type: 'episode',
uri: 'spotify:episode:1CwDjPKXfQGDlitW2gaPYY'
},
video_thumbnail: { url: null }
}
],
limit: 100,
next: null,
offset: 0,
previous: null,
total: 2
},
type: 'playlist',
uri: 'spotify:playlist:7ztqQ9YOM05hRje13ZUg7J'
}You'll note the primary_color field in here. To be honest, I don't think its ever set to anything other than null or an empty string. Since its undocumented, its probably safe to remove from our types anyways.
Not sure if you're looking to set a background based on the image of the playlist, but if you want the trick I used, check out the following code:
- Parse the "vibrant" color from an image and return its swatch: https://github.com/apollographql/spotify-showcase/blob/main/client/src/utils/image.ts
- Add a local resolver on the
Imagetype so I can query for avibrantColoras a client-only field: https://github.com/apollographql/spotify-showcase/blob/main/client/src/apollo/resolvers.ts - An example of where I query this for the playlist page:
Hope this helps! Let me know if you have any questions.
from spotify-showcase.
Related Issues (20)
- Support OpenTelemetry in self-hosted router
- Nodemon doesn't rebuild shared folder if working on spotify-api
- Dedupe subscriptions based on Spotify User ID
- Script to recreate the graph in GraphOS should log helpful message output
- Implement the queue page
- Create an error boundary for page-specific errors
- Implement the "Your Episodes" page
- Add dropdown menus for albums
- Add dropdown menus for tracks
- Determine how to handle free users
- Feedback wanted!
- Switch all CSS over to Tailwind.css
- Add some tests for the app
- Add some basic CI
- Evaluate making `Developer` it's own subgraph`
- Improve empty state on Search page
- Improve Search results page with Albums, Playlists and Songs
- Change mocking header value to include 'mock'
- Create a shared package for SpotifyDataSource interface HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from spotify-showcase.