From df3f6375a6a020ec34495a7a0d182ff8f1a12ab2 Mon Sep 17 00:00:00 2001
From: Abdurrahman eker <abdurrahmaneker58@gmail.com>
Date: Sat, 22 Dec 2018 15:30:33 +0300
Subject: [PATCH 1/3] img tag onError event added.

---
 package.json                                               | 2 +-
 src/Avatar/Avatar.js                                       | 7 ++++++-
 src/Avatar/__tests__/__snapshots__/Avatar.js.snap          | 1 +
 src/ChatItem/ChatItem.js                                   | 2 ++
 src/ChatItem/__tests__/__snapshots__/ChatItem.js.snap      | 1 +
 src/ChatList/ChatList.js                                   | 6 ++++++
 src/LocationMessage/LocationMessage.js                     | 5 ++++-
 .../__tests__/__snapshots__/LocationMessage.js.snap        | 1 +
 src/MessageBox/__tests__/__snapshots__/MessageBox.js.snap  | 1 +
 9 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index a5b76bef..27c46610 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-chat-elements",
-  "version": "10.1.2",
+  "version": "10.2.0",
   "description": "Reactjs chat components",
   "author": "Avare Kodcu <abdurrahmaneker58@gmail.com>",
   "main": "dist/main.js",
diff --git a/src/Avatar/Avatar.js b/src/Avatar/Avatar.js
index 11930df2..eb657ece 100644
--- a/src/Avatar/Avatar.js
+++ b/src/Avatar/Avatar.js
@@ -7,7 +7,11 @@ export class Avatar extends Component {
     render() {
         return (
             <div className={classNames('rce-avatar-container', this.props.type, this.props.size, this.props.className)}>
-                <img alt={this.props.alt} src={this.props.src} className={'rce-avatar'} />
+                <img
+                    alt={this.props.alt}
+                    src={this.props.src}
+                    onError={this.props.onError}
+                    className={'rce-avatar'} />
                 {this.props.sideElement}
             </div>
         );
@@ -20,6 +24,7 @@ Avatar.defaultProps = {
     src: '',
     alt: '',
     sideElement: null,
+    onError: () => void(0),
 };
 
 export default Avatar;
diff --git a/src/Avatar/__tests__/__snapshots__/Avatar.js.snap b/src/Avatar/__tests__/__snapshots__/Avatar.js.snap
index 213831f8..4bb3fade 100644
--- a/src/Avatar/__tests__/__snapshots__/Avatar.js.snap
+++ b/src/Avatar/__tests__/__snapshots__/Avatar.js.snap
@@ -7,6 +7,7 @@ exports[`Avatar component should render without issues 1`] = `
   <img
     alt=""
     className="rce-avatar"
+    onError={[Function]}
     src=""
   />
 </div>
diff --git a/src/ChatItem/ChatItem.js b/src/ChatItem/ChatItem.js
index 47ffe85f..082e98e7 100644
--- a/src/ChatItem/ChatItem.js
+++ b/src/ChatItem/ChatItem.js
@@ -26,6 +26,7 @@ export class ChatItem extends Component {
                                     {this.props.statusText}
                                 </span>
                             }
+                            onError={this.props.onAvatarError}
                             type={classNames('circle', {'flexible': this.props.avatarFlexible})}/>
                     </div>
 
@@ -77,6 +78,7 @@ ChatItem.defaultProps = {
     statusColor: null,
     statusText: null,
     dateString: null,
+    onAvatarError: () => void(0),
 }
 
 export default ChatItem;
diff --git a/src/ChatItem/__tests__/__snapshots__/ChatItem.js.snap b/src/ChatItem/__tests__/__snapshots__/ChatItem.js.snap
index 21dae80c..dbddc58e 100644
--- a/src/ChatItem/__tests__/__snapshots__/ChatItem.js.snap
+++ b/src/ChatItem/__tests__/__snapshots__/ChatItem.js.snap
@@ -13,6 +13,7 @@ exports[`ChatItem component should render without issues 1`] = `
     >
       <Avatar
         alt=""
+        onError={[Function]}
         sideElement={null}
         size="large"
         src=""
diff --git a/src/ChatList/ChatList.js b/src/ChatList/ChatList.js
index c8f46de5..5b495421 100644
--- a/src/ChatList/ChatList.js
+++ b/src/ChatList/ChatList.js
@@ -18,6 +18,11 @@ export class ChatList extends Component {
             this.props.onContextMenu(item, i, e);
     }
 
+    onAvatarError(item, i, e) {
+        if (this.props.onAvatarError instanceof Function)
+            this.props.onAvatarError(item, i, e);
+    }
+
     render() {
         return (
             <div
@@ -29,6 +34,7 @@ export class ChatList extends Component {
                             id={x.id || i}
                             key={i}
                             {...x}
+                            onAvatarError={(e) => this.onAvatarError(x,i,e)}
                             onContextMenu={(e) => this.onContextMenu(x,i,e)}
                             onClick={() => this.onClick(x, i)}/>
                     ))
diff --git a/src/LocationMessage/LocationMessage.js b/src/LocationMessage/LocationMessage.js
index edaf3f66..d14c55f9 100644
--- a/src/LocationMessage/LocationMessage.js
+++ b/src/LocationMessage/LocationMessage.js
@@ -41,7 +41,9 @@ export class LocationMessage extends Component {
                     target={this.props.target}
                     href={this.props.href || this.props.src || this.buildURL(MAP_URL)}
                     className={this.className()}>
-                    <img className='rce-mbox-location-img'
+                    <img
+                        onError={this.props.onError}
+                        className='rce-mbox-location-img'
                         src={
                             this.props.src ||
                             this.buildURL(STATIC_URL)
@@ -63,6 +65,7 @@ LocationMessage.defaultProps = {
     apiKey: '',
     zoom: 14,
     markerColor: 'red',
+    onError: () => void(0),
 }
 
 export default LocationMessage;
diff --git a/src/LocationMessage/__tests__/__snapshots__/LocationMessage.js.snap b/src/LocationMessage/__tests__/__snapshots__/LocationMessage.js.snap
index d0d853e3..f9333a8e 100644
--- a/src/LocationMessage/__tests__/__snapshots__/LocationMessage.js.snap
+++ b/src/LocationMessage/__tests__/__snapshots__/LocationMessage.js.snap
@@ -11,6 +11,7 @@ exports[`LocationMessage component should render without issues 1`] = `
   >
     <img
       className="rce-mbox-location-img"
+      onError={[Function]}
       src="https://maps.googleapis.com/maps/api/staticmap?markers=color:red|undefined,undefined&zoom=14&size=270x200&scale=2&key="
     />
   </a>
diff --git a/src/MessageBox/__tests__/__snapshots__/MessageBox.js.snap b/src/MessageBox/__tests__/__snapshots__/MessageBox.js.snap
index 0b893b77..94223099 100644
--- a/src/MessageBox/__tests__/__snapshots__/MessageBox.js.snap
+++ b/src/MessageBox/__tests__/__snapshots__/MessageBox.js.snap
@@ -10,6 +10,7 @@ exports[`MessageBox component should render without issues 1`] = `
   >
     <div
       className="rce-mbox-body"
+      onContextMenu={null}
     >
       <div
         className="rce-mbox-text"

From 54bf120adbb78dc2ddc378fbddec4dd137c05dfd Mon Sep 17 00:00:00 2001
From: Abdurrahman eker <abdurrahmaneker58@gmail.com>
Date: Sat, 22 Dec 2018 15:34:17 +0300
Subject: [PATCH 2/3] onAvatarError event added on ChatList

---
 README.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/README.md b/README.md
index 39120fd3..f3368511 100644
--- a/README.md
+++ b/README.md
@@ -235,6 +235,7 @@ import { ChatList } from 'react-chat-elements'
 | dataSource | [] | array | chat list array |
 | onClick | none | function | chat list item on click (chat(object) is returned) |
 | onContextMenu | none | function | chat list item on context menu (chat(object) is returned) |
+| onAvatarError | none | function | chat list item on error avatar img |
 
 ## Input Component
 

From c41df4527534961bb343515289ae5e10c23ab685 Mon Sep 17 00:00:00 2001
From: Abdurrahman eker <abdurrahmaneker58@gmail.com>
Date: Sat, 22 Dec 2018 15:37:36 +0300
Subject: [PATCH 3/3] Avatar description added.

---
 README.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/README.md b/README.md
index f3368511..d5db4621 100644
--- a/README.md
+++ b/README.md
@@ -446,6 +446,7 @@ import { Avatar } from 'react-chat-elements'
 | size | default | string | image size. default (25px), xsmall(30px), small(35px), medium(40px), large(45px), xlarge (55px) |
 | type | default | string | types: default, circle, rounded(border radius 5px), flexible |
 | sideElement | none | component | avatar side element |
+| onError | none | component | avatar img onerror |
 
 
 ## LocationMessage Component