Cleanup Live screen (#4027)

Author: MichaelDeBoey

packages/app/src/app/overmind/effects/live/index.ts

@@ -413,7 +413,7 @@ class Live {
     });
   }
 
-  sendLiveMode(mode: string) {
+  sendLiveMode(mode: RoomInfo['mode']) {
     return this.send('live:mode', {
       mode,
     });

packages/app/src/app/overmind/namespaces/editor/actions.ts

@@ -608,11 +608,7 @@ export const forkExternalSandbox: AsyncAction<{
   }
 };
 
-export const forkSandboxClicked: AsyncAction = async ({
-  state,
-  effects,
-  actions,
-}) => {
+export const forkSandboxClicked: AsyncAction = async ({ actions, state }) => {
   if (!state.editor.currentSandbox) {
     return;
   }

packages/app/src/app/overmind/namespaces/live/actions.ts

@@ -2,6 +2,7 @@ import {
   IModuleStateModule,
   LiveMessage,
   LiveMessageEvent,
+  RoomInfo,
   UserSelection,
   UserViewRange,
 } from '@codesandbox/common/lib/types';
@@ -275,41 +276,40 @@ export const onSelectionChanged: Action<UserSelection> = (
   }
 };
 
-export const onModeChanged: Action<{ mode: string }> = (
-  { state, effects },
-  { mode }
+export const onModeChanged: Action<RoomInfo['mode']> = (
+  { effects, state },
+  mode
 ) => {
   if (state.live.isOwner && state.live.roomInfo) {
     state.live.roomInfo.mode = mode;
     effects.live.sendLiveMode(mode);
   }
 };
 
-export const onAddEditorClicked: Action<{
-  liveUserId: string;
-}> = ({ state, effects }, { liveUserId }) => {
+export const onAddEditorClicked: Action<string> = (
+  { effects, state },
+  liveUserId
+) => {
   if (!state.live.roomInfo) {
     return;
   }
+
   state.live.roomInfo.editorIds.push(liveUserId);
 
   effects.live.sendEditorAdded(liveUserId);
 };
 
-export const onRemoveEditorClicked: Action<any> = (
-  { state, effects },
-  { liveUserId, data }
+export const onRemoveEditorClicked: Action<string> = (
+  { effects, state },
+  liveUserId
 ) => {
-  const userId = liveUserId || data.editor_user_id;
-
   if (!state.live.roomInfo) {
     return;
   }
 
-  const editors = state.live.roomInfo.editorIds;
-  const newEditors = editors.filter(id => id !== userId);
-
-  state.live.roomInfo.editorIds = newEditors;
+  state.live.roomInfo.editorIds = state.live.roomInfo.editorIds.filter(
+    id => id !== liveUserId
+  );
 
   effects.live.sendEditorRemoved(liveUserId);
 };
@@ -346,16 +346,17 @@ export const onChatEnabledToggle: Action = ({ effects, state }) => {
   }
 };
 
-export const onFollow: Action<{
-  liveUserId: string;
-}> = ({ state, effects, actions }, { liveUserId }) => {
+export const onFollow: Action<string> = (
+  { actions, effects, state },
+  liveUserId
+) => {
   if (!state.live.roomInfo) {
     return;
   }
 
   effects.analytics.track('Follow Along in Live');
   state.live.followingUserId = liveUserId;
-  actions.live.revealViewRange({ liveUserId });
+  actions.live.revealViewRange(liveUserId);
 
   if (state.editor.currentModule) {
     // In case the selections were hidden first
@@ -395,15 +396,15 @@ export const onStopFollow: Action = ({ state, effects, actions }) => {
   }
 };
 
-export const revealViewRange: Action<{ liveUserId: string }> = (
-  { state, effects, actions },
-  { liveUserId }
+export const revealViewRange: Action<string> = (
+  { actions, effects, state },
+  liveUserId
 ) => {
   if (!state.live.roomInfo) {
     return;
   }
 
-  const user = state.live.roomInfo.users.find(u => u.id === liveUserId);
+  const user = state.live.roomInfo.users.find(({ id }) => id === liveUserId);
 
   if (user && user.currentModuleShortid && state.editor.currentSandbox) {
     const { modules } = state.editor.currentSandbox;

packages/app/src/app/overmind/namespaces/live/liveMessageOperators.ts

@@ -5,16 +5,18 @@ import {
   LiveMessage,
   LiveUser,
   Module,
+  RoomInfo,
   UserSelection,
   UserViewRange,
 } from '@codesandbox/common/lib/types';
 import { logBreadcrumb } from '@codesandbox/common/lib/utils/analytics/sentry';
 import { NotificationStatus } from '@codesandbox/notifications/lib/state';
-import { Operator } from 'app/overmind';
-import { getSavedCode } from 'app/overmind/utils/sandbox';
 import { camelizeKeys } from 'humps';
 import { json, mutate } from 'overmind';
 
+import { Operator } from 'app/overmind';
+import { getSavedCode } from 'app/overmind/utils/sandbox';
+
 export const onSave: Operator<LiveMessage<{
   saved_code: string;
   updated_at: string;
@@ -553,8 +555,8 @@ export const onUserViewRange: Operator<LiveMessage<{
 });
 
 export const onLiveMode: Operator<LiveMessage<{
-  mode: string;
-}>> = mutate(({ state, actions }, { _isOwnMessage, data }) => {
+  mode: RoomInfo['mode'];
+}>> = mutate(({ actions, state }, { _isOwnMessage, data }) => {
   if (!state.live.roomInfo) {
     return;
   }

packages/app/src/app/pages/Sandbox/Editor/Header/CollaboratorHeads/CollaboratorHeads.tsx

@@ -138,7 +138,7 @@ export const CollaboratorHeads: FunctionComponent = () => {
     if (liveUserId === user.id || followingUserId === user.id) {
       actions.live.onStopFollow();
     } else {
-      actions.live.onFollow({ liveUserId: user.id });
+      actions.live.onFollow(user.id);
     }
   };