Upgrading Genius and LastFM signed requests to fetch protocol, fixes #498

src/js/services/genius/actions.js

@@ -35,7 +35,7 @@ const sendRequest = (dispatch, getState, endpoint, method = 'GET', data = false)
     method,
     url,
     timeout: 30000,
-         	crossDomain: true,
+    crossDomain: true,
   };
 
   // only if we've got data do we add it to the request (this prevents appending of "&false" to the URL)
@@ -51,12 +51,25 @@ const sendRequest = (dispatch, getState, endpoint, method = 'GET', data = false)
   const loader_key = helpers.generateGuid();
   dispatch(uiActions.startLoading(loader_key, `genius_${endpoint}`));
 
-  $.ajax(config).then(
-    (response) => {
-      dispatch(uiActions.stopLoading(loader_key));
+  function status(response) {
+    dispatch(uiActions.stopLoading(loader_key));
 
-      if (response.meta && response.meta.status >= 200 && response.meta.status < 300 && response.response) {
-        resolve(response.response);
+    if (response.status >= 200 && response.status < 300) {
+      return Promise.resolve(response);
+    }
+    return Promise.reject(new Error(response.statusText));
+  }
+
+  fetch(url, config)
+    .then(status)
+    .then((response) => response.json())
+    .then((data) => {
+      const {
+        meta: { status },
+        response,
+      } = data;
+      if (status >= 200 && status < 300 && response) {
+        resolve(response);
       } else {
         reject({
           config,
@@ -65,17 +78,10 @@ const sendRequest = (dispatch, getState, endpoint, method = 'GET', data = false)
           error,
         });
       }
-    },
-    (xhr, status, error) => {
-      dispatch(uiActions.stopLoading(loader_key));
-      reject({
-        config,
-        xhr,
-        status,
-        error,
-      });
-    },
-  );
+    })
+    .catch((error) => {
+      reject(error);
+    });
 });
 
 

src/js/services/lastfm/actions.js

@@ -43,19 +43,18 @@ const sendRequest = (dispatch, getState, params, signed = false) => new Promise(
     dispatch(uiActions.stopLoading(loader_key));
 
     if (response.status >= 200 && response.status < 300) {
-      return Promise.resolve(response)
-    } else {
-      return Promise.reject(new Error(response.statusText))
+      return Promise.resolve(response);
     }
+    return Promise.reject(new Error(response.statusText));
   }
 
   fetch(url, config)
     .then(status)
-    .then(response => response.json())
-    .then(data => {
+    .then((response) => response.json())
+    .then((data) => {
       resolve(data);
     })
-    .catch(error => {
+    .catch((error) => {
       reject(error);
     });
 });
@@ -88,22 +87,32 @@ const sendSignedRequest = (dispatch, getState, params) => new Promise((resolve,
 
   const config = {
     method: 'GET',
-    cache: false,
     timeout: 30000,
   };
 
-  fetch(url, config)
-    .then(signResponse => {
-      dispatch(uiActions.stopLoading(loader_key));
+  function status(response) {
+    dispatch(uiActions.stopLoading(loader_key));
 
+    if (response.status >= 200 && response.status < 300) {
+      return Promise.resolve(response)
+    }
+    return Promise.reject(new Error(response.statusText));
+  }
+
+  fetch(url, config)
+    .then(status)
+    .then((response) => response.json())
+    .then((data) => {
       // Now we have signed params, we can make the actual request
-      sendRequest(dispatch, getState, signResponse.params, true)
+      sendRequest(dispatch, getState, data.params, true)
         .then(
-          response => resolve(response),
-          error => reject(error),
+          (response) => resolve(response),
+          (error) => reject(error),
         );
     })
-    .catch(error => reject(error));
+    .catch((error) => {
+      reject(error);
+    });
 });
 
 

src/scss/components/_loader.scss

@@ -53,7 +53,7 @@
 
 				&__circle {
 					@include animate();
-					stroke: rgba(175,175,175,1);
+					stroke: rgba(170,170,170,1);
 				}
 			}
 		}