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
}