diff --git a/src/components/Support/Support.jsx b/src/components/Support/Support.jsx
index 0d59c282fc1d..95d295db6425 100644
--- a/src/components/Support/Support.jsx
+++ b/src/components/Support/Support.jsx
@@ -1,6 +1,7 @@
import React from 'react';
import Backers from './support-backers.json';
import Additional from './support-additional.js';
+import SmallIcon from '../../assets/icon-square-small-slack.png';
import './Support.scss';
const SUPPORTERS = [ ...Backers ];
@@ -100,11 +101,11 @@ export default class Support extends React.Component {
title={ `$${formatMoney(supporter.totalDonations / 100)} by ${supporter.name || supporter.slug}` }
target="_blank"
href={ supporter.website || `https://opencollective.com/${supporter.slug}` }>
- { supporter.avatar ?
:
- {supporter.name || supporter.slug} }
+ src={ supporter.avatar || SmallIcon }
+ alt={ supporter.name || supporter.slug ? `${supporter.name || supporter.slug}'s avatar` : 'avatar' }
+ onError={ this._handleImgError } />}
{ rank === 'backer' ? : null }
))
@@ -118,4 +119,14 @@ export default class Support extends React.Component {
);
}
+
+ /**
+ * Handle images that aren't found
+ *
+ * @param {object} e - React synthetic event
+ */
+ _handleImgError(e) {
+ const imgNode = e.target;
+ imgNode.src = SmallIcon;
+ }
}