Reduce duplication

react/features/base/participants/components/Avatar.native.js

@@ -5,14 +5,16 @@ import { CachedImage, ImageCache } from 'react-native-img-cache';
 import { Platform } from '../../react';
 import { ColorPalette } from '../../styles';
 
-// FIXME @lyubomir: The string images/avatar2.png appears three times in our
-// source code at the time of this writing. Firstly, it presents a maintenance
-// obstacle which increases the risks of inconsistency. Secondly, it is
-// repulsive (when enlarged, especially, on mobile/React Native, for example).
 /**
  * The default image/source to be used in case none is specified or the
  * specified one fails to load.
  *
+ * XXX The relative path to the default/stock (image) file is defined by the
+ * <tt>const</tt> <tt>DEFAULT_AVATAR_RELATIVE_PATH</tt>. Unfortunately, the
+ * packager of React Native cannot deal with it early enough for the following
+ * <tt>require</tt> to succeed at runtime. Anyway, be sure to synchronize the
+ * relative path on Web and mobile for the purposes of consistency.
+ *
  * @private
  * @type {string}
  */

react/features/base/participants/constants.js

@@ -1,3 +1,18 @@
+/**
+ * The relative path to the default/stock avatar (image) file used on both
+ * Web/React and mobile/React Native (for the purposes of consistency).
+ *
+ * XXX (1) Web/React utilizes relativity on the Jitsi Meet deployment.
+ * (2) Mobile/React Native utilizes relativity on the local file system at build
+ * time. Unfortunately, the packager of React Native cannot deal with the
+ * <tt>const</tt> early enough for <tt>require</tt> to succeed at runtime.
+ * Anyway, be sure to synchronize the relative path on Web and mobile for the
+ * purposes of consistency.
+ *
+ * @type {string}
+ */
+export const DEFAULT_AVATAR_RELATIVE_PATH = 'images/avatar.png';
+
 /**
  * Local participant might not have real ID until he joins a conference,
  * so use 'local' as its default ID.

react/features/base/participants/functions.js

@@ -1,3 +1,5 @@
+import { DEFAULT_AVATAR_RELATIVE_PATH } from './constants';
+
 declare var config: Object;
 declare var interfaceConfig: Object;
 declare var MD5: Object;
@@ -20,7 +22,7 @@ export function getAvatarURL(participant) {
     // If disableThirdPartyRequests disables third-party avatar services, we are
     // restricted to a stock image of ours.
     if (typeof config === 'object' && config.disableThirdPartyRequests) {
-        return 'images/avatar.png';
+        return DEFAULT_AVATAR_RELATIVE_PATH;
     }
 
     const { avatarID, avatarURL, email, id } = participant;

react/features/toolbox/defaultToolbarButtons.js

@@ -2,13 +2,14 @@
 
 import React from 'react';
 
+import { DEFAULT_AVATAR_RELATIVE_PATH } from '../base/participants';
 import { openDeviceSelectionDialog } from '../device-selection';
 import { openDialOutDialog } from '../dial-out';
 import { openAddPeopleDialog, openInviteDialog } from '../invite';
-import UIEvents from '../../../service/UI/UIEvents';
-
 import { VideoQualityButton } from '../video-quality';
 
+import UIEvents from '../../../service/UI/UIEvents';
+
 declare var APP: Object;
 declare var interfaceConfig: Object;
 declare var JitsiMeetJS: Object;
@@ -342,7 +343,7 @@ const buttons: Object = {
         enabled: true,
         html: <img
             id = 'avatar'
-            src = 'images/avatar.png' />,
+            src = { DEFAULT_AVATAR_RELATIVE_PATH } />,
         id: 'toolbar_button_profile',
         onClick() {
             JitsiMeetJS.analytics.sendEvent('toolbar.profile.toggled');