diff --git a/src/components/Room/Room.test.tsx b/src/components/Room/Room.test.tsx index 1642cd9..1a82a51 100644 --- a/src/components/Room/Room.test.tsx +++ b/src/components/Room/Room.test.tsx @@ -5,11 +5,12 @@ import { MemoryRouter as Router, Route, Routes } from 'react-router-dom' import { Room } from './' -const mockSender = jest.fn() +const mockGetUuid = jest.fn() +const mockMessagedSender = jest.fn() jest.mock('trystero', () => ({ joinRoom: () => ({ - makeAction: () => [mockSender, () => {}, () => {}], + makeAction: () => [mockMessagedSender, () => {}, () => {}], ping: () => Promise.resolve(0), leave: () => {}, getPeers: () => [], @@ -87,7 +88,7 @@ describe('Room', () => { test('message is sent to peer', () => { render( - + 'abc123')} /> ) @@ -95,6 +96,10 @@ describe('Room', () => { const textInput = screen.getByPlaceholderText('Your message') userEvent.type(textInput, 'hello') userEvent.click(sendButton) - expect(mockSender).toHaveBeenCalledWith({ text: 'hello', timeSent: 100 }) + expect(mockMessagedSender).toHaveBeenCalledWith({ + text: 'hello', + timeSent: 100, + id: 'abc123', + }) }) }) diff --git a/src/components/Room/Room.tsx b/src/components/Room/Room.tsx index dd21758..195c9ba 100644 --- a/src/components/Room/Room.tsx +++ b/src/components/Room/Room.tsx @@ -1,5 +1,6 @@ import { useState } from 'react' import { useParams } from 'react-router-dom' +import { v4 as uuid } from 'uuid' import Button from '@mui/material/Button' import FormControl from '@mui/material/FormControl' import Typography from '@mui/material/Typography' @@ -11,10 +12,12 @@ import { UnsentMessage, ReceivedMessage } from 'models/chat' export interface RoomProps { appId?: string + getUuid?: typeof uuid } export function Room({ appId = `${encodeURI(window.location.origin)}_${process.env.REACT_APP_NAME}`, + getUuid = uuid, }: RoomProps) { const { roomId = '' } = useParams() @@ -42,7 +45,7 @@ export function Room({ event: React.SyntheticEvent ) => { event.preventDefault() - sendMessage({ text: textMessage, timeSent: Date.now() }) + sendMessage({ text: textMessage, timeSent: Date.now(), id: getUuid() }) setTextMessage('') } diff --git a/src/models/chat.ts b/src/models/chat.ts index 8c63502..a9907db 100644 --- a/src/models/chat.ts +++ b/src/models/chat.ts @@ -1,4 +1,5 @@ export interface UnsentMessage { + id: string text: string timeSent: number }