Send and Receive Cloud Messages Function

.vscode/launch.json

@@ -1,7 +1,4 @@
 {
-    // Use IntelliSense to learn about possible attributes.
-    // Hover to view descriptions of existing attributes.
-    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
     "version": "0.2.0",
     "configurations": [
         {
@@ -22,7 +19,7 @@
             "request": "launch",
             "command": "npm run dev",
             "serverReadyAction": {
-                "pattern": "started server on .+, url: (https?://.+)",
+                "pattern": "- Local:.+(https?://.+)",
                 "uriFormat": "%s",
                 "action": "debugWithChrome"
             }

components/sections/group/index.tsx

@@ -58,9 +58,11 @@ const Group = (props: IGroupSectionProps) => {
                 Online
               </h1>
             ) : (
-              <h1 className="text-sm md:text-md font-bold text-black">
-                {getRelativeTime(group.lastMessage?.createdOn)}
-              </h1>
+              group.lastMessage && (
+                <h1 className="text-sm md:text-md font-bold text-black">
+                  {getRelativeTime(group.lastMessage.createdOn)}
+                </h1>
+              )
             )}
           </div>
         </div>

pages/api/message.ts

@@ -9,15 +9,39 @@ export default async function handler(
   res: NextApiResponse<object>
 ) {
   if (req.method === 'POST') {
-    const createdFor = req.body,
-      messageData = await getUsersCombined([{ createdFor }]);
+    const { action } = req.body;
 
-    if (!messageData) {
-      res.status(500).json({ error: 'Bad parameters' });
+    if (action === restContext.getUsersMerged) {
+      const { createdFor } = req.body,
+        messageData = await getUsersCombined([{ createdFor }]);
+
+      if (!messageData) {
+        res.status(500).json({ error: 'Bad parameters' });
+        return;
+      }
+
+      res.status(200).json(messageData[0].createdFor);
+    } else if (action === restContext.createMessage) {
+      const { message } = req.body,
+        { toId, fromId, groupId, referenceId, content, readBy } = message;
+
+      const { data, error } = await supabaseUtil.createMessage(
+        referenceId,
+        fromId,
+        groupId,
+        toId,
+        content,
+        readBy
+      );
+
+      if (error) {
+        res.status(500).json({ error: 'Bad parameters' });
+        return;
+      }
+
+      res.status(201).json({ data });
       return;
     }
-
-    res.status(200).json(messageData[0].createdFor);
   } else if (req.method === 'DELETE') {
     const { referenceId, groupId } = req.query;
     const { error } = await supabaseUtil.deleteMessages(referenceId);
@@ -67,11 +91,11 @@ export default async function handler(
         return;
       }
     } else if (context === restContext.updateMessage) {
-      const { referenceId, content } = req.body;
-      const { error } = await supabaseUtil.updateMessageContent(
-        referenceId,
-        content
-      );
+      const { referenceId, content } = req.body,
+        { error } = await supabaseUtil.updateMessageContent(
+          referenceId,
+          content
+        );
 
       if (error) {
         res.status(500).json({ error: 'Internal error' });

pages/cloud/index.tsx

@@ -40,6 +40,7 @@ import LayoutSwitch from '@/components/layout';
 import Spinner from '@/components/svgs/spinner';
 import SectionSwitch from '@/components/sections';
 import {
+  createMessage,
   createSocket,
   deleteMessage,
   getGroups,
@@ -166,7 +167,7 @@ const Messages = () => {
             type: messageWays.RECEIVED,
             content: output.content,
             fromId: output.fromId,
-            createdOn: output.createdOn,
+            createdOn: output.timestamp,
             groupId: tempGroup.id,
             status: true,
             toId: output.toId,
@@ -351,7 +352,7 @@ const Messages = () => {
             setFriend(Object.assign(body, { createdFor: data }));
           });
         } else if (body?.messageType === messageTypes.DEFAULT) {
-          console.log('new message (inserted)', payload);
+          setOutput(body);
         }
       } else if (eventType === eventTypes.update) {
         console.log('updated', payload);
@@ -591,7 +592,7 @@ const Messages = () => {
     newMessage: IMessageProps,
     isForward: boolean = false
   ) => {
-    if (newMessage?.content && socket) {
+    if (newMessage?.content) {
       const tempGroup: IGroupProps = isForward
           ? groups?.find((g) => g.id === newMessage.groupId)
           : group,
@@ -613,9 +614,16 @@ const Messages = () => {
       if (textInputRef?.current) {
         textInputRef.current.focus();
       }
-
-      socket?.emit('new-message', newMessage);
-
+      (async () => {
+        await createMessage(
+          Object.assign(newMessage, {
+            readBy: [
+              { id: newMessage.toId, value: false },
+              { id: newMessage.fromId, value: true },
+            ],
+          })
+        );
+      })();
       if (!isForward) {
         const tempGroupIndex = groups.findIndex((g) => g.id === group.id);
         groups.splice(tempGroupIndex, 1);

pages/local/index.tsx

@@ -528,7 +528,7 @@ const Messages = () => {
     newMessage: IMessageProps,
     isforwardModal: boolean = false
   ) => {
-    if (newMessage?.content && socket) {
+    if (newMessage?.content) {
       const tempGroup: IGroupProps = isforwardModal
           ? groups?.find((g) => g.id === newMessage.groupId)
           : group,
@@ -550,9 +550,7 @@ const Messages = () => {
       if (textInputRef?.current) {
         textInputRef.current.focus();
       }
-
       socket?.emit('new-message', newMessage);
-
       if (!isforwardModal) {
         const tempGroupIndex = groups.findIndex((g) => g.id === group.id);
         groups.splice(tempGroupIndex, 1);

utils/enums.ts

@@ -89,9 +89,10 @@ export enum messagingType {
 }
 
 export enum restContext {
-  updateRead = 'UPDATE_READ',
-  updateMessage = 'UPDATE_MESSAGE',
-  markAsUnread = 'MARK_AS_UNREAD',
+  updateRead = 1,
+  updateMessage = 2,
+  getUsersMerged = 3,
+  createMessage = 4,
 }
 
 export enum eventTypes {

utils/http.ts

@@ -1,4 +1,4 @@
-import { IMessageDataProps } from '@/types';
+import { IMessageDataProps, IMessageProps } from '@/types';
 import { apiUrls, restContext } from './enums';
 
 export const getFeeds = async (userId: string) => {
@@ -58,6 +58,18 @@ export const markAsUnread = async (message: IMessageDataProps) => {
     .then((data) => data);
 };
 
+export const createMessage = async (message: IMessageProps) => {
+  return await fetch(apiUrls.message, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify({ action: restContext.createMessage, message }),
+  })
+    .then((response) => response.json())
+    .then((data) => data);
+};
+
 export const updateMessage = async (content: string, referenceId: string) => {
   return await fetch(apiUrls.message, {
     method: 'PUT',
@@ -93,7 +105,7 @@ export const getUsersMerged = async (createdFor: string[]) => {
     headers: {
       'Content-Type': 'application/json',
     },
-    body: JSON.stringify(createdFor),
+    body: JSON.stringify({ action: restContext.getUsersMerged, createdFor }),
   })
     .then((response) => response.json())
     .then((data) => data);