feature(layout): Use layout push as a boolean option

bigbluebutton-html5/imports/ui/components/app/component.jsx

@@ -263,10 +263,14 @@ class App extends Component {
       });
 
       if (pushLayoutToEveryone) {
-        LayoutService.setMeetingLayout(settingsLayout);
+        LayoutService.setMeetingLayout(selectedLayout);
       }
     }
 
+    if (pushLayoutToEveryone && !prevProps.pushLayoutToEveryone) {
+      LayoutService.setMeetingLayout(selectedLayout);
+    }
+
     if (mountRandomUserModal) mountModal(<RandomUserSelectContainer />);
 
     if (prevProps.currentUserEmoji.status !== currentUserEmoji.status) {

bigbluebutton-html5/imports/ui/components/app/container.jsx

@@ -184,7 +184,7 @@ export default injectIntl(withModalMounter(withTracker(({ intl, baseControls })
   }).fetch();
 
   const AppSettings = Settings.application;
-  const { selectedLayout } = AppSettings;
+  const { selectedLayout, pushLayout } = AppSettings;
   const { viewScreenshare } = Settings.dataSaving;
   const shouldShowExternalVideo = MediaService.shouldShowExternalVideo();
   const shouldShowScreenshare = MediaService.shouldShowScreenshare()
@@ -217,8 +217,7 @@ export default injectIntl(withModalMounter(withTracker(({ intl, baseControls })
     isPresenter: currentUser?.presenter,
     meetingLayout: layout,
     selectedLayout,
-    settingsLayout: selectedLayout?.replace('Push', ''),
-    pushLayoutToEveryone: selectedLayout?.includes('Push'),
+    pushLayoutToEveryone: pushLayout,
     audioAlertEnabled: AppSettings.chatAudioAlerts,
     pushAlertEnabled: AppSettings.chatPushAlerts,
     shouldShowScreenshare,

bigbluebutton-html5/imports/ui/components/settings/submenus/application/component.jsx

@@ -73,6 +73,10 @@ const intlMessages = defineMessages({
     id: 'app.submenu.application.layoutOptionLabel',
     description: 'layout options',
   },
+  pushLayoutLabel: {
+    id: 'app.submenu.application.pushLayoutLabel',
+    description: 'push layout togle',
+  },
   customLayout: {
     id: 'app.layout.style.custom',
     description: 'label for custom layout style',
@@ -321,19 +325,9 @@ class ApplicationMenu extends BaseMenu {
   }
 
   renderChangeLayout() {
-    const { intl, isModerator } = this.props;
+    const { intl, isModerator, showToggleLabel, displaySettingsStatus } = this.props;
     const { settings } = this.state;
 
-    if (isModerator) {
-      const pushLayouts = {
-        CUSTOM_PUSH: 'customPush',
-        SMART_PUSH: 'smartPush',
-        PRESENTATION_FOCUS_PUSH: 'presentationFocusPush',
-        VIDEO_FOCUS_PUSH: 'videoFocusPush',
-      };
-      Object.assign(LAYOUT_TYPE, pushLayouts);
-    }
-
     return (
       <>
         <Styled.Row>
@@ -359,6 +353,29 @@ class ApplicationMenu extends BaseMenu {
             </Styled.FormElementRight>
           </Styled.Col>
         </Styled.Row>
+        { isModerator ?
+          (<Styled.Row>
+            <Styled.Col>
+              <Styled.FormElement>
+                <Styled.Label>
+                  {intl.formatMessage(intlMessages.pushLayoutLabel)}
+                </Styled.Label>
+              </Styled.FormElement>
+            </Styled.Col>
+            <Styled.Col>
+              <Styled.FormElementRight>
+                {displaySettingsStatus(settings.pushLayout)}
+                <Toggle
+                  icons={false}
+                  defaultChecked={settings.pushLayout}
+                  onChange={() => this.handleToggle('pushLayout')}
+                  ariaLabel={intl.formatMessage(intlMessages.pushLayoutLabel)}
+                  showToggleLabel={showToggleLabel}
+                />
+              </Styled.FormElementRight>
+            </Styled.Col>
+          </Styled.Row>
+        ) : null }
       </>
     );
   }

bigbluebutton-html5/public/locales/en.json

@@ -381,6 +381,7 @@
     "app.submenu.application.noLocaleOptionLabel": "No active locales",
     "app.submenu.application.paginationEnabledLabel": "Video pagination",
     "app.submenu.application.layoutOptionLabel": "Layout type",
+    "app.submenu.application.pushLayoutLabel": "Push layout",
     "app.submenu.notification.SectionTitle": "Notifications",
     "app.submenu.notification.Desc": "Define how and what you will be notified.",
     "app.submenu.notification.audioAlertLabel": "Audio Alerts",

bigbluebutton-html5/public/locales/pt_BR.json

@@ -376,6 +376,7 @@
     "app.submenu.application.noLocaleOptionLabel": "Não existem esquemas de idiomas disponíveis",
     "app.submenu.application.paginationEnabledLabel": "Paginação de vídeo",
     "app.submenu.application.layoutOptionLabel": "Tipo de layout",
+    "app.submenu.application.pushLayoutLabel": "Replicar layout",
     "app.submenu.notification.SectionTitle": "Notificações",
     "app.submenu.notification.Desc": "Defina suas notificações.",
     "app.submenu.notification.audioAlertLabel": "Alertas de áudio",