import React from 'react';
import Debug from 'debug';
import alert from '../alert';

const debug = new Debug("components:alertAjax");

// A component to display Axios errors

export default (context) => {
  const Alert = alert(context);

  function AlertAjax({error, className}) {
    if (!error) {
      return null;
    }
    debug('error:', error);
    const {status} = error.response;
    debug('error status :', status);
    if(![401, 422].includes(status)){
      return null;
    }
    
    const {message} = error;
    
    return (<Alert.Danger className={className} message={message} />)
  }

  return AlertAjax;
}

@@ -1,12 +1,42 @@
+import get from %22lodash/get%22;%0A
 import React
@@ -45,15 +45,15 @@
 rom 
-'
+%22
 react
-'
+%22
 ;%0Aim
@@ -72,15 +72,15 @@
 rom 
-'
+%22
 debug
-'
+%22
 ;%0Aim
@@ -99,17 +99,17 @@
 rom 
-'
+%22
 ../alert
 ';%0A%0A
@@ -104,17 +104,17 @@
 ../alert
-'
+%22
 ;%0A%0Aconst
@@ -213,25 +213,23 @@
 default 
-(
 context
-)
  =%3E %7B%0A  
@@ -281,16 +281,17 @@
 rtAjax(%7B
+ 
 error, c
@@ -298,16 +298,17 @@
 lassName
+ 
 %7D) %7B%0A   
@@ -361,16 +361,16 @@
 bug(
-'
+%22
 error:
-'
+%22
 , er
@@ -386,22 +386,24 @@
  const %7B
+ 
 status
+ 
 %7D = erro
@@ -424,17 +424,17 @@
   debug(
-'
+%22
 error st
@@ -443,9 +443,9 @@
 us :
-'
+%22
 , st
@@ -457,16 +457,17 @@
 ;%0A    if
+ 
 (!%5B401, 
@@ -488,16 +488,17 @@
 status))
+ 
 %7B%0A      
@@ -524,36 +524,106 @@
     
-%0A    const %7B
+let message = get(error, %22response.data.error.message%22);%0A    if (!message) %7B%0A      
 message
-%7D
  = error
 ;%0A  
@@ -618,22 +618,32 @@
  = error
+.message
 ;%0A    
+%7D%0A
 %0A    ret
@@ -646,17 +646,16 @@
  return 
-(
 %3CAlert.D
@@ -702,17 +702,17 @@
 sage%7D /%3E
-)
+;
 %0A  %7D%0A%0A  
@@ -730,9 +730,10 @@
 tAjax;%0A%7D
+;
 %0A

revert AlertAjex