ref: move participant joined notification to the middleware

modules/UI/UI.js

 import Filmstrip from './videolayout/Filmstrip';
 
 import { JitsiTrackErrors } from '../../react/features/base/lib-jitsi-meet';
-import {
-    getLocalParticipant,
-    showParticipantJoinedNotification
-} from '../../react/features/base/participants';
+import { getLocalParticipant } from '../../react/features/base/participants';
 import { toggleChat } from '../../react/features/chat';
 import { openDisplayNamePrompt } from '../../react/features/display-name';
 import { setEtherpadHasInitialzied } from '../../react/features/etherpad';
     if (status) {
         // FIXME: move updateUserStatus in participantPresenceChanged action
         UI.updateUserStatus(user, status);
-    } else {
-        APP.store.dispatch(showParticipantJoinedNotification(displayName));
     }
 
     // set initial display name

react/features/base/participants/middleware.js

     localParticipantJoined,
     localParticipantLeft,
     participantLeft,
-    participantUpdated
+    participantUpdated,
+    showParticipantJoinedNotification
 } from './actions';
 import {
     DOMINANT_SPEAKER_CHANGED,
         break;
     }
 
-    case PARTICIPANT_JOINED:
+    case PARTICIPANT_JOINED: {
         _maybePlaySounds(store, action);
 
+        const { participant: { name } } = action;
+
+        if (name) {
+            store.dispatch(showParticipantJoinedNotification(name));
+        }
+
         return _participantJoinedOrUpdated(store, next, action);
+    }
 
     case PARTICIPANT_LEFT:
         _maybePlaySounds(store, action);