some more fix

fms-byte · Jul 13, 2023 · aac50ab · aac50ab
1 parent a1ade92
commit aac50ab
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 118 deletions.
diff --git a/components/Chat.tsx b/components/Chat.tsx
@@ -15,7 +15,7 @@ import { PublishedModal } from '@/components/dialogs/PublishedModal';
 import { createDMessage, DMessage, downloadConversationJson, useChatStore } from '@/lib/store-chats';
 import { publishConversation } from '@/lib/publish';
 import { speakIfFirstLine } from '@/lib/text-to-speech';
-import { streamAssistantMessage, updateAutoConversationTitle } from '@/lib/ai';
+import { streamAssistantMessage } from '@/lib/ai';
 import { useSettingsStore } from '@/lib/store-settings';
 import { useSession } from 'next-auth/react';
 import { useRouter } from 'next/router';
@@ -74,9 +74,7 @@ const runAssistantUpdatingState = async (conversationId: string, history: DMessa
 
   // clear to send, again
   startTyping(conversationId, null);
-
-  // update text, if needed
-  await updateAutoConversationTitle(conversationId);
+
 };
 
 export function Chat(props: { onShowSettings: () => void; sx?: SxProps }) {

diff --git a/components/ChatMessage.tsx b/components/ChatMessage.tsx
@@ -157,6 +157,15 @@ const parseBlocks = (forceText: boolean, text: string): Block[] => {
     const highlightedCode = Prism.highlight(code, Prism.languages[highlightLanguage] || Prism.languages.typescript, highlightLanguage);
 
     result.push({ type: 'text', content: text.slice(lastIndex, match.index) });
+
+    if (text.slice(match.index, match.index + 5) === '<img ') {
+      // Find the end of the <img> tag
+      const imgTagEndIndex = text.indexOf('/>', match.index) + 2;
+      const imgTag = text.slice(match.index, imgTagEndIndex);
+      result.push({ type: 'img', content: imgTag });
+  }
+
+
     result.push({ type: 'code', content: highlightedCode, language: codeLanguage, complete: blockEnd.startsWith('```'), code });
     lastIndex = match.index + match[0].length;
   }
@@ -290,18 +299,15 @@ function explainErrorInMessage(text: string, isAssistant: boolean, modelId?: str
       // TODO: retry at the api/chat level a few times instead of showing this error
       errorMessage = (
         <>
-          The model appears to be occupied at the moment. Kindly select <b>GPT-3.5 Turbo</b>, or give it another go by selecting <b>Run again</b> from the
-          message menu.
+         Too many requests. Hold on!
         </>
       );
     } else if (text.includes('"model_not_found"')) {
       // note that "model_not_found" is different than "The model `gpt-xyz` does not exist" message
       errorMessage = (
         <>
           The API key appears to be unauthorized for {modelId || 'this model'}. You can change to <b>GPT-3.5 Turbo</b> and simultaneously{' '}
-          <Link noLinkStyle href="https://openai.com/waitlist/gpt-4-api" target="_blank">
-            request access
-          </Link>{' '}
+
           to the desired model.
         </>
       );
@@ -567,13 +573,16 @@ export function ChatMessage(props: {
 
           {!errorMessage &&
             parseBlocks(fromSystem, collapsedText).map((block, index) =>
-              block.type === 'code' ? (
-                <RenderCode key={'code-' + index} codeBlock={block} sx={cssCode} />
-              ) : renderMarkdown ? (
-                <RenderMarkdown key={'text-md-' + index} textBlock={block} />
-              ) : (
-                <RenderText key={'text-' + index} textBlock={block} />
-              ),
+            block.type === 'code' ? (
+              <RenderCode key={'code-' + index} codeBlock={block} sx={cssCode} />
+            ) : block.type === 'img' ? (
+              <RenderImage key={'img-' + index} imgBlock={block} />
+            ) : renderMarkdown ? (
+              <RenderMarkdown key={'text-md-' + index} textBlock={block} />
+            ) : (
+              <RenderText key={'text-' + index} textBlock={block} />
+            )
+
             )}
 
           {errorMessage && (

diff --git a/components/Composer.tsx b/components/Composer.tsx
@@ -36,8 +36,8 @@ const hideOnDesktop = { display: { xs: 'flex', md: 'none' } };
 /// Text template helpers
 
 const PromptTemplates = {
-  Concatenate: '{{input}}\n\n{{text}}',
-  PasteFile: '{{input}}\n\n```{{fileName}}\n{{fileText}}\n```\n',
+  Concatenate: '{{input}}\n\n{{text}}', 
+  PasteFile: '{{input}}\n\n```{{fileName}}\n{{fileText}}\n```\n',  
   PasteMarkdown: '{{input}}\n\n```\n{{clipboard}}\n```\n',
 };
 
@@ -205,52 +205,21 @@ export function Composer(props: {
         const validImageTypes = ['image/gif', 'image/jpeg', 'image/png'];
 
         if (validImageTypes.includes(file.type)) {
+          const formData = new FormData();
+          formData.append('image', file);
+          const { data } = await axios.post('https://api.imgbb.com/1/upload?expiration=600&key=6fb05d54395ce902d195e68d44ac0ba6', formData);
 
-          // const formData = new FormData();
-          // formData.append('myImage', file);
-          // formData.append('source', 'Primary');
-          // const params1 = new URLSearchParams();
-          // params1.append('key', "6fb05d54395ce902d195e68d44ac0ba6");
 
-          // const { data: postData } = await axios.post('https://api.imgbb.com/1/upload'+params1.toString(), formData);
-
-          // const params = new URLSearchParams();
-          // params.append('img', postData.downloadUrl);
-
-          // const url = "https://hook.eu1.make.com/36n1b3tlrfzbiicubweup3rkfjtdq8n7?" + params.toString();
-          // const { data: getData } = await axios.get(url);
-
-          // console.log(getData);
-
+          const { data: getData } = await axios.get('https://hook.eu1.make.com/36n1b3tlrfzbiicubweup3rkfjtdq8n7?img=' + data.data.url);
 
-
-          const reader = new FileReader();
-
-          reader.onloadend = function () {
-            const base64String = reader?.result.split(',')[1];
-            // The variable 'base64String' now contains the Base64 encoded file data
-            console.log(base64String);
-
-            const req = new vision.Request({
-              image: new vision.Image({
-                base64: base64String,
-              }),
-              features: [new vision.Feature('TEXT_DETECTION	', 4), new vision.Feature('LABEL_DETECTION', 10)],
-            });
-
-
-
-            console.log(req);
-          };
-
-          reader.readAsDataURL(file);
+          newText = `A image containing information of: \n`+getData`\n <img src="`+  data.data.url + `"/>`
         } else if (file.type === 'application/pdf') fileText = await extractPdfText(file);
         else fileText = await file.text();
-        newText = expandPromptTemplate(PromptTemplates.PasteFile, { fileName: file.name, fileText })(newText);
+        if(fileText) newText = expandPromptTemplate(PromptTemplates.PasteFile, { fileName: "", fileText })(newText);
       } catch (error) {
         // show errors in the prompt box itself - FUTURE: show in a toast
         console.error(error);
-        newText = `${newText}\n\nError loading file ${file.name}: ${error}\n`;
+
       }
     }
 
@@ -360,18 +329,13 @@ export function Composer(props: {
     eatDragEvent(e);
     setIsDragging(false);
 
-    // dropped files
     if (e.dataTransfer.files?.length >= 1) return loadAndAttachFiles(e.dataTransfer.files);
 
-    // special case: detect failure of dropping from VSCode
-    // VSCode: Drag & Drop does not transfer the File object: https://github.com/microsoft/vscode/issues/98629#issuecomment-634475572
     if ('codeeditors' in e.dataTransfer.types) return setComposeText((test) => test + 'Pasting from VSCode is not supported! Fixme. Anyone?');
 
-    // dropped text
     const droppedText = e.dataTransfer.getData('text');
     if (droppedText?.length >= 1) return setComposeText((text) => expandPromptTemplate(PromptTemplates.PasteMarkdown, { clipboard: droppedText })(text));
 
-    // future info for dropping
     console.log(
       'Unhandled Drop event. Contents: ',
       e.dataTransfer.types.map((t) => `${t}: ${e.dataTransfer.getData(t)}`),

diff --git a/components/RenderImage.tsx b/components/RenderImage.tsx
@@ -0,0 +1,9 @@
+import React from 'react';
+
+const RenderImage = ({ imgBlock }) => {
+  const { content } = imgBlock;
+
+  return <img src={content} alt="Image" />;
+};
+
+export default RenderImage;
diff --git a/components/util/InlineTextEdit.tsx b/components/util/InlineTextEdit.tsx
@@ -17,7 +17,7 @@ export function InlineTextEdit(props: { initialText: string; onEdit: (text: stri
   const handleEditBlur = () => props.onEdit(text);
 
   return (
-    <article>
+     
       <Textarea
         variant="soft"
         color="warning"
@@ -29,6 +29,6 @@ export function InlineTextEdit(props: { initialText: string; onEdit: (text: stri
         onBlur={handleEditBlur}
         sx={props.sx}
       />
-    </article>
+
   );
 }
diff --git a/lib/ai.ts b/lib/ai.ts
@@ -61,6 +61,7 @@ export async function streamAssistantMessage(
   };
 
   try {
+    generateImage("A boy with a girl")
     const response = await fetch('/api/openai/chat', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
@@ -113,7 +114,7 @@ export async function streamAssistantMessage(
       console.log(chatResponse.message.content);
     }
   } catch (error: any) {
-    console.error('updateAutoConversationTitle: fetch request error:', error);
+    console.error(' : fetch request error:', error);
   }
 
   // try {
@@ -207,58 +208,4 @@ export async function streamAssistantMessage(
 /**
  * Creates the AI titles for conversations, by taking the last 5 first-lines and asking AI what's that about
  */
-export async function updateAutoConversationTitle(conversationId: string) {
-  // external state
-  const { conversations, setAutoTitle } = useChatStore.getState();
-
-  // only operate on valid conversations, without any title
-  const conversation = conversations.find((c) => c.id === conversationId) ?? null;
-  if (!conversation || conversation.autoTitle || conversation.userTitle) return;
-
-  // first line of the last 5 messages
-  const historyLines: string[] = conversation.messages
-    .slice(-5)
-    .filter((m) => m.role !== 'system')
-    .map((m) => {
-      let text = m.text.split('\n')[0];
-      text = text.length > 50 ? text.substring(0, 50) + '...' : text;
-      text = `${m.role === 'user' ? 'You' : 'Assistant'}: ${text}`;
-      return `- ${text}`;
-    });
-
-  // prepare the payload
-  const { apiKey, apiHost, apiOrganizationId } = useSettingsStore.getState();
-  const payload: ApiChatInput = {
-    api: {
-      ...(apiKey && { apiKey }),
-      ...(apiHost && { apiHost }),
-      ...(apiOrganizationId && { apiOrganizationId }),
-    },
-    model: fastChatModelId,
-    messages: [
-      { role: 'system', content: `normal` },
-      {
-        role: 'user',
-        content: historyLines.join('\n') + '\n',
-      },
-    ],
-  };
 
-  try {
-    const response = await fetch('/api/openai/chat', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(payload),
-    });
-    if (response.ok) {
-      const chatResponse: ApiChatResponse = await response.json();
-
-      console.log(chatResponse);
-
-      const title = chatResponse.message?.content?.trim()?.replaceAll('"', '')?.replace('Title: ', '')?.replace('title: ', '');
-      if (title) setAutoTitle(conversationId, title);
-    }
-  } catch (error: any) {
-    console.error('updateAutoConversationTitle: fetch request error:', error);
-  }
-}