Handle replying with a voice recording.

src/components/views/rooms/VoiceRecordComposerTile.tsx

@@ -39,7 +39,7 @@ import InlineSpinner from "../elements/InlineSpinner";
 import { PlaybackManager } from "../../../audio/PlaybackManager";
 import { doMaybeLocalRoomAction } from "../../../utils/local-room";
 import defaultDispatcher from "../../../dispatcher/dispatcher";
-import { attachRelation } from "./SendMessageComposer";
+import { attachMentions, attachRelation } from "./SendMessageComposer";
 import { addReplyToMessageContent } from "../../../utils/Reply";
 import { RoomPermalinkCreator } from "../../../utils/permalinks/Permalinks";
 import RoomContext from "../../../contexts/RoomContext";
@@ -129,7 +129,8 @@ export default class VoiceRecordComposerTile extends React.PureComponent<IProps,
  this.state.recorder.getPlayback().thumbnailWaveform.map((v) => Math.round(v * 1024)),
  );
 
- // TODO Do we need to attachMentions?
+ // Attach mentions, which really only applies if there's a replyToEvent.
+ attachMentions(MatrixClientPeg.get().getUserId()!, content, null, replyToEvent);
  attachRelation(content, relation);
  if (replyToEvent) {
  addReplyToMessageContent(content, replyToEvent, {

test/components/views/rooms/VoiceRecordComposerTile-test.tsx

@@ -26,6 +26,7 @@ import { IUpload, VoiceMessageRecording } from "../../../../src/audio/VoiceMessa
 import { RoomPermalinkCreator } from "../../../../src/utils/permalinks/Permalinks";
 import { VoiceRecordingStore } from "../../../../src/stores/VoiceRecordingStore";
 import { PlaybackClock } from "../../../../src/audio/PlaybackClock";
+import { mkEvent } from "../../../test-utils";
 
 jest.mock("../../../../src/utils/local-room", () => ({
  doMaybeLocalRoomAction: jest.fn(),
@@ -50,6 +51,7 @@ describe("<VoiceRecordComposerTile/>", () => {
 
  beforeEach(() => {
  mockClient = {
+ getUserId: jest.fn().mockReturnValue("@alice:example.com"),
  sendMessage: jest.fn(),
  } as unknown as MatrixClient;
  MatrixClientPeg.get = () => mockClient;
@@ -127,6 +129,61 @@ describe("<VoiceRecordComposerTile/>", () => {
  "org.matrix.msc1767.text": "Voice message",
  "org.matrix.msc3245.voice": {},
  "url": "mxc://example.com/voice",
+ "org.matrix.msc3952.mentions": {},
+ });
+ });
+
+ it("reply with voice recording", async () => {
+ const room = {
+ roomId,
+ } as unknown as Room;
+
+ const replyToEvent = mkEvent({
+ type: "m.room.message",
+ user: "@bob:test",
+ room: roomId,
+ content: {},
+ event: true,
+ });
+
+ const props = {
+ room,
+ ref: voiceRecordComposerTile,
+ permalinkCreator: new RoomPermalinkCreator(room),
+ replyToEvent,
+ };
+ render(<VoiceRecordComposerTile {...props} />);
+
+ await voiceRecordComposerTile.current!.send();
+ expect(mockClient.sendMessage).toHaveBeenCalledWith(roomId, {
+ "body": "Voice message",
+ "file": undefined,
+ "info": {
+ duration: 1337000,
+ mimetype: "audio/ogg",
+ size: undefined,
+ },
+ "msgtype": MsgType.Audio,
+ "org.matrix.msc1767.audio": {
+ duration: 1337000,
+ waveform: [1434, 2560, 3686],
+ },
+ "org.matrix.msc1767.file": {
+ file: undefined,
+ mimetype: "audio/ogg",
+ name: "Voice message.ogg",
+ size: undefined,
+ url: "mxc://example.com/voice",
+ },
+ "org.matrix.msc1767.text": "Voice message",
+ "org.matrix.msc3245.voice": {},
+ "url": "mxc://example.com/voice",
+ "m.relates_to": {
+ "m.in_reply_to": {
+ event_id: replyToEvent.getId(),
+ },
+ },
+ "org.matrix.msc3952.mentions": { user_ids: ["@bob:test"] },
  });
  });
  });