2 | ![avatar]()
3 |
4 | {{displayName}}
5 |
--------------------------------------------------------------------------------
/src/app/room-tile/room-tile.component.scss:
--------------------------------------------------------------------------------
1 | @import "../../vars";
2 |
3 | .room-tile {
4 | border: 1px solid $primary_border_color;
5 | border-radius: 4px;
6 | display: inline-block;
7 | margin: 5px;
8 | width: calc(100% - 10px); // 5px margin
9 |
10 | .avatar-placeholder, .avatar {
11 | width: 36px;
12 | height: 36px;
13 | border-radius: 4px;
14 | display: inline-block;
15 | vertical-align: middle;
16 | margin: 5px 10px 5px 5px;
17 | }
18 |
19 | .avatar-placeholder {
20 | background-color: $placeholder-avatar-color;
21 | }
22 |
23 | .name {
24 | white-space: nowrap;
25 | overflow: hidden;
26 | text-overflow: ellipsis;
27 | width: calc(100% - 56px); // 36px avatar + margins
28 | display: inline-block;
29 | vertical-align: middle;
30 | }
31 | }
--------------------------------------------------------------------------------
/src/app/room-tile/room-tile.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, Input, OnInit } from '@angular/core';
2 | import { MatrixRoomsService } from "../matrix-rooms.service";
3 | import { MatrixAuthService } from "../matrix-auth.service";
4 | import { MatrixRoom } from "../matrix-room";
5 |
6 | @Component({
7 | selector: 'app-room-tile',
8 | templateUrl: './room-tile.component.html',
9 | styleUrls: ['./room-tile.component.scss']
10 | })
11 | export class RoomTileComponent implements OnInit {
12 |
13 | @Input()
14 | public room: MatrixRoom;
15 |
16 | private homeserverUrl: string;
17 |
18 | public get displayName(): string {
19 | return this.room.displayName || this.room.roomId;
20 | }
21 |
22 | public get avatarUrl(): string {
23 | if (!this.room.avatarMxc || !this.homeserverUrl) return null;
24 | return `${this.homeserverUrl}/_matrix/media/r0/thumbnail/${this.room.avatarMxc.substring("mxc://".length)}?width=96&height=96&method=crop`;
25 | }
26 |
27 | constructor(private rooms: MatrixRoomsService, private auth: MatrixAuthService) {
28 | }
29 |
30 | public ngOnInit() {
31 | this.auth.loginState.subscribe(loginState => {
32 | this.homeserverUrl = loginState.hsUrl;
33 | });
34 | }
35 |
36 | }
37 |
--------------------------------------------------------------------------------
/src/app/tag-manager/tag-manager.component.html:
--------------------------------------------------------------------------------
1 |
2 | Welcome, {{userId}}
3 |
4 |
5 |
6 | View on Github
7 |
8 |
9 |
10 |
11 |
12 | Loading your rooms and tags. This could take a while if you have a lot of rooms.
13 |
14 |
15 |
27 |
33 |
34 |
--------------------------------------------------------------------------------
/src/app/tag-manager/tag-manager.component.scss:
--------------------------------------------------------------------------------
1 | @import "../../vars";
2 |
3 | .welcome-row {
4 | padding: 20px;
5 | }
6 |
7 | .tag-container {
8 | display: flex;
9 | flex-direction: row;
10 | flex-wrap: wrap;
11 |
12 | .tag-list-container.new {
13 | border: 1px dashed $secondary_border_color;
14 | }
15 |
16 | .tag-list-container {
17 | min-width: 320px;
18 | max-width: 320px;
19 | padding: 10px;
20 | border: 1px solid $primary_border_color;
21 | border-radius: 4px;
22 | margin: 15px;
23 | flex-grow: 1;
24 |
25 | h4 {
26 | margin-bottom: 0;
27 | }
28 |
29 | small {
30 | display: block;
31 | margin-bottom: 10px;
32 | }
33 |
34 | .tag-list {
35 | width: 100%;
36 | min-height: 200px;
37 | max-height: 400px;
38 | overflow: auto;
39 |
40 | .room-tile {
41 | cursor: move;
42 | }
43 | }
44 | }
45 | }
--------------------------------------------------------------------------------
/src/app/tag-manager/tag-manager.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 | import { MatrixAuthService } from "../matrix-auth.service";
3 | import { MatrixRoomsService } from "../matrix-rooms.service";
4 | import { MatrixRoom } from "../matrix-room";
5 |
6 | const FAKE_TAG_DIRECT = "fake.direct";
7 | const FAKE_TAG_RECENTS = "fake.recents";
8 |
9 | @Component({
10 | selector: 'app-tag-manager',
11 | templateUrl: './tag-manager.component.html',
12 | styleUrls: ['./tag-manager.component.scss']
13 | })
14 | export class TagManagerComponent implements OnInit {
15 |
16 | public userId: string;
17 | public loadingRooms = true;
18 | public newTagName: string;
19 | public isSaving = false;
20 |
21 | public tags: { [tagName: string]: MatrixRoom[] } = {
22 | "Favourites": [],
23 | "Direct Chats": [],
24 | "Default": [],
25 | "Low Priority": [],
26 | };
27 |
28 | public originalTags: { [tagName: string]: MatrixRoom[] } = {};
29 |
30 | public get tagNames(): string[] {
31 | return Object.keys(this.tags);
32 | }
33 |
34 | constructor(private auth: MatrixAuthService, private rooms: MatrixRoomsService) {
35 | }
36 |
37 | public ngOnInit() {
38 | this.auth.loginState.subscribe(loginState => {
39 | this.userId = loginState.userId;
40 | });
41 | this.rooms.getRooms().subscribe(async (joinedRooms) => {
42 | const additionalRooms = await this.rooms.getJoinedRooms().toPromise();
43 | for (const roomId of additionalRooms) {
44 | if (!joinedRooms[roomId]) joinedRooms[roomId] = {displayName: null, avatarMxc: null, roomId};
45 | }
46 | this.rooms.getTags().subscribe(tags => {
47 | const sortedRoomIds = [];
48 | for (const tagName of Object.keys(tags)) {
49 | let adjustedTagName = this.translateAdjustedToTag(tagName);
50 |
51 | if (!this.tags[adjustedTagName]) this.tags[adjustedTagName] = [];
52 | tags[tagName].map(taggedRoom => {
53 | let room = joinedRooms[taggedRoom.roomId];
54 | if (!room) room = {displayName: null, avatarMxc: null, roomId: taggedRoom.roomId};
55 | this.tags[adjustedTagName].push(room);
56 | sortedRoomIds.push(taggedRoom.roomId);
57 | });
58 | }
59 |
60 | this.rooms.getDirectChats().subscribe(chats => {
61 | const directChatRoomIds = [];
62 | for (const userId of Object.keys(chats)) directChatRoomIds.push(...chats[userId]);
63 |
64 | for (const roomId of directChatRoomIds) {
65 | let room = joinedRooms[roomId];
66 | if (!room) {
67 | console.warn(`Ignoring unknown direct chat: ${roomId}`);
68 | continue;
69 | }
70 | this.tags["Direct Chats"].push(room);
71 | sortedRoomIds.push(roomId);
72 | }
73 |
74 | Object.keys(joinedRooms).filter(rid => !sortedRoomIds.includes(rid)).map(rid => {
75 | const room = joinedRooms[rid];
76 | this.tags["Default"].push(room);
77 | });
78 |
79 | this.originalTags = {};
80 | for (const tid of Object.keys(this.tags)) {
81 | this.originalTags[tid] = this.tags[tid].map(r => r); // clone
82 | }
83 |
84 | this.loadingRooms = false;
85 | });
86 | });
87 | });
88 | }
89 |
90 | private translateTagToAdjusted(tagName: string): string {
91 | if (tagName === 'Favourites') return 'm.favourite';
92 | if (tagName === 'Direct Chats') return FAKE_TAG_DIRECT;
93 | if (tagName === 'Default') return FAKE_TAG_RECENTS;
94 | if (tagName === 'Low Priority') return 'm.lowpriority';
95 |
96 | return tagName;
97 | }
98 |
99 | private translateAdjustedToTag(adjustedTagName: string): string {
100 | if (adjustedTagName === 'm.favourite') return 'Favourites';
101 | if (adjustedTagName === FAKE_TAG_DIRECT) return 'Direct Chats';
102 | if (adjustedTagName === FAKE_TAG_RECENTS) return 'Default';
103 | if (adjustedTagName === 'm.lowpriority') return 'Low Priority';
104 |
105 | return adjustedTagName;
106 | }
107 |
108 | public isListChanged(tagName: string): boolean {
109 | const originalList = this.originalTags[tagName];
110 | const newList = this.tags[tagName];
111 |
112 | if (!originalList || !newList) return false;
113 |
114 | if (originalList.filter(i => !newList.includes(i)).length > 0) return true;
115 | if (newList.filter(i => !originalList.includes(i)).length > 0) return true;
116 |
117 | for (const room of newList) {
118 | const idxA = originalList.indexOf(room);
119 | const idxB = newList.indexOf(room);
120 | if (idxA !== idxB) return true;
121 | }
122 |
123 | return false;
124 | }
125 |
126 | public async saveDirectChats() {
127 | const knownDirectChatIds = this.tags['Direct Chats'].map(r => r.roomId);
128 | const legacyDirectChatIds = this.originalTags['Direct Chats']
129 | .map(r => r.roomId)
130 | .filter(rid => !knownDirectChatIds.includes(rid));
131 |
132 | try {
133 | const directChatMap = await this.rooms.getDirectChats().toPromise();
134 |
135 | // First untag all the rooms we want to untag
136 | console.log(`Untagging ${legacyDirectChatIds.length} rooms from direct chat map`);
137 | for (const userId of Object.keys(directChatMap)) {
138 | const rooms = directChatMap[userId];
139 | for (const roomId of legacyDirectChatIds) {
140 | console.log(`Removing ${roomId} from direct chats with ${userId}`);
141 | const idx = rooms.indexOf(roomId);
142 | if (idx !== -1) rooms.splice(idx, 1);
143 | }
144 | }
145 |
146 | // Slot in the new tags and clean up mismatches
147 | console.log(`Updating ${knownDirectChatIds.length} rooms in direct chat map`);
148 | for (const roomId of knownDirectChatIds) {
149 | let joinedMembers = await this.rooms.getEffectiveJoinedMembers(roomId).toPromise();
150 |
151 | // Our own user shouldn't normally appear in the direct chats
152 | joinedMembers = joinedMembers.filter(u => u !== this.userId);
153 |
154 | // Special case: if we're going to end up with no members, use ourselves
155 | if (joinedMembers.length === 0) {
156 | joinedMembers = [this.userId];
157 | }
158 |
159 | for (const userId of Object.keys(directChatMap)) {
160 | const rooms = directChatMap[userId];
161 | if (rooms.includes(roomId) && !joinedMembers.includes(userId)) {
162 | console.log(`Removing ${roomId} from direct chats with ${userId} because of mismatch`);
163 | rooms.splice(rooms.indexOf(roomId), 1);
164 | } else if (!rooms.includes(roomId) && joinedMembers.includes(userId)) {
165 | console.log(`Adding ${roomId} to direct chats with ${userId}`);
166 | rooms.push(roomId);
167 | }
168 | }
169 |
170 | for (const userId of joinedMembers) {
171 | let rooms = directChatMap[userId];
172 | if (!rooms) {
173 | directChatMap[userId] = rooms = [];
174 | }
175 | if (!rooms.includes(roomId)) {
176 | console.log(`Adding ${roomId} to direct chats with ${userId} (new)`);
177 | rooms.push(roomId);
178 | }
179 | }
180 | }
181 |
182 | // Clean up empty entries
183 | const allUserIds = Object.keys(directChatMap).map(u => u); // clone
184 | for (const userId of allUserIds) {
185 | const rooms = directChatMap[userId];
186 | if (!rooms || rooms.length <= 0) {
187 | console.log(`Removing ${userId} from direct chats map because there are no entries`);
188 | delete directChatMap[userId];
189 | }
190 | }
191 |
192 | console.log("Saving direct chat map...");
193 | await this.rooms.setDirectChats(directChatMap).toPromise();
194 |
195 | this.isSaving = false;
196 | this.originalTags["Direct Chats"] = this.tags["Direct Chats"].map(r => r); // clone
197 | } catch (e) {
198 | console.error("Failed to set direct chats");
199 | console.error(e);
200 | this.isSaving = false;
201 | // TODO: Dialog or toast or something
202 | }
203 | }
204 |
205 | public async saveTag(tagName: string) {
206 | this.isSaving = true;
207 |
208 | let adjustedTagName = this.translateTagToAdjusted(tagName);
209 | if (adjustedTagName === FAKE_TAG_DIRECT) {
210 | return this.saveDirectChats();
211 | }
212 |
213 | // Re-scale the order so that we don't end up with infinitely small values
214 | const roomIds = this.tags[tagName].map(r => r.roomId);
215 | const increment = 1.0 / roomIds.length;
216 |
217 | for (const roomId of roomIds) {
218 | try {
219 | console.log(`Getting tags for ${roomId}`);
220 | const currentTags = await this.rooms.getTagsOnRoom(roomId).toPromise();
221 | console.log(currentTags);
222 | const toDelete = Object.keys(currentTags).filter(i => i !== adjustedTagName);
223 |
224 | if (adjustedTagName !== FAKE_TAG_RECENTS) {
225 | const order = increment * roomIds.indexOf(roomId);
226 | console.log(`Adding '${adjustedTagName}' to ${roomId} at ${order}`);
227 | await this.rooms.addTagToRoom(roomId, adjustedTagName, order).toPromise();
228 | }
229 |
230 | console.log(`Removing ${toDelete.length} old tags from ${roomId}`);
231 | for (const oldTag of toDelete) {
232 | console.log(`Removing '${oldTag}' from ${roomId}`);
233 | await this.rooms.removeTagFromRoom(roomId, oldTag).toPromise();
234 |
235 | // Remove the tag from the original tag list because the user has already moved it
236 | const oldTagList = this.originalTags[this.translateAdjustedToTag(oldTag)];
237 | if (oldTagList) {
238 | const idx = oldTagList.findIndex(r => r.roomId === roomId);
239 | if (idx !== -1) {
240 | console.log(`Removing ${roomId} from original ${oldTag}`);
241 | oldTagList.splice(idx, 1);
242 | }
243 | }
244 | }
245 | } catch (e) {
246 | console.error("Failed to set tag");
247 | console.error(e);
248 | // TODO: Dialog or toast or something
249 | }
250 | }
251 |
252 | // Untag any rooms not currently in the list (but were previously)
253 | const oldRoomIds = this.originalTags[tagName]
254 | .map(r => r.roomId)
255 | .filter(rid => !roomIds.includes(rid));
256 | console.log(`Untagging ${oldRoomIds.length} from old tag lists`);
257 | for (const oldRoomId of oldRoomIds) {
258 | try {
259 | console.log(`Untagging ${oldRoomId}`);
260 | await this.rooms.removeTagFromRoom(oldRoomId, tagName).toPromise();
261 |
262 | const idx = this.originalTags[tagName].findIndex(i => i.roomId === oldRoomId);
263 | this.originalTags[tagName].splice(idx, 1);
264 | } catch (e) {
265 | console.error("Failed to set tag");
266 | console.error(e);
267 | // TODO: Dialog or toast or something
268 | }
269 | }
270 |
271 | this.isSaving = false;
272 | this.originalTags[tagName] = this.tags[tagName].map(r => r); // clone the list
273 | }
274 |
275 | public logout() {
276 | this.auth.logout();
277 | }
278 |
279 | public addTag() {
280 | this.tags[this.newTagName] = [];
281 | this.originalTags[this.newTagName] = [];
282 | this.newTagName = "";
283 | }
284 | }
285 |
--------------------------------------------------------------------------------
/src/assets/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/turt2live/matrix-tag-manager/da379d176ccee63cb19552feacc5b658f3087ca2/src/assets/.gitkeep
--------------------------------------------------------------------------------
/src/browserslist:
--------------------------------------------------------------------------------
1 | # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
2 | # For additional information regarding the format and rule options, please see:
3 | # https://github.com/browserslist/browserslist#queries
4 | #
5 | # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
6 |
7 | > 0.5%
8 | last 2 versions
9 | Firefox ESR
10 | not dead
11 | not IE 9-11
--------------------------------------------------------------------------------
/src/environments/environment.prod.ts:
--------------------------------------------------------------------------------
1 | export const environment = {
2 | production: true
3 | };
4 |
--------------------------------------------------------------------------------
/src/environments/environment.ts:
--------------------------------------------------------------------------------
1 | // This file can be replaced during build by using the `fileReplacements` array.
2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
3 | // The list of file replacements can be found in `angular.json`.
4 |
5 | export const environment = {
6 | production: false
7 | };
8 |
9 | /*
10 | * For easier debugging in development mode, you can import the following file
11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
12 | *
13 | * This import should be commented out in production mode because it will have a negative impact
14 | * on performance if an error is thrown.
15 | */
16 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI.
17 |
--------------------------------------------------------------------------------
/src/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/turt2live/matrix-tag-manager/da379d176ccee63cb19552feacc5b658f3087ca2/src/favicon.ico
--------------------------------------------------------------------------------
/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |