From c5e982f5b0bfb1b895242dea807bf7a66d7a2173 Mon Sep 17 00:00:00 2001 From: yaya-usman Date: Thu, 21 Jul 2022 15:53:09 +0300 Subject: [PATCH 1/2] added the starred item button to the left panel --- src/components/views/rooms/RoomList.tsx | 43 +++++++++++++++++++++- src/components/views/rooms/RoomSublist.tsx | 2 +- src/i18n/strings/en_EN.json | 1 + src/stores/room-list/models.ts | 2 + 4 files changed, 46 insertions(+), 2 deletions(-) diff --git a/src/components/views/rooms/RoomList.tsx b/src/components/views/rooms/RoomList.tsx index fb90941ee4..b2493db25c 100644 --- a/src/components/views/rooms/RoomList.tsx +++ b/src/components/views/rooms/RoomList.tsx @@ -77,10 +77,12 @@ interface IState { sublists: ITagMap; currentRoomId?: string; suggestedRooms: ISuggestedRoom[]; + feature_favourite_messages: boolean; } export const TAG_ORDER: TagID[] = [ DefaultTagID.Invite, + DefaultTagID.SavedItems, DefaultTagID.Favourite, DefaultTagID.DM, DefaultTagID.Untagged, @@ -351,6 +353,11 @@ const TAG_AESTHETICS: ITagAestheticsMap = { isInvite: false, defaultHidden: false, }, + [DefaultTagID.SavedItems]: { + sectionLabel: _td("Saved Items"), + isInvite: false, + defaultHidden: false, + }, [DefaultTagID.DM]: { sectionLabel: _td("People"), isInvite: false, @@ -392,6 +399,7 @@ export default class RoomList extends React.PureComponent { private dispatcherRef; private roomStoreToken: fbEmitter.EventSubscription; private treeRef = createRef(); + private favouriteMessageWatcher: string; static contextType = MatrixClientContext; public context!: React.ContextType; @@ -402,6 +410,7 @@ export default class RoomList extends React.PureComponent { this.state = { sublists: {}, suggestedRooms: SpaceStore.instance.suggestedRooms, + feature_favourite_messages: SettingsStore.getValue("feature_favourite_messages"), }; } @@ -410,12 +419,17 @@ export default class RoomList extends React.PureComponent { this.roomStoreToken = RoomViewStore.instance.addListener(this.onRoomViewStoreUpdate); SpaceStore.instance.on(UPDATE_SUGGESTED_ROOMS, this.updateSuggestedRooms); RoomListStore.instance.on(LISTS_UPDATE_EVENT, this.updateLists); + this.favouriteMessageWatcher = + SettingsStore.watchSetting("feature_favourite_messages", null, (...[,,, value]) => { + this.setState({ feature_favourite_messages: value }); + }); this.updateLists(); // trigger the first update } public componentWillUnmount() { SpaceStore.instance.off(UPDATE_SUGGESTED_ROOMS, this.updateSuggestedRooms); RoomListStore.instance.off(LISTS_UPDATE_EVENT, this.updateLists); + SettingsStore.unwatchSetting(this.favouriteMessageWatcher); defaultDispatcher.unregister(this.dispatcherRef); if (this.roomStoreToken) this.roomStoreToken.remove(); } @@ -545,6 +559,28 @@ export default class RoomList extends React.PureComponent { ); }); } + private renderFavoriteMessagesList(): ReactComponentElement[] { + const avatar = ( + ); + + return [ + ""} + key="favMessagesTile_key" + />, + ]; + } private renderSublists(): React.ReactElement[] { // show a skeleton UI if the user is in no rooms and they are not filtering and have no suggested rooms @@ -558,6 +594,12 @@ export default class RoomList extends React.PureComponent { extraTiles = this.renderSuggestedRooms(); } + if (this.state.feature_favourite_messages && orderedTagId === DefaultTagID.SavedItems) { + extraTiles = this.renderFavoriteMessagesList(); + } else { + extraTiles = null; + } + const aesthetics = TAG_AESTHETICS[orderedTagId]; if (!aesthetics) throw new Error(`Tag ${orderedTagId} does not have aesthetics`); @@ -582,7 +624,6 @@ export default class RoomList extends React.PureComponent { ) { forceExpanded = true; } - // The cost of mounting/unmounting this component offsets the cost // of keeping it in the DOM and hiding it when it is not required return { } private renderMenu(): React.ReactElement { - if (this.props.tagId === DefaultTagID.Suggested) return null; // not sortable + if (this.props.tagId === DefaultTagID.Suggested || this.props.tagId === DefaultTagID.SavedItems ) return null; // not sortable let contextMenu = null; if (this.state.contextMenuPosition) { diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 875516e0bb..f1c2fc2658 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1802,6 +1802,7 @@ "Explore public rooms": "Explore public rooms", "Add room": "Add room", "Invites": "Invites", + "Saved Items": "Saved Items", "Low priority": "Low priority", "System Alerts": "System Alerts", "Historical": "Historical", diff --git a/src/stores/room-list/models.ts b/src/stores/room-list/models.ts index 8224dd6479..0345ff6053 100644 --- a/src/stores/room-list/models.ts +++ b/src/stores/room-list/models.ts @@ -23,11 +23,13 @@ export enum DefaultTagID { DM = "im.vector.fake.direct", ServerNotice = "m.server_notice", Suggested = "im.vector.fake.suggested", + SavedItems = "im.vector.fake.saved_items", } export const OrderedDefaultTagIDs = [ DefaultTagID.Invite, DefaultTagID.Favourite, + DefaultTagID.SavedItems, DefaultTagID.DM, DefaultTagID.Untagged, DefaultTagID.LowPriority, From fa577429a05924ed2165a3c98a543389ad0ad9cf Mon Sep 17 00:00:00 2001 From: yaya-usman Date: Thu, 21 Jul 2022 16:17:36 +0300 Subject: [PATCH 2/2] eslint error fix --- src/components/views/rooms/RoomSublist.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/rooms/RoomSublist.tsx b/src/components/views/rooms/RoomSublist.tsx index 80b39db4e5..677b63bcf9 100644 --- a/src/components/views/rooms/RoomSublist.tsx +++ b/src/components/views/rooms/RoomSublist.tsx @@ -527,7 +527,7 @@ export default class RoomSublist extends React.Component { } private renderMenu(): React.ReactElement { - if (this.props.tagId === DefaultTagID.Suggested || this.props.tagId === DefaultTagID.SavedItems ) return null; // not sortable + if (this.props.tagId === DefaultTagID.Suggested || this.props.tagId === DefaultTagID.SavedItems) return null; // not sortable let contextMenu = null; if (this.state.contextMenuPosition) {