ESLint config, fix easy eslint errors

.eslintrc.json

@@ -14,6 +14,9 @@
         ],
         "createDefaultProgram": true
       },
+      "plugins": [
+        "@typescript-eslint"
+      ],
       "extends": [
         "plugin:@angular-eslint/recommended",
         "plugin:@angular-eslint/template/process-inline-templates"
@@ -34,7 +37,74 @@
             "prefix": "app",
             "style": "kebab-case"
           }
-        ]
+        ],
+        "@typescript-eslint/dot-notation": "off",
+        "@typescript-eslint/explicit-member-accessibility": [
+            "off",
+            {
+                "accessibility": "explicit"
+            }
+        ],
+        "@typescript-eslint/indent": "error",
+        "@typescript-eslint/member-delimiter-style": [
+            "off",
+            {
+                "multiline": {
+                    "delimiter": "none",
+                    "requireLast": true
+                },
+                "singleline": {
+                    "delimiter": "semi",
+                    "requireLast": false
+                }
+            }
+        ],
+        "@typescript-eslint/member-ordering": "off",
+        "@typescript-eslint/naming-convention": "off",
+        "@typescript-eslint/no-empty-function": "off",
+        "@typescript-eslint/no-inferrable-types": "error",
+        "@typescript-eslint/no-unused-expressions": "error",
+        "@typescript-eslint/no-use-before-define": "off",
+        "@typescript-eslint/quotes": "off",
+        "@typescript-eslint/semi": [
+            "off",
+            null
+        ],
+        "@typescript-eslint/type-annotation-spacing": "error",
+        "brace-style": [
+            "error",
+            "1tbs"
+        ],
+        "curly": "off",
+        "eol-last": "off",
+        "eqeqeq": [
+            "error",
+            "always"
+        ],
+        "guard-for-in": "off",
+        "id-blacklist": "off",
+        "id-match": "off",
+        "max-len": "off",
+        "no-bitwise": "off",
+        "no-caller": "error",
+        "no-console": "off",
+        "no-debugger": "error",
+        "no-empty": "off",
+        "no-eval": "error",
+        "no-fallthrough": "error",
+        "no-new-wrappers": "error",
+        "no-redeclare": "error",
+        "no-shadow": [
+            "error",
+            {
+                "hoist": "all"
+            }
+        ],
+        "no-trailing-spaces": "error",
+        "no-underscore-dangle": "off",
+        "no-unused-labels": "error",
+        "no-var": "error",
+        "radix": "error"
       }
     },
     {

package.json

@@ -9,13 +9,12 @@
     "start:web": "ng serve --configuration development --port 8082",
     "start:app": "npm run-script build && node build/app/index.js",
     "start:apponly": "ts-node-dev --respawn --transpile-only --project tsconfig.backend.json ./src/index.ts",
-    "node:start:apponly": "npm run-script build:app && node build/app/index.js",
     "build": "npm run-script build:web && npm run-script build:app",
     "build:web": "rimraf build/web && ng build --configuration production",
     "build:app": "rimraf build/app && tsc -p tsconfig.backend.json",
-    "lint": "npm run-script lint:app && npm run-script lint:web",
+    "lint": "eslint .",
-    "lint:app": "tslint --project ./tsconfig.app.json",
+    "lint:app": "eslint src",
-    "lint:web": "tslint --project ./tsconfig.json",
+    "lint:web": "eslint web",
     "i18n": "npm run-script i18n:init && npm run-script i18n:extract",
     "i18n:init": "ngx-translate-extract --input ./web --output ./web/public/assets/i18n/template.json --key-as-default-value --replace --format json",
     "i18n:extract": "ngx-translate-extract --input ./web --output ./web/public/assets/i18n/en.json --clean --format json"

src/api/dimension/DimensionBigBlueButtonService.ts

@@ -139,7 +139,7 @@ export class DimensionBigBlueButtonService {
         // than following it ourselves
 
         // Add authenticity token and full name to the query parameters
-        let queryParams = {authenticity_token: authenticityToken};
+        const queryParams = {authenticity_token: authenticityToken};
         queryParams[`${greenlightMeetingID}[join_name]`] = fullName;
 
         // Request the updated URL
@@ -259,7 +259,7 @@ export class DimensionBigBlueButtonService {
         getJoinUrlRequest: BigBlueButtonGetJoinUrlRequest,
     ): Promise<BigBlueButtonCreateAndJoinMeetingResponse|ApiError> {
         // Check if the meeting exists and is running. If not, return an error for each case
-        let getMeetingInfoParameters = {
+        const getMeetingInfoParameters = {
             meetingID: getJoinUrlRequest.meetingId,
         }
 
@@ -290,7 +290,7 @@ export class DimensionBigBlueButtonService {
             fullName = getJoinUrlRequest.userId;
         }
 
-        let joinQueryParameters = {
+        const joinQueryParameters = {
             meetingID: getJoinUrlRequest.meetingId,
             password: getJoinUrlRequest.meetingPassword,
             fullName: fullName,

web/app/admin/bridges/bridges.component.ts

@@ -24,7 +24,9 @@ export class AdminBridgesComponent implements OnInit {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Failed to load bridges').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to load bridges').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/bridges/irc/add-selfhosted/add-selfhosted.component.ts

@@ -28,12 +28,16 @@ export class AdminIrcBridgeAddSelfhostedComponent {
     public add() {
         this.isSaving = true;
         this.ircApi.newSelfhosted(this.provisionUrl).then(() => {
-            this.translate.get('IRC Bridge added').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('IRC Bridge added').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(err => {
             console.error(err);
             this.isSaving = false;
-            this.translate.get('Failed to create IRC bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to create IRC bridge').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/bridges/irc/irc.component.ts

@@ -50,7 +50,9 @@ export class AdminIrcBridgeComponent implements OnInit {
             }
         } catch (err) {
             console.error(err);
-            this.translate.get('Error loading bridges').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading bridges').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         }
     }
 
@@ -69,13 +71,17 @@ export class AdminIrcBridgeComponent implements OnInit {
         const createBridge = (upstream: FE_Upstream) => {
             return this.ircApi.newFromUpstream(upstream).then(bridge => {
                 this.configurations.push(bridge);
-                this.translate.get(['Click the pencil icon to enable networks.', 'matrix.org\'s IRC bridge added']).subscribe((res: string) => {this.toaster.pop("success", res[0], res[1]); });
+                this.translate.get(['Click the pencil icon to enable networks.', 'matrix.org\'s IRC bridge added']).subscribe((res: string) => {
+                    this.toaster.pop("success", res[0], res[1]);
+                });
                 this.isUpdating = false;
                 this.hasModularBridge = true;
             }).catch(err => {
                 console.error(err);
                 this.isUpdating = false;
-                this.translate.get('Error adding matrix.org\'s IRC Bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error adding matrix.org\'s IRC Bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         };
         const vectorUpstreams = this.upstreams.filter(u => u.type === "vector");
@@ -87,7 +93,9 @@ export class AdminIrcBridgeComponent implements OnInit {
                 createBridge(upstream);
             }).catch(err => {
                 console.error(err);
-                this.translate.get('Error creating matrix.org\'s IRC Bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error creating matrix.org\'s IRC Bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         } else createBridge(vectorUpstreams[0]);
     }
@@ -102,7 +110,9 @@ export class AdminIrcBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update IRC bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update IRC bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         })
     }
@@ -117,7 +127,9 @@ export class AdminIrcBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update IRC bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update IRC bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         })
         const selfhostedInstance = selfhostedRef.componentInstance as IrcNetworksDialogContext;

web/app/admin/bridges/irc/networks/networks.component.ts

@@ -51,13 +51,17 @@ export class AdminIrcBridgeNetworksComponent {
         this.isUpdating = true;
         this.ircApi.setNetworkEnabled(this.bridge.id, network.id, network.isEnabled).then(() => {
             this.isUpdating = false;
-            this.translate.get(['Enabled', 'disabled']).subscribe((res: string) => {this.toaster.pop("success", "Network " + (network.isEnabled ? res[0] : res[1])); });
+            this.translate.get(['Enabled', 'disabled']).subscribe((res: string) => {
+                this.toaster.pop("success", "Network " + (network.isEnabled ? res[0] : res[1]));
+            });
         }).catch(err => {
             console.error(err);
             this.isUpdating = false;
             network.isEnabled = !network.isEnabled;
             this.bridge.availableNetworks[network.id].isEnabled = network.isEnabled;
-            this.translate.get('Failed to update network').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to update network').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/bridges/slack/manage-selfhosted/manage-selfhosted.component.ts

@@ -32,12 +32,16 @@ export class AdminSlackBridgeManageSelfhostedComponent {
         this.isSaving = true;
         if (this.isAdding) {
             this.slackApi.newSelfhosted(this.provisionUrl).then(() => {
-                this.translate.get('Slack bridge added').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Slack bridge added').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.modal.close();
             }).catch(err => {
                 console.error(err);
                 this.isSaving = false;
-                this.translate.get('Failed to create Slack bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to create Slack bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         } else {
             this.slackApi.updateSelfhosted(this.bridgeId, this.provisionUrl).then(() => {
@@ -46,7 +50,9 @@ export class AdminSlackBridgeManageSelfhostedComponent {
             }).catch(err => {
                 console.error(err);
                 this.isSaving = false;
-                this.translate.get('Failed to update Slack bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to update Slack bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         }
     }

web/app/admin/bridges/slack/slack.component.ts

@@ -41,7 +41,9 @@ export class AdminSlackBridgeComponent implements OnInit {
             this.configurations = await this.slackApi.getBridges();
         } catch (err) {
             console.error(err);
-            this.translate.get('Error loading bridges').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading bridges').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         }
     }
 
@@ -51,12 +53,16 @@ export class AdminSlackBridgeComponent implements OnInit {
         const createBridge = (upstream: FE_Upstream) => {
             return this.slackApi.newFromUpstream(upstream).then(bridge => {
                 this.configurations.push(bridge);
-                this.translate.get('matrix.org\'s Slack bridge added').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('matrix.org\'s Slack bridge added').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.isUpdating = false;
             }).catch(err => {
                 console.error(err);
                 this.isUpdating = false;
-                this.translate.get('Error adding matrix.org\'s Slack Bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error adding matrix.org\'s Slack Bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         };
 
@@ -69,7 +75,9 @@ export class AdminSlackBridgeComponent implements OnInit {
                 createBridge(upstream);
             }).catch(err => {
                 console.error(err);
-                this.translate.get('Error creating matrix.org\'s Slack Bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error creating matrix.org\'s Slack Bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         } else createBridge(vectorUpstreams[0]);
     }
@@ -84,7 +92,9 @@ export class AdminSlackBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update Slack bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update Slack bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
         const selfhostedInstance = selfhostedRef.componentInstance as ManageSelfhostedSlackBridgeDialogContext;
@@ -101,7 +111,9 @@ export class AdminSlackBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update Slack bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update Slack bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
         const selfhostedInstance = selfhostedRef.componentInstance as ManageSelfhostedSlackBridgeDialogContext;

web/app/admin/bridges/telegram/manage-selfhosted/manage-selfhosted.component.ts

@@ -42,21 +42,29 @@ export class AdminTelegramBridgeManageSelfhostedComponent {
         };
         if (this.isAdding) {
             this.telegramApi.newSelfhosted(this.provisionUrl, this.sharedSecret, options).then(() => {
-                this.translate.get('Telegram bridge added').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Telegram bridge added').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.modal.close();
             }).catch(err => {
                 console.error(err);
                 this.isSaving = false;
-                this.translate.get('Failed to create Telegram bridge').subscribe((res: string) => { this.toaster.pop("error", res); });
+                this.translate.get('Failed to create Telegram bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         } else {
             this.telegramApi.updateSelfhosted(this.bridgeId, this.provisionUrl, this.sharedSecret, options).then(() => {
-                this.translate.get('Telegram bridge updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Telegram bridge updated').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.modal.close();
             }).catch(err => {
                 console.error(err);
                 this.isSaving = false;
-                this.translate.get('Failed to update Telegram bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to update Telegram bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         }
     }

web/app/admin/bridges/telegram/telegram.component.ts

@@ -35,7 +35,9 @@ export class AdminTelegramBridgeComponent implements OnInit {
             this.configurations = await this.telegramApi.getBridges();
         } catch (err) {
             console.error(err);
-            this.translate.get('Error loading bridges').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading bridges').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         }
     }
 
@@ -49,7 +51,9 @@ export class AdminTelegramBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update Telegram bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update Telegram bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         })
         const selfhostedInstance = selfhostedRef.componentInstance as ManageSelfhostedTelegramBridgeDialogContext;
@@ -76,7 +80,9 @@ export class AdminTelegramBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update Telegram bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update Telegram bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         })
         const selfhostedInstance = selfhostedRef.componentInstance as ManageSelfhostedTelegramBridgeDialogContext;

web/app/admin/bridges/webhooks/manage-selfhosted/manage-selfhosted.component.ts

@@ -38,21 +38,29 @@ export class AdminWebhooksBridgeManageSelfhostedComponent {
         this.isSaving = true;
         if (this.isAdding) {
             this.webhooksApi.newSelfhosted(this.provisionUrl, this.sharedSecret).then(() => {
-                this.translate.get('Webhook bridge added').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Webhook bridge added').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.modal.close();
             }).catch(err => {
                 console.error(err);
                 this.isSaving = false;
-                this.translate.get('Failed to create Webhook bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to create Webhook bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         } else {
             this.webhooksApi.updateSelfhosted(this.bridgeId, this.provisionUrl, this.sharedSecret).then(() => {
-                this.translate.get('Webhook bridge updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Webhook bridge updated').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.modal.close();
             }).catch(err => {
                 console.error(err);
                 this.isSaving = false;
-                this.translate.get('Failed to update Webhook bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to update Webhook bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         }
     }

web/app/admin/bridges/webhooks/webhooks.component.ts

@@ -35,7 +35,9 @@ export class AdminWebhooksBridgeComponent implements OnInit {
             this.configurations = await this.webhooksApi.getBridges();
         } catch (err) {
             console.error(err);
-            this.translate.get('Error loading bridges').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading bridges').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         }
     }
 
@@ -49,7 +51,9 @@ export class AdminWebhooksBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update Webhooks bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update Webhooks bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
         const selfhostedInstance = selfhostedRef.componentInstance as ManageSelfhostedWebhooksBridgeDialogContext;
@@ -69,7 +73,9 @@ export class AdminWebhooksBridgeComponent implements OnInit {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an update Webhooks bridge list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an update Webhooks bridge list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
         const selfhostedInstance = selfhostedRef.componentInstance as ManageSelfhostedWebhooksBridgeDialogContext;

web/app/admin/custom-bots/add/add.component.ts

@@ -46,23 +46,33 @@ export class AdminAddCustomBotComponent {
 
     public add() {
         if (!this.bot.name) {
-            this.translate.get('Please enter a name for the bot').subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get('Please enter a name for the bot').subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
         if (!this.bot.avatarUrl) {
-            this.translate.get('Please enter an avatar URL for the bot').subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get('Please enter an avatar URL for the bot').subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
         if (!this.bot.userId) {
-            this.translate.get('Please enter a user ID for the bot').subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get('Please enter a user ID for the bot').subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
         if (!this.bot.description) {
-            this.translate.get('Please enter a description for the bot').subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get('Please enter a description for the bot').subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
         if (!this.bot.accessToken) {
-            this.translate.get('Please enter an access token for the bot').subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get('Please enter an access token for the bot').subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
 
@@ -86,12 +96,16 @@ export class AdminAddCustomBotComponent {
         }
 
         promise.then(() => {
-            this.translate.get('Bot updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Bot updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(error => {
             this.isSaving = false;
             console.error(error);
-            this.translate.get('Error updating bot').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating bot').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/custom-bots/custom-bots.component.ts

@@ -24,7 +24,9 @@ export class AdminCustomBotsComponent {
 
         this.reload().then(() => this.isLoading = false).catch(error => {
             console.error(error);
-            this.translate.get('Error loading go-neb configuration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading go-neb configuration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -45,7 +47,9 @@ export class AdminCustomBotsComponent {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an updated bot list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an updated bot list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
     }
@@ -60,7 +64,9 @@ export class AdminCustomBotsComponent {
                 this.reload()
             } catch (err) {
                 console.error(err);
-                this.translate.get('Failed to get an updated bot list').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to get an updated bot list').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
         const selfhostedInstance = selfhostedRef.componentInstance as AddCustomBotDialogContext;
@@ -73,11 +79,15 @@ export class AdminCustomBotsComponent {
         bot.isEnabled = !bot.isEnabled;
         this.botApi.updateBot(bot.id, bot).then(() => {
             this.isUpdating = false;
-            this.translate.get(['Enabled', 'disabled']).subscribe((res: string) => {this.toaster.pop("success", "Bot " + (bot.isEnabled ? res[0] : res[1])); });
+            this.translate.get(['Enabled', 'disabled']).subscribe((res: string) => {
+                this.toaster.pop("success", "Bot " + (bot.isEnabled ? res[0] : res[1]));
+            });
         }).catch(error => {
             console.error(error);
             bot.isEnabled = !bot.isEnabled;
-            this.translate.get('Error updating bot').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating bot').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         })
     }
 }

web/app/admin/home/home.component.ts

@@ -35,11 +35,15 @@ export class AdminHomeComponent {
         selfhostedRef.result.then(async () => {
             try {
                 await this.adminApi.logoutAll();
-                this.translate.get('Everyone has been logged out').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Everyone has been logged out').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.config.sessionInfo.numTokens = 0;
             } catch (err) {
                 console.error(err);
-                this.translate.get('Error logging everyone out').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error logging everyone out').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
     }

web/app/admin/neb/add-selfhosted/add-selfhosted.component.ts

@@ -36,7 +36,9 @@ export class AdminAddSelfhostedNebComponent {
         this.asApi.createAppservice(this.userPrefix).then(appservice => {
             return this.nebApi.newAppserviceConfiguration(this.adminUrl, appservice);
         }).then(neb => {
-            this.translate.get('New go-neb created').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('New go-neb created').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
 
             const selfhostedRef = this.modal.open(AdminNebAppserviceConfigComponent, {
                 backdrop: 'static',
@@ -48,7 +50,9 @@ export class AdminAddSelfhostedNebComponent {
         }).catch(err => {
             console.error(err);
             this.isSaving = false;
-            this.translate.get('Error creating appservice').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error creating appservice').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/neb/appservice-config/appservice-config.component.ts

@@ -29,7 +29,9 @@ export class AdminNebAppserviceConfigComponent {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Could not load appservice configuration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Could not load appservice configuration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -50,10 +52,14 @@ export class AdminNebAppserviceConfigComponent {
 
     public test() {
         this.adminAppserviceApi.test(this.neb.appserviceId).then(() => {
-            this.translate.get('The appservice appears to be correctly set up').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('The appservice appears to be correctly set up').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(err => {
             console.error(err);
-            this.translate.get('The appservice is not correctly set up').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('The appservice is not correctly set up').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/neb/config/giphy/giphy.component.ts

@@ -36,19 +36,25 @@ export class AdminNebGiphyConfigComponent implements OnInit {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Error loading configuration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading configuration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
     public save() {
         this.isUpdating = true;
         this.adminNebApi.setIntegrationConfiguration(this.neb.id, this.integration.type, this.config).then(() => {
-            this.translate.get('Configuration updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Configuration updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(err => {
             this.isUpdating = false;
             console.error(err);
-            this.translate.get('Error updating integration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating integration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/neb/config/google/google.component.ts

@@ -36,19 +36,25 @@ export class AdminNebGoogleConfigComponent implements OnInit {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Error loading configuration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading configuration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
     public save() {
         this.isUpdating = true;
         this.adminNebApi.setIntegrationConfiguration(this.neb.id, this.integration.type, this.config).then(() => {
-            this.translate.get('Configuration updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Configuration updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(err => {
             this.isUpdating = false;
             console.error(err);
-            this.translate.get('Error updating integration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating integration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/neb/config/guggy/guggy.component.ts

@@ -35,19 +35,25 @@ export class AdminNebGuggyConfigComponent implements OnInit {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Error loading configuration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading configuration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
     public save() {
         this.isUpdating = true;
         this.adminNebApi.setIntegrationConfiguration(this.neb.id, this.integration.type, this.config).then(() => {
-            this.translate.get('Configuration updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Configuration updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(err => {
             this.isUpdating = false;
             console.error(err);
-            this.translate.get('Error updating integration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating integration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/neb/config/imgur/imgur.component.ts

@@ -36,19 +36,25 @@ export class AdminNebImgurConfigComponent implements OnInit {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Error loading configuration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading configuration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
     public save() {
         this.isUpdating = true;
         this.adminNebApi.setIntegrationConfiguration(this.neb.id, this.integration.type, this.config).then(() => {
-            this.translate.get('Configuration updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Configuration updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(err => {
             this.isUpdating = false;
             console.error(err);
-            this.translate.get('Error updating integration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating integration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/neb/edit/edit.component.ts

@@ -60,12 +60,16 @@ export class AdminEditNebComponent implements OnInit, OnDestroy {
         try {
             await this.nebApi.toggleIntegration(this.nebConfig.id, bot.type, bot.isEnabled);
             this.isUpdating = false;
-            this.translate.get('Integration updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Integration updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         } catch (err) {
             console.error(err);
             bot.isEnabled = !bot.isEnabled; // revert change
             this.isUpdating = false;
-            this.translate.get('Error updating integration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating integration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
             return;
         }
 
@@ -78,7 +82,9 @@ export class AdminEditNebComponent implements OnInit, OnDestroy {
                     await this.nebApi.setIntegrationConfiguration(this.nebConfig.id, bot.type, {});
                 } catch (err) {
                     console.error(err);
-                    this.translate.get(['Failed to configure the integration', 'Manual troubleshooting may be requred' ]).subscribe((res: string) => {this.toaster.pop("warning", res[0], res[1]); });
+                    this.translate.get(['Failed to configure the integration', 'Manual troubleshooting may be requred' ]).subscribe((res: string) => {
+                        this.toaster.pop("warning", res[0], res[1]);
+                    });
                     return;
                 }
             }
@@ -122,7 +128,9 @@ export class AdminEditNebComponent implements OnInit, OnDestroy {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Could not get go-neb configuration').subscribe((res: string) => {this.toaster.pop('error', res); });
+            this.translate.get('Could not get go-neb configuration').subscribe((res: string) => {
+                this.toaster.pop('error', res);
+            });
         });
     }
 }

web/app/admin/neb/neb.component.ts

@@ -37,7 +37,9 @@ export class AdminNebComponent {
 
         this.reload().then(() => this.isLoading = false).catch(error => {
             console.error(error);
-            this.translate.get('Error loading go-neb configuration').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading go-neb configuration').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -100,13 +102,17 @@ export class AdminNebComponent {
         const createNeb = (upstream: FE_Upstream) => {
             return this.nebApi.newUpstreamConfiguration(upstream).then(neb => {
                 this.configurations.push(neb);
-                this.translate.get(['matrix.org\'s go-neb added', 'Click the pencil icon to enable the bots.']).subscribe((res: string) => {this.toaster.pop("success", res[0], res[1]); });
+                this.translate.get(['matrix.org\'s go-neb added', 'Click the pencil icon to enable the bots.']).subscribe((res: string) => {
+                    this.toaster.pop("success", res[0], res[1]);
+                });
                 this.isAddingModularNeb = false;
                 this.hasModularNeb = true;
             }).catch(error => {
                 console.error(error);
                 this.isAddingModularNeb = false;
-                this.translate.get('Error adding matrix.org\'s go-neb').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error adding matrix.org\'s go-neb').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         };
 
@@ -119,7 +125,9 @@ export class AdminNebComponent {
                 createNeb(upstream);
             }).catch(err => {
                 console.error(err);
-                this.translate.get('Error creating matrix.org go-neb').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error creating matrix.org go-neb').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         } else createNeb(vectorUpstreams[0]);
     }

web/app/admin/sticker-packs/sticker-packs.component.ts

@@ -31,7 +31,9 @@ export class AdminStickerPacksComponent implements OnInit {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Failed to load sticker packs').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to load sticker packs').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -40,12 +42,16 @@ export class AdminStickerPacksComponent implements OnInit {
         this.isUpdating = true;
         this.adminStickers.togglePack(pack.id, pack.isEnabled).then(() => {
             this.isUpdating = false;
-            this.translate.get('Sticker pack updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Sticker pack updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(err => {
             console.error(err);
             pack.isEnabled = !pack.isEnabled; // revert change
             this.isUpdating = false;
-            this.translate.get('Error updating sticker pack').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating sticker pack').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -62,11 +68,15 @@ export class AdminStickerPacksComponent implements OnInit {
             this.isImporting = false;
             this.tgUrl = "";
             this.packs.push(pack);
-            this.translate.get('Telegram sticker pack imported').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Telegram sticker pack imported').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(err => {
             console.error(err);
             this.isImporting = false;
-            this.translate.get('Error importing sticker pack').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error importing sticker pack').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 

web/app/admin/terms/new-edit/new-edit.component.ts

@@ -72,7 +72,7 @@ export class AdminNewEditTermsComponent implements OnInit {
     }
 
     public ngOnInit() {
-        let params = this.activatedRoute.snapshot.params;
+        const params = this.activatedRoute.snapshot.params;
         this.shortcode = params.shortcode;
         this.isEditing = !!this.shortcode;
 
@@ -96,7 +96,9 @@ export class AdminNewEditTermsComponent implements OnInit {
                 this.isLoading = false;
             }).catch(err => {
                 console.error(err);
-                this.translate.get('Failed to load policy').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to load policy').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         } else {
             this.adminTerms.getAllPolicies().then(policies => {
@@ -104,7 +106,9 @@ export class AdminNewEditTermsComponent implements OnInit {
                 this.isLoading = false;
             }).catch(err => {
                 console.error(err);
-                this.translate.get('Failed to load policies').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Failed to load policies').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
         }
     }
@@ -135,11 +139,15 @@ export class AdminNewEditTermsComponent implements OnInit {
                 });
 
                 await this.adminTerms.publishDraft(this.shortcode, val);
-                this.translate.get('Policy published').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Policy published').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.router.navigate(["../.."], {relativeTo: this.activatedRoute});
             } catch (e) {
                 console.error(e);
-                this.translate.get('Error publishing policy').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error publishing policy').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
                 this.isUpdating = false;
             }
         });
@@ -148,11 +156,15 @@ export class AdminNewEditTermsComponent implements OnInit {
     public async create() {
         for (const languageCode in this.languages) {
             if (this.languages[languageCode].name.trim().length <= 0) {
-                this.translate.get('Please enter a name for all policies').subscribe((res: string) => {this.toaster.pop("warning", res); });
+                this.translate.get('Please enter a name for all policies').subscribe((res: string) => {
+                    this.toaster.pop("warning", res);
+                });
                 return;
             }
             if (this.languages[languageCode].text.trim().length <= 0) {
-                this.translate.get('Please enter text for all policies').subscribe((res: string) => {this.toaster.pop("warning", res); });
+                this.translate.get('Please enter text for all policies').subscribe((res: string) => {
+                    this.toaster.pop("warning", res);
+                });
                 return;
             }
         }
@@ -166,11 +178,15 @@ export class AdminNewEditTermsComponent implements OnInit {
                     text: this.languages['en'].text,
                     url: `${window.location.origin}/widgets/terms/${this.shortcode}/en/draft`,
                 });
-                this.translate.get('Draft saved').subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get('Draft saved').subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
                 this.router.navigate(["../.."], {relativeTo: this.activatedRoute});
             } catch (e) {
                 console.error(e);
-                this.translate.get('Error saving policy').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error saving policy').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
                 this.isUpdating = false;
             }
             return;
@@ -189,11 +205,15 @@ export class AdminNewEditTermsComponent implements OnInit {
                 text: this.languages['en'].text,
                 url: `${window.location.origin}/widgets/terms/${shortcode}/en/draft`,
             });
-            this.translate.get('Draft created').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Draft created').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.router.navigate([".."], {relativeTo: this.activatedRoute});
         } catch (e) {
             console.error(e);
-            this.translate.get('Error creating document').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error creating document').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
             this.isUpdating = false;
         }
     }

web/app/admin/terms/new-edit/publish/publish.component.ts

@@ -19,7 +19,9 @@ export class AdminTermsNewEditPublishDialogComponent {
 
     public publish() {
         if (!this.version || !this.version.trim()) {
-            this.translate.get('Please enter a version number').subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get('Please enter a version number').subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
         this.modal.close(this.version);

web/app/admin/terms/terms.component.html

@@ -26,7 +26,7 @@
 
                     <td class="text-center">
                         <span class="editButton" [routerLink]="['edit', policy.shortcode]" title="edit draft"
-                              *ngIf="policy.version == 'draft'">
+                              *ngIf="policy.version === 'draft'">
                             <i class="fa fa-pencil-alt"></i>
                         </span>
                     </td>

web/app/admin/terms/terms.component.ts

@@ -34,7 +34,9 @@ export class AdminTermsComponent implements OnInit {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Failed to load policies').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to load policies').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 

web/app/admin/widgets/etherpad/etherpad.component.ts

@@ -31,12 +31,16 @@ export class AdminWidgetEtherpadConfigComponent implements OnInit {
         this.isUpdating = true;
         this.adminIntegrationsApi.setIntegrationOptions(this.widget.category, this.widget.type, this.widget.options).then(() => {
             this.originalWidget.options = this.widget.options;
-            this.translate.get('Widget updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Widget updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(err => {
             this.isUpdating = false;
             console.error(err);
-            this.translate.get('Error updating widget').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating widget').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/admin/widgets/jitsi/jitsi.component.ts

@@ -34,12 +34,16 @@ export class AdminWidgetJitsiConfigComponent implements OnInit {
         this.isUpdating = true;
         this.adminIntegrationsApi.setIntegrationOptions(this.widget.category, this.widget.type, this.widget.options).then(() => {
             this.originalWidget.options = this.widget.options;
-            this.translate.get('Widget updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Widget updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.modal.close();
         }).catch(err => {
             this.isUpdating = false;
             console.error(err);
-            this.translate.get('Error updating widget').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating widget').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 

web/app/admin/widgets/widgets.component.ts

@@ -29,7 +29,9 @@ export class AdminWidgetsComponent {
             this.widgets = widgets;
         }).catch(err => {
             console.error(err);
-            this.translate.get('Failed to load widgets').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to load widgets').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -38,12 +40,16 @@ export class AdminWidgetsComponent {
         this.isUpdating = true;
         this.adminIntegrationsApi.toggleIntegration(widget.category, widget.type, widget.isEnabled).then(() => {
             this.isUpdating = false;
-            this.translate.get('Widget updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Widget updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(err => {
             console.error(err);
             widget.isEnabled = !widget.isEnabled; // revert change
             this.isUpdating = false;
-            this.translate.get('Error updating widget').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating widget').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -56,7 +62,9 @@ export class AdminWidgetsComponent {
 
         if (!component) {
             console.error("No known dialog component for " + widget.type);
-            this.translate.get('Error opening configuration page').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error opening configuration page').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
             return;
         }
 

web/app/app.component.ts

@@ -4,19 +4,18 @@ import { TranslateService } from "@ngx-translate/core";
 import { HttpClient } from "@angular/common/http";
 
 @Component({
-    selector: "my-app", // <my-app></my-app>
+    selector: "app-app", // <my-app></my-app>
     templateUrl: "./app.component.html",
     styleUrls: ["./app.component.scss"],
 })
 export class AppComponent {
-
     constructor(public translate: TranslateService, public http: HttpClient) {
-        translate.addLangs(['en', 'de']);
+        translate.addLangs(["en", "de"]);
-        translate.setDefaultLang('de');
+        translate.setDefaultLang("de");
-        if (navigator.language === 'de') {
+        if (navigator.language === "de") {
-            translate.use('de');
+            translate.use("de");
         } else {
-            translate.use('en');
+            translate.use("en");
         }
     }
 }

web/app/app.module.ts

@@ -295,7 +295,7 @@ export class AppModule {
     }
 
     hmrOnDestroy(store) {
-    let cmpLocation = this.appRef.components.map(
+        const cmpLocation = this.appRef.components.map(
             (cmp) => cmp.location.nativeElement
         );
         // recreate elements

web/app/configs/bridge/bridge.component.ts

@@ -52,19 +52,25 @@ export class BridgeComponent<T> implements OnInit, OnDestroy {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get("Failed to load configuration").subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get("Failed to load configuration").subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
     public save(): void {
         this.isUpdating = true;
         this.integrationsApi.setIntegrationConfiguration("bridge", this.integrationType, this.roomId, this.newConfig).then(() => {
-            this.translate.get("Configuration updated").subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get("Configuration updated").subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.bridge.config = this.newConfig;
             this.isUpdating = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get("Error updating configuration").subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get("Error updating configuration").subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
             this.isUpdating = false;
         });
     }

web/app/configs/bridge/config-screen/config-screen.bridge.component.ts

@@ -2,15 +2,14 @@ import { Component, ContentChild, Input, TemplateRef } from "@angular/core";
 import { BridgeComponent } from "../bridge.component";
 
 @Component({
-    selector: "my-bridge-config",
+    selector: "app-bridge-config",
     templateUrl: "config-screen.bridge.component.html",
     styleUrls: ["config-screen.bridge.component.scss"],
 })
 export class ConfigScreenBridgeComponent {
-
     @Input() bridgeComponent: BridgeComponent<any>;
-    @ContentChild(TemplateRef, {static: false}) bridgeParamsTemplate: TemplateRef<any>;
+    @ContentChild(TemplateRef, { static: false })
+    bridgeParamsTemplate: TemplateRef<any>;
 
-    constructor() {
+    constructor() {}
-    }
 }

web/app/configs/bridge/irc/irc.bridge.component.ts

@@ -57,7 +57,9 @@ export class IrcBridgeConfigComponent extends BridgeComponent<IrcConfig> {
 
     public loadOps() {
         if (!this.channel.trim()) {
-            this.translate.get('Please enter a channel name').subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get('Please enter a channel name').subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
 
@@ -70,7 +72,9 @@ export class IrcBridgeConfigComponent extends BridgeComponent<IrcConfig> {
         }).catch(err => {
             console.error(err);
             this.loadingOps = false;
-            this.translate.get('Error loading channel operators').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error loading channel operators').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -88,7 +92,9 @@ export class IrcBridgeConfigComponent extends BridgeComponent<IrcConfig> {
         } catch (err) {
             console.error(err);
             this.requestingBridge = false;
-            this.translate.get(['Failed to make the bridge an administrator', 'Please ensure you are an \'Admin\' for the room']).subscribe((res: string) => {this.toaster.pop("error", res[0], res[1]); });
+            this.translate.get(['Failed to make the bridge an administrator', 'Please ensure you are an \'Admin\' for the room']).subscribe((res: string) => {
+                this.toaster.pop("error", res[0], res[1]);
+            });
             return;
         }
 
@@ -101,11 +107,15 @@ export class IrcBridgeConfigComponent extends BridgeComponent<IrcConfig> {
                 pending: true,
             });
             this.resetForm();
-            this.translate.get(['Link requested!', 'The operator selected will have to approve the bridge for it to work']).subscribe((res: string) => {this.toaster.pop("success", res[0], res[1]); });
+            this.translate.get(['Link requested!', 'The operator selected will have to approve the bridge for it to work']).subscribe((res: string) => {
+                this.toaster.pop("success", res[0], res[1]);
+            });
         }).catch(err => {
             console.error(err);
             this.requestingBridge = false;
-            this.translate.get('Failed to request a link').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to request a link').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -135,10 +145,14 @@ export class IrcBridgeConfigComponent extends BridgeComponent<IrcConfig> {
             this.isUpdating = false;
             const idx = this.bridge.config.links[channel.networkId].findIndex(c => c.channelName === channel.name);
             if (idx !== -1) this.bridge.config.links[channel.networkId].splice(idx, 1);
-            this.translate.get('Link removed').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Link removed').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(err => {
             console.error(err);
-            this.translate.get('Failed to remove link').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to remove link').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/configs/bridge/slack/slack.bridge.component.ts

@@ -60,7 +60,9 @@ export class SlackBridgeConfigComponent extends BridgeComponent<SlackConfig> imp
                         this.loadingTeams = false;
                     }).catch(error2 => {
                         console.error(error2);
-                        this.translate.get('Error getting Slack authorization information').subscribe((res: string) => {this.toaster.pop("error", res); });
+                        this.translate.get('Error getting Slack authorization information').subscribe((res: string) => {
+                            this.toaster.pop("error", res);
+                        });
                     });
 
                     this.timerId = setInterval(() => {
@@ -69,7 +71,9 @@ export class SlackBridgeConfigComponent extends BridgeComponent<SlackConfig> imp
                 }
             } else {
                 console.error(error);
-                this.translate.get('Error getting teams').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error getting teams').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             }
         });
     }
@@ -86,7 +90,9 @@ export class SlackBridgeConfigComponent extends BridgeComponent<SlackConfig> imp
             this.isBusy = false;
         }).catch(error => {
             console.error(error);
-            this.translate.get('Error getting channels for team').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error getting channels for team').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
             this.isBusy = false;
         });
     }
@@ -100,7 +106,9 @@ export class SlackBridgeConfigComponent extends BridgeComponent<SlackConfig> imp
             if (!e.response || !e.response.error || !e.response.error._error ||
                 e.response.error._error.message.indexOf("already in the room") === -1) {
                 this.isBusy = false;
-                this.translate.get('Error inviting bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error inviting bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
                 return;
             }
         }
@@ -108,11 +116,15 @@ export class SlackBridgeConfigComponent extends BridgeComponent<SlackConfig> imp
         this.slack.bridgeRoom(this.roomId, this.teamId, this.channelId).then(link => {
             this.bridge.config.link = link;
             this.isBusy = false;
-            this.translate.get('Bridge requested').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Bridge requested').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(error => {
             this.isBusy = false;
             console.error(error);
-            this.translate.get('Error requesting bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error requesting bridge').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -121,11 +133,15 @@ export class SlackBridgeConfigComponent extends BridgeComponent<SlackConfig> imp
         this.slack.unbridgeRoom(this.roomId).then(() => {
             this.bridge.config.link = null;
             this.isBusy = false;
-            this.translate.get('Bridge removed').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Bridge removed').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(error => {
             this.isBusy = false;
             console.error(error);
-            this.translate.get('Error removing bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error removing bridge').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/configs/bridge/telegram/telegram.bridge.component.ts

@@ -106,7 +106,9 @@ export class TelegramBridgeConfigComponent extends BridgeComponent<TelegramConfi
             this.bridge.config.portalInfo = loadedPortalInfo;
             this.bridge.config.linked = [loadedPortalInfo.chatId];
             this.isUpdating = false;
-            this.translate.get('Bridge updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Bridge updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(error => {
             this.isUpdating = false;
             console.error(error);
@@ -119,7 +121,9 @@ export class TelegramBridgeConfigComponent extends BridgeComponent<TelegramConfi
                 if (body["dim_errcode"] === "BOT_NOT_IN_CHAT") message = 'The Telegram bot has not been invited to the chat';
                 if (body["dim_errcode"] === "NOT_ENOUGH_PERMISSIONS") message = 'You do not have permission to bridge that chat';
             }
-            this.translate.get(message).subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get(message).subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -129,7 +133,9 @@ export class TelegramBridgeConfigComponent extends BridgeComponent<TelegramConfi
             this.bridge.config.portalInfo = portalInfo;
             this.bridge.config.linked = [];
             this.isUpdating = false;
-            this.translate.get('Bridge removed').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Bridge removed').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(error => {
             this.isUpdating = false;
             console.error(error);
@@ -139,7 +145,9 @@ export class TelegramBridgeConfigComponent extends BridgeComponent<TelegramConfi
                 if (body["dim_errcode"] === "BOT_NOT_IN_CHAT") message = 'The Telegram bot has not been invited to the chat';
                 if (body["dim_errcode"] === "NOT_ENOUGH_PERMISSIONS")  message = 'You do not have permission to unbridge that chat';
             }
-            this.translate.get(message).subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get(message).subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/configs/bridge/webhooks/webhooks.bridge.component.ts

@@ -32,7 +32,9 @@ export class WebhooksBridgeConfigComponent extends BridgeComponent<WebhooksConfi
             if (!e.response || !e.response.error || !e.response.error._error ||
                 e.response.error._error.message.indexOf("already in the room") === -1) {
                 this.isBusy = false;
-                this.translate.get('Error inviting bridge').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get('Error inviting bridge').subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
                 return;
             }
         }
@@ -41,11 +43,15 @@ export class WebhooksBridgeConfigComponent extends BridgeComponent<WebhooksConfi
             this.newConfig.webhooks.push(hook);
             this.isBusy = false;
             this.webhookName = "";
-            this.translate.get('Webhook created').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Webhook created').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(err => {
             console.error(err);
             this.isBusy = false;
-            this.translate.get('Error creating webhook').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error creating webhook').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -55,11 +61,15 @@ export class WebhooksBridgeConfigComponent extends BridgeComponent<WebhooksConfi
             const idx = this.newConfig.webhooks.indexOf(hook);
             if (idx !== -1) this.newConfig.webhooks.splice(idx, 1);
             this.isBusy = false;
-            this.translate.get('Webhook deleted').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Webhook deleted').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
         }).catch(err => {
             console.error(err);
             this.isBusy = false;
-            this.translate.get('Error deleting webhook').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error deleting webhook').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/configs/complex-bot/complex-bot.component.ts

@@ -53,20 +53,26 @@ export class ComplexBotComponent<T> implements OnInit, OnDestroy {
             this.isLoading = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get("Failed to load configuration").subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get("Failed to load configuration").subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
     public save(): void {
         this.isUpdating = true;
         this.integrationsApi.setIntegrationConfiguration("complex-bot", this.integrationType, this.roomId, this.newConfig).then(() => {
-            this.translate.get("Configuration updated").subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get("Configuration updated").subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.bot.config = this.newConfig;
             this.newConfig = JSON.parse(JSON.stringify(this.bot.config));
             this.isUpdating = false;
         }).catch(err => {
             console.error(err);
-            this.translate.get("Error updating configuration").subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get("Error updating configuration").subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
             this.isUpdating = false;
         });
     }

web/app/configs/complex-bot/config-screen/config-screen.complex-bot.component.ts

@@ -2,15 +2,14 @@ import { ComplexBotComponent } from "../complex-bot.component";
 import { Component, ContentChild, Input, TemplateRef } from "@angular/core";
 
 @Component({
-    selector: "my-complex-bot-config",
+    selector: "app-complex-bot-config",
     templateUrl: "config-screen.complex-bot.component.html",
     styleUrls: ["config-screen.complex-bot.component.scss"],
 })
 export class ConfigScreenComplexBotComponent {
-
     @Input() botComponent: ComplexBotComponent<any>;
-    @ContentChild(TemplateRef, {static: false}) botParamsTemplate: TemplateRef<any>;
+    @ContentChild(TemplateRef, { static: false })
+    botParamsTemplate: TemplateRef<any>;
 
-    constructor() {
+    constructor() {}
-    }
 }

web/app/configs/complex-bot/rss/rss.complex-bot.component.ts

@@ -32,7 +32,9 @@ export class RssComplexBotConfigComponent extends ComplexBotComponent<RssConfig>
 
     public addFeed(): void {
         if (!this.newFeedUrl.trim()) {
-            this.translate.get('Please enter a feed URL').subscribe((res: string) => {this.toaster.pop('warning', res); });
+            this.translate.get('Please enter a feed URL').subscribe((res: string) => {
+                this.toaster.pop('warning', res);
+            });
             return;
         }
 

web/app/configs/complex-bot/travisci/travisci.complex-bot.component.ts

@@ -52,7 +52,9 @@ export class TravisCiComplexBotConfigComponent extends ComplexBotComponent<Travi
 
     public addRepo(): void {
         if (!this.newRepoKey.trim()) {
-            this.translate.get('Please enter a repository').subscribe((res: string) => {this.toaster.pop('warning', res); });
+            this.translate.get('Please enter a repository').subscribe((res: string) => {
+                this.toaster.pop('warning', res);
+            });
             return;
         }
 

web/app/configs/simple-bot/simple-bot.component.ts

@@ -44,9 +44,13 @@ export class ConfigSimpleBotComponent implements OnInit {
         promise.then(() => {
             this.bot._isUpdating = false;
             if (this.bot._inRoom) {
-                this.translate.get('was invited to the room').subscribe((res: string) => {this.toaster.pop("success", this.bot.displayName + res); });
+                this.translate.get('was invited to the room').subscribe((res: string) => {
+                    this.toaster.pop("success", this.bot.displayName + res);
+                });
             } else {
-                this.translate.get('was removed from the room').subscribe((res: string) => {this.toaster.pop("success", this.bot.displayName + res); });
+                this.translate.get('was removed from the room').subscribe((res: string) => {
+                    this.toaster.pop("success", this.bot.displayName + res);
+                });
             }
         }).catch(err => {
             this.bot._inRoom = !this.bot._inRoom; // revert the status change
@@ -57,7 +61,9 @@ export class ConfigSimpleBotComponent implements OnInit {
             if (err.json) errorMessage = err.json().error;
             if (err.response && err.response.error) errorMessage = err.response.error.message;
             if (!errorMessage) errorMessage = "";
-            this.translate.get('Could not update integration status').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Could not update integration status').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 }

web/app/configs/stickerpicker/stickerpicker.component.ts

@@ -41,7 +41,9 @@ export class StickerpickerComponent implements OnInit {
             this.isLoading = false;
         } catch (e) {
             console.error(e);
-            this.translate.get('Failed to load sticker packs').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Failed to load sticker packs').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         }
 
         this.stickerApi.getConfig().then(config => {
@@ -58,12 +60,16 @@ export class StickerpickerComponent implements OnInit {
             this.packs.splice(0, 0, pack);
             this.packUrl = "";
             this.isImporting = false;
-            this.translate.get('Stickerpack added').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Stickerpack added').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             this.addWidget();
         }).catch(err => {
             console.error(err);
             this.isImporting = false;
-            this.translate.get('Error adding stickerpack').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error adding stickerpack').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 
@@ -76,13 +82,17 @@ export class StickerpickerComponent implements OnInit {
         this.isUpdating = true;
         this.stickerApi.togglePackSelection(pack.id, pack.isSelected).then(() => {
             this.isUpdating = false;
-            this.translate.get('Stickers updated').subscribe((res: string) => {this.toaster.pop("success", res); });
+            this.translate.get('Stickers updated').subscribe((res: string) => {
+                this.toaster.pop("success", res);
+            });
             if (this.packs.filter(p => p.isSelected).length > 0) this.addWidget();
         }).catch(err => {
             console.error(err);
             pack.isSelected = !pack.isSelected; // revert change
             this.isUpdating = false;
-            this.translate.get('Error updating stickers').subscribe((res: string) => {this.toaster.pop("error", res); });
+            this.translate.get('Error updating stickers').subscribe((res: string) => {
+                this.toaster.pop("error", res);
+            });
         });
     }
 

web/app/configs/widget/config-screen/config-screen.widget.component.ts

@@ -2,15 +2,14 @@ import { WidgetComponent } from "../widget.component";
 import { Component, ContentChild, Input, TemplateRef } from "@angular/core";
 
 @Component({
-    selector: "my-widget-config",
+    selector: "app-widget-config",
     templateUrl: "config-screen.widget.component.html",
     styleUrls: ["config-screen.widget.component.scss"],
 })
 export class ConfigScreenWidgetComponent {
-
     @Input() widgetComponent: WidgetComponent;
-    @ContentChild(TemplateRef, {static: false}) widgetParamsTemplate: TemplateRef<any>;
+    @ContentChild(TemplateRef, { static: false })
+    widgetParamsTemplate: TemplateRef<any>;
 
-    constructor() {
+    constructor() {}
-    }
 }

web/app/configs/widget/widget.component.ts

@@ -49,7 +49,7 @@ export class WidgetComponent implements OnInit {
             this.wrapperUrl = this.window.location.origin + "/widgets/" + this.wrapperId + "?url=";
 
             if (!this.scalarWrapperId) this.scalarWrapperId = this.wrapperId;
-            for (let widgetLink of SCALAR_WIDGET_LINKS) {
+            for (const widgetLink of SCALAR_WIDGET_LINKS) {
                 const wrapperLink = widgetLink
                     .replace("__TYPE__", this.scalarWrapperId)
                     .replace("__PNAME__", this.scalarWrapperUrlParamName);
@@ -60,7 +60,7 @@ export class WidgetComponent implements OnInit {
         this.prepareNewWidget();
         this.getWidgetsOfType(this.widgetTypes).then(widgets => {
             this.widgets = widgets;
-            for (let widget of this.widgets) {
+            for (const widget of this.widgets) {
                 this.unpackWidget(widget);
             }
 
@@ -70,15 +70,15 @@ export class WidgetComponent implements OnInit {
 
             // We reset after discovering to ensure that the widget component can correctly
             // set the state of the widget prior to us unpacking it (again)
-            for (let widget of this.widgets) {
+            for (const widget of this.widgets) {
                 this.resetWidget(widget);
             }
 
             // See if we should request editing a particular widget
             if (SessionStorage.editIntegrationId && SessionStorage.editsRequested === 1) {
                 let editWidget: EditableWidget = null;
-                let otherWidgets: EditableWidget[] = [];
+                const otherWidgets: EditableWidget[] = [];
-                for (let widget of this.widgets) {
+                for (const widget of this.widgets) {
                     if (widget.id === SessionStorage.editIntegrationId) {
                         editWidget = widget;
                     } else otherWidgets.push(widget);
@@ -186,7 +186,7 @@ export class WidgetComponent implements OnInit {
         if (!this.wrapperUrl) return url;
 
         const urls = [this.wrapperUrl].concat(this.scalarWrapperUrls);
-        for (let scalarUrl of urls) {
+        for (const scalarUrl of urls) {
             if (url.startsWith(scalarUrl)) {
                 return decodeURIComponent(url.substring(scalarUrl.length));
             }
@@ -263,12 +263,16 @@ export class WidgetComponent implements OnInit {
         try {
             this.OnWidgetBeforeAdd(this.newWidget);
         } catch (error) {
-            this.translate.get(error.message).subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get(error.message).subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
 
         if (!this.newWidget.dimension.newUrl || this.newWidget.dimension.newUrl.trim().length === 0) {
-           this.translate.get("Please enter a URL for the widget").subscribe((res: string) => {this.toaster.pop("warning", res ); });
+            this.translate.get("Please enter a URL for the widget").subscribe((res: string) => {
+                this.toaster.pop("warning", res );
+            });
             return;
         }
 
@@ -281,7 +285,9 @@ export class WidgetComponent implements OnInit {
                 this.isUpdating = false;
                 this.OnWidgetAfterAdd(this.newWidget);
                 this.prepareNewWidget();
-                this.translate.get("Widget added!").subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get("Widget added!").subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
             })
             .catch(err => {
                 this.isUpdating = false;
@@ -305,7 +311,9 @@ export class WidgetComponent implements OnInit {
         }
 
         if (!widget.dimension.newUrl || widget.dimension.newUrl.trim().length === 0) {
-            this.translate.get("Please enter a URL for the widget").subscribe((res: string) => {this.toaster.pop("warning", res); });
+            this.translate.get("Please enter a URL for the widget").subscribe((res: string) => {
+                this.toaster.pop("warning", res);
+            });
             return;
         }
 
@@ -316,7 +324,9 @@ export class WidgetComponent implements OnInit {
             .then(() => {
                 this.isUpdating = false;
                 this.OnWidgetAfterEdit(widget);
-                this.translate.get("Widget updated!").subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get("Widget updated!").subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
             })
             .catch(err => {
                 this.isUpdating = false;
@@ -338,7 +348,9 @@ export class WidgetComponent implements OnInit {
             .then(() => {
                 this.isUpdating = false;
                 this.OnWidgetAfterDelete(widget);
-                this.translate.get("Widget deleted!").subscribe((res: string) => {this.toaster.pop("success", res); });
+                this.translate.get("Widget deleted!").subscribe((res: string) => {
+                    this.toaster.pop("success", res);
+                });
             })
             .catch(err => {
                 this.isUpdating = false;

web/app/configs/widget/youtube/youtube.widget.component.ts

@@ -47,12 +47,16 @@ export class YoutubeWidgetConfigComponent extends WidgetComponent {
 
     private setVideoUrl(widget: EditableWidget) {
         if (!widget.dimension.newData.videoUrl || widget.dimension.newData.videoUrl.trim().length === 0) {
-            this.translate.get('Please enter a video URL').subscribe((res: string) => {throw new Error(res); });
+            this.translate.get('Please enter a video URL').subscribe((res: string) => {
+                throw new Error(res);
+            });
         }
 
         const videoUrl = this.getRealVideoUrl(widget.dimension.newData.videoUrl);
         if (!videoUrl) {
-            this.translate.get('Please enter a YouTube, Vimeo, or DailyMotion video URL').subscribe((res: string) => {throw new Error(res); });
+            this.translate.get('Please enter a YouTube, Vimeo, or DailyMotion video URL').subscribe((res: string) => {
+                throw new Error(res);
+            });
         }
 
         widget.dimension.newUrl = videoUrl;

web/app/elements/fullscreen-button/fullscreen-button.component.ts

@@ -2,12 +2,11 @@ import { Component, OnDestroy, OnInit } from "@angular/core";
 import * as screenfull from "screenfull";
 
 @Component({
-    selector: "my-fullscreen-button",
+    selector: "app-fullscreen-button",
     templateUrl: "fullscreen-button.component.html",
     styleUrls: ["fullscreen-button.component.scss"],
 })
 export class FullscreenButtonComponent implements OnDestroy, OnInit {
-
     public isFullscreen = false;
 
     private listener = null;

web/app/elements/ibox/ibox.component.ts

@@ -2,7 +2,7 @@ import { Component, Input, OnInit } from "@angular/core";
 import { ANIMATION_FADE_IN_NOT_OUT } from "../../app.animations";
 
 @Component({
-    selector: "my-ibox",
+    selector: "app-ibox",
     templateUrl: "./ibox.component.html",
     styleUrls: ["./ibox.component.scss"],
     animations: [ANIMATION_FADE_IN_NOT_OUT],

web/app/elements/spinner/spinner.component.ts

@@ -1,9 +1,8 @@
 import { Component } from "@angular/core";
 
 @Component({
-    selector: "my-spinner",
+    selector: "app-spinner",
     templateUrl: "./spinner.component.html",
     styleUrls: ["./spinner.component.scss"],
 })
-export class SpinnerComponent {
+export class SpinnerComponent {}
-}

web/app/home/home.component.ts

@@ -1,16 +1,16 @@
 import { Component } from "@angular/core";
 
 @Component({
-    selector: "my-home",
+    selector: "app-home",
     templateUrl: "./home.component.html",
     styleUrls: ["./home.component.scss"],
 })
 export class HomeComponent {
-
     public hostname: string = window.location.origin;
     public showPromoPage = this.hostname === "https://dimension.t2bot.io";
 
-    public integrationsConfig = `` +
+    public integrationsConfig =
+    `` +
     `"integrations_ui_url": "${this.hostname}/element",\n` +
     `"integrations_rest_url": "${this.hostname}/api/v1/scalar",\n` +
     `"integrations_widgets_urls": ["${this.hostname}/widgets"],\n` +
@@ -19,5 +19,4 @@ export class HomeComponent {
     constructor() {
     // Do stuff
     }
-
 }

web/app/integration-bag/integration-bag.component.ts

@@ -1,27 +1,40 @@
-import { Component, EventEmitter, Input, OnChanges, Output, SimpleChange, SimpleChanges } from "@angular/core";
+import {
+    Component,
+    EventEmitter,
+    Input,
+    OnChanges,
+    Output,
+    SimpleChange,
+    SimpleChanges,
+} from "@angular/core";
 import { DomSanitizer, SafeResourceUrl } from "@angular/platform-browser";
 import { FE_Integration } from "../shared/models/integration";
 import { MediaService } from "../shared/services/media.service";
 
 @Component({
-    selector: "my-integration-bag",
+    selector: "app-integration-bag",
     templateUrl: "./integration-bag.component.html",
     styleUrls: ["./integration-bag.component.scss"],
 })
 export class IntegrationBagComponent implements OnChanges {
-
     @Input() integrations: FE_Integration[];
-    @Output() integrationClicked: EventEmitter<FE_Integration> = new EventEmitter<FE_Integration>();
+    @Output() integrationClicked: EventEmitter<FE_Integration> =
+    new EventEmitter<FE_Integration>();
 
-    constructor(private sanitizer: DomSanitizer, private media: MediaService) {
+    constructor(private sanitizer: DomSanitizer, private media: MediaService) {}
-    }
 
     public ngOnChanges(changes: SimpleChanges) {
         const change: SimpleChange = changes.integrations;
 
         (<FE_Integration[]>change.currentValue).map(async (i) => {
             if (i.avatarUrl.startsWith("mxc://")) {
-                i.avatarUrl = await this.media.getThumbnailUrl(i.avatarUrl, 128, 128, "scale", true);
+                i.avatarUrl = await this.media.getThumbnailUrl(
+                    i.avatarUrl,
+                    128,
+                    128,
+                    "scale",
+                    true
+                );
             }
         });
     }

web/app/page-header/page-header.component.ts

@@ -1,35 +1,50 @@
 import { Component } from "@angular/core";
-import { ActivatedRoute, NavigationEnd, PRIMARY_OUTLET, Router } from "@angular/router";
+import {
+    ActivatedRoute,
+    NavigationEnd,
+    PRIMARY_OUTLET,
+    Router,
+} from "@angular/router";
 import { TranslateService } from "@ngx-translate/core";
 import { filter } from "rxjs/operators";
 
 @Component({
-    selector: "my-page-header",
+    selector: "app-page-header",
     templateUrl: "./page-header.component.html",
     styleUrls: ["./page-header.component.scss"],
 })
 export class PageHeaderComponent {
-
     public pageName: string;
 
-    constructor(private router: Router, private activatedRoute: ActivatedRoute, public translate: TranslateService) {
+    constructor(
+        private router: Router,
+        private activatedRoute: ActivatedRoute,
+        public translate: TranslateService
+    ) {
         this.translate = translate;
-        this.router.events.pipe(filter(ev => ev instanceof NavigationEnd)).subscribe((ev) => {
+        this.router.events
+            .pipe(filter((ev) => ev instanceof NavigationEnd))
+            .subscribe((ev) => {
                 let currentRoute = this.activatedRoute.root;
                 let url = "";
                 const event = ev as NavigationEnd;
 
                 while (currentRoute.children.length > 0) {
                     const children = currentRoute.children;
-                children.forEach(route => {
+                    children.forEach((route) => {
-                    if (route.snapshot.data['breadcrumb']) {
+                        if (route.snapshot.data["breadcrumb"]) {
-                        this.translate.get(route.snapshot.data['breadcrumb']).subscribe((res: string) => {route.snapshot.data['breadcrumb'] = res});
+                            this.translate
+                                .get(route.snapshot.data["breadcrumb"])
+                                .subscribe((res: string) => {
+                                    route.snapshot.data["breadcrumb"] = res;
+                                });
                         }
                         currentRoute = route;
-                    url += "/" + route.snapshot.url.map(s => s.path).join("/");
+                        url += "/" + route.snapshot.url.map((s) => s.path).join("/");
                         if (route.outlet !== PRIMARY_OUTLET) return;
                         if (!route.routeConfig || !route.routeConfig.data) return;
-                    if (url === event.urlAfterRedirects.split("?")[0]) this.pageName = route.snapshot.data.name;
+                        if (url === event.urlAfterRedirects.split("?")[0])
+                            this.pageName = route.snapshot.data.name;
                     });
                 }
             });

web/app/riot/riot-home/home.component.ts

@@ -28,7 +28,7 @@ const CATEGORY_MAP = {
 };
 
 @Component({
-  selector: "my-riot-home",
+    selector: "app-riot-home",
     templateUrl: "./home.component.html",
     styleUrls: ["./home.component.scss"],
 })
@@ -59,7 +59,7 @@ export class RiotHomeComponent {
         public translate: TranslateService
     ) {
         this.translate = translate;
-    let params: any = this.activatedRoute.snapshot.queryParams;
+        const params: any = this.activatedRoute.snapshot.queryParams;
 
         this.requestedScreen = params.screen;
         this.requestedIntegrationId = params.integ_id;
@@ -258,7 +258,7 @@ export class RiotHomeComponent {
                     );
                 }
 
-        let promises = supportedIntegrations.map((i) =>
+                const promises = supportedIntegrations.map((i) =>
                     this.updateIntegrationState(i)
                 );
                 return Promise.all(promises);
@@ -354,7 +354,7 @@ export class RiotHomeComponent {
 
         if (!integration.requirements) return;
 
-    let promises = integration.requirements.map((r) =>
+        const promises = integration.requirements.map((r) =>
             this.checkRequirement(r)
         );
 
@@ -412,7 +412,7 @@ export class RiotHomeComponent {
                 });
             case "canSendEventTypes":
                 const processPayload = (payload) => {
-          const response = <any>payload.response;
+                    const response = payload.response;
                     if (response === true) return Promise.resolve();
                     if (response.error || response.error.message) {
                         let message: string;

web/app/riot/riot.component.ts

@@ -2,14 +2,12 @@ import { Component } from "@angular/core";
 import { SessionStorage } from "../shared/SessionStorage";
 
 @Component({
-    selector: "my-riot",
+    selector: "app-riot",
     templateUrl: "./riot.component.html",
     styleUrls: ["./riot.component.scss"],
 })
 export class RiotComponent {
-
+    constructor() {}
-    constructor() {
-    }
 
     public isAdmin(): boolean {
         return SessionStorage.isAdmin;

web/app/riot/scalar-close/scalar-close.component.ts

@@ -2,14 +2,12 @@ import { Component } from "@angular/core";
 import { ScalarClientApiService } from "../../shared/services/scalar/scalar-client-api.service";
 
 @Component({
-    selector: "my-scalar-close",
+    selector: "app-scalar-close",
     templateUrl: "./scalar-close.component.html",
     styleUrls: ["./scalar-close.component.scss"],
 })
 export class ScalarCloseComponent {
-
+    constructor(private scalar: ScalarClientApiService) {}
-    constructor(private scalar: ScalarClientApiService) {
-    }
 
     public closeScalar() {
         console.log("Closing scalar...");

web/app/shared/directives/screenshot-capable.directive.ts

@@ -30,7 +30,9 @@ export class ScreenshotCapableDirective implements OnInit, OnDestroy {
     private takeScreenshot(request: ScalarToWidgetRequest) {
         if (this.el.nativeElement.tagName === "IFRAME") {
             console.error("Attempted to take a screenshot of an iframe");
-            this.translate.get('Failed to take screenshot: iframe not supported').subscribe((res: string) => {ScalarWidgetApi.replyError(request, new Error("Cannot take screenshot of iframe"), res); });
+            this.translate.get('Failed to take screenshot: iframe not supported').subscribe((res: string) => {
+                ScalarWidgetApi.replyError(request, new Error("Cannot take screenshot of iframe"), res);
+            });
         } else {
             domtoimage.toBlob(this.el.nativeElement).then(b => {
                 if (!b) {
@@ -40,7 +42,9 @@ export class ScreenshotCapableDirective implements OnInit, OnDestroy {
                 ScalarWidgetApi.replyScreenshot(request, b);
             }).catch(error => {
                 console.error(error);
-                this.translate.get('Failed to take screenshot').subscribe((res: string) => {ScalarWidgetApi.replyError(request, error, res); });
+                this.translate.get('Failed to take screenshot').subscribe((res: string) => {
+                    ScalarWidgetApi.replyError(request, error, res);
+                });
             });
         }
     }

web/app/shared/models/widget.ts

@@ -84,9 +84,9 @@ export interface EditableWidget {
  * @return {EditableWidget[]} The Dimension widgets
  */
 export function convertScalarWidgetsToDtos(scalarResponse: WidgetsResponse): EditableWidget[] {
-    let widgets = [];
+    const widgets = [];
 
-    for (let event of scalarResponse.response) {
+    for (const event of scalarResponse.response) {
         widgets.push({
             id: event.state_key,
             type: event.content.type,

web/app/shared/services/scalar/scalar-client-api.service.ts

@@ -18,7 +18,7 @@ export class ScalarClientApiService {
     private static actionMap: { [key: string]: { resolve: (obj: any) => void, reject: (obj: any) => void } } = {};
 
     public static getAndRemoveActionHandler(requestKey: string): { resolve: (obj: any) => void, reject: (obj: any) => void } {
-        let handler = ScalarClientApiService.actionMap[requestKey];
+        const handler = ScalarClientApiService.actionMap[requestKey];
         ScalarClientApiService.actionMap[requestKey] = null;
         return handler;
     }
@@ -121,7 +121,7 @@ export class ScalarClientApiService {
     }
 
     private callAction(action, payload): Promise<any> {
-        let requestKey = randomString({length: 20});
+        const requestKey = randomString({length: 20});
         return new Promise((resolve, reject) => {
             if (!window.opener) {
                 // Mimic an error response from scalar
@@ -134,7 +134,7 @@ export class ScalarClientApiService {
                 reject: reject
             };
 
-            let request = JSON.parse(JSON.stringify(payload));
+            const request = JSON.parse(JSON.stringify(payload));
             request["request_id"] = requestKey;
             request["action"] = action;
 
@@ -147,10 +147,10 @@ export class ScalarClientApiService {
 window.addEventListener("message", event => {
     if (!event.data) return;
 
-    let requestKey = event.data["request_id"];
+    const requestKey = event.data["request_id"];
     if (!requestKey) return;
 
-    let action = ScalarClientApiService.getAndRemoveActionHandler(requestKey);
+    const action = ScalarClientApiService.getAndRemoveActionHandler(requestKey);
     if (!action) return;
 
     if (event.data.response && event.data.response.error) action.reject(event.data);

web/app/shared/services/scalar/scalar-widget.api.ts

@@ -97,7 +97,7 @@ export class ScalarWidgetApi {
             return;
         }
 
-        let request = JSON.parse(JSON.stringify(payload));
+        const request = JSON.parse(JSON.stringify(payload));
         request["api"] = "fromWidget";
         request["widgetId"] = ScalarWidgetApi.widgetId;
         request["action"] = action;
@@ -114,7 +114,7 @@ export class ScalarWidgetApi {
             return;
         }
 
-        let requestClone = JSON.parse(JSON.stringify(request));
+        const requestClone = JSON.parse(JSON.stringify(request));
         requestClone["response"] = payload;
 
         console.log("[Dimension] Sending postMessage response: ", request);

web/app/widget-wrappers/bigbluebutton/bigbluebutton.component.ts

@@ -5,16 +5,20 @@ import { ScalarWidgetApi } from "../../shared/services/scalar/scalar-widget.api"
 import { CapableWidget } from "../capable-widget";
 import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 import { BigBlueButtonApiService } from "../../shared/services/integrations/bigbluebutton-api.service";
-import { FE_BigBlueButtonCreateAndJoinMeeting, FE_BigBlueButtonJoin } from "../../shared/models/integration";
+import {
+    FE_BigBlueButtonCreateAndJoinMeeting,
+    FE_BigBlueButtonJoin,
+} from "../../shared/models/integration";
 import { TranslateService } from "@ngx-translate/core";
 
 @Component({
-    selector: "my-bigbluebutton-widget-wrapper",
+    selector: "app-bigbluebutton-widget-wrapper",
     templateUrl: "bigbluebutton.component.html",
     styleUrls: ["bigbluebutton.component.scss"],
 })
-export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implements OnInit, OnDestroy {
+export class BigBlueButtonWidgetWrapperComponent
-
+    extends CapableWidget
+    implements OnInit, OnDestroy {
     public canEmbed = true;
 
     /**
@@ -71,14 +75,16 @@ export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implement
    */
     public embedUrl: SafeUrl = null;
 
-    constructor(activatedRoute: ActivatedRoute,
+    constructor(
+        activatedRoute: ActivatedRoute,
         private bigBlueButtonApi: BigBlueButtonApiService,
         private sanitizer: DomSanitizer,
-                public translate: TranslateService) {
+        public translate: TranslateService
+    ) {
         super();
         this.supportsAlwaysOnScreen = true;
 
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
 
         this.roomId = params.roomId;
         this.createMeeting = params.createMeeting;
@@ -144,9 +150,20 @@ export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implement
 
     // Ask Dimension to create a meeting (or use an existing one) for this room and return the embeddable meeting URL
     private async joinThroughDimension() {
-        console.log("BigBlueButton: Joining meeting created by Dimension with meeting ID: " + this.meetingId);
+        console.log(
+            "BigBlueButton: Joining meeting created by Dimension with meeting ID: " +
+        this.meetingId
+        );
 
-        this.bigBlueButtonApi.getJoinUrl(this.displayName, this.userId, this.avatarUrl, this.meetingId, this.meetingPassword).then((response) => {
+        this.bigBlueButtonApi
+            .getJoinUrl(
+                this.displayName,
+                this.userId,
+                this.avatarUrl,
+                this.meetingId,
+                this.meetingPassword
+            )
+            .then((response) => {
                 console.log("The response");
                 console.log(response);
                 if ("errorCode" in response) {
@@ -154,14 +171,16 @@ export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implement
                     if (response.errorCode === "UNKNOWN_MEETING_ID") {
                         // This meeting ID is invalid.
                         // Inform the user that they should try and start a new meeting
-                    this.statusMessage = "This meeting has ended or otherwise does not exist.<br>Please start a new meeting.";
+                        this.statusMessage =
+              "This meeting has ended or otherwise does not exist.<br>Please start a new meeting.";
                         return;
                     }
 
                     if (response.errorCode === "MEETING_HAS_ENDED") {
                         // It's likely that everyone has left the meeting, and it's been garbage collected.
                         // Inform the user that they should try and start a new meeting
-                    this.statusMessage = "This meeting has ended.<br>Please start a new meeting.";
+                        this.statusMessage =
+              "This meeting has ended.<br>Please start a new meeting.";
                         return;
                     }
                     // Otherwise this is a generic error
@@ -176,8 +195,13 @@ export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implement
 
     // Hand Dimension a Greenlight URL and receive a translated, embeddable meeting URL in response
     private joinThroughGreenlightUrl() {
-        console.log("BigBlueButton: joining via greenlight url:", this.conferenceUrl);
+        console.log(
-        this.bigBlueButtonApi.joinMeetingWithGreenlightUrl(this.conferenceUrl, this.joinName).then((response) => {
+            "BigBlueButton: joining via greenlight url:",
+            this.conferenceUrl
+        );
+        this.bigBlueButtonApi
+            .joinMeetingWithGreenlightUrl(this.conferenceUrl, this.joinName)
+            .then((response) => {
                 if ("errorCode" in response) {
                     // This is an instance of ApiError
                     if (response.errorCode === "WAITING_FOR_MEETING_START") {
@@ -185,7 +209,11 @@ export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implement
                         this.statusMessage = "Waiting for conference to start...";
 
                         // Poll until it has
-                    setTimeout(this.joinConference.bind(this), this.pollIntervalMillis, false);
+                        setTimeout(
+                            this.joinConference.bind(this),
+                            this.pollIntervalMillis,
+                            false
+                        );
                         return;
                     }
 
@@ -212,7 +240,8 @@ export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implement
     }
 
     public ngOnDestroy() {
-        if (this.bigBlueButtonApiSubscription) this.bigBlueButtonApiSubscription.unsubscribe();
+        if (this.bigBlueButtonApiSubscription)
+            this.bigBlueButtonApiSubscription.unsubscribe();
     }
 
     protected onCapabilitiesSent(): void {
@@ -221,5 +250,4 @@ export class BigBlueButtonWidgetWrapperComponent extends CapableWidget implement
         // Don't set alwaysOnScreen until we start a meeting
         ScalarWidgetApi.sendSetAlwaysOnScreen(false);
     }
-
 }

web/app/widget-wrappers/gcal/gcal.component.ts

@@ -3,17 +3,17 @@ import { ActivatedRoute } from "@angular/router";
 import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 
 @Component({
-    selector: "my-gcal-widget-wrapper",
+    selector: "app-gcal-widget-wrapper",
     templateUrl: "../fullpage-iframe/fullpage-iframe.component.html",
     styleUrls: ["../fullpage-iframe/fullpage-iframe.component.scss"],
 })
 export class GCalWidgetWrapperComponent {
-
     public embedUrl: SafeUrl = null;
 
     constructor(activatedRoute: ActivatedRoute, sanitizer: DomSanitizer) {
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
-        const embedUrl = "https://calendar.google.com/calendar/embed?src=" + params.calendarId;
+        const embedUrl =
+      "https://calendar.google.com/calendar/embed?src=" + params.calendarId;
         this.embedUrl = sanitizer.bypassSecurityTrustResourceUrl(embedUrl);
     }
 }

web/app/widget-wrappers/generic-fullscreen/generic-fullscreen.component.ts

@@ -3,16 +3,15 @@ import { ActivatedRoute } from "@angular/router";
 import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 
 @Component({
-    selector: "my-generic-fullscreen-widget-wrapper",
+    selector: "app-generic-fullscreen-widget-wrapper",
     templateUrl: "../fullpage-iframe/fullpage-iframe.component.html",
     styleUrls: ["../fullpage-iframe/fullpage-iframe.component.scss"],
 })
 export class GenericFullscreenWidgetWrapperComponent {
-
     public embedUrl: SafeUrl = null;
 
     constructor(activatedRoute: ActivatedRoute, sanitizer: DomSanitizer) {
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
         // Note: we don't do an embeddable check (as we would in a generic wrapper)
         // because the Grafana dashboard might be private.
         this.embedUrl = sanitizer.bypassSecurityTrustResourceUrl(params.url);

web/app/widget-wrappers/generic/generic.component.ts

@@ -4,24 +4,30 @@ import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 import { WidgetApiService } from "../../shared/services/integrations/widget-api.service";
 
 @Component({
-    selector: "my-generic-widget-wrapper",
+    selector: "app-generic-widget-wrapper",
     templateUrl: "generic.component.html",
     styleUrls: ["generic.component.scss"],
 })
 export class GenericWidgetWrapperComponent {
-
     public isLoading = true;
     public canEmbed = false;
     public embedUrl: SafeUrl = null;
 
-    constructor(widgetApi: WidgetApiService, activatedRoute: ActivatedRoute, sanitizer: DomSanitizer) {
+    constructor(
-        let params: any = activatedRoute.snapshot.queryParams;
+        widgetApi: WidgetApiService,
+        activatedRoute: ActivatedRoute,
+        sanitizer: DomSanitizer
+    ) {
+        const params: any = activatedRoute.snapshot.queryParams;
 
-        widgetApi.isEmbeddable(params.url).then(result => {
+        widgetApi
+            .isEmbeddable(params.url)
+            .then((result) => {
                 this.canEmbed = result.canEmbed;
                 this.isLoading = false;
                 this.embedUrl = sanitizer.bypassSecurityTrustResourceUrl(params.url);
-        }).catch(err => {
+            })
+            .catch((err) => {
                 console.error(err);
                 this.canEmbed = false;
                 this.isLoading = false;

web/app/widget-wrappers/jitsi/jitsi.component.ts

@@ -7,15 +7,16 @@ import { Subscription } from "rxjs/Subscription";
 import { ScalarWidgetApi } from "../../shared/services/scalar/scalar-widget.api";
 import { CapableWidget } from "../capable-widget";
 
-declare var JitsiMeetExternalAPI: any;
+declare let JitsiMeetExternalAPI: any;
 
 @Component({
-    selector: "my-jitsi-widget-wrapper",
+    selector: "app-jitsi-widget-wrapper",
     templateUrl: "jitsi.component.html",
     styleUrls: ["jitsi.component.scss"],
 })
-export class JitsiWidgetWrapperComponent extends CapableWidget implements OnInit, OnDestroy {
+export class JitsiWidgetWrapperComponent
-
+    extends CapableWidget
+    implements OnInit, OnDestroy {
     public isJoined = false;
     public toggleVideo = false;
 
@@ -28,18 +29,21 @@ export class JitsiWidgetWrapperComponent extends CapableWidget implements OnInit
     private jitsiApiObj: any;
     private jitsiApiSubscription: Subscription;
 
-    constructor(activatedRoute: ActivatedRoute, private widgetApi: WidgetApiService) {
+    constructor(
+        activatedRoute: ActivatedRoute,
+        private widgetApi: WidgetApiService
+    ) {
         super();
         this.supportsAlwaysOnScreen = true;
 
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
 
         this.domain = params.domain;
         this.conferenceId = params.conferenceId || params.confId;
         this.displayName = params.displayName;
         this.avatarUrl = params.avatarUrl;
         this.userId = params.userId || params.email; // Element uses `email` when placing a conference call
-        this.isAudioOnly = params.isAudioOnly === 'true';
+        this.isAudioOnly = params.isAudioOnly === "true";
         this.toggleVideo = !this.isAudioOnly;
 
         // Set the widget ID if we have it
@@ -48,29 +52,32 @@ export class JitsiWidgetWrapperComponent extends CapableWidget implements OnInit
 
     public ngOnInit() {
         super.ngOnInit();
-        this.widgetApi.getWidget("jitsi").then(integration => {
+        this.widgetApi.getWidget("jitsi").then((integration) => {
             const widget = <FE_JitsiWidget>integration;
             $.getScript(widget.options.scriptUrl);
 
             if (!this.domain) {
                 // Always fall back to jitsi.riot.im to maintain compatibility with widgets created by Element.
-                this.domain = widget.options.useDomainAsDefault ? widget.options.jitsiDomain : "jitsi.riot.im";
+                this.domain = widget.options.useDomainAsDefault
+                    ? widget.options.jitsiDomain
+                    : "jitsi.riot.im";
             }
         });
-        this.jitsiApiSubscription = ScalarWidgetApi.requestReceived.subscribe(request => {
+        this.jitsiApiSubscription = ScalarWidgetApi.requestReceived.subscribe(
+            (request) => {
                 if (!this.isJoined) {
                     return;
                 }
 
                 switch (request.action) {
                     case "audioToggle":
-                    this.jitsiApiObj.executeCommand('toggleAudio');
+                        this.jitsiApiObj.executeCommand("toggleAudio");
                         break;
                     case "audioMute":
                         this.jitsiApiObj.isAudioMuted().then((muted) => {
                             // Toggle audio if Jitsi is not currently muted
                             if (!muted) {
-                            this.jitsiApiObj.executeCommand('toggleAudio');
+                                this.jitsiApiObj.executeCommand("toggleAudio");
                             }
                         });
                         break;
@@ -78,7 +85,7 @@ export class JitsiWidgetWrapperComponent extends CapableWidget implements OnInit
                         this.jitsiApiObj.isAudioMuted().then((muted) => {
                             // Toggle audio if Jitsi is currently muted
                             if (muted) {
-                            this.jitsiApiObj.executeCommand('toggleAudio');
+                                this.jitsiApiObj.executeCommand("toggleAudio");
                             }
                         });
                         break;
@@ -88,7 +95,8 @@ export class JitsiWidgetWrapperComponent extends CapableWidget implements OnInit
                 }
 
                 ScalarWidgetApi.replyAcknowledge(request);
-        });
+            }
+        );
     }
 
     public joinConference() {
@@ -107,12 +115,15 @@ export class JitsiWidgetWrapperComponent extends CapableWidget implements OnInit
                 SHOW_WATERMARK_FOR_GUESTS: false,
                 MAIN_TOOLBAR_BUTTONS: [],
                 VIDEO_LAYOUT_FIT: "height",
-            }
+            },
         });
-        if (this.displayName) this.jitsiApiObj.executeCommand("displayName", this.displayName);
+        if (this.displayName)
-        if (this.avatarUrl) this.jitsiApiObj.executeCommand("avatarUrl", this.avatarUrl.toString());
+            this.jitsiApiObj.executeCommand("displayName", this.displayName);
+        if (this.avatarUrl)
+            this.jitsiApiObj.executeCommand("avatarUrl", this.avatarUrl.toString());
         if (this.userId) this.jitsiApiObj.executeCommand("email", this.userId);
-        if (this.isAudioOnly === this.toggleVideo) this.jitsiApiObj.executeCommand("toggleVideo");
+        if (this.isAudioOnly === this.toggleVideo)
+            this.jitsiApiObj.executeCommand("toggleVideo");
 
         this.jitsiApiObj.on("readyToClose", () => {
             this.isJoined = false;
@@ -132,5 +143,4 @@ export class JitsiWidgetWrapperComponent extends CapableWidget implements OnInit
         super.onCapabilitiesSent();
         ScalarWidgetApi.sendSetAlwaysOnScreen(false);
     }
-
 }

web/app/widget-wrappers/manager-test/manager-test.component.ts

@@ -6,15 +6,16 @@ import { ScalarServerApiService } from "../../shared/services/scalar/scalar-serv
 import { TranslateService } from "@ngx-translate/core";
 
 @Component({
-    selector: "my-reauth-example-widget-wrapper",
+    selector: "app-reauth-example-widget-wrapper",
     templateUrl: "manager-test.component.html",
     styleUrls: ["manager-test.component.scss"],
 })
-export class ManagerTestWidgetWrapperComponent extends CapableWidget implements OnInit, OnDestroy {
+export class ManagerTestWidgetWrapperComponent
-
+    extends CapableWidget
-    public readonly STATE_NEUTRAL = 'neutral';
+    implements OnInit, OnDestroy {
-    public readonly STATE_OK = 'ok';
+    public readonly STATE_NEUTRAL = "neutral";
-    public readonly STATE_ERROR = 'error';
+    public readonly STATE_OK = "ok";
+    public readonly STATE_ERROR = "error";
 
     public isBusy = true;
     public isSupported = true;
@@ -23,22 +24,30 @@ export class ManagerTestWidgetWrapperComponent extends CapableWidget implements
     public homeserverState = this.STATE_NEUTRAL;
     public message: string;
 
-    constructor(activatedRoute: ActivatedRoute,
+    constructor(
+        activatedRoute: ActivatedRoute,
         private scalarApi: ScalarServerApiService,
         private changeDetector: ChangeDetectorRef,
-                public translate: TranslateService) {
+        public translate: TranslateService
+    ) {
         super();
         this.translate = translate;
-        this.translate.get('Click the button to test your connection. This may cause your client to ask if it is okay to share your identity with the widget - this is required to test your connection to your homeserver.').subscribe((res: string) => {this.message = res});
+        this.translate
+            .get(
+                "Click the button to test your connection. This may cause your client to ask if it is okay to share your identity with the widget - this is required to test your connection to your homeserver."
+            )
+            .subscribe((res: string) => {
+                this.message = res;
+            });
         const params: any = activatedRoute.snapshot.queryParams;
         ScalarWidgetApi.widgetId = params.widgetId;
     }
 
-
-
     protected onSupportedVersionsFound(): void {
         super.onSupportedVersionsFound();
-        this.isSupported = this.doesSupportAtLeastVersion(WIDGET_API_VERSION_OPENID);
+        this.isSupported = this.doesSupportAtLeastVersion(
+            WIDGET_API_VERSION_OPENID
+        );
         this.isBusy = false;
         if (!this.isSupported) {
             this.selfState = this.STATE_ERROR;
@@ -50,41 +59,73 @@ export class ManagerTestWidgetWrapperComponent extends CapableWidget implements
         this.selfState = this.STATE_NEUTRAL;
         this.managerState = this.STATE_NEUTRAL;
         this.homeserverState = this.STATE_NEUTRAL;
-        this.translate.get('Please accept the prompt to verify your identity.').subscribe((res: string) => {this.message = res});
+        this.translate
+            .get("Please accept the prompt to verify your identity.")
+            .subscribe((res: string) => {
+                this.message = res;
+            });
         this.isBusy = true;
 
         const response = await this.getOpenIdInfo();
         if (response.blocked) {
             this.isBusy = false;
             this.selfState = this.STATE_ERROR;
-            this.translate.get('You have blocked this widget from verifying your identity.').subscribe((res: string) => {this.message = res});
+            this.translate
+                .get("You have blocked this widget from verifying your identity.")
+                .subscribe((res: string) => {
+                    this.message = res;
+                });
             return;
         }
 
         this.selfState = this.STATE_OK;
-        this.translate.get('Checking connectivity to integration manager...').subscribe((res: string) => {this.message = res});
+        this.translate
+            .get("Checking connectivity to integration manager...")
+            .subscribe((res: string) => {
+                this.message = res;
+            });
 
         try {
             await this.scalarApi.ping();
             this.managerState = this.STATE_OK;
-            this.translate.get('Checking connectivity to homeserver...').subscribe((res: string) => {this.message = res});
+            this.translate
+                .get("Checking connectivity to homeserver...")
+                .subscribe((res: string) => {
+                    this.message = res;
+                });
         } catch (e) {
             console.error(e);
             this.isBusy = false;
             this.managerState = this.STATE_ERROR;
-            this.translate.get('Error checking if the integration manager is alive. This usually means that the manager which served this widget has gone offline.').subscribe((res: string) => {this.message = res});
+            this.translate
+                .get(
+                    "Error checking if the integration manager is alive. This usually means that the manager which served this widget has gone offline."
+                )
+                .subscribe((res: string) => {
+                    this.message = res;
+                });
             return;
         }
 
         try {
             await this.scalarApi.register(response.openId);
             this.homeserverState = this.STATE_OK;
-            this.translate.get('You\'re all set! Click the button below to re-run the test.').subscribe((res: string) => {this.message = res});
+            this.translate
+                .get("You're all set! Click the button below to re-run the test.")
+                .subscribe((res: string) => {
+                    this.message = res;
+                });
             this.isBusy = false;
         } catch (e) {
             this.isBusy = false;
             this.homeserverState = this.STATE_ERROR;
-            this.translate.get('Error contacting homeserver. This usually means your federation setup is incorrect, or your homeserver is offline. Consult your homeserver\'s documentation for how to set up federation.').subscribe((res: string) => {this.message = res});
+            this.translate
+                .get(
+                    "Error contacting homeserver. This usually means your federation setup is incorrect, or your homeserver is offline. Consult your homeserver's documentation for how to set up federation."
+                )
+                .subscribe((res: string) => {
+                    this.message = res;
+                });
         }
     }
 }

web/app/widget-wrappers/reauth-example/reauth-example.component.ts

@@ -8,12 +8,13 @@ import { FE_ScalarOpenIdRequestBody } from "../../shared/models/scalar-server-re
 import { TranslateService } from "@ngx-translate/core";
 
 @Component({
-    selector: "my-reauth-example-widget-wrapper",
+    selector: "app-reauth-example-widget-wrapper",
     templateUrl: "reauth-example.component.html",
     styleUrls: ["reauth-example.component.scss"],
 })
-export class ReauthExampleWidgetWrapperComponent extends CapableWidget implements OnInit, OnDestroy {
+export class ReauthExampleWidgetWrapperComponent
-
+    extends CapableWidget
+    implements OnInit, OnDestroy {
     public busy = true; // busy until we load supported versions
     public hasOpenId = false;
     public userId: string;
@@ -21,13 +22,19 @@ export class ReauthExampleWidgetWrapperComponent extends CapableWidget implement
     public error = false;
     public stateMessage: string;
 
-    constructor(activatedRoute: ActivatedRoute,
+    constructor(
+        activatedRoute: ActivatedRoute,
         private scalarApi: ScalarServerApiService,
         private changeDetector: ChangeDetectorRef,
-                public translate: TranslateService) {
+        public translate: TranslateService
+    ) {
         super();
         this.translate = translate;
-        this.translate.get('Checking client version...').subscribe((res: string) => {this.stateMessage = res});
+        this.translate
+            .get("Checking client version...")
+            .subscribe((res: string) => {
+                this.stateMessage = res;
+            });
 
         const params: any = activatedRoute.snapshot.queryParams;
         ScalarWidgetApi.widgetId = params.widgetId;
@@ -44,7 +51,11 @@ export class ReauthExampleWidgetWrapperComponent extends CapableWidget implement
             this.error = true;
             this.hasOpenId = false;
             this.blocked = false;
-            this.translate.get('Your client is too old to use this widget, sorry').subscribe((res: string) => {this.stateMessage = res});
+            this.translate
+                .get("Your client is too old to use this widget, sorry")
+                .subscribe((res: string) => {
+                    this.stateMessage = res;
+                });
         } else {
             this.busy = false;
             this.error = false;
@@ -60,7 +71,11 @@ export class ReauthExampleWidgetWrapperComponent extends CapableWidget implement
         this.error = false;
         this.blocked = false;
         this.hasOpenId = false;
-        this.translate.get('Please accept the prompt to verify your identity').subscribe((res: string) => {this.stateMessage = res});
+        this.translate
+            .get("Please accept the prompt to verify your identity")
+            .subscribe((res: string) => {
+                this.stateMessage = res;
+            });
 
         const response = await this.getOpenIdInfo();
         if (response.blocked) {

web/app/widget-wrappers/spotify/spotify.component.ts

@@ -4,19 +4,17 @@ import * as spotifyUri from "spotify-uri";
 import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 
 @Component({
-    selector: "my-spotify-widget-wrapper",
+    selector: "app-spotify-widget-wrapper",
     templateUrl: "../fullpage-iframe/fullpage-iframe.component.html",
     styleUrls: ["../fullpage-iframe/fullpage-iframe.component.scss"],
 })
 export class SpotifyWidgetWrapperComponent {
-
     public embedUrl: SafeUrl = null;
 
     constructor(activatedRoute: ActivatedRoute, sanitizer: DomSanitizer) {
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
         const spotifyUrl = spotifyUri.parse(params.uri);
         const spotifyEmbedUrl = spotifyUri.formatEmbedURL(spotifyUrl);
         this.embedUrl = sanitizer.bypassSecurityTrustResourceUrl(spotifyEmbedUrl);
     }
-
 }

web/app/widget-wrappers/sticker-picker/sticker-picker.component.ts

@@ -3,50 +3,53 @@ import {
     state,
     style,
     transition,
-    trigger
+    trigger,
-} from '@angular/animations';
+} from "@angular/animations";
-import { AfterViewInit, ChangeDetectorRef, Component, OnDestroy, OnInit } from "@angular/core";
+import {
+    AfterViewInit,
+    ChangeDetectorRef,
+    Component,
+    OnDestroy,
+    OnInit,
+} from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 import { CapableWidget, WIDGET_API_VERSION_OPENID } from "../capable-widget";
-import { fromEvent } from 'rxjs';
+import { fromEvent } from "rxjs";
 import {
     distinctUntilChanged,
     filter,
     map,
     pairwise,
     share,
-  throttleTime
+    throttleTime,
-} from 'rxjs/operators';
+} from "rxjs/operators";
 import { Subscription } from "rxjs/Subscription";
 import { ScalarWidgetApi } from "../../shared/services/scalar/scalar-widget.api";
 import { StickerApiService } from "../../shared/services/integrations/sticker-api.service";
 import { SessionStorage } from "../../shared/SessionStorage";
 import { ScalarServerApiService } from "../../shared/services/scalar/scalar-server-api.service";
-import { FE_Sticker, FE_UserStickerPack } from "../../shared/models/integration";
+import {
+    FE_Sticker,
+    FE_UserStickerPack,
+} from "../../shared/models/integration";
 import { MediaService } from "../../shared/services/media.service";
 import { WIDGET_STICKER_PICKER } from "../../shared/models/widget";
 
 @Component({
-    selector: "my-generic-widget-wrapper",
+    selector: "app-generic-widget-wrapper",
     templateUrl: "sticker-picker.component.html",
     styleUrls: ["sticker-picker.component.scss"],
     animations: [
-        trigger('hideList', [
+        trigger("hideList", [
-          state(
+            state("hidden", style({ opacity: 0, transform: "translateY(100%)" })),
-            'hidden',
+            state("visible", style({ opacity: 1, transform: "translateY(0)" })),
-            style({ opacity: 0, transform: 'translateY(100%)' })
+            transition("* => *", animate("200ms ease-in")),
-          ),
+        ]),
-          state(
+    ],
-            'visible',
-            style({ opacity: 1, transform: 'translateY(0)' })
-          ),
-          transition('* => *', animate('200ms ease-in'))
-        ])
-    ]
 })
-
+export class StickerPickerWidgetWrapperComponent
-export class StickerPickerWidgetWrapperComponent extends CapableWidget implements OnInit, OnDestroy, AfterViewInit {
+    extends CapableWidget
-
+    implements OnInit, OnDestroy, AfterViewInit {
     public isLoading = true;
     public isListVisible = true;
     public authError = false;
@@ -54,15 +57,17 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
 
     private stickerWidgetApiSubscription: Subscription;
 
-    constructor(activatedRoute: ActivatedRoute,
+    constructor(
+        activatedRoute: ActivatedRoute,
         private media: MediaService,
         private scalarApi: ScalarServerApiService,
         private stickerApi: StickerApiService,
-                private changeDetector: ChangeDetectorRef) {
+        private changeDetector: ChangeDetectorRef
+    ) {
         super();
         this.supportsStickers = true;
 
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
 
         let token = params.scalar_token;
         if (!token) token = localStorage.getItem("dim-scalar-token");
@@ -85,7 +90,8 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
 
     public ngOnInit() {
         super.ngOnInit();
-        this.stickerWidgetApiSubscription = ScalarWidgetApi.requestReceived.subscribe(request => {
+        this.stickerWidgetApiSubscription =
+      ScalarWidgetApi.requestReceived.subscribe((request) => {
           if (request.action === "visibility") {
               if ((<any>request).visible) this.loadStickers();
               ScalarWidgetApi.replyAcknowledge(request);
@@ -96,25 +102,24 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
 
     public ngOnDestroy() {
         super.ngOnDestroy();
-        if (this.stickerWidgetApiSubscription) this.stickerWidgetApiSubscription.unsubscribe();
+        if (this.stickerWidgetApiSubscription)
+            this.stickerWidgetApiSubscription.unsubscribe();
     }
 
     public ngAfterViewInit() {
-        const scroll$ = fromEvent(window, 'scroll').pipe(
+        const scroll$ = fromEvent(window, "scroll").pipe(
             throttleTime(10),
             map(() => window.pageYOffset),
             pairwise(),
-          map(([y1, y2]): string => (y2 < y1 ? 'up' : 'down')),
+            map(([y1, y2]): string => (y2 < y1 ? "up" : "down")),
             distinctUntilChanged(),
             share()
         );
 
-        const scrollUp$ = scroll$.pipe(
+        const scrollUp$ = scroll$.pipe(filter((direction) => direction === "up"));
-          filter(direction => direction === 'up')
-        );
 
         const scrollDown = scroll$.pipe(
-          filter(direction => direction === 'down')
+            filter((direction) => direction === "down")
         );
 
         scrollUp$.subscribe(() => (this.isListVisible = true));
@@ -124,11 +129,14 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
     protected onSupportedVersionsFound(): void {
         super.onSupportedVersionsFound();
 
-        if (this.authError && this.doesSupportAtLeastVersion(WIDGET_API_VERSION_OPENID)) {
+        if (
+            this.authError &&
+      this.doesSupportAtLeastVersion(WIDGET_API_VERSION_OPENID)
+        ) {
             this.isLoading = true;
             this.changeDetector.detectChanges();
 
-            this.getOpenIdInfo().then(async response => {
+            this.getOpenIdInfo().then(async (response) => {
                 if (response.blocked) {
                     this.isLoading = false;
                     this.authError = true;
@@ -137,8 +145,13 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
                 }
 
                 try {
-                    const registerResponse = await this.scalarApi.register(response.openId);
+                    const registerResponse = await this.scalarApi.register(
-                    localStorage.setItem("dim-scalar-token", registerResponse.scalar_token);
+                        response.openId
+                    );
+                    localStorage.setItem(
+                        "dim-scalar-token",
+                        registerResponse.scalar_token
+                    );
                     SessionStorage.scalarToken = registerResponse.scalar_token;
                     this.authError = !SessionStorage.scalarToken;
                     this.isLoading = false;
@@ -154,7 +167,12 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
         }
     }
 
-    public getThumbnailUrl(mxc: string, width: number, height: number, method: "crop" | "scale" = "scale"): string {
+    public getThumbnailUrl(
+        mxc: string,
+        width: number,
+        height: number,
+        method: "crop" | "scale" = "scale"
+    ): string {
         return this.media.getThumbnailUrl(mxc, width, height, method, true);
     }
 
@@ -165,7 +183,9 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
             try {
                 const info = await this.scalarApi.getAccount();
                 SessionStorage.userId = info.user_id;
-                console.log("Dimension scalar_token belongs to " + SessionStorage.userId);
+                console.log(
+                    "Dimension scalar_token belongs to " + SessionStorage.userId
+                );
             } catch (e) {
                 console.error(e);
                 this.authError = true;
@@ -177,8 +197,14 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
         console.log("Attempting to load available stickers...");
         try {
             const packs = await this.stickerApi.getPacks();
-            this.packs = packs.filter(p => p.isSelected);
+            this.packs = packs.filter((p) => p.isSelected);
-            console.log("User has " + this.packs.length + "/" + packs.length + " sticker packs selected");
+            console.log(
+                "User has " +
+          this.packs.length +
+          "/" +
+          packs.length +
+          " sticker packs selected"
+            );
             this.isLoading = false;
             this.changeDetector.markForCheck();
         } catch (e) {
@@ -187,13 +213,14 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
     }
 
     public scrollHorizontal(event: WheelEvent): void {
-        document.getElementsByClassName('sticker-pack-list')[0].scrollLeft += event.deltaY;
+        document.getElementsByClassName("sticker-pack-list")[0].scrollLeft +=
+      event.deltaY;
         event.preventDefault();
     }
 
     public scrollToPack(id: string) {
         const el = document.getElementById(id);
-        el.scrollIntoView({behavior: 'smooth'});
+        el.scrollIntoView({ behavior: "smooth" });
     }
 
     public sendSticker(sticker: FE_Sticker, pack: FE_UserStickerPack) {
@@ -201,6 +228,9 @@ export class StickerPickerWidgetWrapperComponent extends CapableWidget implement
     }
 
     public openIntegrationManager() {
-        ScalarWidgetApi.openIntegrationManager(WIDGET_STICKER_PICKER[0], ScalarWidgetApi.widgetId);
+        ScalarWidgetApi.openIntegrationManager(
+            WIDGET_STICKER_PICKER[0],
+            ScalarWidgetApi.widgetId
+        );
     }
 }

web/app/widget-wrappers/terms/terms.component.ts

@@ -6,32 +6,38 @@ import { ToasterService } from "angular2-toaster";
 import { TranslateService } from "@ngx-translate/core";
 
 @Component({
-    selector: "my-terms-widget-wrapper",
+    selector: "app-terms-widget-wrapper",
     templateUrl: "terms.component.html",
     styleUrls: ["terms.component.scss"],
 })
 export class TermsWidgetWrapperComponent implements OnInit {
-
     public isLoading = true;
     public html: SafeHtml;
 
-    constructor(private activatedRoute: ActivatedRoute,
+    constructor(
+        private activatedRoute: ActivatedRoute,
         private sanitizer: DomSanitizer,
         private toaster: ToasterService,
         private widgetApi: WidgetApiService,
-                public translate: TranslateService) {
+        public translate: TranslateService
+    ) {
         this.translate = translate;
     }
 
     public ngOnInit(): void {
         const params: any = this.activatedRoute.snapshot.params;
 
-        this.widgetApi.getTerms(params.shortcode, params.lang, params.version).then(terms => {
+        this.widgetApi
+            .getTerms(params.shortcode, params.lang, params.version)
+            .then((terms) => {
                 this.html = this.sanitizer.bypassSecurityTrustHtml(terms.text);
                 this.isLoading = false;
-        }).catch(err => {
+            })
+            .catch((err) => {
                 console.error(err);
-            this.translate.get('Error loading policy').subscribe((res: string) => {this.toaster.pop("error", res); });
+                this.translate.get("Error loading policy").subscribe((res: string) => {
+                    this.toaster.pop("error", res);
+                });
             });
     }
 }

web/app/widget-wrappers/tradingview/tradingview.component.ts

@@ -2,20 +2,19 @@ import { Component, OnInit } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 import * as $ from "jquery";
 
-declare var TradingView: any;
+declare let TradingView: any;
 
 @Component({
-    selector: "my-tradingview-widget-wrapper",
+    selector: "app-tradingview-widget-wrapper",
     templateUrl: "tradingview.component.html",
     styleUrls: ["tradingview.component.scss"],
 })
 export class TradingViewWidgetWrapperComponent implements OnInit {
-
     private symbol: string;
     private interval: string;
 
     constructor(activatedRoute: ActivatedRoute) {
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
 
         this.symbol = params.pair;
         this.interval = params.interval;
@@ -24,18 +23,18 @@ export class TradingViewWidgetWrapperComponent implements OnInit {
     public ngOnInit() {
         $.getScript("https://s3.tradingview.com/tv.js", () => {
             const widget = new TradingView.widget({
-                "autosize": true,
+                autosize: true,
-                "symbol": this.symbol,
+                symbol: this.symbol,
-                "interval": this.interval,
+                interval: this.interval,
-                "timezone": "Etc/UTC",
+                timezone: "Etc/UTC",
-                "theme": "Light",
+                theme: "Light",
-                "style": "1",
+                style: "1",
-                "locale": "en",
+                locale: "en",
-                "toolbar_bg": "#f1f3f6",
+                toolbar_bg: "#f1f3f6",
-                "enable_publishing": false,
+                enable_publishing: false,
-                "hide_top_toolbar": true,
+                hide_top_toolbar: true,
-                "hide_legend": true,
+                hide_legend: true,
-                "container_id": "tradingviewContainer",
+                container_id: "tradingviewContainer",
             });
             console.log("Created widget: " + widget);
         });

web/app/widget-wrappers/video/video.component.ts

@@ -3,17 +3,15 @@ import { ActivatedRoute } from "@angular/router";
 import { DomSanitizer, SafeUrl } from "@angular/platform-browser";
 
 @Component({
-    selector: "my-video-widget-wrapper",
+    selector: "app-video-widget-wrapper",
     templateUrl: "../fullpage-iframe/fullpage-iframe.component.html",
     styleUrls: ["../fullpage-iframe/fullpage-iframe.component.scss"],
 })
 export class VideoWidgetWrapperComponent {
-
     public embedUrl: SafeUrl = null;
 
     constructor(activatedRoute: ActivatedRoute, sanitizer: DomSanitizer) {
-        let params: any = activatedRoute.snapshot.queryParams;
+        const params: any = activatedRoute.snapshot.queryParams;
         this.embedUrl = sanitizer.bypassSecurityTrustResourceUrl(params.url);
     }
-
 }

web/environments/environment.prod.ts

@@ -1,4 +1,3 @@
 export const environment = {
     production: true
-  };
+};
-  

web/environments/environment.ts

@@ -4,14 +4,13 @@
 
 export const environment = {
     production: false
-  };
+};
 
-  /*
+/*
    * For easier debugging in development mode, you can import the following file
    * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
    *
    * This import should be commented out in production mode because it will have a negative impact
    * on performance if an error is thrown.
    */
-  // import 'zone.js/plugins/zone-error';  // Included with Angular CLI.
+// import 'zone.js/plugins/zone-error';  // Included with Angular CLI.
-