Updates

static/js/main.9bd627fd.chunk.js

@@ -0,0 +1,2 @@
+(this["webpackJsonpspoti-search"]=this["webpackJsonpspoti-search"]||[]).push([[0],{115:function(e,t,a){e.exports=a(131)},131:function(e,t,a){"use strict";a.r(t);var n=a(0),r=a.n(n),l=a(33),i=a.n(l),c=a(55),o=a(56),s=a(88),m=a(82),u=a(51),g=a(91),d=a(145),h=a(92),f=a(76),p=a(89),b=a(146),E=function(e){return r.a.createElement(b.a,Object.assign({as:"header",direction:"row",align:"center",justify:"center",background:"brand",pad:{left:"medium",right:"small",vertical:"small"},style:{zIndex:1}},e))},v=a(143),y=a(144),j=function(e){var t=e.inputValue,a=e.handleChange,n=e.suggestions,l=e.handleSelect;return r.a.createElement(b.a,{as:"section",direction:"row",justify:"center",margin:{vertical:"large"}},r.a.createElement(v.a,{value:t,onChange:a,onSelect:l,placeholder:"Type an artist name",icon:r.a.createElement(y.a,{color:"plain"}),dropHeight:"large",suggestions:n}))},O=a(149),k=a(148),w=a(142),x=a(147),S=function(e){var t=e.image,a=e.name;return r.a.createElement(b.a,{round:"xxsmall",elevation:"small",overflow:"hidden"},r.a.createElement(b.a,{height:"300px"},r.a.createElement(x.a,{src:t,fit:"cover"})),r.a.createElement(k.a,{level:"4",margin:{bottom:"small",top:"small",left:"small"}},a))},A=function(e){var t=e.image,a=e.name,n=e.handleClick;return r.a.createElement(b.a,{round:"xxsmall",overflow:"hidden",align:"center",pad:"small",onClick:n},r.a.createElement(k.a,{level:"4",margin:{bottom:"small",top:"small",left:"small"}},a),r.a.createElement(b.a,{height:"small",width:"small",round:"full",background:{repeat:"no-repeat",size:"cover",image:"url(".concat(t,")")}}))},C=function(e){var t=e.artists,a=e.handleClick,n=t[0],l=n.name,i=n.image,c=n.albums;return r.a.createElement(O.a,{as:"section",rows:["fit","fit"],columns:["fit","2/3"],gap:"small",areas:[["artist-title","other-title"],["artist","other"],["disco-title","disco-title"],["discography","discography"]]},r.a.createElement(k.a,{level:"1",gridArea:"artist-title",margin:{vertical:"none"}},l),r.a.createElement(O.a,{gridArea:"artist",margin:{bottom:"medium"}},r.a.createElement(b.a,{round:"full",background:{repeat:"no-repeat",size:"cover",image:"url(".concat(i,")")},height:"300px",width:"300px"})),r.a.createElement(k.a,{level:"2",gridArea:"other-title",margin:{vertical:"none"},alignSelf:"end",size:"small"},"Other results"),r.a.createElement(w.a.Consumer,null,(function(e){return r.a.createElement(b.a,{gridArea:"other",direction:"row",wrap:!0},t.slice(1,t.length).map((function(e){return r.a.createElement(A,{key:e.id,image:e.image,name:e.name,handleClick:a})})))})),r.a.createElement(k.a,{level:"2",gridArea:"disco-title",size:"large"},"Discography"),r.a.createElement(w.a.Consumer,null,(function(e){return r.a.createElement(O.a,{gridArea:"discography",align:"start",columns:{count:"fill",size:"300px"},gap:"large"},c.map((function(e){return r.a.createElement(S,{key:e.id,image:e.image,name:e.name})})))})))};function q(){var e=Object(g.a)(["\n\tquery Artist($byName: String!) {\n\t\tqueryArtists(byName: $byName) {\n\t\t\tname\n\t\t\timage\n\t\t\tid\n\t\t\talbums {\n\t\t\t\tname\n\t\t\t\timage\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t}\n"]);return q=function(){return e},e}var z=Object(f.a)(q());function N(){var e=Object(n.useState)(""),t=Object(u.a)(e,2),a=t[0],l=t[1],i=Object(p.a)(z),c=Object(u.a)(i,2),o=c[0],s=c[1].data,g=Object(n.useState)([]),f=Object(u.a)(g,2),b=f[0],v=f[1],y=Object(n.useState)(),O=Object(u.a)(y,2),k=O[0],w=O[1],x=Object(n.useState)(!1),S=Object(u.a)(x,2),A=S[0],q=S[1],N=Object(n.useCallback)(Object(h.debounce)((function(){o({variables:{byName:a}})}),500),[a]);Object(n.useEffect)((function(){return N(),N.cancel}),[a,N]);return Object(n.useEffect)((function(){if(s&&s.queryArtists!==[]){var e=s.queryArtists.slice(0,5).map((function(e){return e.name}));w(e)}}),[s]),r.a.createElement(d.a,{theme:I},r.a.createElement(E,null,r.a.createElement("h1",null,"Spoti Search")),r.a.createElement(j,{inputValue:a,handleChange:function(e){l(e.target.value)},suggestions:k,handleSelect:function(e){for(var t=e.suggestion,a=[],n=s.queryArtists.slice(0,5).map((function(e){return e})),r=0;r<n.length;r++)if(n[r].name===t){var l=null===n||void 0===n?void 0:n.splice(r,1),i=n;a=[].concat(Object(m.a)(l),Object(m.a)(i));break}v(a),q(!0)}}),A&&r.a.createElement(C,{artists:b,handleClick:function(){console.log("click")}}))}var I={global:{font:{family:"Roboto",size:"18px",height:"20px"}}},J=new c.a({uri:"https://spotify-graphql-server.herokuapp.com/graphql",cache:new o.a});i.a.render(r.a.createElement(r.a.StrictMode,null,r.a.createElement(s.a,{client:J},r.a.createElement(N,null))),document.getElementById("root"))}},[[115,1,2]]]);
+//# sourceMappingURL=main.9bd627fd.chunk.js.map

static/js/main.d5729ca7.chunk.js

@@ -1,2 +0,0 @@
-(this["webpackJsonpspoti-search"]=this["webpackJsonpspoti-search"]||[]).push([[0],{115:function(e,t,a){e.exports=a(131)},131:function(e,t,a){"use strict";a.r(t);var n=a(0),r=a.n(n),l=a(33),c=a.n(l),i=a(56),s=a(57),o=a(88),u=a(82),m=a(51),g=a(91),h=a(147),p=a(92),d=a(76),f=a(89),b=a(148),E=function(e){return r.a.createElement(b.a,Object.assign({as:"header",direction:"row",align:"center",justify:"center",background:"brand",pad:{left:"medium",right:"small",vertical:"small"},style:{zIndex:1}},e))},v=a(144),y=a(145),j=function(e){var t=e.inputValue,a=e.handleChange,n=e.suggestions,l=e.handleSelect;return r.a.createElement(b.a,{as:"section",direction:"row",justify:"center",margin:{vertical:"large"}},r.a.createElement(v.a,{value:t,onChange:a,onSelect:l,placeholder:"Type an artist name",icon:r.a.createElement(y.a,{color:"plain"}),dropHeight:"large",suggestions:n}))},O=a(151),S=a(149),w=a(146),x=a(143),k=a(150),A=function(e){var t=e.image,a=e.name;return r.a.createElement(b.a,{round:"xxsmall",elevation:"small",overflow:"hidden"},r.a.createElement(b.a,{height:"300px"},r.a.createElement(S.a,{src:t,fit:"cover"})),r.a.createElement(b.a,{pad:{horizontal:"small"}},r.a.createElement(b.a,{margin:{top:"small"},direction:"row",align:"center",justify:"between"},r.a.createElement(b.a,null,r.a.createElement(k.a,{level:"4",margin:{bottom:"small",top:"xsmall"}},a)))))},q=function(e){var t=e.artists,a=t[0],n=a.name,l=a.image,c=a.albums;return r.a.createElement(O.a,{rows:["fit","fit"],columns:["1/4","3/4"],gap:"small",areas:[["artist","other"],["discography","discography"]]},r.a.createElement(b.a,{gridArea:"artist",height:"300px"},r.a.createElement("h1",null,n),r.a.createElement(S.a,{src:l,fit:"cover"})),r.a.createElement(b.a,{gridArea:"other",background:"light-2"},r.a.createElement("h3",null,"Other results"),t.map((function(e){return r.a.createElement(b.a,{gridArea:"artist",key:e.id},r.a.createElement(w.a,{src:e.image}),r.a.createElement("h4",null,e.name))}))),r.a.createElement(x.a.Consumer,null,(function(e){return r.a.createElement(O.a,{gridArea:"discography",align:"start",columns:{count:"fill",size:"300px"},gap:"medium"},r.a.createElement(k.a,{level:"1"},"Discography"),c.map((function(e){return r.a.createElement(A,{key:e.id,image:e.image,name:e.name})})))})))};function C(){var e=Object(g.a)(["\n\tquery Artist($byName: String!) {\n\t\tqueryArtists(byName: $byName) {\n\t\t\tname\n\t\t\timage\n\t\t\tid\n\t\t\talbums {\n\t\t\t\tname\n\t\t\t\timage\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t}\n"]);return C=function(){return e},e}var z=Object(d.a)(C());function N(){var e=Object(n.useState)(""),t=Object(m.a)(e,2),a=t[0],l=t[1],c=Object(f.a)(z),i=Object(m.a)(c,2),s=i[0],o=i[1].data,g=Object(n.useState)([]),d=Object(m.a)(g,2),b=d[0],v=d[1],y=Object(n.useState)(),O=Object(m.a)(y,2),S=O[0],w=O[1],x=Object(n.useState)(!1),k=Object(m.a)(x,2),A=k[0],C=k[1],N=Object(n.useCallback)(Object(p.debounce)((function(){s({variables:{byName:a}})}),500),[a]);Object(n.useEffect)((function(){return N(),N.cancel}),[a,N]);return Object(n.useEffect)((function(){if(o&&o.queryArtists!==[]){var e=o.queryArtists.slice(0,5).map((function(e){return e.name}));w(e)}}),[o]),r.a.createElement(h.a,{theme:I},r.a.createElement(E,null,r.a.createElement("h1",null,"Spoti Search")),r.a.createElement(j,{inputValue:a,handleChange:function(e){l(e.target.value)},suggestions:S,handleSelect:function(e){for(var t=e.suggestion,a=[],n=o.queryArtists.slice(0,5).map((function(e){return e})),r=0;r<n.length;r++)if(n[r].name===t){var l=null===n||void 0===n?void 0:n.splice(r,1),c=n;a=[].concat(Object(u.a)(l),Object(u.a)(c));break}v(a),C(!0)}}),A&&r.a.createElement(q,{artists:b}))}var I={global:{font:{family:"Roboto",size:"18px",height:"20px"}}},J=new i.a({uri:"https://spotify-graphql-server.herokuapp.com/graphql",cache:new s.a});c.a.render(r.a.createElement(r.a.StrictMode,null,r.a.createElement(o.a,{client:J},r.a.createElement(N,null))),document.getElementById("root"))}},[[115,1,2]]]);
-//# sourceMappingURL=main.d5729ca7.chunk.js.map