feat: initialize voice message

src/app/config.ts

@@ -80,6 +80,7 @@ export const ContentTypes = {
   text: "text/plain",
   markdown: "text/markdown",
   file: "vocechat/file",
+  audio: "vocechat/audio",
   archive: "vocechat/archive",
   formData: "multipart/form-data",
   json: "application/json"
@@ -87,6 +88,7 @@ export const ContentTypes = {
 export const MessageTypes = {
   text: "text/plain",
   markdown: "text/markdown",
+  audio: "vocechat/audio",
   file: "vocechat/file",
   archive: "vocechat/archive",
 };

src/common/component/Message/renderContent.tsx

@@ -7,6 +7,7 @@ import MarkdownRender from "../MarkdownRender";
 import FileMessage from "../FileMessage";
 import { ContentType } from "../../../types/message";
 import LinkifyText from '../LinkifyText';
+import VoiceMessage, { VoiceMessageProps } from "../VoiceMessage";
 
 type Props = {
   context: "user" | "channel";
@@ -51,6 +52,12 @@ const renderContent = ({
         ctn = <MarkdownRender content={content} />;
       }
       break;
+    case ContentTypes.audio:
+      {
+        // const { url, secure_url } = properties; todo
+        ctn = <VoiceMessage data={content as VoiceMessageProps} />;
+      }
+      break;
     case ContentTypes.file:
       {
         // const { size, name, file_type } = properties;

src/common/component/VoiceMessage.tsx

@@ -0,0 +1,26 @@
+import { useState } from 'react';
+
+export type VoiceMessageProps = {
+    type: string,
+    url: string,
+    secure_url: string,
+}
+
+const VoiceMessage = ({ data }: { data: VoiceMessageProps }) => {
+    const [audio, setAudio] = useState(new Audio(data.url));
+    // useEffect(() => {
+    //   first
+
+    //   return () => {
+    //     second
+    //   }
+    // }, [url])
+
+    return (
+        <div className='bg-green-800'>
+            audio message
+        </div>
+    );
+};
+
+export default VoiceMessage;

src/types/message.ts

@@ -1,7 +1,7 @@
 import { ChatEvent } from "./sse";
 
-export type ContentType = "text/plain" | "text/markdown" | "vocechat/file" | "vocechat/archive";
-export type ContentTypeKey = "text" | "markdown" | "file" | "archive";
+export type ContentType = "text/plain" | "text/markdown" | "vocechat/file" | "vocechat/audio" | "vocechat/archive";
+export type ContentTypeKey = "text" | "markdown" | "file" | "audio" | "archive";
 
 export interface MuteDTO {
   add_users?: {
@@ -24,4 +24,4 @@ export interface UploadFileResponse {
     height: number;
   };
 }
-export interface ChatMessage extends Omit<ChatEvent, "type"> {}
+export interface ChatMessage extends Omit<ChatEvent, "type"> { }