refactor code

enjoy/src/renderer/components/medias/media-current-recording.tsx

@@ -693,12 +693,11 @@ export const MediaCurrentRecording = () => {
 };
 
 export const MediaRecordButton = () => {
-  const { media, isRecording, startRecording, stopRecording, recordingTime } =
-    useContext(MediaPlayerProviderContext);
+  const { media, isRecording, startRecording, stopRecording } = useContext(
+    MediaPlayerProviderContext
+  );
   const { EnjoyApp } = useContext(AppSettingsProviderContext);
   const [access, setAccess] = useState(true);
-  const [active, setActive] = useState(false);
-  const ref = useRef(null);
 
   const askForMediaAccess = () => {
     EnjoyApp.system.preferences.mediaAccess("microphone").then((access) => {
@@ -715,29 +714,8 @@ export const MediaRecordButton = () => {
     askForMediaAccess();
   }, [media]);
 
-  useEffect(() => {
-    if (!active) return;
-    if (recordingTime >= 60) {
-      stopRecording();
-    }
-  }, [active, recordingTime]);
-
-  useEffect(() => {
-    const rect = ref.current?.getBoundingClientRect();
-    if (!rect) return;
-
-    const elementAtPoint = document.elementFromPoint(
-      rect.left + rect.width / 2,
-      rect.top + rect.height / 2
-    );
-    setActive(
-      elementAtPoint == ref.current || ref.current.contains(elementAtPoint)
-    );
-  }, [ref, isRecording]);
-
   return (
     <Button
-      ref={ref}
       variant="ghost"
       disabled={!access}
       onClick={() => {

enjoy/src/renderer/components/medias/media-transcription-generate-button.tsx

@@ -20,6 +20,7 @@ import {
   TranscriptionCreateForm,
   TranscriptionsList,
 } from "@renderer/components";
+import { SttEngineOptionEnum } from "@/types/enums";
 
 export const MediaTranscriptionGenerateButton = (props: {
   children: React.ReactNode;
@@ -67,7 +68,9 @@ export const MediaTranscriptionGenerateButton = (props: {
         <Tabs defaultValue="transcribe">
           <TabsList className="w-full grid grid-cols-2 mb-4">
             <TabsTrigger value="transcribe">{t("transcribe")}</TabsTrigger>
-            <TabsTrigger value="download">{t("downloadTranscript")}</TabsTrigger>
+            <TabsTrigger value="download">
+              {t("downloadTranscript")}
+            </TabsTrigger>
           </TabsList>
           <TabsContent value="transcribe">
             <TranscriptionCreateForm
@@ -76,9 +79,7 @@ export const MediaTranscriptionGenerateButton = (props: {
                 generateTranscription({
                   originalText: data.text,
                   language: data.language,
-                  service: data.service as
-                    | WhisperConfigType["service"]
-                    | "upload",
+                  service: data.service as SttEngineOptionEnum | "upload",
                   isolate: data.isolate,
                 })
                   .then(() => {

enjoy/src/renderer/context/media-player-provider.tsx

@@ -666,6 +666,8 @@ export const MediaPlayerProvider = ({
    * auto stop recording when recording time is over
    */
   useEffect(() => {
+    if (!isRecording) return;
+
     if (recordingType === "segment" && recordingTime >= ONE_MINUTE) {
       stopRecording();
     } else if (recordingTime >= TEN_MINUTES) {