@bigbinary/neeto-media-recorder 1.3.20 → 1.3.21

package/README.md

@@ -32,12 +32,15 @@ This package exports four different sets of functions and components.
   import { MediaRecorder } from "@bigbinary/neeto-media-recorder";
   ```
 
-  `MediaRecorder` accepts two props:
+  `MediaRecorder` accepts three props:
 
   - `onUploadComplete`: This callback will get triggered once the uploading of
     the screen recording is completed.
   - `onDiscard`: This callback will get triggered whenever the user discard's
     the screen recording.
+  - `appName`: This prop is used to set the application name which will be used
+    in the permission denied messages. By default it will be set to
+    `globalProps.appName`
 
 ### Utilities
 

package/index.js

@@ -6,7 +6,7 @@ import { SCREEN_RECORDER_STATUS, SCREEN_RECORDER_ERROR, IS_SAFARI_EXTENSION, UPL
 import { screenRecorder, multipartS3Uploader } from '@bigbinary/neeto-media-recorder/core';
 import PageLoader from '@bigbinary/neeto-molecules/PageLoader';
 import { Typography, Spinner, Button, Callout, Alert } from '@bigbinary/neetoui';
-import { useTranslation } from 'react-i18next';
+import { useTranslation, Trans } from 'react-i18next';
 import { useMutation } from 'react-query';
 import axios from 'axios';
 import withT from '@bigbinary/neeto-commons-frontend/react-utils/withT';
@@ -1101,15 +1101,19 @@ var AllowMicAccess = function AllowMicAccess() {
   })));
 };
 
+var _window;
 var useRecorderStore = screenRecorder.useRecorderStore,
   restartRecording = screenRecorder.restartRecording,
   discardRecording = screenRecorder.discardRecording;
 var useMultipartS3UploadStore = multipartS3Uploader.useMultipartS3UploadStore;
+var globalProps = ((_window = window) === null || _window === void 0 ? void 0 : _window.globalProps) || {};
 var MediaRecorder = function MediaRecorder(_ref, ref) {
   var _ref$onUploadComplete = _ref.onUploadComplete,
     onUploadComplete = _ref$onUploadComplete === void 0 ? noop : _ref$onUploadComplete,
     _ref$onDiscard = _ref.onDiscard,
-    onDiscard = _ref$onDiscard === void 0 ? noop : _ref$onDiscard;
+    onDiscard = _ref$onDiscard === void 0 ? noop : _ref$onDiscard,
+    _ref$appName = _ref.appName,
+    appName = _ref$appName === void 0 ? globalProps.appName : _ref$appName;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
   var _useState = useState(false),
@@ -1325,12 +1329,24 @@ var MediaRecorder = function MediaRecorder(_ref, ref) {
   }, /*#__PURE__*/React.createElement(Typography, {
     className: "mb-2",
     style: "h3"
-  }, t("neetoMediaRecorder.record.screenSharePermissionDeniedTitle")), /*#__PURE__*/React.createElement(Typography, null, t("neetoMediaRecorder.record.screenSharePermissionDenied"))), error === SCREEN_RECORDER_ERROR.MicPermissionDenied && /*#__PURE__*/React.createElement("div", {
+  }, t("neetoMediaRecorder.record.screenSharePermissionDeniedTitle", {
+    appName: appName
+  })), /*#__PURE__*/React.createElement(Typography, null, /*#__PURE__*/React.createElement(Trans, {
+    i18nKey: "neetoMediaRecorder.record.screenSharePermissionDenied",
+    components: {
+      Bold: /*#__PURE__*/React.createElement(Typography, {
+        component: "span",
+        weight: "bold"
+      })
+    }
+  }))), error === SCREEN_RECORDER_ERROR.MicPermissionDenied && /*#__PURE__*/React.createElement("div", {
     className: "flex flex-col items-center"
   }, /*#__PURE__*/React.createElement(Typography, {
     className: "mb-2",
     style: "h3"
-  }, t("neetoMediaRecorder.record.micPermissionDeniedTitle")), /*#__PURE__*/React.createElement(Typography, null, t("neetoMediaRecorder.record.micPermissionDeniedMessage")), /*#__PURE__*/React.createElement(AllowMicAccess, null)), isRecorderStatus(SCREEN_RECORDER_STATUS.acquiring_media) && /*#__PURE__*/React.createElement(Callout, {
+  }, t("neetoMediaRecorder.record.micPermissionDeniedTitle", {
+    appName: appName
+  })), /*#__PURE__*/React.createElement(Typography, null, t("neetoMediaRecorder.record.micPermissionDeniedMessage")), /*#__PURE__*/React.createElement(AllowMicAccess, null)), isRecorderStatus(SCREEN_RECORDER_STATUS.acquiring_media) && /*#__PURE__*/React.createElement(Callout, {
     className: "mb-2 p-3",
     "data-cy": "recorder-grant-permission-info-callout",
     style: "info"