From fcdb0a27d00d8fa46504571399454abfd7aa6738 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 1 Jul 2021 09:53:54 +0100 Subject: [PATCH 1/4] Convert EventTimeline, EventTimelineSet and TimelineWindow to TS --- src/components/structures/FilePanel.tsx | 2 +- src/components/structures/TimelinePanel.tsx | 22 ++++++++++++--------- src/indexing/EventIndex.ts | 6 +++--- 3 files changed, 17 insertions(+), 13 deletions(-) diff --git a/src/components/structures/FilePanel.tsx b/src/components/structures/FilePanel.tsx index 21ef0c4f31..14380341d1 100644 --- a/src/components/structures/FilePanel.tsx +++ b/src/components/structures/FilePanel.tsx @@ -129,7 +129,7 @@ class FilePanel extends React.Component { } } - public async fetchFileEventsServer(room: Room): Promise { + public async fetchFileEventsServer(room: Room): Promise { const client = MatrixClientPeg.get(); const filter = new Filter(client.credentials.userId); diff --git a/src/components/structures/TimelinePanel.tsx b/src/components/structures/TimelinePanel.tsx index e4c7d15596..d7d3b33b3e 100644 --- a/src/components/structures/TimelinePanel.tsx +++ b/src/components/structures/TimelinePanel.tsx @@ -16,11 +16,13 @@ limitations under the License. import React, { createRef, ReactNode, SyntheticEvent } from 'react'; import ReactDOM from "react-dom"; -import { Room } from "matrix-js-sdk/src/models/room"; +import { NotificationCountType, Room } from "matrix-js-sdk/src/models/room"; import { MatrixEvent } from "matrix-js-sdk/src/models/event"; -import { TimelineSet } from "matrix-js-sdk/src/models/event-timeline-set"; +import { EventTimelineSet } from "matrix-js-sdk/src/models/event-timeline-set"; import { EventTimeline } from "matrix-js-sdk/src/models/event-timeline"; import { TimelineWindow } from "matrix-js-sdk/src/timeline-window"; +import { EventType, RelationType } from 'matrix-js-sdk/src/@types/event'; +import { SyncState } from 'matrix-js-sdk/src/sync.api'; import SettingsStore from "../../settings/SettingsStore"; import { Layout } from "../../settings/Layout"; @@ -39,10 +41,8 @@ import { UIFeature } from "../../settings/UIFeature"; import { replaceableComponent } from "../../utils/replaceableComponent"; import { arrayFastClone } from "../../utils/arrays"; import MessagePanel from "./MessagePanel"; -import { SyncState } from 'matrix-js-sdk/src/sync.api'; import { IScrollState } from "./ScrollPanel"; import { ActionPayload } from "../../dispatcher/payloads"; -import { EventType } from 'matrix-js-sdk/src/@types/event'; import ResizeNotifier from "../../utils/ResizeNotifier"; import { RoomPermalinkCreator } from "../../utils/permalinks/Permalinks"; import Spinner from "../views/elements/Spinner"; @@ -65,7 +65,7 @@ interface IProps { // representing. This may or may not have a room, depending on what it's // a timeline representing. If it has a room, we maintain RRs etc for // that room. - timelineSet: TimelineSet; + timelineSet: EventTimelineSet; showReadReceipts?: boolean; // Enable managing RRs and RMs. These require the timelineSet to have a room. manageReadReceipts?: boolean; @@ -579,7 +579,7 @@ class TimelinePanel extends React.Component { }); }; - private onRoomTimelineReset = (room: Room, timelineSet: TimelineSet): void => { + private onRoomTimelineReset = (room: Room, timelineSet: EventTimelineSet): void => { if (timelineSet !== this.props.timelineSet) return; if (this.messagePanel.current && this.messagePanel.current.isAtBottom()) { @@ -792,8 +792,8 @@ class TimelinePanel extends React.Component { // that sending an RR for the latest message will set our notif counter // to zero: it may not do this if we send an RR for somewhere before the end. if (this.isAtEndOfLiveTimeline()) { - this.props.timelineSet.room.setUnreadNotificationCount('total', 0); - this.props.timelineSet.room.setUnreadNotificationCount('highlight', 0); + this.props.timelineSet.room.setUnreadNotificationCount(NotificationCountType.Total, 0); + this.props.timelineSet.room.setUnreadNotificationCount(NotificationCountType.Highlight, 0); dis.dispatch({ action: 'on_room_read', roomId: this.props.timelineSet.room.roomId, @@ -1416,7 +1416,11 @@ class TimelinePanel extends React.Component { }); } - private getRelationsForEvent = (...args) => this.props.timelineSet.getRelationsForEvent(...args); + private getRelationsForEvent = ( + eventId: string, + relationType: RelationType, + eventType: EventType | string, + ) => this.props.timelineSet.getRelationsForEvent(eventId, relationType, eventType); render() { // just show a spinner while the timeline loads. diff --git a/src/indexing/EventIndex.ts b/src/indexing/EventIndex.ts index 43b3de42ed..103a2f0809 100644 --- a/src/indexing/EventIndex.ts +++ b/src/indexing/EventIndex.ts @@ -16,7 +16,7 @@ limitations under the License. import { EventEmitter } from "events"; import { RoomMember } from 'matrix-js-sdk/src/models/room-member'; -import { EventTimeline } from 'matrix-js-sdk/src/models/event-timeline'; +import { Direction, EventTimeline } from 'matrix-js-sdk/src/models/event-timeline'; import { Room } from 'matrix-js-sdk/src/models/room'; import { MatrixEvent } from 'matrix-js-sdk/src/models/event'; import { EventTimelineSet } from 'matrix-js-sdk/src/models/event-timeline-set'; @@ -109,7 +109,7 @@ export default class EventIndex extends EventEmitter { // our message crawler. await Promise.all(encryptedRooms.map(async (room) => { const timeline = room.getLiveTimeline(); - const token = timeline.getPaginationToken("b"); + const token = timeline.getPaginationToken(Direction.Backward); const backCheckpoint: ICrawlerCheckpoint = { roomId: room.roomId, @@ -371,7 +371,7 @@ export default class EventIndex extends EventEmitter { if (!room) return; const timeline = room.getLiveTimeline(); - const token = timeline.getPaginationToken("b"); + const token = timeline.getPaginationToken(Direction.Backward); if (!token) { // The room doesn't contain any tokens, meaning the live timeline From 5c6466d8245fc3b700fbb5217f03c3abd98e521c Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 1 Jul 2021 10:01:48 +0100 Subject: [PATCH 2/4] use better types --- src/Terms.ts | 3 ++- src/components/structures/FilePanel.tsx | 7 ++++++- src/components/structures/TimelinePanel.tsx | 4 ++-- src/indexing/EventIndex.ts | 2 +- 4 files changed, 11 insertions(+), 5 deletions(-) diff --git a/src/Terms.ts b/src/Terms.ts index 3859cc1c73..e96081b7b7 100644 --- a/src/Terms.ts +++ b/src/Terms.ts @@ -15,6 +15,7 @@ limitations under the License. */ import classNames from 'classnames'; +import { SERVICE_TYPES } from '../../matrix-js-sdk/src/service-types'; import { MatrixClientPeg } from './MatrixClientPeg'; import * as sdk from '.'; @@ -32,7 +33,7 @@ export class Service { * @param {string} baseUrl The Base URL of the service (ie. before '/_matrix') * @param {string} accessToken The user's access token for the service */ - constructor(public serviceType: string, public baseUrl: string, public accessToken: string) { + constructor(public serviceType: SERVICE_TYPES, public baseUrl: string, public accessToken: string) { } } diff --git a/src/components/structures/FilePanel.tsx b/src/components/structures/FilePanel.tsx index 14380341d1..d47ea11a3c 100644 --- a/src/components/structures/FilePanel.tsx +++ b/src/components/structures/FilePanel.tsx @@ -19,6 +19,7 @@ import React from 'react'; import { Filter } from 'matrix-js-sdk/src/filter'; import { EventTimelineSet } from "matrix-js-sdk/src/models/event-timeline-set"; +import { Direction } from "matrix-js-sdk/src/models/event-timeline"; import { MatrixEvent } from "matrix-js-sdk/src/models/event"; import { Room } from 'matrix-js-sdk/src/models/room'; import { TimelineWindow } from 'matrix-js-sdk/src/timeline-window'; @@ -153,7 +154,11 @@ class FilePanel extends React.Component { return timelineSet; } - private onPaginationRequest = (timelineWindow: TimelineWindow, direction: string, limit: number): void => { + private onPaginationRequest = ( + timelineWindow: TimelineWindow, + direction: Direction, + limit: number, + ): Promise => { const client = MatrixClientPeg.get(); const eventIndex = EventIndexPeg.get(); const roomId = this.props.roomId; diff --git a/src/components/structures/TimelinePanel.tsx b/src/components/structures/TimelinePanel.tsx index d7d3b33b3e..9253fb786b 100644 --- a/src/components/structures/TimelinePanel.tsx +++ b/src/components/structures/TimelinePanel.tsx @@ -19,7 +19,7 @@ import ReactDOM from "react-dom"; import { NotificationCountType, Room } from "matrix-js-sdk/src/models/room"; import { MatrixEvent } from "matrix-js-sdk/src/models/event"; import { EventTimelineSet } from "matrix-js-sdk/src/models/event-timeline-set"; -import { EventTimeline } from "matrix-js-sdk/src/models/event-timeline"; +import { Direction, EventTimeline } from "matrix-js-sdk/src/models/event-timeline"; import { TimelineWindow } from "matrix-js-sdk/src/timeline-window"; import { EventType, RelationType } from 'matrix-js-sdk/src/@types/event'; import { SyncState } from 'matrix-js-sdk/src/sync.api'; @@ -388,7 +388,7 @@ class TimelinePanel extends React.Component { private onPaginationRequest = ( timelineWindow: TimelineWindow, - direction: string, + direction: Direction, size: number, ): Promise => { if (this.props.onPaginationRequest) { diff --git a/src/indexing/EventIndex.ts b/src/indexing/EventIndex.ts index 103a2f0809..c84d446197 100644 --- a/src/indexing/EventIndex.ts +++ b/src/indexing/EventIndex.ts @@ -862,7 +862,7 @@ export default class EventIndex extends EventEmitter { * @returns {Promise} Resolves to a boolean which is true if more * events were successfully retrieved. */ - public paginateTimelineWindow(room: Room, timelineWindow: TimelineWindow, direction: string, limit: number) { + public paginateTimelineWindow(room: Room, timelineWindow: TimelineWindow, direction: Direction, limit: number) { const tl = timelineWindow.getTimelineIndex(direction); if (!tl) return Promise.resolve(false); From ac0f1ebf93dd6ff48d524d66aba596d07084db62 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 1 Jul 2021 21:05:57 +0100 Subject: [PATCH 3/4] fix field accesses in tests and default params --- src/Terms.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Terms.ts b/src/Terms.ts index e96081b7b7..f2c01ebe24 100644 --- a/src/Terms.ts +++ b/src/Terms.ts @@ -15,7 +15,7 @@ limitations under the License. */ import classNames from 'classnames'; -import { SERVICE_TYPES } from '../../matrix-js-sdk/src/service-types'; +import { SERVICE_TYPES } from 'matrix-js-sdk/src/service-types'; import { MatrixClientPeg } from './MatrixClientPeg'; import * as sdk from '.'; From c2545923c1f189b76eb4d388d4eeea229643c340 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Thu, 1 Jul 2021 21:10:37 +0100 Subject: [PATCH 4/4] Use better types to make CI happy --- .../views/rooms/SendMessageComposer.tsx | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/src/components/views/rooms/SendMessageComposer.tsx b/src/components/views/rooms/SendMessageComposer.tsx index ec190c829a..2c45c1bbf8 100644 --- a/src/components/views/rooms/SendMessageComposer.tsx +++ b/src/components/views/rooms/SendMessageComposer.tsx @@ -17,17 +17,19 @@ limitations under the License. import React, { ClipboardEvent, createRef, KeyboardEvent } from 'react'; import EMOJI_REGEX from 'emojibase-regex'; import { IContent, MatrixEvent } from 'matrix-js-sdk/src/models/event'; +import { DebouncedFunc, throttle } from 'lodash'; +import { EventType, RelationType } from "matrix-js-sdk/src/@types/event"; import dis from '../../../dispatcher/dispatcher'; import EditorModel from '../../../editor/model'; import { - htmlSerializeIfNeeded, - textSerialize, containsEmote, - stripEmoteCommand, - unescapeMessage, + htmlSerializeIfNeeded, startsWith, + stripEmoteCommand, stripPrefix, + textSerialize, + unescapeMessage, } from '../../../editor/serialize'; import { CommandPartCreator, Part, PartCreator, SerializedPart } from '../../../editor/parts'; import BasicMessageComposer from "./BasicMessageComposer"; @@ -52,7 +54,6 @@ import { Room } from 'matrix-js-sdk/src/models/room'; import ErrorDialog from "../dialogs/ErrorDialog"; import QuestionDialog from "../dialogs/QuestionDialog"; import { ActionPayload } from "../../../dispatcher/payloads"; -import { DebouncedFunc, throttle } from 'lodash'; function addReplyToMessageContent( content: IContent, @@ -258,12 +259,12 @@ export default class SendMessageComposer extends React.Component { const events = timeline.getEvents(); const reaction = this.model.parts[1].text; for (let i = events.length - 1; i >= 0; i--) { - if (events[i].getType() === "m.room.message") { + if (events[i].getType() === EventType.RoomMessage) { let shouldReact = true; const lastMessage = events[i]; const userId = MatrixClientPeg.get().getUserId(); const messageReactions = this.props.room.getUnfilteredTimelineSet() - .getRelationsForEvent(lastMessage.getId(), "m.annotation", "m.reaction"); + .getRelationsForEvent(lastMessage.getId(), RelationType.Annotation, EventType.Reaction); // if we have already sent this reaction, don't redact but don't re-send if (messageReactions) { @@ -274,9 +275,9 @@ export default class SendMessageComposer extends React.Component { shouldReact = !myReactionKeys.includes(reaction); } if (shouldReact) { - MatrixClientPeg.get().sendEvent(lastMessage.getRoomId(), "m.reaction", { + MatrixClientPeg.get().sendEvent(lastMessage.getRoomId(), EventType.Reaction, { "m.relates_to": { - "rel_type": "m.annotation", + "rel_type": RelationType.Annotation, "event_id": lastMessage.getId(), "key": reaction, },