.rce-mbox-photo--error and rce-error-button classes added.

abdurrahmanekr · abdurrahmanekr · commit c5f96c8bef33 · 2018-10-25T09:55:05.000+03:00
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-chat-elements",
-  "version": "10.1.0",
+  "version": "10.1.1",
   "description": "Reactjs chat components",
   "author": "Avare Kodcu <abdurrahmaneker58@gmail.com>",
   "main": "dist/main.js",
diff --git a/src/Button/__tests__/__snapshots__/Button.js.snap b/src/Button/__tests__/__snapshots__/Button.js.snap
@@ -11,6 +11,7 @@ exports[`Button component should render without issues 1`] = `
       "color": "white",
     }
   }
+  title={null}
 >
   <span />
 </button>
diff --git a/src/Dropdown/__tests__/__snapshots__/Dropdown.js.snap b/src/Dropdown/__tests__/__snapshots__/Dropdown.js.snap
@@ -14,6 +14,7 @@ exports[`Dropdown component should render without issues 1`] = `
     icon={null}
     onClick={[Function]}
     text=""
+    title={null}
     type={null}
   />
   <div
diff --git a/src/FileMessage/FileMessage.css b/src/FileMessage/FileMessage.css
@@ -51,6 +51,9 @@
     align-items: center;
     display: flex;
 }
+.rce-mbox-file--buttons .rce-error-button {
+    display: inherit;
+}
 
 .rce-mbox-file--loading {
     font-size: 15px;
diff --git a/src/FileMessage/FileMessage.js b/src/FileMessage/FileMessage.js
@@ -56,8 +56,10 @@ export class FileMessage extends Component {
                     <div className="rce-mbox-file--buttons">
                         {
                             error &&
-                            <FaError
-                                color='#ff3d3d'/>
+                            <span className="rce-error-button">
+                                <FaError
+                                    color='#ff3d3d'/>
+                            </span>
                         }
                         {
                             !error &&
diff --git a/src/PhotoMessage/PhotoMessage.css b/src/PhotoMessage/PhotoMessage.css
@@ -64,3 +64,12 @@
 .rce-mbox-photo--download:active {
     opacity: .3;
 }
+
+.rce-mbox-photo--error {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: none;
+    font-size: 70px;
+    color: #eaeaea;
+}
diff --git a/src/PhotoMessage/PhotoMessage.js b/src/PhotoMessage/PhotoMessage.js
@@ -46,14 +46,14 @@ export class PhotoMessage extends Component {
                     {
                         error &&
                         <div className="rce-mbox-photo--img__block">
-                            <button
-                                className="rce-mbox-photo--img__block-item rce-mbox-photo--download">
+                            <span
+                                className="rce-mbox-photo--img__block-item rce-mbox-photo--error">
                                 <FaError/>
-                            </button>
+                            </span>
                         </div>
                     }
                     {
-                        !error &
+                        !error &&
                         this.props.data.status &&
                         !this.props.data.status.download &&
                         <div className="rce-mbox-photo--img__block">

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "react-chat-elements",`
`3`		`- "version": "10.1.0",`
	`3`	`+ "version": "10.1.1",`
`4`	`4`	`"description": "Reactjs chat components",`
`5`	`5`	`"author": "Avare Kodcu <abdurrahmaneker58@gmail.com>",`
`6`	`6`	`"main": "dist/main.js",`
Original file line number	Diff line number	Diff line change
@@ -11,6 +11,7 @@ exports[`Button component should render without issues 1`] = `
`11`	`11`	`"color": "white",`
`12`	`12`	`}`
`13`	`13`	`}`
	`14`	`+ title={null}`
`14`	`15`	`>`
`15`	`16`	`<span />`
`16`	`17`	`</button>`
Original file line number	Diff line number	Diff line change
`@@ -51,6 +51,9 @@`
`51`	`51`	`align-items: center;`
`52`	`52`	`display: flex;`
`53`	`53`	`}`
	`54`	`+.rce-mbox-file--buttons .rce-error-button {`
	`55`	`+ display: inherit;`
	`56`	`+}`
`54`	`57`
`55`	`58`	`.rce-mbox-file--loading {`
`56`	`59`	`font-size: 15px;`
Original file line number	Diff line number	Diff line change
`@@ -56,8 +56,10 @@ export class FileMessage extends Component {`
`56`	`56`	`<div className="rce-mbox-file--buttons">`
`57`	`57`	`{`
`58`	`58`	`error &&`
`59`		`- <FaError`
`60`		`- color='#ff3d3d'/>`
	`59`	`+ <span className="rce-error-button">`
	`60`	`+ <FaError`
	`61`	`+ color='#ff3d3d'/>`
	`62`	`+ </span>`
`61`	`63`	`}`
`62`	`64`	`{`
`63`	`65`	`!error &&`
Original file line number	Diff line number	Diff line change
`@@ -46,14 +46,14 @@ export class PhotoMessage extends Component {`
`46`	`46`	`{`
`47`	`47`	`error &&`
`48`	`48`	`<div className="rce-mbox-photo--img__block">`
`49`		`- <button`
`50`		`- className="rce-mbox-photo--img__block-item rce-mbox-photo--download">`
	`49`	`+ <span`
	`50`	`+ className="rce-mbox-photo--img__block-item rce-mbox-photo--error">`
`51`	`51`	`<FaError/>`
`52`		`- </button>`
	`52`	`+ </span>`
`53`	`53`	`</div>`
`54`	`54`	`}`
`55`	`55`	`{`
`56`		`- !error &`
	`56`	`+ !error &&`
`57`	`57`	`this.props.data.status &&`
`58`	`58`	`!this.props.data.status.download &&`
`59`	`59`	`<div className="rce-mbox-photo--img__block">`