fix(avatar): Avatar properties not updated before local user join

Replaces changeAvatarID, changeAvatarURL and changeEmail with
participantUpdated action.
participantUpdated can be fired for local user without id. This
fixes the problem with updating the local user before the user
join the conference which results in fix for failing to execute
commands for avatarID, avatarURL and email right after the iframe
api creates the iframe with Jitsi Meet.

conference.js

     isFatalJitsiConnectionError
 } from './react/features/base/lib-jitsi-meet';
 import {
-    changeParticipantAvatarID,
-    changeParticipantAvatarURL,
-    changeParticipantEmail,
     participantJoined,
     participantLeft,
-    participantRoleChanged
+    participantRoleChanged,
+    participantUpdated
 } from './react/features/base/participants';
 import {
     mediaPermissionPromptVisibilityChanged,
  * @param {string} value new value
  */
 function sendData (command, value) {
+    if(!room) {
+        return;
+    }
+
     room.removeCommand(command);
     room.sendCommand(command, {value: value});
 }
 
         APP.UI.addListener(UIEvents.EMAIL_CHANGED, this.changeLocalEmail);
         room.addCommandListener(this.commands.defaults.EMAIL, (data, from) => {
-            APP.store.dispatch(changeParticipantEmail(from, data.value));
+            APP.store.dispatch(participantUpdated({
+                id: from,
+                email: data.value
+            }));
             APP.UI.setUserEmail(from, data.value);
         });
 
             this.commands.defaults.AVATAR_URL,
             (data, from) => {
                 APP.store.dispatch(
-                    changeParticipantAvatarURL(from, data.value));
+                    participantUpdated({
+                        id: from,
+                        avatarURL: data.value
+                    }));
                 APP.UI.setUserAvatarUrl(from, data.value);
         });
 
         room.addCommandListener(this.commands.defaults.AVATAR_ID,
             (data, from) => {
                 APP.store.dispatch(
-                    changeParticipantAvatarID(from, data.value));
+                    participantUpdated({
+                        id: from,
+                        avatarID: data.value
+                    }));
                 APP.UI.setUserAvatarID(from, data.value);
             });
 
         if (email === APP.settings.getEmail()) {
             return;
         }
-        APP.store.dispatch(changeParticipantEmail(room.myUserId(), email));
+
+        const localId = room ? room.myUserId() : undefined;
+
+        APP.store.dispatch(participantUpdated({
+            id: localId,
+            local: true,
+            email
+        }));
 
         APP.settings.setEmail(email);
-        APP.UI.setUserEmail(room.myUserId(), email);
+        APP.UI.setUserEmail(localId, email);
         sendData(commands.EMAIL, email);
     },
 
         if (url === APP.settings.getAvatarUrl()) {
             return;
         }
-        APP.store.dispatch(changeParticipantAvatarURL(room.myUserId(), url));
+
+        const localId = room ? room.myUserId() : undefined;
+
+        APP.store.dispatch(participantUpdated({
+            id: localId,
+            local: true,
+            avatarURL: url
+        }));
 
         APP.settings.setAvatarUrl(url);
-        APP.UI.setUserAvatarUrl(room.myUserId(), url);
+        APP.UI.setUserAvatarUrl(localId, url);
         sendData(commands.AVATAR_URL, url);
     },
 

modules/UI/UI.js

     Avatar.setUserEmail(id, email);
 
     changeAvatar(id, Avatar.getAvatarUrl(id));
+    if (APP.conference.isLocalId(id)) {
+        Profile.changeEmail(email);
+    }
 };
 
 /**

modules/UI/avatar/Avatar.js

 export default {
     /**
      * Sets prop in users object.
-     * @param id {string} user id
+     * @param id {string} user id or undefined for the local user.
      * @param prop {string} name of the prop
      * @param val {string} value to be set
      */
         // FIXME: Fixes the issue with not be able to return avatar for the
         // local user when the conference has been left. Maybe there is beter
         // way to solve it.
-        if(APP.conference.isLocalId(id)) {
+        if(!id || APP.conference.isLocalId(id)) {
             id = "local";
         }
         if(!val || (users[id] && users[id][prop] === val))

modules/UI/side_pannels/profile/Profile.js

         </div>
         <div class="sideToolbarBlock">
             <label data-i18n="profile.setEmailLabel"></label>
-            <input id="setEmail" type="text" class="input-control" 
+            <input id="setEmail" type="text" class="input-control"
                 data-i18n="[placeholder]profile.setEmailInput">
         </div>
-        <div id="profile_auth_container" 
+        <div id="profile_auth_container"
              class="sideToolbarBlock auth_container">
             <p data-i18n="toolbar.authenticate"></p>
             <ul>
         $('#avatar').attr('src', avatarUrl);
     },
 
+    /**
+     * Change the value of the field for the user email.
+     * @param {string} email the new value that will be displayed in the field.
+     */
+    changeEmail (email) {
+        $('#setEmail').val(email);
+    },
+
     /**
      * Shows or hides authentication related buttons
      * @param {boolean} show <tt>true</tt> to show or <tt>false</tt> to hide

react/features/base/conference/actions.js

 import { JitsiConferenceEvents } from '../lib-jitsi-meet';
 import {
-    changeParticipantAvatarID,
-    changeParticipantAvatarURL,
-    changeParticipantEmail,
     dominantSpeakerChanged,
     getLocalParticipant,
     participantJoined,
     participantLeft,
-    participantRoleChanged
+    participantRoleChanged,
+    participantUpdated
 } from '../participants';
 import { trackAdded, trackRemoved } from '../tracks';
 
 
     conference.addCommandListener(
             AVATAR_ID_COMMAND,
-            (data, id) => dispatch(changeParticipantAvatarID(id, data.value)));
+            (data, id) => dispatch(participantUpdated({
+                id,
+                avatarID: data.value
+            })));
     conference.addCommandListener(
             AVATAR_URL_COMMAND,
-            (data, id) => dispatch(changeParticipantAvatarURL(id, data.value)));
+            (data, id) => dispatch(participantUpdated({
+                id,
+                avatarURL: data.value
+            })));
     conference.addCommandListener(
             EMAIL_COMMAND,
-            (data, id) => dispatch(changeParticipantEmail(id, data.value)));
+            (data, id) => dispatch(participantUpdated({
+                id,
+                email: data.value
+            })));
 }
 
 /**

react/features/base/participants/actions.js

 } from './actionTypes';
 import { getLocalParticipant } from './functions';
 
-/**
- * Action to update a participant's avatar ID.
- *
- * @param {string} id - Participant's ID.
- * @param {string} avatarID - Participant's avatar ID.
- * @returns {{
- *     type: PARTICIPANT_UPDATED,
- *     participant: {
- *         id: string,
- *         avatarID: string,
- *     }
- * }}
- */
-export function changeParticipantAvatarID(id, avatarID) {
-    return {
-        type: PARTICIPANT_UPDATED,
-        participant: {
-            id,
-            avatarID
-        }
-    };
-}
-
-/**
- * Action to update a participant's avatar URL.
- *
- * @param {string} id - Participant's ID.
- * @param {string} avatarURL - Participant's avatar URL.
- * @returns {{
- *     type: PARTICIPANT_UPDATED,
- *     participant: {
- *         id: string,
- *         avatarURL: string,
- *     }
- * }}
- */
-export function changeParticipantAvatarURL(id, avatarURL) {
-    return {
-        type: PARTICIPANT_UPDATED,
-        participant: {
-            id,
-            avatarURL
-        }
-    };
-}
-
-/**
- * Action to update a participant's email.
- *
- * @param {string} id - Participant's ID.
- * @param {string} email - Participant's email.
- * @returns {{
- *     type: PARTICIPANT_UPDATED,
- *     participant: {
- *         id: string,
- *         email: string
- *     }
- * }}
- */
-export function changeParticipantEmail(id, email) {
-    return {
-        type: PARTICIPANT_UPDATED,
-        participant: {
-            id,
-            email
-        }
-    };
-}
-
 /**
  * Create an action for when dominant speaker changes.
  *
  * }}
  */
 export function participantRoleChanged(id, role) {
+    return participantUpdated({
+        id,
+        role
+    });
+}
+
+/**
+ * Action to signal that some of participant properties has been changed.
+ *
+ * @param {Participant} participant={} - Information about participant. To
+ * identify the participant the object should contain either property id with
+ * value the id of the participant or property local with value true (if the
+ * local participant hasn't joined the conference yet).
+ * @returns {{
+ *     type: PARTICIPANT_UPDATED,
+ *     participant: Participant
+ * }}
+ */
+export function participantUpdated(participant = {}) {
     return {
         type: PARTICIPANT_UPDATED,
-        participant: {
-            id,
-            role
-        }
+        participant
     };
 }
 

react/features/base/participants/reducer.js

 
     case PARTICIPANT_UPDATED: {
         const participant = action.participant; // eslint-disable-line no-shadow
-        const { id } = participant;
+        const { local } = participant;
+        let { id } = participant;
+
+        if (!id && local) {
+            id = LOCAL_PARTICIPANT_DEFAULT_ID;
+        }
 
         if (state.id === id) {
             const newState = { ...state };