@edifice.io/react 2.0.0-develop-rc.7 → 2.0.0-develop-rc.11

package/dist/modules/multimedia/AudioRecorder/useAudioRecorder.js

@@ -1,235 +1,235 @@
-import { jsx } from "react/jsx-runtime";
-import { useReducer, useRef, useEffect, useCallback } from "react";
-import { useTranslation } from "react-i18next";
-import useWorkspaceFile from "../../../core/useWorkspaceFile/useWorkspaceFile.js";
-import { Icon } from "../../../components/Icon/Icon.js";
-function useAudioRecorder(onSaveSuccess, onUpdateRecord, hideSaveAction = !1, visibility = "protected", application = "media-library") {
-  var _a;
-  function audioReducer(state, action) {
+import { jsx as S } from "react/jsx-runtime";
+import { useReducer as Q, useRef as P, useEffect as j, useCallback as y } from "react";
+import { useTranslation as X } from "react-i18next";
+import $ from "../../../core/useWorkspaceFile/useWorkspaceFile.js";
+import { Icon as b } from "../../../components/Icon/Icon.js";
+function oe(g, d, Y = !1, F = "protected", W = "media-library") {
+  var U;
+  function V(t, n) {
     return {
-      ...state,
-      ...action.updatedState
+      ...t,
+      ...n.updatedState
     };
   }
   const [{
-    recordState,
-    playState,
-    micStream,
-    micStreamAudioSourceNode,
-    audioWorkletNode,
-    audioContext,
-    encoderWorker,
-    maxDuration,
-    recordTime,
-    isEncoding
-  }, dispatch] = useReducer(audioReducer, {
+    recordState: r,
+    playState: u,
+    micStream: f,
+    micStreamAudioSourceNode: h,
+    audioWorkletNode: c,
+    audioContext: a,
+    encoderWorker: E,
+    maxDuration: A,
+    recordTime: T,
+    isEncoding: L
+  }, o] = Q(V, {
     recordState: "IDLE",
     isEncoding: !1,
     playState: "IDLE",
     recordTime: 0,
     maxDuration: 180
     // max duration in s (3 minutes by default)
-  }), audioNameRef = useRef(null), audioRef = useRef(null), leftChannelRef = useRef(), rightChannelRef = useRef(), {
-    t
-  } = useTranslation(), {
-    create
-  } = useWorkspaceFile(), BUFFER_SIZE = 128, DEFAULT_SAMPLE_RATE = 48e3;
-  useEffect(() => {
-    const encoderWorker2 = new Worker("/infra/public/js/audioEncoder.js");
-    return dispatch({
+  }), v = P(null), e = P(null), D = P(), l = P(), {
+    t: i
+  } = X(), {
+    create: _
+  } = $(), N = 128, k = 48e3;
+  j(() => {
+    const t = new Worker("/infra/public/js/audioEncoder.js");
+    return o({
       type: "update",
       updatedState: {
-        encoderWorker: encoderWorker2
+        encoderWorker: t
       }
-    }), encoderWorker2.postMessage(["init", (audioContext == null ? void 0 : audioContext.sampleRate) || DEFAULT_SAMPLE_RATE]), () => {
-      closeAudioStream(), encoderWorker2.terminate();
+    }), t.postMessage(["init", (a == null ? void 0 : a.sampleRate) || k]), () => {
+      I(), t.terminate();
     };
   }, []);
-  const handleAudioWorkletNodeMessage = (event) => {
-    var _a2, _b;
-    const leftChannel = event.data.inputs[0][0];
-    let rightChannel = event.data.inputs[0][1];
-    (!rightChannel || rightChannel.filter((data) => data !== void 0).length === 0) && (rightChannel = leftChannel), (_a2 = leftChannelRef.current) == null || _a2.push(leftChannel), (_b = rightChannelRef.current) == null || _b.push(rightChannel);
-  }, closeAudioStream = useCallback(() => {
-    micStream == null || micStream.getTracks().forEach((track) => track.stop()), micStreamAudioSourceNode == null || micStreamAudioSourceNode.disconnect(), audioWorkletNode == null || audioWorkletNode.port.removeEventListener("message", handleAudioWorkletNodeMessage), audioWorkletNode == null || audioWorkletNode.port.close(), audioWorkletNode == null || audioWorkletNode.disconnect(), audioContext == null || audioContext.close();
-  }, [audioContext, audioWorkletNode, micStream, micStreamAudioSourceNode]), initRecording = async () => {
-    const micStream2 = await navigator.mediaDevices.getUserMedia({
+  const G = (t) => {
+    var s, m;
+    const n = t.data.inputs[0][0];
+    let p = t.data.inputs[0][1];
+    (!p || p.filter((R) => R !== void 0).length === 0) && (p = n), (s = D.current) == null || s.push(n), (m = l.current) == null || m.push(p);
+  }, I = y(() => {
+    f == null || f.getTracks().forEach((t) => t.stop()), h == null || h.disconnect(), c == null || c.port.removeEventListener("message", G), c == null || c.port.close(), c == null || c.disconnect(), a == null || a.close();
+  }, [a, c, f, h]), x = async () => {
+    const t = await navigator.mediaDevices.getUserMedia({
       audio: !0
-    }), audioContext2 = new AudioContext({
-      sampleRate: DEFAULT_SAMPLE_RATE
-    }), micStreamAudioSourceNode2 = audioContext2.createMediaStreamSource(micStream2);
+    }), n = new AudioContext({
+      sampleRate: k
+    }), p = n.createMediaStreamSource(t);
     try {
-      await audioContext2.audioWorklet.addModule("/infra/public/js/audio-recorder-processor.js");
-    } catch (err) {
-      console.error(err);
+      await n.audioWorklet.addModule("/infra/public/js/audio-recorder-processor.js");
+    } catch (m) {
+      console.error(m);
     }
-    const audioWorkletNode2 = new AudioWorkletNode(audioContext2, "audio-recorder-processor");
-    audioWorkletNode2.port.addEventListener("message", handleAudioWorkletNodeMessage), dispatch({
+    const s = new AudioWorkletNode(n, "audio-recorder-processor");
+    s.port.addEventListener("message", G), o({
       type: "update",
       updatedState: {
-        micStream: micStream2,
-        micStreamAudioSourceNode: micStreamAudioSourceNode2,
-        audioContext: audioContext2,
+        micStream: t,
+        micStreamAudioSourceNode: p,
+        audioContext: n,
         recordTime: 0,
-        audioWorkletNode: audioWorkletNode2,
+        audioWorkletNode: s,
         recordState: "RECORDING",
         playState: "IDLE"
       }
-    }), rightChannelRef.current = [], leftChannelRef.current = [], audioWorkletNode2.port.start(), micStreamAudioSourceNode2.connect(audioWorkletNode2), audioWorkletNode2.connect(audioContext2.destination);
-  }, handleRecord = useCallback(async () => {
-    audioRef.current && (audioRef.current.currentTime = 0, audioRef.current.pause()), recordState === "PAUSED" ? (dispatch({
+    }), l.current = [], D.current = [], s.port.start(), p.connect(s), s.connect(n.destination);
+  }, B = y(async () => {
+    e.current && (e.current.currentTime = 0, e.current.pause()), r === "PAUSED" ? (o({
       type: "update",
       updatedState: {
         recordState: "RECORDING",
         playState: "IDLE"
       }
-    }), audioContext == null || audioContext.resume(), onUpdateRecord == null || onUpdateRecord(void 0)) : initRecording();
-  }, [recordState, audioContext, audioRef]), handleRecordPause = useCallback(() => {
-    dispatch({
+    }), a == null || a.resume(), d == null || d(void 0)) : x();
+  }, [r, a, e]), w = y(() => {
+    o({
       type: "update",
       updatedState: {
         recordState: "PAUSED",
         playState: "IDLE",
         isEncoding: !0
       }
-    }), audioContext == null || audioContext.suspend(), encoderWorker && leftChannelRef.current && rightChannelRef.current && (encoderWorker.postMessage(["wav", rightChannelRef.current, leftChannelRef.current, rightChannelRef.current.length * BUFFER_SIZE]), encoderWorker.onmessage = (event) => {
-      const audioUrl = window.URL.createObjectURL(event.data);
-      dispatch({
+    }), a == null || a.suspend(), E && D.current && l.current && (E.postMessage(["wav", l.current, D.current, l.current.length * N]), E.onmessage = (t) => {
+      const n = window.URL.createObjectURL(t.data);
+      o({
         type: "update",
         updatedState: {
           isEncoding: !1
         }
-      }), audioRef.current && (audioRef.current.src = audioUrl), onUpdateRecord && onUpdateRecord(audioUrl);
+      }), e.current && (e.current.src = n), d && d(n);
     });
-  }, [audioContext, encoderWorker, onUpdateRecord]), handlePlay = useCallback(() => {
-    var _a2;
-    dispatch({
+  }, [a, E, d]), q = y(() => {
+    var t;
+    o({
       type: "update",
       updatedState: {
         playState: "PLAYING"
       }
-    }), ((_a2 = audioRef == null ? void 0 : audioRef.current) != null && _a2.currentTime || audioRef.current) && audioRef.current.play();
-  }, [audioRef]), handlePlayPause = useCallback(() => {
-    var _a2;
-    (_a2 = audioRef == null ? void 0 : audioRef.current) == null || _a2.pause(), dispatch({
+    }), ((t = e == null ? void 0 : e.current) != null && t.currentTime || e.current) && e.current.play();
+  }, [e]), Z = y(() => {
+    var t;
+    (t = e == null ? void 0 : e.current) == null || t.pause(), o({
       type: "update",
       updatedState: {
         playState: "PAUSED"
       }
     });
-  }, [audioRef]), handleReset = useCallback(() => {
-    closeAudioStream(), dispatch({
+  }, [e]), z = y(() => {
+    I(), o({
       type: "update",
       updatedState: {
         playState: "IDLE",
         recordState: "IDLE"
       }
-    }), rightChannelRef.current = [], leftChannelRef.current = [], onUpdateRecord && onUpdateRecord(void 0);
-  }, [closeAudioStream, onUpdateRecord]), handleSave = useCallback(async () => {
-    var _a2;
-    const audioName = (_a2 = audioNameRef.current) == null ? void 0 : _a2.value;
-    if (!audioName) {
+    }), l.current = [], D.current = [], d && d(void 0);
+  }, [I, d]), O = y(async () => {
+    var n;
+    const t = (n = v.current) == null ? void 0 : n.value;
+    if (!t) {
       console.error("Audio name is required");
       return;
     }
-    return audioRef.current && (audioRef.current.pause(), audioRef.current.currentTime = 0), dispatch({
+    return e.current && (e.current.pause(), e.current.currentTime = 0), o({
       type: "update",
       updatedState: {
         recordState: "SAVING",
         playState: "IDLE"
       }
-    }), new Promise((resolve, reject) => {
+    }), new Promise((p, s) => {
       try {
-        encoderWorker && leftChannelRef.current && rightChannelRef.current && (encoderWorker.postMessage(["mp3", rightChannelRef.current, leftChannelRef.current, rightChannelRef.current.length * BUFFER_SIZE]), encoderWorker.onmessage = async (event) => {
-          if (event.data instanceof Blob) {
-            const file = new File([event.data], audioName, {
+        E && D.current && l.current && (E.postMessage(["mp3", l.current, D.current, l.current.length * N]), E.onmessage = async (m) => {
+          if (m.data instanceof Blob) {
+            const R = new File([m.data], t, {
               type: "audio/mp3"
-            }), resourceAudio = await create(file, {
-              application,
-              visibility
+            }), C = await _(R, {
+              application: W,
+              visibility: F
             });
-            resourceAudio && onSaveSuccess && onSaveSuccess(resourceAudio), dispatch({
+            C && g && g(C), o({
               type: "update",
               updatedState: {
                 recordState: "SAVED"
               }
-            }), resolve(resourceAudio);
+            }), p(C);
           }
         });
-      } catch (error) {
-        dispatch({
+      } catch (m) {
+        o({
           type: "update",
           updatedState: {
             playState: "IDLE",
             recordState: "IDLE"
           }
-        }), console.error("Error while saving", error), reject();
+        }), console.error("Error while saving", m), s();
       }
     });
-  }, [recordState, onSaveSuccess, closeAudioStream]), handlePlayStop = useCallback(() => {
-    audioRef != null && audioRef.current && (audioRef.current.pause(), audioRef.current.currentTime = 0), dispatch({
+  }, [r, g, I]), H = y(() => {
+    e != null && e.current && (e.current.pause(), e.current.currentTime = 0), o({
       type: "update",
       updatedState: {
         playState: "IDLE"
       }
     });
-  }, [audioRef]), handlePlayEnded = useCallback(() => {
-    dispatch({
+  }, [e]), J = y(() => {
+    o({
       type: "update",
       updatedState: {
         playState: "PAUSED"
       }
-    }), audioRef.current && (audioRef.current.currentTime = 0);
-  }, [audioRef]);
-  useEffect(() => {
-    if (recordState === "RECORDING" && audioContext) {
-      const timer = window.setInterval(
+    }), e.current && (e.current.currentTime = 0);
+  }, [e]);
+  j(() => {
+    if (r === "RECORDING" && a) {
+      const t = window.setInterval(
         // Compute exact elapsed time by diffing the start time.
         () => {
-          dispatch({
+          o({
             type: "update",
             updatedState: {
-              recordTime: audioContext.currentTime
+              recordTime: a.currentTime
             }
-          }), audioContext.currentTime >= maxDuration && (handleRecordPause(), window.clearInterval(timer));
+          }), a.currentTime >= A && (w(), window.clearInterval(t));
         },
         100
       );
-      return () => window.clearInterval(timer);
+      return () => window.clearInterval(t);
     }
-  }, [audioContext, handleRecordPause, maxDuration, recordState]);
-  const recordText = t(recordState === "IDLE" ? "bbm.audio.record.start" : "bbm.audio.record.resume"), toolbarItems = [{
+  }, [a, w, A, r]);
+  const M = i(r === "IDLE" ? "bbm.audio.record.start" : "bbm.audio.record.resume"), K = [{
     type: "icon",
     name: "record",
-    visibility: recordState === "RECORDING" ? "hide" : "show",
+    visibility: r === "RECORDING" ? "hide" : "show",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "record" }),
+      icon: /* @__PURE__ */ S(b, { name: "record" }),
       color: "danger",
-      disabled: recordState !== "IDLE" && recordState !== "PAUSED" || recordTime >= maxDuration,
-      onClick: handleRecord,
-      "aria-label": recordText
+      disabled: r !== "IDLE" && r !== "PAUSED" || T >= A,
+      onClick: B,
+      "aria-label": M
     },
-    tooltip: recordText
+    tooltip: M
   }, {
     type: "icon",
     name: "recordPause",
-    visibility: recordState === "RECORDING" ? "show" : "hide",
+    visibility: r === "RECORDING" ? "show" : "hide",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "record-pause" }),
+      icon: /* @__PURE__ */ S(b, { name: "record-pause" }),
       color: "danger",
-      disabled: recordState !== "RECORDING",
-      onClick: handleRecordPause,
-      "aria-label": t("bbm.audio.record.pause")
+      disabled: r !== "RECORDING",
+      onClick: w,
+      "aria-label": i("bbm.audio.record.pause")
     },
-    tooltip: t("bbm.audio.record.pause")
+    tooltip: i("bbm.audio.record.pause")
   }, {
     type: "divider"
   }, {
     type: "icon",
     name: "encoding",
-    visibility: isEncoding ? "show" : "hide",
+    visibility: L ? "show" : "hide",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "loader", style: {
+      icon: /* @__PURE__ */ S(b, { name: "loader", style: {
         animation: "loading 1s infinite"
       } }),
       disabled: !0
@@ -237,71 +237,72 @@ function useAudioRecorder(onSaveSuccess, onUpdateRecord, hideSaveAction = !1, vi
   }, {
     type: "icon",
     name: "play",
-    visibility: isEncoding || playState === "PLAYING" ? "hide" : "show",
+    visibility: L || u === "PLAYING" ? "hide" : "show",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "play-filled" }),
-      disabled: recordState !== "RECORDED" && recordState !== "PAUSED" && recordState !== "SAVED",
-      onClick: handlePlay,
-      "aria-label": t("bbm.audio.play.start")
+      icon: /* @__PURE__ */ S(b, { name: "play-filled" }),
+      disabled: r !== "RECORDED" && r !== "PAUSED" && r !== "SAVED",
+      onClick: q,
+      "aria-label": i("bbm.audio.play.start")
     },
-    tooltip: t("bbm.audio.play.start")
+    tooltip: i("bbm.audio.play.start")
   }, {
     type: "icon",
     name: "playPause",
-    visibility: !isEncoding && playState === "PLAYING" ? "show" : "hide",
+    visibility: !L && u === "PLAYING" ? "show" : "hide",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "pause" }),
-      onClick: handlePlayPause,
-      "aria-label": t("bbm.audio.play.pause")
+      icon: /* @__PURE__ */ S(b, { name: "pause" }),
+      onClick: Z,
+      "aria-label": i("bbm.audio.play.pause")
     },
-    tooltip: t("bbm.audio.play.pause")
+    tooltip: i("bbm.audio.play.pause")
   }, {
     type: "icon",
     name: "stop",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "restart" }),
-      disabled: playState !== "PLAYING" && playState !== "PAUSED",
-      onClick: handlePlayStop,
-      "aria-label": t("bbm.audio.play.stop")
+      icon: /* @__PURE__ */ S(b, { name: "restart" }),
+      disabled: u !== "PLAYING" && u !== "PAUSED",
+      onClick: H,
+      "aria-label": i("bbm.audio.play.stop")
     },
-    tooltip: t("bbm.audio.play.stop")
+    tooltip: i("bbm.audio.play.stop")
   }, {
     type: "divider"
   }, {
     type: "icon",
     name: "reset",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "refresh" }),
-      disabled: recordState !== "RECORDED" && recordState !== "PAUSED" && playState !== "PLAYING" && playState !== "PAUSED",
-      onClick: handleReset,
-      "aria-label": t("bbm.audio.record.reset")
+      icon: /* @__PURE__ */ S(b, { name: "refresh" }),
+      disabled: r !== "RECORDED" && r !== "PAUSED" && u !== "PLAYING" && u !== "PAUSED",
+      onClick: z,
+      "aria-label": i("bbm.audio.record.reset")
     },
-    tooltip: t("bbm.audio.record.reset")
+    tooltip: i("bbm.audio.record.reset")
   }, {
     type: "icon",
     name: "save",
-    visibility: hideSaveAction ? "hide" : "show",
+    visibility: Y ? "hide" : "show",
     props: {
-      icon: /* @__PURE__ */ jsx(Icon, { name: "save" }),
-      disabled: recordState !== "RECORDED" && recordState !== "PAUSED" && playState !== "PLAYING" && playState !== "PAUSED" || recordState === "SAVED" || !((_a = audioNameRef.current) != null && _a.value),
-      onClick: handleSave,
-      "aria-label": t("bbm.audio.record.save")
+      icon: /* @__PURE__ */ S(b, { name: "save" }),
+      disabled: r !== "RECORDED" && r !== "PAUSED" && u !== "PLAYING" && u !== "PAUSED" || r === "SAVED" || !((U = v.current) != null && U.value),
+      onClick: O,
+      "aria-label": i("bbm.audio.record.save")
     },
-    tooltip: t("bbm.audio.record.save")
+    tooltip: i("bbm.audio.record.save")
   }];
   return {
-    recordState,
-    playState,
-    audioContext,
-    recordTime: recordTime * 1e3,
-    maxDuration: maxDuration * 1e3,
-    audioRef,
-    audioNameRef,
-    toolbarItems,
-    handlePlayEnded,
-    handleSave
+    recordState: r,
+    playState: u,
+    audioContext: a,
+    recordTime: T * 1e3,
+    maxDuration: A * 1e3,
+    audioRef: e,
+    audioNameRef: v,
+    toolbarItems: K,
+    handlePlayEnded: J,
+    handleSave: O
   };
 }
 export {
-  useAudioRecorder as default
+  oe as default
 };
+//# sourceMappingURL=useAudioRecorder.js.map

package/dist/modules/multimedia/AudioRecorder/useAudioRecorder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAudioRecorder.js","sources":["../../../../src/modules/multimedia/AudioRecorder/useAudioRecorder.tsx"],"sourcesContent":["import { useCallback, useEffect, useReducer, useRef } from 'react';\n\nimport { WorkspaceElement, WorkspaceVisibility } from '@edifice.io/ts-client';\nimport { useTranslation } from 'react-i18next';\n\nimport { Icon, ToolbarItem } from '../../../components';\nimport { useWorkspaceFile } from '../../../core';\n\nexport type RecordState =\n  | 'IDLE'\n  | 'RECORDING'\n  | 'PAUSED'\n  | 'RECORDED'\n  | 'SAVING'\n  | 'SAVED';\n\nexport type PlayState = 'IDLE' | 'PLAYING' | 'PAUSED';\n\ntype AudioReducerState = {\n  recordState: RecordState;\n  playState: PlayState;\n  isEncoding: boolean;\n\n  // The audio recorder is based on the Web Audio API (https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API)\n  // See also https://developer.mozilla.org/en-US/docs/Web/API/AudioWorkletNode for more information.\n  micStream?: MediaStream;\n  micStreamAudioSourceNode?: MediaStreamAudioSourceNode;\n  audioWorkletNode?: AudioWorkletNode;\n  audioContext?: AudioContext;\n\n  // encoder and web socket for sending encoded audio to the backend\n  encoderWorker?: Worker;\n\n  recordTime: number;\n  // max duration in s (3 minutes by default)\n  maxDuration: number;\n};\n\nexport default function useAudioRecorder(\n  onSaveSuccess?: (resource: WorkspaceElement) => void,\n  onUpdateRecord?: (audioUrl?: string) => void,\n  hideSaveAction = false,\n  visibility: WorkspaceVisibility = 'protected',\n  application = 'media-library',\n) {\n  function audioReducer(\n    state: AudioReducerState,\n    action: {\n      type: 'update';\n      updatedState?: Partial<AudioReducerState>;\n    },\n  ): AudioReducerState {\n    return { ...state, ...action.updatedState };\n  }\n\n  const [\n    {\n      recordState,\n      playState,\n      micStream,\n      micStreamAudioSourceNode,\n      audioWorkletNode,\n      audioContext,\n      encoderWorker,\n      maxDuration,\n      recordTime,\n      isEncoding,\n    },\n    dispatch,\n  ] = useReducer(audioReducer, {\n    recordState: 'IDLE',\n    isEncoding: false,\n    playState: 'IDLE',\n    recordTime: 0,\n    maxDuration: 180, // max duration in s (3 minutes by default)\n  });\n  const audioNameRef = useRef<HTMLInputElement>(null);\n  const audioRef = useRef<HTMLAudioElement>(null);\n  const leftChannelRef = useRef<Float32Array[]>();\n  const rightChannelRef = useRef<Float32Array[]>();\n\n  const { t } = useTranslation();\n  const { create } = useWorkspaceFile();\n\n  const BUFFER_SIZE = 128; // https://developer.mozilla.org/en-US/docs/Web/API/AudioWorkletProcessor\n  const DEFAULT_SAMPLE_RATE = 48000;\n\n  // Init Web Socket to send audio chunks to backend\n  useEffect(() => {\n    const encoderWorker = new Worker('/infra/public/js/audioEncoder.js');\n    dispatch({\n      type: 'update',\n      updatedState: { encoderWorker: encoderWorker },\n    });\n    encoderWorker.postMessage([\n      'init',\n      audioContext?.sampleRate || DEFAULT_SAMPLE_RATE,\n    ]);\n\n    return () => {\n      closeAudioStream();\n      encoderWorker.terminate();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  /**\n   * Handle message received from the audio recorder processor.\n   * Basically the Audio recorder processor returns the input channels that will be treated by the audioEncoder worker.\n   * The audio recorder processor script is located here: /infra/public/js/audio-recorder-processor.js\n   * The script follows the AudioWorkletProcessor API (https://developer.mozilla.org/en-US/docs/Web/API/AudioWorkletProcessor)\n   * This method gets called for each block of 128 sample-frames.\n   *\n   * @param event is the input returned, containing leftChannel and rightChannel arrays.\n   */\n  const handleAudioWorkletNodeMessage = (event: MessageEvent) => {\n    const leftChannel = (event.data.inputs as Float32Array[][])[0][0];\n    let rightChannel = (event.data.inputs as Float32Array[][])[0][1];\n    if (\n      !rightChannel ||\n      rightChannel.filter((data) => data !== undefined).length === 0\n    ) {\n      rightChannel = leftChannel;\n    }\n    leftChannelRef.current?.push(leftChannel);\n    rightChannelRef.current?.push(rightChannel);\n  };\n\n  /**\n   * Close opened audio stream and clean channels\n   */\n  const closeAudioStream = useCallback(() => {\n    // Close audio stream\n    micStream?.getTracks().forEach((track) => track.stop());\n    micStreamAudioSourceNode?.disconnect();\n    audioWorkletNode?.port.removeEventListener(\n      'message',\n      handleAudioWorkletNodeMessage,\n    );\n    audioWorkletNode?.port.close();\n    audioWorkletNode?.disconnect();\n    audioContext?.close();\n  }, [audioContext, audioWorkletNode, micStream, micStreamAudioSourceNode]);\n\n  const initRecording = async () => {\n    // Request access to the user's microphone\n    const micStream: MediaStream = await navigator.mediaDevices.getUserMedia({\n      audio: true,\n    });\n\n    // Create the microphone stream\n    const audioContext = new AudioContext({ sampleRate: DEFAULT_SAMPLE_RATE });\n    const micStreamAudioSourceNode: MediaStreamAudioSourceNode =\n      audioContext.createMediaStreamSource(micStream);\n\n    // Create and connect AudioWorkletNode for processing the audio stream\n    // https://developer.mozilla.org/en-US/docs/Web/API/AudioWorkletProcessor\n    try {\n      await audioContext.audioWorklet.addModule(\n        '/infra/public/js/audio-recorder-processor.js',\n      );\n    } catch (err) {\n      console.error(err);\n    }\n\n    const audioWorkletNode = new AudioWorkletNode(\n      audioContext,\n      'audio-recorder-processor',\n    );\n\n    // Message received from the audio recorder processor. cf handleAudioWorkletNodeMessage function.\n    // Basically the Audio recorder processor returns the input channels that will be treated by the audioEncoder worker.\n    audioWorkletNode.port.addEventListener(\n      'message',\n      handleAudioWorkletNodeMessage,\n    );\n\n    // Store the audio context and stream in the state, reset record time and set states\n    dispatch({\n      type: 'update',\n      updatedState: {\n        micStream,\n        micStreamAudioSourceNode,\n        audioContext,\n        recordTime: 0,\n        audioWorkletNode,\n        recordState: 'RECORDING',\n        playState: 'IDLE',\n      },\n    });\n\n    // Clean audio channels\n    rightChannelRef.current = [];\n    leftChannelRef.current = [];\n\n    audioWorkletNode.port.start();\n\n    micStreamAudioSourceNode.connect(audioWorkletNode);\n    audioWorkletNode.connect(audioContext.destination);\n  };\n\n  const handleRecord = useCallback(async () => {\n    if (audioRef.current) {\n      audioRef.current.currentTime = 0;\n      audioRef.current.pause();\n    }\n    if (recordState === 'PAUSED') {\n      // Resume recording\n      dispatch({\n        type: 'update',\n        updatedState: { recordState: 'RECORDING', playState: 'IDLE' },\n      });\n      audioContext?.resume();\n      onUpdateRecord?.(undefined);\n    } else {\n      // Start new recording\n      initRecording();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [recordState, audioContext, audioRef]);\n\n  const handleRecordPause = useCallback(() => {\n    dispatch({\n      type: 'update',\n      updatedState: {\n        recordState: 'PAUSED',\n        playState: 'IDLE',\n        isEncoding: true,\n      },\n    });\n    audioContext?.suspend();\n    if (encoderWorker && leftChannelRef.current && rightChannelRef.current) {\n      // Encode audio\n      encoderWorker.postMessage([\n        'wav',\n        rightChannelRef.current,\n        leftChannelRef.current,\n        rightChannelRef.current.length * BUFFER_SIZE,\n      ]);\n      encoderWorker.onmessage = (event: MessageEvent) => {\n        const audioUrl = window.URL.createObjectURL(event.data);\n\n        dispatch({\n          type: 'update',\n          updatedState: { isEncoding: false },\n        });\n\n        if (audioRef.current) {\n          audioRef.current.src = audioUrl;\n        }\n\n        if (onUpdateRecord) {\n          onUpdateRecord(audioUrl);\n        }\n      };\n    }\n  }, [audioContext, encoderWorker, onUpdateRecord]);\n\n  const handlePlay = useCallback(() => {\n    dispatch({ type: 'update', updatedState: { playState: 'PLAYING' } });\n    if (audioRef?.current?.currentTime) {\n      audioRef.current.play();\n    } else {\n      if (audioRef.current) {\n        audioRef.current.play();\n      }\n    }\n  }, [audioRef]);\n\n  const handlePlayPause = useCallback(() => {\n    audioRef?.current?.pause();\n    dispatch({ type: 'update', updatedState: { playState: 'PAUSED' } });\n  }, [audioRef]);\n\n  const handleReset = useCallback(() => {\n    closeAudioStream();\n\n    dispatch({\n      type: 'update',\n      updatedState: {\n        playState: 'IDLE',\n        recordState: 'IDLE',\n      },\n    });\n\n    // Clean channels\n    rightChannelRef.current = [];\n    leftChannelRef.current = [];\n\n    if (onUpdateRecord) {\n      onUpdateRecord(undefined);\n    }\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [closeAudioStream, onUpdateRecord]);\n\n  const handleSave: () => Promise<WorkspaceElement | undefined> =\n    useCallback(async () => {\n      const audioName = audioNameRef.current?.value;\n      if (!audioName) {\n        console.error('Audio name is required');\n        return;\n      }\n      if (audioRef.current) {\n        audioRef.current.pause();\n        audioRef.current.currentTime = 0;\n      }\n      dispatch({\n        type: 'update',\n        updatedState: { recordState: 'SAVING', playState: 'IDLE' },\n      });\n      return new Promise<WorkspaceElement | undefined>((resolve, reject) => {\n        try {\n          if (\n            encoderWorker &&\n            leftChannelRef.current &&\n            rightChannelRef.current\n          ) {\n            encoderWorker.postMessage([\n              'mp3',\n              rightChannelRef.current,\n              leftChannelRef.current,\n              rightChannelRef.current.length * BUFFER_SIZE,\n            ]);\n\n            encoderWorker.onmessage = async (event: MessageEvent) => {\n              if (event.data instanceof Blob) {\n                const file = new File([event.data], audioName!, {\n                  type: 'audio/mp3',\n                });\n\n                const resourceAudio = await create(file, {\n                  application,\n                  visibility,\n                });\n\n                if (resourceAudio && onSaveSuccess) {\n                  onSaveSuccess(resourceAudio);\n                }\n\n                dispatch({\n                  type: 'update',\n                  updatedState: { recordState: 'SAVED' },\n                });\n\n                resolve(resourceAudio);\n              }\n            };\n          }\n        } catch (error) {\n          dispatch({\n            type: 'update',\n            updatedState: { playState: 'IDLE', recordState: 'IDLE' },\n          });\n          console.error('Error while saving', error);\n          reject();\n        }\n      });\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [recordState, onSaveSuccess, closeAudioStream]);\n\n  const handlePlayStop = useCallback(() => {\n    // Stop Playing the record\n    if (audioRef?.current) {\n      audioRef.current.pause();\n      audioRef.current.currentTime = 0;\n    }\n    dispatch({ type: 'update', updatedState: { playState: 'IDLE' } });\n  }, [audioRef]);\n\n  const handlePlayEnded = useCallback(() => {\n    dispatch({ type: 'update', updatedState: { playState: 'PAUSED' } });\n    if (audioRef.current) {\n      audioRef.current.currentTime = 0;\n    }\n  }, [audioRef]);\n\n  /**\n   * Auto-stop recording when max allowed duration is reached.\n   */\n  useEffect(() => {\n    if (recordState === 'RECORDING' && audioContext) {\n      const timer = window.setInterval(\n        // Compute exact elapsed time by diffing the start time.\n        () => {\n          dispatch({\n            type: 'update',\n            updatedState: {\n              recordTime: audioContext.currentTime,\n            },\n          });\n\n          if (audioContext.currentTime >= maxDuration) {\n            handleRecordPause();\n            window.clearInterval(timer);\n          }\n        },\n        100,\n      );\n\n      return () => window.clearInterval(timer);\n    }\n  }, [audioContext, handleRecordPause, maxDuration, recordState]);\n\n  const recordText =\n    recordState === 'IDLE'\n      ? t('bbm.audio.record.start')\n      : t('bbm.audio.record.resume');\n\n  const toolbarItems: ToolbarItem[] = [\n    {\n      type: 'icon',\n      name: 'record',\n      visibility: recordState === 'RECORDING' ? 'hide' : 'show',\n      props: {\n        icon: <Icon name=\"record\" />,\n        color: 'danger',\n        disabled:\n          (recordState !== 'IDLE' && recordState !== 'PAUSED') ||\n          recordTime >= maxDuration,\n        onClick: handleRecord,\n        'aria-label': recordText,\n      },\n      tooltip: recordText,\n    },\n    {\n      type: 'icon',\n      name: 'recordPause',\n      visibility: recordState === 'RECORDING' ? 'show' : 'hide',\n      props: {\n        icon: <Icon name=\"record-pause\" />,\n        color: 'danger',\n        disabled: recordState !== 'RECORDING',\n        onClick: handleRecordPause,\n        'aria-label': t('bbm.audio.record.pause'),\n      },\n      tooltip: t('bbm.audio.record.pause'),\n    },\n    { type: 'divider' },\n    {\n      type: 'icon',\n      name: 'encoding',\n      visibility: isEncoding ? 'show' : 'hide',\n      props: {\n        icon: (\n          <Icon name=\"loader\" style={{ animation: 'loading 1s infinite' }} />\n        ),\n        disabled: true,\n      },\n    },\n    {\n      type: 'icon',\n      name: 'play',\n      visibility: isEncoding || playState === 'PLAYING' ? 'hide' : 'show',\n      props: {\n        icon: <Icon name=\"play-filled\" />,\n        disabled:\n          recordState !== 'RECORDED' &&\n          recordState !== 'PAUSED' &&\n          recordState !== 'SAVED',\n        onClick: handlePlay,\n        'aria-label': t('bbm.audio.play.start'),\n      },\n      tooltip: t('bbm.audio.play.start'),\n    },\n    {\n      type: 'icon',\n      name: 'playPause',\n      visibility: !isEncoding && playState === 'PLAYING' ? 'show' : 'hide',\n      props: {\n        icon: <Icon name=\"pause\" />,\n        onClick: handlePlayPause,\n        'aria-label': t('bbm.audio.play.pause'),\n      },\n      tooltip: t('bbm.audio.play.pause'),\n    },\n    {\n      type: 'icon',\n      name: 'stop',\n      props: {\n        icon: <Icon name=\"restart\" />,\n        disabled: playState !== 'PLAYING' && playState !== 'PAUSED',\n        onClick: handlePlayStop,\n        'aria-label': t('bbm.audio.play.stop'),\n      },\n      tooltip: t('bbm.audio.play.stop'),\n    },\n    { type: 'divider' },\n    {\n      type: 'icon',\n      name: 'reset',\n      props: {\n        icon: <Icon name=\"refresh\" />,\n        disabled:\n          recordState !== 'RECORDED' &&\n          recordState !== 'PAUSED' &&\n          playState !== 'PLAYING' &&\n          playState !== 'PAUSED',\n        onClick: handleReset,\n        'aria-label': t('bbm.audio.record.reset'),\n      },\n      tooltip: t('bbm.audio.record.reset'),\n    },\n    {\n      type: 'icon',\n      name: 'save',\n      visibility: hideSaveAction ? 'hide' : 'show',\n      props: {\n        icon: <Icon name=\"save\" />,\n        disabled:\n          (recordState !== 'RECORDED' &&\n            recordState !== 'PAUSED' &&\n            playState !== 'PLAYING' &&\n            playState !== 'PAUSED') ||\n          recordState === 'SAVED' ||\n          !audioNameRef.current?.value,\n        onClick: handleSave,\n        'aria-label': t('bbm.audio.record.save'),\n      },\n      tooltip: t('bbm.audio.record.save'),\n    },\n  ];\n\n  return {\n    recordState,\n    playState,\n    audioContext,\n    recordTime: recordTime * 1000,\n    maxDuration: maxDuration * 1000,\n    audioRef,\n    audioNameRef,\n    toolbarItems,\n    handlePlayEnded,\n    handleSave,\n  };\n}\n"],"names":["useAudioRecorder","onSaveSuccess","onUpdateRecord","hideSaveAction","visibility","application","audioReducer","state","action","updatedState","recordState","playState","micStream","micStreamAudioSourceNode","audioWorkletNode","audioContext","encoderWorker","maxDuration","recordTime","isEncoding","dispatch","useReducer","audioNameRef","useRef","audioRef","leftChannelRef","rightChannelRef","t","useTranslation","create","useWorkspaceFile","BUFFER_SIZE","DEFAULT_SAMPLE_RATE","useEffect","Worker","type","postMessage","sampleRate","closeAudioStream","terminate","handleAudioWorkletNodeMessage","event","leftChannel","data","inputs","rightChannel","filter","undefined","length","current","push","useCallback","getTracks","forEach","track","stop","disconnect","port","removeEventListener","close","initRecording","navigator","mediaDevices","getUserMedia","audio","AudioContext","createMediaStreamSource","audioWorklet","addModule","err","console","error","AudioWorkletNode","addEventListener","start","connect","destination","handleRecord","currentTime","pause","resume","handleRecordPause","suspend","onmessage","audioUrl","window","URL","createObjectURL","src","handlePlay","play","handlePlayPause","handleReset","handleSave","audioName","value","Promise","resolve","reject","Blob","file","File","resourceAudio","handlePlayStop","handlePlayEnded","timer","setInterval","clearInterval","recordText","toolbarItems","name","props","icon","jsx","Icon","color","disabled","onClick","tooltip","animation"],"mappings":"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"}

package/dist/modules/multimedia/Embed/Embed.js

@@ -1,32 +1,33 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState } from "react";
-import { useTranslation } from "react-i18next";
-import { TextArea } from "../../../components/TextArea/TextArea.js";
-import { Icon } from "../../../components/Icon/Icon.js";
-import { FormControl } from "../../../components/Form/FormControl.js";
-const Embed = ({
-  onSuccess
+import { jsxs as i, jsx as r } from "react/jsx-runtime";
+import { useState as o } from "react";
+import { useTranslation as s } from "react-i18next";
+import { TextArea as c } from "../../../components/TextArea/TextArea.js";
+import { Icon as b } from "../../../components/Icon/Icon.js";
+import { FormControl as f } from "../../../components/Form/FormControl.js";
+const N = ({
+  onSuccess: l
 }) => {
   const {
     t
-  } = useTranslation(), [htmlContent, setHTMLContent] = useState();
-  function handleContentChange(event) {
-    const HTMLContent = event.target.value;
-    setHTMLContent(HTMLContent), HTMLContent != null && HTMLContent.length ? onSuccess(HTMLContent) : onSuccess();
+  } = s(), [e, n] = o();
+  function d(a) {
+    const m = a.target.value;
+    n(m), m != null && m.length ? l(m) : l();
   }
-  return /* @__PURE__ */ jsxs("div", { className: "d-flex flex-column flex-fill", children: [
-    /* @__PURE__ */ jsx("div", { className: "mb-32", children: t("bbm.embed.description") }),
-    /* @__PURE__ */ jsxs("div", { className: "mb-8 d-flex", children: [
-      /* @__PURE__ */ jsx(Icon, { name: "code", className: "me-8" }),
+  return /* @__PURE__ */ i("div", { className: "d-flex flex-column flex-fill", children: [
+    /* @__PURE__ */ r("div", { className: "mb-32", children: t("bbm.embed.description") }),
+    /* @__PURE__ */ i("div", { className: "mb-8 d-flex", children: [
+      /* @__PURE__ */ r(b, { name: "code", className: "me-8" }),
       t("bbm.embed.title")
     ] }),
-    /* @__PURE__ */ jsx(FormControl, { id: "iframeContent", children: /* @__PURE__ */ jsx(TextArea, { size: "md", height: "sm", placeholder: t("bbm.embed.placeholder"), onChange: handleContentChange }) }),
-    !!(htmlContent != null && htmlContent.length) && /* @__PURE__ */ jsx("div", { className: "embed-preview mt-12", dangerouslySetInnerHTML: {
-      __html: htmlContent
+    /* @__PURE__ */ r(f, { id: "iframeContent", children: /* @__PURE__ */ r(c, { size: "md", height: "sm", placeholder: t("bbm.embed.placeholder"), onChange: d }) }),
+    !!(e != null && e.length) && /* @__PURE__ */ r("div", { className: "embed-preview mt-12", dangerouslySetInnerHTML: {
+      __html: e
     } }),
-    !(htmlContent != null && htmlContent.length) && /* @__PURE__ */ jsx("div", { className: "embed-preview mt-12 d-flex align-items-center justify-content-center bg-gray-300 text-black-50 rounded-3", children: /* @__PURE__ */ jsx("strong", { children: t("bbm.embed.preview") }) })
+    !(e != null && e.length) && /* @__PURE__ */ r("div", { className: "embed-preview mt-12 d-flex align-items-center justify-content-center bg-gray-300 text-black-50 rounded-3", children: /* @__PURE__ */ r("strong", { children: t("bbm.embed.preview") }) })
   ] });
 };
 export {
-  Embed as default
+  N as default
 };
+//# sourceMappingURL=Embed.js.map

package/dist/modules/multimedia/Embed/Embed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Embed.js","sources":["../../../../src/modules/multimedia/Embed/Embed.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { useTranslation } from 'react-i18next';\n\nimport { FormControl, Icon, TextArea } from '../../../components';\n\nexport interface EmbedProps {\n  onSuccess: (resource?: string) => void;\n}\n\nconst Embed = ({ onSuccess }: EmbedProps) => {\n  const { t } = useTranslation();\n\n  const [htmlContent, setHTMLContent] = useState<string>();\n\n  function handleContentChange(event: React.ChangeEvent<HTMLTextAreaElement>) {\n    const HTMLContent = event.target.value;\n\n    setHTMLContent(HTMLContent);\n\n    if (HTMLContent?.length) {\n      onSuccess(HTMLContent);\n    } else {\n      onSuccess();\n    }\n  }\n\n  return (\n    <div className=\"d-flex flex-column flex-fill\">\n      <div className=\"mb-32\">{t('bbm.embed.description')}</div>\n      <div className=\"mb-8 d-flex\">\n        <Icon name=\"code\" className=\"me-8\" />\n        {t('bbm.embed.title')}\n      </div>\n      <FormControl id=\"iframeContent\">\n        <TextArea\n          size=\"md\"\n          height=\"sm\"\n          placeholder={t('bbm.embed.placeholder')}\n          onChange={handleContentChange}\n        />\n      </FormControl>\n      {!!htmlContent?.length && (\n        <div\n          className=\"embed-preview mt-12\"\n          dangerouslySetInnerHTML={{ __html: htmlContent }}\n        ></div>\n      )}\n      {!htmlContent?.length && (\n        <div className=\"embed-preview mt-12 d-flex align-items-center justify-content-center bg-gray-300 text-black-50 rounded-3\">\n          <strong>{t('bbm.embed.preview')}</strong>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default Embed;\n"],"names":["Embed","onSuccess","t","useTranslation","htmlContent","setHTMLContent","useState","handleContentChange","event","HTMLContent","target","value","length","jsxs","jsx","Icon","FormControl","TextArea","__html"],"mappings":";;;;;;AAUA,MAAMA,IAAQA,CAAC;AAAA,EAAEC,WAAAA;AAAsB,MAAM;AACrC,QAAA;AAAA,IAAEC;AAAAA,MAAMC,EAAe,GAEvB,CAACC,GAAaC,CAAc,IAAIC,EAAiB;AAEvD,WAASC,EAAoBC,GAA+C;AACpEC,UAAAA,IAAcD,EAAME,OAAOC;AAEjCN,IAAAA,EAAeI,CAAW,GAEtBA,KAAAA,QAAAA,EAAaG,SACfX,EAAUQ,CAAW,IAEXR;EAEd;AAGE,SAAA,gBAAAY,EAAC,OAAI,EAAA,WAAU,gCACb,UAAA;AAAA,IAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,SAASZ,UAAAA,EAAE,uBAAuB,GAAE;AAAA,IACnD,gBAAAW,EAAC,OAAI,EAAA,WAAU,eACb,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAK,EAAA,MAAK,QAAO,WAAU,QAAM;AAAA,MACjCb,EAAE,iBAAiB;AAAA,IAAA,GACtB;AAAA,sBACCc,GAAY,EAAA,IAAG,iBACd,UAAA,gBAAAF,EAACG,KACC,MAAK,MACL,QAAO,MACP,aAAaf,EAAE,uBAAuB,GACtC,UAAUK,EAAoB,CAAA,GAElC;AAAA,IACC,CAAC,EAACH,KAAAA,QAAAA,EAAaQ,6BACb,OACC,EAAA,WAAU,uBACV,yBAAyB;AAAA,MAAEM,QAAQd;AAAAA,IAAAA,GACpC;AAAA,IAEF,EAACA,KAAAA,QAAAA,EAAaQ,WACb,gBAAAE,EAAC,OAAI,EAAA,WAAU,4GACb,UAAA,gBAAAA,EAAC,UAAQZ,EAAAA,UAAAA,EAAE,mBAAmB,EAAE,CAAA,GAClC;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}