From f22438803a757adcdd791878a32707784cc0e67c Mon Sep 17 00:00:00 2001
From: Rob Gordon <rob.gordon@tone-row.com>
Date: Wed, 10 Jan 2024 23:01:42 -0500
Subject: [PATCH] Available on mobile; on hosted

---
 app/src/components/Microphone.tsx | 11 ++++++++++-
 app/src/pages/EditHosted.tsx      |  7 +++++++
 app/src/pages/Sandbox.tsx         |  5 ++++-
 3 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/app/src/components/Microphone.tsx b/app/src/components/Microphone.tsx
index 3814a3b76..cacccf7ea 100644
--- a/app/src/components/Microphone.tsx
+++ b/app/src/components/Microphone.tsx
@@ -23,11 +23,20 @@ export function Microphone({
   const isRecording = useMicrophoneStore((s) => s.isRecording);
 
   const handleFinishRecording = useCallback(() => {
-    onSend();
     const audioBlob = new Blob(useMicrophoneStore.getState().data, {
       type: "audio/mp4",
     });
 
+    // Get length in milliseconds
+    const lengthInMS = audioBlob.size / audioBlob.type.length;
+
+    // Don't send if the recording is too short
+    if (lengthInMS < 2500) {
+      return;
+    }
+
+    onSend();
+
     // Base64 encode the blob
     let audioUrl = "";
     const reader = new FileReader();
diff --git a/app/src/pages/EditHosted.tsx b/app/src/pages/EditHosted.tsx
index bd2fbe921..611c41b99 100644
--- a/app/src/pages/EditHosted.tsx
+++ b/app/src/pages/EditHosted.tsx
@@ -26,6 +26,7 @@ import { useTabsStore } from "../lib/useTabsStore";
 import { useIsProUser } from "../lib/hooks";
 import { ThemeTab } from "../components/Tabs/ThemeTab";
 import { FlowchartLayout } from "../components/FlowchartLayout";
+import { EditWithAI } from "../components/EditWithAI";
 
 export default function EditHosted() {
   const { id } = useParams<{ id: string }>();
@@ -98,6 +99,9 @@ export default function EditHosted() {
                 readOnly: !isProUser,
               }}
             />
+            <div className="absolute top-2 right-2 z-[40] drop-shadow-lg hidden md:block">
+              <EditWithAI />
+            </div>
           </Tabs.Content>
           <Tabs.Content value="Theme" className="overflow-hidden">
             <ThemeTab />
@@ -116,6 +120,9 @@ export default function EditHosted() {
             }}
           />
           <EditorError />
+          <div className="absolute top-2 right-2 z-[40] drop-shadow-lg md:hidden">
+            <EditWithAI />
+          </div>
         </WithGraph>
       </Tabs.Root>
     </FlowchartLayout>
diff --git a/app/src/pages/Sandbox.tsx b/app/src/pages/Sandbox.tsx
index 6cb5a649c..e0c40e247 100644
--- a/app/src/pages/Sandbox.tsx
+++ b/app/src/pages/Sandbox.tsx
@@ -116,7 +116,7 @@ const Sandbox = memo(function Edit() {
           <WithGraph>
             <Tabs.Content value="Document" className="overflow-hidden relative">
               <TextEditor value={text} onChange={onChange} />
-              <div className="absolute top-2 right-2 z-[40] drop-shadow-lg">
+              <div className="absolute top-2 right-2 z-[40] drop-shadow-lg hidden md:block">
                 <EditWithAI />
               </div>
             </Tabs.Content>
@@ -132,6 +132,9 @@ const Sandbox = memo(function Edit() {
               }}
             />
             <EditorError />
+            <div className="absolute top-2 right-2 z-[40] drop-shadow-lg md:hidden">
+              <EditWithAI />
+            </div>
           </WithGraph>
         </Tabs.Root>
       </FlowchartLayout>