From a76de8c4585c08dadd4f423b3df9299d4b87ce24 Mon Sep 17 00:00:00 2001
From: Arthurk12 <arthur_bockmann@hotmail.com>
Date: Tue, 14 Feb 2023 14:41:45 -0300
Subject: [PATCH] feat(captions): no longer writes in the pad

This feature was too coupled to the old closed captions' pads.
(e.g. the old closed captions feature should be enabled for this
 to work properly)
Some things were hardcoded and others didn't make sense from the
user experience perspective.
Reverts #876d8aa.
Partially reverts #802964f, removes changes to make closed captions'
pads compatible with live-transcription but keeps provider settings.
---
 .../server/handlers/transcriptUpdated.js       | 12 ------------
 .../ui/components/actions-bar/component.jsx    |  6 ++++++
 .../audio/captions/button/component.jsx        | 18 +-----------------
 .../audio/captions/button/container.jsx        |  4 ++--
 .../ui/components/captions/container.jsx       | 14 ++++++++++++++
 .../captions/writer-menu/container.jsx         |  6 +++---
 .../user-list/user-list-content/component.jsx  |  2 +-
 .../user-options/component.jsx                 | 17 +++++++++++++++++
 8 files changed, 44 insertions(+), 35 deletions(-)

diff --git a/bigbluebutton-html5/imports/api/audio-captions/server/handlers/transcriptUpdated.js b/bigbluebutton-html5/imports/api/audio-captions/server/handlers/transcriptUpdated.js
index a57d84f0a6..538de9ca3e 100644
--- a/bigbluebutton-html5/imports/api/audio-captions/server/handlers/transcriptUpdated.js
+++ b/bigbluebutton-html5/imports/api/audio-captions/server/handlers/transcriptUpdated.js
@@ -1,26 +1,14 @@
 import setTranscript from '/imports/api/audio-captions/server/modifiers/setTranscript';
-import updatePad from '/imports/api/pads/server/methods/updatePad';
-import Users from '/imports/api/users';
 
 export default function transcriptUpdated({ header, body }) {
   const {
     meetingId,
-    userId,
   } = header;
 
   const {
     transcriptId,
     transcript,
-    locale,
-    result,
   } = body;
 
-  if (result) {
-    const user = Users.findOne({ userId }, { fields: { name: 1 } });
-    const datetime = new Date(Date.now());
-    const userSpoke = `\n ${user.name} (${datetime.getHours()}:${datetime.getMinutes()}): ${transcript}`;
-    updatePad(meetingId, userId, 'en', userSpoke);
-  }
-
   setTranscript(meetingId, transcriptId, transcript);
 }
diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
index 9b5aa82ea8..084932c544 100755
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/component.jsx
@@ -1,4 +1,5 @@
 import React, { PureComponent } from 'react';
+import CaptionsButtonContainer from '/imports/ui/components/captions/button/container';
 import withShortcutHelper from '/imports/ui/components/shortcut-help/service';
 import deviceInfo from '/imports/utils/deviceInfo';
 import Styled from './styles';
@@ -67,6 +68,11 @@ class ActionsBar extends PureComponent {
             showPushLayout,
           }}
           />
+          { isCaptionsAvailable
+            ? (
+              <CaptionsButtonContainer {...{ intl }} />
+            )
+            : null }
           { !deviceInfo.isMobile
             ? (
               <AudioCaptionsButtonContainer />
diff --git a/bigbluebutton-html5/imports/ui/components/audio/captions/button/component.jsx b/bigbluebutton-html5/imports/ui/components/audio/captions/button/component.jsx
index c8fe1209a9..326bd995b3 100644
--- a/bigbluebutton-html5/imports/ui/components/audio/captions/button/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/audio/captions/button/component.jsx
@@ -3,11 +3,9 @@ import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
 import Service from '/imports/ui/components/audio/captions/service';
 import SpeechService from '/imports/ui/components/audio/captions/speech/service';
-import ServiceOldCaptions from '/imports/ui/components/captions/service';
 import ButtonEmoji from '/imports/ui/components/common/button/button-emoji/ButtonEmoji';
 import BBBMenu from '/imports/ui/components/common/menu/component';
 import Styled from './styles';
-import OldCaptionsService from '/imports/ui/components/captions/service';
 
 const intlMessages = defineMessages({
   start: {
@@ -90,16 +88,7 @@ const CaptionsButton = ({
   availableVoices,
   isSupported,
   isVoiceUser,
-  mountModal,
 }) => {
-  const usePrevious = (value) => {
-    const ref = useRef();
-    useEffect(() => {
-      ref.current = value;
-    });
-    return ref.current;
-  }
-
   const isTranscriptionDisabled = () => (
     currentSpeechLocale === DISABLED
   );
@@ -115,12 +104,7 @@ const CaptionsButton = ({
     if (!isTranscriptionDisabled()) selectedLocale.current = getSelectedLocaleValue;
   }, [currentSpeechLocale]);
 
-  const prevEnabled = usePrevious(enabled);
-
-  if (!enabled) return null;
-  if (!prevEnabled && enabled) {
-    OldCaptionsService.createCaptions('en');
-  }
+    if (!enabled) return null;
 
   const shouldRenderChevron = isSupported && isVoiceUser;
 
diff --git a/bigbluebutton-html5/imports/ui/components/audio/captions/button/container.jsx b/bigbluebutton-html5/imports/ui/components/audio/captions/button/container.jsx
index d5c017afa9..c755ca9a70 100644
--- a/bigbluebutton-html5/imports/ui/components/audio/captions/button/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/audio/captions/button/container.jsx
@@ -8,7 +8,7 @@ import AudioService from '/imports/ui/components/audio/service';
 
 const Container = (props) => <Button {...props} />;
 
-export default withModalMounter(withTracker(() => {
+export default withTracker(() => {
   const isRTL = document.documentElement.getAttribute('dir') === 'rtl';
   const availableVoices = SpeechService.getSpeechVoices();
   const currentSpeechLocale = SpeechService.getSpeechLocale();
@@ -23,4 +23,4 @@ export default withModalMounter(withTracker(() => {
     isSupported,
     isVoiceUser,
   };
-})(Container));
+})(Container);
diff --git a/bigbluebutton-html5/imports/ui/components/captions/container.jsx b/bigbluebutton-html5/imports/ui/components/captions/container.jsx
index a3b15ca08d..fc0ca2c311 100644
--- a/bigbluebutton-html5/imports/ui/components/captions/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/captions/container.jsx
@@ -11,6 +11,20 @@ const Container = (props) => {
   const { isResizing } = cameraDock;
   const layoutContextDispatch = layoutDispatch();
 
+  const { amIModerator } = props;
+
+  if (!amIModerator) {
+    layoutContextDispatch({
+      type: ACTIONS.SET_SIDEBAR_CONTENT_IS_OPEN,
+      value: false,
+    });
+    layoutContextDispatch({
+      type: ACTIONS.SET_SIDEBAR_CONTENT_PANEL,
+      value: PANELS.NONE,
+    });
+    return null;
+  }
+
   return <Captions {...{ layoutContextDispatch, isResizing, ...props }} />;
 };
 
diff --git a/bigbluebutton-html5/imports/ui/components/captions/writer-menu/container.jsx b/bigbluebutton-html5/imports/ui/components/captions/writer-menu/container.jsx
index 2cbadc0f0e..816d70a95d 100644
--- a/bigbluebutton-html5/imports/ui/components/captions/writer-menu/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/captions/writer-menu/container.jsx
@@ -6,7 +6,6 @@ import WriterMenu from './component';
 import { layoutDispatch } from '../../layout/context';
 import Auth from '/imports/ui/services/auth';
 import { UsersContext } from '/imports/ui/components/components-data/users-context/context';
-import SpeechService from '/imports/ui/components/audio/captions/speech/service';
 
 const ROLE_MODERATOR = Meteor.settings.public.user.role_moderator;
 
@@ -16,11 +15,12 @@ const WriterMenuContainer = (props) => {
   const usingUsersContext = useContext(UsersContext);
   const { users } = usingUsersContext;
   const currentUser = users[Auth.meetingID][Auth.userID];
+  const amIModerator = currentUser.role === ROLE_MODERATOR;
 
-  return <WriterMenu {...{ layoutContextDispatch, ...props }} />;
+  return amIModerator && <WriterMenu {...{ layoutContextDispatch, ...props }} />;
 };
 
 export default withModalMounter(withTracker(({ mountModal }) => ({
   closeModal: () => mountModal(null),
-  availableLocales: SpeechService.getSpeechVoices(),
+  availableLocales: Service.getAvailableLocales(),
 }))(WriterMenuContainer));
diff --git a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/component.jsx b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/component.jsx
index 13b7d7696b..5df01ec90b 100755
--- a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/component.jsx
@@ -33,7 +33,7 @@ class UserContent extends PureComponent {
     return (
       <Styled.Content data-test="userListContent">
         {isChatEnabled() ? <UserMessagesContainer /> : null}
-        <UserCaptionsContainer />
+        {currentUser.role === ROLE_MODERATOR ? <UserCaptionsContainer /> : null}
         <UserNotesContainer />
         {showWaitingRoom && currentUser.role === ROLE_MODERATOR
           ? (
diff --git a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/user-participants/user-options/component.jsx b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/user-participants/user-options/component.jsx
index 27fb4b0dc8..c198217408 100644
--- a/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/user-participants/user-options/component.jsx
+++ b/bigbluebutton-html5/imports/ui/components/user-list/user-list-content/user-participants/user-options/component.jsx
@@ -145,6 +145,7 @@ class UserOptions extends PureComponent {
     this.captionsId = _.uniqueId('list-item-');
 
     this.handleCreateBreakoutRoomClick = this.handleCreateBreakoutRoomClick.bind(this);
+    this.handleCaptionsClick = this.handleCaptionsClick.bind(this);
     this.onCreateBreakouts = this.onCreateBreakouts.bind(this);
     this.onInvitationUsers = this.onInvitationUsers.bind(this);
     this.renderMenuItems = this.renderMenuItems.bind(this);
@@ -195,6 +196,11 @@ class UserOptions extends PureComponent {
     );
   }
 
+  handleCaptionsClick() {
+    const { mountModal } = this.props;
+    mountModal(<CaptionsWriterMenu />);
+  }
+
   renderMenuItems() {
     const {
       intl,
@@ -295,6 +301,17 @@ class UserOptions extends PureComponent {
         });
       }
 
+      if (amIModerator && CaptionsService.isCaptionsEnabled()) {
+        this.menuItems.push({
+          icon: 'closed_caption',
+          label: intl.formatMessage(intlMessages.captionsLabel),
+          description: intl.formatMessage(intlMessages.captionsDesc),
+          key: this.captionsId,
+          onClick: this.handleCaptionsClick,
+          dataTest: 'writeClosedCaptions',
+        });
+      }
+
       if (amIModerator) {
         if (isLearningDashboardEnabled()) {
           this.menuItems.push({