@bigbinary/neeto-media-recorder 2.6.3 → 2.6.5

package/index.js

@@ -1029,12 +1029,33 @@ var generatePublicUrl = function generatePublicUrl(recordingId) {
   return "".concat(baseURL, "/watch/").concat(recordingId);
 };
 
+var UseDesktopAppCallout = function UseDesktopAppCallout() {
+  return /*#__PURE__*/jsx(Callout, {
+    className: "mb-3",
+    style: "info",
+    children: /*#__PURE__*/jsx(Typography, {
+      component: "span",
+      style: "body2",
+      children: /*#__PURE__*/jsx(Trans, {
+        i18nKey: "neetoMediaRecorder.useDesktopAppCallOut",
+        components: {
+          Download: /*#__PURE__*/jsx(Button, {
+            href: "https://neeto.com/neetorecord/download",
+            style: "link"
+          })
+        }
+      })
+    })
+  });
+};
+
 var UploadingInProgress = function UploadingInProgress(_ref) {
   var recording = _ref.recording,
     uploadProgress = _ref.uploadProgress,
     uploadStatus = _ref.uploadStatus,
     onDiscard = _ref.onDiscard,
-    onRetryUpload = _ref.onRetryUpload;
+    onRetryUpload = _ref.onRetryUpload,
+    isRetryUpload = _ref.isRetryUpload;
   var _useState = useState(""),
     _useState2 = _slicedToArray(_useState, 2),
     baseURL = _useState2[0],
@@ -1070,7 +1091,7 @@ var UploadingInProgress = function UploadingInProgress(_ref) {
     className: "flex h-screen w-full flex-col items-center justify-center",
     children: [/*#__PURE__*/jsxs("div", {
       className: "flex h-full w-full flex-col items-center justify-start py-14 lg:py-20 xl:py-28 2xl:py-36",
-      children: [/*#__PURE__*/jsxs("div", {
+      children: [/*#__PURE__*/jsx(UseDesktopAppCallout, {}), /*#__PURE__*/jsxs("div", {
         className: "w-full pb-6 text-center",
         children: [/*#__PURE__*/jsx(Typography, {
           className: "select-none pb-6",
@@ -1113,8 +1134,9 @@ var UploadingInProgress = function UploadingInProgress(_ref) {
           onClick: handleRecordingBlobDownload
         }), /*#__PURE__*/jsx(Button, {
           "data-cy": "recorder-retry-upload-button",
+          disabled: isRetryUpload,
           icon: Refresh,
-          label: "Retry",
+          label: t("neetoMediaRecorder.record.retry"),
           style: "tertiary",
           onClick: onRetryUpload
         }), /*#__PURE__*/jsx(Button, {
@@ -1412,15 +1434,28 @@ var MediaRecorder = function MediaRecorder(_ref, ref) {
     setUploadProgress(progress);
   };
   var handleReUpload = function handleReUpload() {
+    var _uploaderCallbacks;
     var multipartS3Uploader = getMultipartS3Uploader();
     setIsRetryUpload(true);
     setUploadProgress(0);
     multipartS3Uploader.abortUpload();
 
     // Create a new multipartS3Uploader instance to push the blob
-    getMultipartS3Uploader({
+    var newMultipartS3Uploader = getMultipartS3Uploader({
       initialize: true
-    }).push(screenRecorder.getWebmMediaBlob());
+    });
+    newMultipartS3Uploader.push(screenRecorder.getWebmMediaBlob());
+
+    // Attach callbacks to the new multipartS3Uploader instance
+    var uploaderCallbacks = (_uploaderCallbacks = {}, _defineProperty(_uploaderCallbacks, UPLOAD_EVENT.onComplete, handleUploadComplete), _defineProperty(_uploaderCallbacks, UPLOAD_EVENT.onError, handleUploadError), _defineProperty(_uploaderCallbacks, UPLOAD_EVENT.onProgress, handleUploadProgress), _defineProperty(_uploaderCallbacks, UPLOAD_EVENT.onAbort, function () {
+      Object.keys(uploaderCallbacks).forEach(function (key) {
+        multipartS3Uploader.removeCallback(key, uploaderCallbacks[key]);
+      });
+      multipartS3Uploader.removeCallback(UPLOAD_EVENT.onAbort, uploaderCallbacks[UPLOAD_EVENT.onAbort]);
+    }), _uploaderCallbacks);
+    Object.keys(uploaderCallbacks).forEach(function (key) {
+      newMultipartS3Uploader.addCallback(key, uploaderCallbacks[key]);
+    });
     handleCreateRecording();
   };
   useImperativeHandle(ref, function () {
@@ -1440,7 +1475,7 @@ var MediaRecorder = function MediaRecorder(_ref, ref) {
   useEffect(function () {
     var _cleanupFunction = noop;
     var handleOnScreenRecorderStart = function handleOnScreenRecorderStart() {
-      var _recorderCallbacks, _uploaderCallbacks;
+      var _recorderCallbacks, _uploaderCallbacks2;
       var multipartS3Uploader = getMultipartS3Uploader({
         initialize: true
       });
@@ -1464,7 +1499,7 @@ var MediaRecorder = function MediaRecorder(_ref, ref) {
           }
         }, _callee3);
       }))), _defineProperty(_recorderCallbacks, SCREEN_RECORDER_EVENT.onDiscard, handleDiscardRecording), _defineProperty(_recorderCallbacks, SCREEN_RECORDER_EVENT.onRestart, handleRestartRecording), _recorderCallbacks);
-      var uploaderCallbacks = (_uploaderCallbacks = {}, _defineProperty(_uploaderCallbacks, UPLOAD_EVENT.onComplete, handleUploadComplete), _defineProperty(_uploaderCallbacks, UPLOAD_EVENT.onError, handleUploadError), _defineProperty(_uploaderCallbacks, UPLOAD_EVENT.onProgress, handleUploadProgress), _uploaderCallbacks);
+      var uploaderCallbacks = (_uploaderCallbacks2 = {}, _defineProperty(_uploaderCallbacks2, UPLOAD_EVENT.onComplete, handleUploadComplete), _defineProperty(_uploaderCallbacks2, UPLOAD_EVENT.onError, handleUploadError), _defineProperty(_uploaderCallbacks2, UPLOAD_EVENT.onProgress, handleUploadProgress), _uploaderCallbacks2);
       Object.keys(recorderCallbacks).forEach(function (key) {
         screenRecorder.addCallback(key, recorderCallbacks[key]);
       });
@@ -1525,6 +1560,7 @@ var MediaRecorder = function MediaRecorder(_ref, ref) {
   }
   if (isRetryUpload || isRecorderStatus(SCREEN_RECORDER_STATUS.stopped) && (isCreatingRecording || isBeingUploadedOrHasErrorUploading)) {
     return /*#__PURE__*/jsx(UploadingInProgress, {
+      isRetryUpload: isRetryUpload,
       recording: recording,
       uploadProgress: uploadProgress,
       uploadStatus: uploadStatus,
@@ -1533,16 +1569,16 @@ var MediaRecorder = function MediaRecorder(_ref, ref) {
     });
   }
   if (isRecorderStatus(SCREEN_RECORDER_STATUS.stopped) && isUploadStatus(UPLOAD_STATUS$1.completed)) {
-    return /*#__PURE__*/jsx("div", {
+    return /*#__PURE__*/jsxs("div", {
       className: "h-screen w-full",
-      children: /*#__PURE__*/jsx(PageLoader, {})
+      children: [/*#__PURE__*/jsx(UseDesktopAppCallout, {}), /*#__PURE__*/jsx(PageLoader, {})]
     });
   }
   return /*#__PURE__*/jsxs("div", {
     className: "flex h-screen w-full flex-col items-center justify-start py-10 xl:py-14 2xl:py-20",
     children: [/*#__PURE__*/jsxs("div", {
       className: classNames("w-full max-w-3xl"),
-      children: [error === SCREEN_RECORDER_ERROR.NotAllowedError && /*#__PURE__*/jsxs("div", {
+      children: [/*#__PURE__*/jsx(UseDesktopAppCallout, {}), error === SCREEN_RECORDER_ERROR.NotAllowedError && /*#__PURE__*/jsxs("div", {
         className: "flex flex-col items-center",
         children: [/*#__PURE__*/jsx(Typography, {
           className: "mb-2",