From d15e6094b200c953d5d908669387c27dbf5e5c2d Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 04:14:36 -0600 Subject: [PATCH 01/13] Add /jumptodate slash command Fix https://github.com/vector-im/element-web/issues/7677 Utilizing MSC3030: https://github.com/matrix-org/matrix-doc/pull/3030 Experimental Synapse implementation added in https://github.com/matrix-org/synapse/pull/9445 --- src/SlashCommands.tsx | 33 +++++++++++++++++++++++++++++++++ src/i18n/strings/en_EN.json | 1 + 2 files changed, 34 insertions(+) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index f7435ddda81..dc40b89279d 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -19,6 +19,7 @@ limitations under the License. import * as React from 'react'; import { User } from "matrix-js-sdk/src/models/user"; +import { Direction } from 'matrix-js-sdk/src/models/event-timeline'; import { EventType } from "matrix-js-sdk/src/@types/event"; import * as ContentHelpers from 'matrix-js-sdk/src/content-helpers'; import { parseFragment as parseHtml, Element as ChildElement } from "parse5"; @@ -286,6 +287,38 @@ export const Commands = [ category: CommandCategories.admin, renderingTypes: [TimelineRenderingType.Room], }), + new Command({ + command: 'jumptodate', + args: '', + description: _td('Jump to the given date in the timeline'), + runFn: function(roomId, args) { + if (args) { + return success((async () => { + const unixTimestamp = Date.parse(args); + if (!unixTimestamp) { + throw new Error(`Unable to parse given date ${args}`); + } + + const cli = MatrixClientPeg.get(); + const { event_id, origin_server_ts } = await cli.timestampToEvent( + roomId, + unixTimestamp, + Direction.Forward, + ) + logger.log(`/timestamp_to_event: found ${event_id} (${origin_server_ts}) for timestamp=${unixTimestamp}`); + dis.dispatch({ + action: Action.ViewRoom, + event_id, + highlighted: true, + room_id: roomId, + }); + })()); + } + + return reject(this.getUsage()); + }, + category: CommandCategories.actions, + }), new Command({ command: 'nick', args: '', diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 6406ce728e3..b08f6a4be36 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -435,6 +435,7 @@ "Sends a message as html, without interpreting it as markdown": "Sends a message as html, without interpreting it as markdown", "Upgrades a room to a new version": "Upgrades a room to a new version", "You do not have the required permissions to use this command.": "You do not have the required permissions to use this command.", + "Jump to the given date in the timeline": "Jump to the given date in the timeline", "Changes your display nickname": "Changes your display nickname", "Changes your display nickname in the current room only": "Changes your display nickname in the current room only", "Changes the avatar of the current room": "Changes the avatar of the current room", From d1a637b2b1d770a4ad71e72ed84078569eebdb6d Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 04:31:11 -0600 Subject: [PATCH 02/13] Add jump to date feature flag --- src/SlashCommands.tsx | 1 + src/i18n/strings/en_EN.json | 1 + src/settings/Settings.tsx | 7 +++++++ 3 files changed, 9 insertions(+) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index dc40b89279d..cb4dfa3ec38 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -291,6 +291,7 @@ export const Commands = [ command: 'jumptodate', args: '', description: _td('Jump to the given date in the timeline'), + isEnabled: () => SettingsStore.getValue("feature_jump_to_date"), runFn: function(roomId, args) { if (args) { return success((async () => { diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index b08f6a4be36..cc7f21a870b 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -861,6 +861,7 @@ "Meta Spaces": "Meta Spaces", "Use new room breadcrumbs": "Use new room breadcrumbs", "New spotlight search experience": "New spotlight search experience", + "Jump to date (adds /jumptodate). Also requires your homeserver to have MSC3030 enabled": "Jump to date (adds /jumptodate). Also requires your homeserver to have MSC3030 enabled", "Don't send read receipts": "Don't send read receipts", "Font size": "Font size", "Use custom size": "Use custom size", diff --git a/src/settings/Settings.tsx b/src/settings/Settings.tsx index a86f0535126..904628e9d86 100644 --- a/src/settings/Settings.tsx +++ b/src/settings/Settings.tsx @@ -367,6 +367,13 @@ export const SETTINGS: {[setting: string]: ISetting} = { displayName: _td("New spotlight search experience"), default: false, }, + "feature_jump_to_date": { + isFeature: true, + labsGroup: LabGroup.Messaging, + displayName: _td("Jump to date (adds /jumptodate). Also requires your homeserver to have MSC3030 enabled"), + supportedLevels: LEVELS_FEATURE, + default: false, + }, "RoomList.backgroundImage": { supportedLevels: LEVELS_ACCOUNT_SETTINGS, default: null, From 3c7155c6d03ff4efa1cf128601afd671a68783aa Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 04:47:00 -0600 Subject: [PATCH 03/13] Fix lints --- src/SlashCommands.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index cb4dfa3ec38..c21d45b2be7 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -301,15 +301,17 @@ export const Commands = [ } const cli = MatrixClientPeg.get(); - const { event_id, origin_server_ts } = await cli.timestampToEvent( + const { event_id: eventId, origin_server_ts: originServerTs } = await cli.timestampToEvent( roomId, unixTimestamp, Direction.Forward, - ) - logger.log(`/timestamp_to_event: found ${event_id} (${origin_server_ts}) for timestamp=${unixTimestamp}`); + ); + logger.log( + `/timestamp_to_event: found ${eventId} (${originServerTs}) for timestamp=${unixTimestamp}`, + ); dis.dispatch({ action: Action.ViewRoom, - event_id, + eventId, highlighted: true, room_id: roomId, }); From 5984c1feea216b1712edf5b628866a366cd86ab5 Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 05:08:19 -0600 Subject: [PATCH 04/13] Trigger Build From 9573eb1f7048d6844b9ce9061b9d4b2ded1ca69b Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 05:36:40 -0600 Subject: [PATCH 05/13] Only show jump to date feature flag when your homserver supports it See https://github.com/matrix-org/matrix-react-sdk/pull/7372#discussion_r769523369 --- .../settings/tabs/user/LabsUserSettingsTab.tsx | 16 ++++++++++++++++ src/settings/Settings.tsx | 8 +++++--- 2 files changed, 21 insertions(+), 3 deletions(-) diff --git a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx index d8ecbc2815c..496f2fc1e69 100644 --- a/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx +++ b/src/components/views/settings/tabs/user/LabsUserSettingsTab.tsx @@ -49,6 +49,7 @@ export class LabsSettingToggle extends React.Component interface IState { showHiddenReadReceipts: boolean; + showJumpToDate: boolean; } @replaceableComponent("views.settings.tabs.user.LabsUserSettingsTab") @@ -60,8 +61,13 @@ export default class LabsUserSettingsTab extends React.Component<{}, IState> { this.setState({ showHiddenReadReceipts }); }); + MatrixClientPeg.get().doesServerSupportUnstableFeature("org.matrix.msc2716").then((showJumpToDate) => { + this.setState({ showJumpToDate }); + }); + this.state = { showHiddenReadReceipts: false, + showJumpToDate: false, }; } @@ -135,6 +141,16 @@ export default class LabsUserSettingsTab extends React.Component<{}, IState> { ); } + if (this.state.showJumpToDate) { + groups.getOrCreate(LabGroup.Messaging, []).push( + , + ); + } + labsSection =
{ sortBy(Array.from(groups.entries()), "0").map(([group, flags]) => (
diff --git a/src/settings/Settings.tsx b/src/settings/Settings.tsx index 904628e9d86..ff295484fb9 100644 --- a/src/settings/Settings.tsx +++ b/src/settings/Settings.tsx @@ -368,9 +368,11 @@ export const SETTINGS: {[setting: string]: ISetting} = { default: false, }, "feature_jump_to_date": { - isFeature: true, - labsGroup: LabGroup.Messaging, - displayName: _td("Jump to date (adds /jumptodate). Also requires your homeserver to have MSC3030 enabled"), + // We purposely leave out `isFeature: true` so it doesn't show in Labs + // by default. We will conditionally show it depending on whether we can + // detect MSC3030 support (see LabUserSettingsTab.tsx). + // labsGroup: LabGroup.Messaging, + displayName: _td("Jump to date (adds /jumptodate)"), supportedLevels: LEVELS_FEATURE, default: false, }, From ccf94734b96f10669449e99e71ca815a8c73b50e Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 05:39:32 -0600 Subject: [PATCH 06/13] Add date format examples --- src/SlashCommands.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index c21d45b2be7..db7c0a36f0b 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -290,14 +290,14 @@ export const Commands = [ new Command({ command: 'jumptodate', args: '', - description: _td('Jump to the given date in the timeline'), + description: _td('Jump to the given date in the timeline (YYYY-MM-DD)'), isEnabled: () => SettingsStore.getValue("feature_jump_to_date"), runFn: function(roomId, args) { if (args) { return success((async () => { const unixTimestamp = Date.parse(args); if (!unixTimestamp) { - throw new Error(`Unable to parse given date ${args}`); + throw new Error(`We were unable to understand the given date (${args}). Try using the format YYYY-MM-DD.`); } const cli = MatrixClientPeg.get(); From 5e3acdb4f3a338c7e848e291c641196cd33aa314 Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 05:44:22 -0600 Subject: [PATCH 07/13] Fix lints --- src/SlashCommands.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index db7c0a36f0b..8d959a966a8 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -297,7 +297,9 @@ export const Commands = [ return success((async () => { const unixTimestamp = Date.parse(args); if (!unixTimestamp) { - throw new Error(`We were unable to understand the given date (${args}). Try using the format YYYY-MM-DD.`); + throw new Error( + `We were unable to understand the given date (${args}). Try using the format YYYY-MM-DD.`, + ); } const cli = MatrixClientPeg.get(); From e4af78b4cee9651f25bef763d328d8ce6b018f72 Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 05:52:03 -0600 Subject: [PATCH 08/13] Add translatable error --- src/SlashCommands.tsx | 5 ++++- src/i18n/strings/en_EN.json | 5 +++-- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 8d959a966a8..2f0e50e4f38 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -298,7 +298,10 @@ export const Commands = [ const unixTimestamp = Date.parse(args); if (!unixTimestamp) { throw new Error( - `We were unable to understand the given date (${args}). Try using the format YYYY-MM-DD.`, + _t( + 'We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.', + { inputDate: args }, + ), ); } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index cc7f21a870b..923beba22aa 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -435,7 +435,8 @@ "Sends a message as html, without interpreting it as markdown": "Sends a message as html, without interpreting it as markdown", "Upgrades a room to a new version": "Upgrades a room to a new version", "You do not have the required permissions to use this command.": "You do not have the required permissions to use this command.", - "Jump to the given date in the timeline": "Jump to the given date in the timeline", + "Jump to the given date in the timeline (YYYY-MM-DD)": "Jump to the given date in the timeline (YYYY-MM-DD)", + "We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.": "We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.", "Changes your display nickname": "Changes your display nickname", "Changes your display nickname in the current room only": "Changes your display nickname in the current room only", "Changes the avatar of the current room": "Changes the avatar of the current room", @@ -861,7 +862,7 @@ "Meta Spaces": "Meta Spaces", "Use new room breadcrumbs": "Use new room breadcrumbs", "New spotlight search experience": "New spotlight search experience", - "Jump to date (adds /jumptodate). Also requires your homeserver to have MSC3030 enabled": "Jump to date (adds /jumptodate). Also requires your homeserver to have MSC3030 enabled", + "Jump to date (adds /jumptodate)": "Jump to date (adds /jumptodate)", "Don't send read receipts": "Don't send read receipts", "Font size": "Font size", "Use custom size": "Use custom size", From dddae93d8a40ff04547fd456c614d4102065c36e Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 06:00:08 -0600 Subject: [PATCH 09/13] Add fixme to use newTranslatableError in the near future See https://github.com/matrix-org/matrix-react-sdk/pull/7372#discussion_r769559393 --- src/SlashCommands.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 2f0e50e4f38..58490f3515b 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -298,6 +298,7 @@ export const Commands = [ const unixTimestamp = Date.parse(args); if (!unixTimestamp) { throw new Error( + // FIXME: Use newTranslatableError here instead otherwise the rageshake error messages will be translated too _t( 'We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.', { inputDate: args }, From de661a69cdb8e508a81b3d340f8c802054336327 Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 06:10:16 -0600 Subject: [PATCH 10/13] Fix lints --- src/SlashCommands.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 58490f3515b..2e519f67429 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -298,7 +298,9 @@ export const Commands = [ const unixTimestamp = Date.parse(args); if (!unixTimestamp) { throw new Error( - // FIXME: Use newTranslatableError here instead otherwise the rageshake error messages will be translated too + // FIXME: Use newTranslatableError here instead + // otherwise the rageshake error messages will be + // translated too _t( 'We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.', { inputDate: args }, From a4c360190ef926ce795c2710e4501289bfefa42b Mon Sep 17 00:00:00 2001 From: Eric Eastwood Date: Wed, 15 Dec 2021 06:18:40 -0600 Subject: [PATCH 11/13] Ignore long string --- src/SlashCommands.tsx | 1 + src/components/views/rooms/SendMessageComposer.tsx | 6 +++++- src/languageHandler.tsx | 4 ++-- 3 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 2e519f67429..0004f786280 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -302,6 +302,7 @@ export const Commands = [ // otherwise the rageshake error messages will be // translated too _t( + // eslint-disable-next-line max-len 'We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.', { inputDate: args }, ), diff --git a/src/components/views/rooms/SendMessageComposer.tsx b/src/components/views/rooms/SendMessageComposer.tsx index 54bc69cd24e..bb21a4c0f3a 100644 --- a/src/components/views/rooms/SendMessageComposer.tsx +++ b/src/components/views/rooms/SendMessageComposer.tsx @@ -40,7 +40,7 @@ import { findEditableEvent } from '../../../utils/EventUtils'; import SendHistoryManager from "../../../SendHistoryManager"; import { Command, CommandCategories, getCommand } from '../../../SlashCommands'; import Modal from '../../../Modal'; -import { _t, _td } from '../../../languageHandler'; +import { _t, _td, newTranslatableError } from '../../../languageHandler'; import ContentMessages from '../../../ContentMessages'; import { withMatrixClientHOC, MatrixClientProps } from "../../../contexts/MatrixClientContext"; import { Action } from "../../../dispatcher/actions"; @@ -378,6 +378,10 @@ export class SendMessageComposer extends React.Component Date: Wed, 15 Dec 2021 06:19:33 -0600 Subject: [PATCH 12/13] Revert "Ignore long string" This reverts commit a4c360190ef926ce795c2710e4501289bfefa42b. --- src/SlashCommands.tsx | 1 - src/components/views/rooms/SendMessageComposer.tsx | 6 +----- src/languageHandler.tsx | 4 ++-- 3 files changed, 3 insertions(+), 8 deletions(-) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 0004f786280..2e519f67429 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -302,7 +302,6 @@ export const Commands = [ // otherwise the rageshake error messages will be // translated too _t( - // eslint-disable-next-line max-len 'We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.', { inputDate: args }, ), diff --git a/src/components/views/rooms/SendMessageComposer.tsx b/src/components/views/rooms/SendMessageComposer.tsx index bb21a4c0f3a..54bc69cd24e 100644 --- a/src/components/views/rooms/SendMessageComposer.tsx +++ b/src/components/views/rooms/SendMessageComposer.tsx @@ -40,7 +40,7 @@ import { findEditableEvent } from '../../../utils/EventUtils'; import SendHistoryManager from "../../../SendHistoryManager"; import { Command, CommandCategories, getCommand } from '../../../SlashCommands'; import Modal from '../../../Modal'; -import { _t, _td, newTranslatableError } from '../../../languageHandler'; +import { _t, _td } from '../../../languageHandler'; import ContentMessages from '../../../ContentMessages'; import { withMatrixClientHOC, MatrixClientProps } from "../../../contexts/MatrixClientContext"; import { Action } from "../../../dispatcher/actions"; @@ -378,10 +378,6 @@ export class SendMessageComposer extends React.Component Date: Wed, 15 Dec 2021 06:19:53 -0600 Subject: [PATCH 13/13] Ignore long string --- src/SlashCommands.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/SlashCommands.tsx b/src/SlashCommands.tsx index 2e519f67429..0004f786280 100644 --- a/src/SlashCommands.tsx +++ b/src/SlashCommands.tsx @@ -302,6 +302,7 @@ export const Commands = [ // otherwise the rageshake error messages will be // translated too _t( + // eslint-disable-next-line max-len 'We were unable to understand the given date (%(inputDate)s). Try using the format YYYY-MM-DD.', { inputDate: args }, ),