[MM-53081] Redux store refactor

standalone/src/init.ts

@@ -28,12 +28,12 @@ import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 import configureStore from 'mattermost-redux/store';
 import {Theme} from 'mattermost-redux/types/themes';
 import {
-    VOICE_CHANNEL_USER_SCREEN_ON,
-    VOICE_CHANNEL_ROOT_POST,
-    VOICE_CHANNEL_PROFILES_CONNECTED,
-    VOICE_CHANNEL_USERS_CONNECTED,
-    VOICE_CHANNEL_USERS_CONNECTED_STATES,
-    VOICE_CHANNEL_CALL_START,
+    USER_SCREEN_ON,
+    PROFILES_CONNECTED,
+    USERS_CONNECTED,
+    USERS_CONNECTED_STATES,
+    CALL_STATE,
+    CALL_HOST,
 } from 'plugin/action_types';
 import {getCallsConfig} from 'plugin/actions';
 import CallsClient from 'plugin/client';
@@ -145,44 +145,44 @@ async function fetchChannelData(store: Store, channelID: string) {
     }
 
     store.dispatch({
-        type: VOICE_CHANNEL_USERS_CONNECTED,
+        type: USERS_CONNECTED,
         data: {
             users: resp.call.users,
             channelID,
         },
     });
 
     store.dispatch({
-        type: VOICE_CHANNEL_ROOT_POST,
-        data: {
-            channelID,
-            rootPost: resp.call.thread_id,
-        },
-    });
-
-    store.dispatch({
-        type: VOICE_CHANNEL_USER_SCREEN_ON,
+        type: USER_SCREEN_ON,
         data: {
             channelID,
             userID: resp.call.screen_sharing_id,
         },
     });
 
     store.dispatch({
-        type: VOICE_CHANNEL_CALL_START,
+        type: CALL_STATE,
         data: {
             ID: resp.call.id,
             channelID: resp.channel_id,
             startAt: resp.call.start_at,
             ownerID: resp.call.owner_id,
+            threadID: resp.call.thread_id,
+        },
+    });
+
+    store.dispatch({
+        type: CALL_HOST,
+        data: {
+            channelID,
             hostID: resp.call.host_id,
-            dismissedNotification: resp.call.dismissed_notification || {},
+            hostChangeAt: resp.call.start_at,
         },
     });
 
     if (resp.call.users.length > 0) {
         store.dispatch({
-            type: VOICE_CHANNEL_PROFILES_CONNECTED,
+            type: PROFILES_CONNECTED,
             data: {
                 profiles: await getProfilesByIds(store.getState(), resp.call.users),
                 channelID,
@@ -196,7 +196,7 @@ async function fetchChannelData(store: Store, channelID: string) {
             userStates[users[i]] = {...states[i], id: users[i], voice: false};
         }
         store.dispatch({
-            type: VOICE_CHANNEL_USERS_CONNECTED_STATES,
+            type: USERS_CONNECTED_STATES,
             data: {
                 states: userStates,
                 channelID,

standalone/src/recording/components/recording_view/index.tsx

@@ -14,7 +14,7 @@ import {useIntl} from 'react-intl';
 import {useSelector} from 'react-redux';
 import ScreenIcon from 'src/components/icons/screen_icon';
 import Timestamp from 'src/components/timestamp';
-import {voiceChannelCallHostID, voiceChannelScreenSharingID, voiceConnectedProfiles, voiceUsersStatuses} from 'src/selectors';
+import {screenSharingIDForCurrentCall, profilesInCurrentCall, usersStatusesInCurrentCall, hostIDForCurrentCall} from 'src/selectors';
 
 import {callProfileImages} from 'src/recording/selectors';
 
@@ -26,17 +26,17 @@ const RecordingView = () => {
     const [screenStream, setScreenStream] = useState<MediaStream|null>(null);
     const callsClient = window.callsClient;
     const channelID = callsClient?.channelID || '';
-    const screenSharingID = useSelector((state: GlobalState) => voiceChannelScreenSharingID(state, channelID)) || '';
-    const statuses = useSelector(voiceUsersStatuses);
-    const profiles = sortedProfiles(useSelector(voiceConnectedProfiles), statuses, screenSharingID);
+    const screenSharingID = useSelector((state: GlobalState) => screenSharingIDForCurrentCall(state));
+    const statuses = useSelector(usersStatusesInCurrentCall);
+    const profiles = sortedProfiles(useSelector(profilesInCurrentCall), statuses, screenSharingID);
     const profileImages = useSelector((state: GlobalState) => callProfileImages(state, channelID));
     const pictures: {[key: string]: string} = {};
     if (profileImages) {
         for (let i = 0; i < profiles.length; i++) {
             pictures[String(profiles[i].id)] = profileImages[profiles[i].id];
         }
     }
-    const callHostID = useSelector((state: GlobalState) => voiceChannelCallHostID(state, channelID)) || '';
+    const hostID = useSelector((state: GlobalState) => hostIDForCurrentCall(state));
 
     const attachVoiceTracks = (tracks: MediaStreamTrack[]) => {
         for (const track of tracks) {
@@ -155,7 +155,7 @@ const RecordingView = () => {
                     isSpeaking={isSpeaking}
                     isHandRaised={isHandRaised}
                     reaction={status?.reaction}
-                    isHost={profile.id === callHostID}
+                    isHost={profile.id === hostID}
                 />
             );
         });

standalone/src/recording/index.tsx

@@ -8,14 +8,14 @@ import {Theme} from 'mattermost-redux/types/themes';
 import {getCurrentUserId} from 'mattermost-webapp/packages/mattermost-redux/src/selectors/entities/users';
 import {logErr} from 'plugin/log';
 import {pluginId} from 'plugin/manifest';
-import {voiceConnectedProfilesInChannel, voiceChannelCallStartAt} from 'plugin/selectors';
+import {profilesInCallInChannel, callStartAtForCallInChannel} from 'plugin/selectors';
 import {Store} from 'plugin/types/mattermost-webapp';
 import {getProfilesByIds, getPluginPath, fetchTranslationsFile, setCallsGlobalCSSVars, runWithRetry} from 'plugin/utils';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import {IntlProvider} from 'react-intl';
 import {Provider} from 'react-redux';
-import {VOICE_CHANNEL_USER_CONNECTED} from 'src/action_types';
+import {USER_CONNECTED} from 'src/action_types';
 
 import init from '../init';
 import recordingReducer from 'src/recording/reducers';
@@ -70,20 +70,20 @@ async function initRecordingStore(store: Store, channelID: string) {
 }
 
 async function initRecording(store: Store, theme: Theme, channelID: string) {
-    if (!voiceChannelCallStartAt(store.getState(), channelID)) {
+    if (!callStartAtForCallInChannel(store.getState(), channelID)) {
         throw new Error('call is missing from store');
     }
 
     await store.dispatch({
-        type: VOICE_CHANNEL_USER_CONNECTED,
+        type: USER_CONNECTED,
         data: {
             channelID,
             userID: getCurrentUserId(store.getState()),
             currentUserID: getCurrentUserId(store.getState()),
         },
     });
 
-    const profiles = voiceConnectedProfilesInChannel(store.getState(), channelID);
+    const profiles = profilesInCallInChannel(store.getState(), channelID);
 
     if (profiles?.length > 0) {
         store.dispatch({

standalone/src/widget/index.tsx

@@ -8,7 +8,7 @@ import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
 import {Theme} from 'mattermost-redux/types/themes';
 import {isOpenChannel, isPrivateChannel} from 'mattermost-redux/utils/channel_utils';
 import {
-    VOICE_CHANNEL_USER_CONNECTED,
+    USER_CONNECTED,
 } from 'plugin/action_types';
 import CallWidget from 'plugin/components/call_widget';
 import {
@@ -30,7 +30,7 @@ import init from '../init';
 
 async function initWidget(store: Store, theme: Theme, channelID: string) {
     store.dispatch({
-        type: VOICE_CHANNEL_USER_CONNECTED,
+        type: USER_CONNECTED,
         data: {
             channelID,
             userID: getCurrentUserId(store.getState()),

webapp/src/action_types.ts

@@ -1,28 +1,27 @@
 import {pluginId} from './manifest';
 
-export const VOICE_CHANNEL_USER_CONNECTED = pluginId + '_voice_channel_user_connected';
-export const VOICE_CHANNEL_USER_DISCONNECTED = pluginId + '_voice_channel_user_disconnected';
-export const VOICE_CHANNEL_USER_MUTED = pluginId + '_voice_channel_user_muted';
-export const VOICE_CHANNEL_USER_UNMUTED = pluginId + '_voice_channel_user_unmuted';
-export const VOICE_CHANNEL_USER_VOICE_ON = pluginId + '_voice_channel_user_voice_on';
-export const VOICE_CHANNEL_USER_VOICE_OFF = pluginId + '_voice_channel_user_voice_off';
-export const VOICE_CHANNEL_USERS_CONNECTED = pluginId + '_voice_channel_users_connected';
-export const VOICE_CHANNEL_USERS_CONNECTED_STATES = pluginId + '_voice_channel_users_connected_states';
-export const VOICE_CHANNEL_PROFILES_CONNECTED = pluginId + '_voice_channel_profiles_connected';
-export const VOICE_CHANNEL_PROFILE_CONNECTED = pluginId + '_voice_channel_profile_connected';
-export const VOICE_CHANNEL_CALL_START = pluginId + '_voice_channel_call_start';
-export const VOICE_CHANNEL_USER_SCREEN_ON = pluginId + '_voice_channel_screen_on';
-export const VOICE_CHANNEL_USER_SCREEN_OFF = pluginId + '_voice_channel_screen_off';
-export const VOICE_CHANNEL_UNINIT = pluginId + '_voice_channel_uninit';
-export const VOICE_CHANNEL_USER_RAISE_HAND = pluginId + '_voice_channel_user_raise_hand';
-export const VOICE_CHANNEL_USER_UNRAISE_HAND = pluginId + '_voice_channel_user_unraise_hand';
-export const VOICE_CHANNEL_USER_REACTED = pluginId + '_voice_channel_user_reacted';
-export const VOICE_CHANNEL_USER_REACTED_TIMEOUT = pluginId + '_voice_channel_user_reacted_timeout';
-export const VOICE_CHANNEL_ROOT_POST = pluginId + '_voice_channel_root_post';
-export const VOICE_CHANNEL_CALL_HOST = pluginId + '_voice_channel_call_host';
-export const VOICE_CHANNEL_CALL_RECORDING_STATE = pluginId + '_voice_channel_call_recording_state';
-export const VOICE_CHANNEL_CALL_REC_PROMPT_DISMISSED = pluginId + '_voice_channel_call_rec_prompt_dismissed';
-export const VOICE_CHANNEL_USER_JOINED_TIMEOUT = pluginId + '_voice_channel_user_joined_timeout';
+export const USER_CONNECTED = pluginId + '_user_connected';
+export const USER_DISCONNECTED = pluginId + '_user_disconnected';
+export const USER_MUTED = pluginId + '_user_muted';
+export const USER_UNMUTED = pluginId + '_user_unmuted';
+export const USER_VOICE_ON = pluginId + '_user_voice_on';
+export const USER_VOICE_OFF = pluginId + '_user_voice_off';
+export const USERS_CONNECTED = pluginId + '_users_connected';
+export const USERS_CONNECTED_STATES = pluginId + '_users_connected_states';
+export const PROFILE_CONNECTED = pluginId + '_profile_connected';
+export const PROFILES_CONNECTED = pluginId + '_profiles_connected';
+export const CALL_STATE = pluginId + '_call_state';
+export const USER_SCREEN_ON = pluginId + '_screen_on';
+export const USER_SCREEN_OFF = pluginId + '_screen_off';
+export const UNINIT = pluginId + '_uninit';
+export const USER_RAISE_HAND = pluginId + '_user_raise_hand';
+export const USER_UNRAISE_HAND = pluginId + '_user_unraise_hand';
+export const USER_REACTED = pluginId + '_user_reacted';
+export const USER_REACTED_TIMEOUT = pluginId + '_user_reacted_timeout';
+export const CALL_HOST = pluginId + '_call_host';
+export const CALL_RECORDING_STATE = pluginId + '_call_recording_state';
+export const CALL_REC_PROMPT_DISMISSED = pluginId + '_call_rec_prompt_dismissed';
+export const USER_JOINED_TIMEOUT = pluginId + '_user_joined_timeout';
 
 export const SHOW_EXPANDED_VIEW = pluginId + '_show_expanded_view';
 export const HIDE_EXPANDED_VIEW = pluginId + '_hide_expanded_view';
@@ -39,8 +38,8 @@ export const RINGING_FOR_CALL = pluginId + '_ringing_for_call';
 export const DID_RING_FOR_CALL = pluginId + '_did_ring_for_call';
 export const DID_NOTIFY_FOR_CALL = pluginId + '_did_notify_for_call';
 
-// VOICE_CHANNEL_CALL_END is sent when the `/call end` command is used
-export const VOICE_CHANNEL_CALL_END = pluginId + '_voice_channel_call_end';
+// CALL_END is sent when the `/call end` command is used
+export const CALL_END = pluginId + '_call_end';
 
 export const RECEIVED_CALLS_CONFIG = pluginId + '_received_calls_config';
 export const RECORDINGS_ENABLED = pluginId + '_recordings_enabled';

webapp/src/actions.ts

@@ -21,11 +21,11 @@ import {CallsInTestModeModal, IDTestModeUser} from 'src/components/modals';
 import {RING_LENGTH} from 'src/constants';
 import {logErr} from 'src/log';
 import {
-    channelHasCall, connectedCallID, incomingCalls,
+    channelHasCall, idForCurrentCall, incomingCalls,
     ringingEnabled,
     ringingForCall,
-    voiceChannelCallDismissedNotification,
-    voiceChannelCalls,
+    callDismissedNotification,
+    calls,
 } from 'src/selectors';
 import * as Telemetry from 'src/types/telemetry';
 import {ChannelType} from 'src/types/types';
@@ -43,9 +43,9 @@ import {
     SHOW_EXPANDED_VIEW,
     SHOW_SCREEN_SOURCE_MODAL,
     SHOW_SWITCH_CALL_MODAL,
-    VOICE_CHANNEL_CALL_REC_PROMPT_DISMISSED,
-    VOICE_CHANNEL_CALL_RECORDING_STATE,
-    VOICE_CHANNEL_USER_DISCONNECTED,
+    CALL_REC_PROMPT_DISMISSED,
+    CALL_RECORDING_STATE,
+    USER_DISCONNECTED,
     RTCD_ENABLED,
     REMOVE_INCOMING_CALL,
     DID_RING_FOR_CALL,
@@ -242,7 +242,7 @@ export const startCallRecording = (callID: string) => (dispatch: Dispatch<Generi
         {method: 'post'},
     ).catch((err) => {
         dispatch({
-            type: VOICE_CHANNEL_CALL_RECORDING_STATE,
+            type: CALL_RECORDING_STATE,
             data: {
                 callID,
                 recState: {
@@ -266,7 +266,7 @@ export const stopCallRecording = async (callID: string) => {
 
 export const recordingPromptDismissedAt = (callID: string, dismissedAt: number) => (dispatch: Dispatch<GenericAction>) => {
     dispatch({
-        type: VOICE_CHANNEL_CALL_REC_PROMPT_DISMISSED,
+        type: CALL_REC_PROMPT_DISMISSED,
         data: {
             callID,
             dismissedAt,
@@ -316,7 +316,7 @@ export function incomingCallOnChannel(channelID: string, callID: string, callerI
             return;
         }
 
-        if (voiceChannelCallDismissedNotification(getState(), channelID)) {
+        if (callDismissedNotification(getState(), channelID)) {
             return;
         }
 
@@ -326,8 +326,8 @@ export function incomingCallOnChannel(channelID: string, callID: string, callerI
 
         // Never send a notification for a call you started yourself, or a call you are currently in.
         const currentUserID = getCurrentUserId(getState());
-        const connectedID = connectedCallID(getState());
-        if (currentUserID === callerID || connectedID === callID) {
+        const currentCallID = idForCurrentCall(getState());
+        if (currentUserID === callerID || currentCallID === callID) {
             return;
         }
 
@@ -352,10 +352,10 @@ export function incomingCallOnChannel(channelID: string, callID: string, callerI
 export const userDisconnected = (channelID: string, userID: string) => {
     return async (dispatch: DispatchFunc, getState: GetStateFunc) => {
         // save for later
-        const callID = voiceChannelCalls(getState())[channelID].ID || '';
+        const callID = calls(getState())[channelID].ID || '';
 
         await dispatch({
-            type: VOICE_CHANNEL_USER_DISCONNECTED,
+            type: USER_DISCONNECTED,
             data: {
                 channelID,
                 userID,

webapp/src/components/call_widget/index.ts

@@ -12,18 +12,18 @@ import {bindActionCreators, Dispatch} from 'redux';
 
 import {recordingPromptDismissedAt, showExpandedView, showScreenSourceModal, trackEvent} from 'src/actions';
 import {
-    voiceUsersStatuses,
-    voiceChannelCallStartAt,
-    voiceChannelScreenSharingID,
+    usersStatusesInCurrentCall,
+    callStartAtForCurrentCall,
+    screenSharingIDForCurrentCall,
     expandedView,
     getChannelUrlAndDisplayName,
     allowScreenSharing,
-    voiceConnectedProfiles,
-    voiceChannelCallHostID,
-    callRecording,
-    voiceChannelCallHostChangeAt,
-    recentlyJoinedUsers,
+    profilesInCurrentCall,
+    hostIDForCurrentCall,
+    hostChangeAtForCurrentCall,
+    recordingForCurrentCall,
     sortedIncomingCalls,
+    recentlyJoinedUsersInCurrentCall,
 } from 'src/selectors';
 import {alphaSortProfiles, stateSortProfiles} from 'src/utils';
 
@@ -37,14 +37,14 @@ const mapStateToProps = (state: GlobalState) => {
     const channel = getChannel(state, String(window.callsClient?.channelID));
     const currentUserID = getCurrentUserId(state);
 
-    const screenSharingID = voiceChannelScreenSharingID(state, channel?.id) || '';
+    const screenSharingID = screenSharingIDForCurrentCall(state);
 
     const sortedProfiles = (profiles: UserProfile[], statuses: {[key: string]: UserState}) => {
         return [...profiles].sort(alphaSortProfiles).sort(stateSortProfiles(profiles, statuses, screenSharingID, true));
     };
 
-    const statuses = voiceUsersStatuses(state);
-    const profiles = sortedProfiles(voiceConnectedProfiles(state), statuses);
+    const statuses = usersStatusesInCurrentCall(state);
+    const profiles = sortedProfiles(profilesInCurrentCall(state), statuses);
 
     const profilesMap: IDMappedObjects<UserProfile> = {};
     const picturesMap: {
@@ -67,15 +67,15 @@ const mapStateToProps = (state: GlobalState) => {
         profiles,
         profilesMap,
         picturesMap,
-        statuses: voiceUsersStatuses(state) || {},
-        callStartAt: voiceChannelCallStartAt(state, channel?.id) || Number(window.callsClient?.initTime),
-        callHostID: voiceChannelCallHostID(state, channel?.id) || '',
-        callHostChangeAt: voiceChannelCallHostChangeAt(state, channel?.id) || 0,
-        callRecording: callRecording(state, channel?.id),
+        statuses,
+        callStartAt: callStartAtForCurrentCall(state),
+        callHostID: hostIDForCurrentCall(state),
+        callHostChangeAt: hostChangeAtForCurrentCall(state),
+        callRecording: recordingForCurrentCall(state),
         screenSharingID,
         allowScreenSharing: allowScreenSharing(state),
         show: !expandedView(state),
-        recentlyJoinedUsers: recentlyJoinedUsers(state, channel?.id),
+        recentlyJoinedUsers: recentlyJoinedUsersInCurrentCall(state),
         wider: getMyTeams(state)?.length > 1,
         callsIncoming: sortedIncomingCalls(state),
     };