Merge pull request #18762 from Scroody/I-18444

refactor: Changes to layout toast's workflow

akka-bbb-apps/src/main/scala/org/bigbluebutton/core/apps/layout/BroadcastLayoutMsgHdlr.scala

@@ -5,6 +5,7 @@ import org.bigbluebutton.core.models.{ Layouts, LayoutsType }
 import org.bigbluebutton.core.running.OutMsgRouter
 import org.bigbluebutton.core2.MeetingStatus2x
 import org.bigbluebutton.core.apps.{ PermissionCheck, RightsManagementTrait }
+import org.bigbluebutton.core2.message.senders.{ MsgBuilder }
 
 trait BroadcastLayoutMsgHdlr extends RightsManagementTrait {
   this: LayoutApp2x =>
@@ -58,5 +59,18 @@ trait BroadcastLayoutMsgHdlr extends RightsManagementTrait {
     val msgEvent = BbbCommonEnvCoreMsg(envelope, event)
 
     outGW.send(msgEvent)
+
+    if (body.pushLayout) {
+      val notifyEvent = MsgBuilder.buildNotifyUserInMeetingEvtMsg(
+        fromUserId,
+        liveMeeting.props.meetingProp.intId,
+        "info",
+        "user",
+        "app.layoutUpdate.label",
+        "Notification to when the presenter changes size of cams",
+        Vector()
+      )
+      outGW.send(notifyEvent)
+    }
   }
 }

bigbluebutton-html5/imports/ui/components/layout/modal/component.jsx

@@ -20,6 +20,7 @@ const LayoutModalComponent = (props) => {
   } = props;
 
   const [selectedLayout, setSelectedLayout] = useState(application.selectedLayout);
+  const [updateAllUsed, setUpdateAllUsed] = useState(false);
 
   const BASE_NAME = Meteor.settings.public.app.basename;
 
@@ -43,10 +44,18 @@ const LayoutModalComponent = (props) => {
       id: 'app.layout.modal.layoutLabel',
       description: 'Layout label',
     },
+    layoutToastLabelAuto: {
+      id: 'app.layout.modal.layoutToastLabelAuto',
+      description: 'Layout toast label',
+    },
     layoutToastLabel: {
       id: 'app.layout.modal.layoutToastLabel',
       description: 'Layout toast label',
     },
+    layoutToastLabelAutoOff: {
+      id: 'app.layout.modal.layoutToastLabelAutoOff',
+      description: 'Layout toast label',
+    },
     customLayout: {
       id: 'app.layout.style.custom',
       description: 'label for custom layout style',
@@ -82,7 +91,15 @@ const LayoutModalComponent = (props) => {
       application:
       { ...application, selectedLayout, pushLayout: updateAll },
     };
-    updateSettings(obj, intlMessages.layoutToastLabel);
+    if ((isModerator || isPresenter) && updateAll) {
+      updateSettings(obj, intlMessages.layoutToastLabelAuto);
+      setUpdateAllUsed(true);
+    } else if ((isModerator || isPresenter) && !updateAll && !updateAllUsed) {
+      updateSettings(obj, intlMessages.layoutToastLabelAutoOff);
+      setUpdateAllUsed(false);
+    } else {
+      updateSettings(obj, intlMessages.layoutToastLabel);
+    }
     setIsOpen(false);
   };
 

bigbluebutton-html5/imports/ui/components/layout/service.js

@@ -5,7 +5,7 @@ const setPushLayout = (pushLayout) => {
 };
 
 const setMeetingLayout = (options) => {
-  makeCall('changeLayout', options)
+  makeCall('changeLayout', options);
 };
 
 export default {

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

@@ -22,6 +22,14 @@ export default injectIntl(withTracker(({ intl }) => {
       if (obj.messageId === 'app.notification.userLeavePushAlert') {
         return UserService.UserLeftMeetingAlert(obj);
       }
+      if (obj.messageId === 'app.layoutUpdate.label') {
+        const last = new Date(Session.get('lastLayoutUpdateNotification'));
+        const now = new Date();
+        if (now - last < 1000) {
+          return {};
+        }
+        Session.set('lastLayoutUpdateNotification', now);
+      }
 
       notify(
         <FormattedMessage

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

@@ -7,6 +7,17 @@ import DropAreaContainer from './drop-areas/container';
 import VideoProviderContainer from '/imports/ui/components/video-provider/container';
 import Storage from '/imports/ui/services/storage/session';
 import { colorContentBackground } from '/imports/ui/stylesheets/styled-components/palette';
+import { defineMessages } from 'react-intl';
+import {
+  isPresenter,
+} from '/imports/ui/components/settings/service';
+
+const intlMessages = defineMessages({
+  layoutToastLabelAuto: {
+    id: 'app.layout.modal.layoutToastLabelAuto',
+    description: 'Layout toast label',
+  },
+});
 
 const WebcamComponent = ({
   cameraDock,

bigbluebutton-html5/public/locales/en.json

@@ -1114,6 +1114,7 @@
     "app.video.meetingCamCapReached": "Meeting reached it's simultaneous cameras limit",
     "app.video.dropZoneLabel": "Drop here",
     "app.fullscreenButton.label": "Make {0} fullscreen",
+    "app.layoutUpdate.label": "Layout updates applied to everyone",
     "app.fullscreenUndoButton.label": "Undo {0} fullscreen",
     "app.switchButton.expandLabel": "Expand screenshare video",
     "app.switchButton.shrinkLabel": "Shrink screenshare video",
@@ -1275,6 +1276,8 @@
     "app.layout.modal.layoutLabel": "Select your layout",
     "app.layout.modal.pushLayoutLabel": "Push to everyone",
     "app.layout.modal.layoutToastLabel": "Layout settings changed",
+    "app.layout.modal.layoutToastLabelAuto": "Auto layout updates enabled, layout updates are now applied to everyone",
+    "app.layout.modal.layoutToastLabelAutoOff": "Auto layout updates disabled",
     "app.layout.modal.layoutSingular": "Layout",
     "app.layout.modal.layoutBtnDesc": "Sets layout as selected option",
     "app.layout.style.custom": "Custom layout",