lint

docs/config.md

@@ -212,19 +212,18 @@ Starting with `branding`, the following subproperties are available:
 3. `auth_footer_links`: A list of links to add to the footer during login, registration, etc. Each entry must have a `text` and
    `url` property.
 
-
 4. `title_template`: A template string that can be used to configure the title of the application when not viewing a room.
 5. `title_template_in_room`: A template string that can be used to configure the title of the application when viewing a room
 
 #### `title_template` vars
 
 - `$brand` The name of the web app, as configured by the `brand` config value.
 - `$room_name` The friendly name of a room. Only applicable to `title_template_in_room`.
-- `$status` The client's status, repesented as. 
-  - The notification count, when at least one room is unread.
-  - "*" when no rooms are unread, but notifications are not muted.
-  - "Offline", when the client is offline.
-  - "", when the client isn't logged in or notifications are muted.
+- `$status` The client's status, repesented as.
+    - The notification count, when at least one room is unread.
+    - "\*" when no rooms are unread, but notifications are not muted.
+    - "Offline", when the client is offline.
+    - "", when the client isn't logged in or notifications are muted.
 
 `embedded_pages` can be configured as such:
 

playwright/e2e/branding/title.spec.ts

@@ -11,36 +11,37 @@ import { expect, test } from "../../element-web-test";
  * Tests for branding configuration
  **/
 
-test.describe('Test without branding config', () => {
+test.describe("Test without branding config", () => {
     test("Shows standard branding when showing the home page", async ({ pageWithCredentials: page }) => {
         await page.goto("/");
         await page.waitForSelector(".mx_MatrixChat", { timeout: 30000 });
-        expect(page.title()).toEqual('Element *');
+        expect(page.title()).toEqual("Element *");
     });
     test("Shows standard branding when showing a room", async ({ app, pageWithCredentials: page }) => {
         await app.client.createRoom({ name: "Test Room" });
         await app.viewRoomByName("Test Room");
-        expect(page.title()).toEqual('Element * | Test Room');
+        expect(page.title()).toEqual("Element * | Test Room");
     });
 });
 
-test.describe('Test with custom branding', () => {
-    test.use({ config: {
-        brand: 'TestBrand',
-        branding: {
-            title_template: 'TestingApp $ignoredParameter $brand $status $ignoredParameter',
-            title_template_in_room: 'TestingApp $brand $status $room_name $ignoredParameter'
-        }
-    }});
+test.describe("Test with custom branding", () => {
+    test.use({
+        config: {
+            brand: "TestBrand",
+            branding: {
+                title_template: "TestingApp $ignoredParameter $brand $status $ignoredParameter",
+                title_template_in_room: "TestingApp $brand $status $room_name $ignoredParameter",
+            },
+        },
+    });
     test("Shows custom branding when showing the home page", async ({ pageWithCredentials: page }) => {
         await page.goto("/");
         await page.waitForSelector(".mx_MatrixChat", { timeout: 30000 });
-        expect(page.title()).toEqual('TestingApp TestBrand * $ignoredParameter');
+        expect(page.title()).toEqual("TestingApp TestBrand * $ignoredParameter");
     });
     test("Shows custom branding when showing a room", async ({ app, pageWithCredentials: page }) => {
         await app.client.createRoom({ name: "Test Room" });
         await app.viewRoomByName("Test Room");
-        expect(page.title()).toEqual('TestingApp TestBrand * Test Room $ignoredParameter');
+        expect(page.title()).toEqual("TestingApp TestBrand * Test Room $ignoredParameter");
     });
 });
-

src/components/structures/MatrixChat.tsx

@@ -283,8 +283,8 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
         // we don't do it as react state as i'm scared about triggering needless react refreshes.
         this.subTitleStatus = "";
 
-        this.titleTemplate = props.config.branding?.title_template ?? '$brand $status';
-        this.titleTemplateInRoom = props.config.branding?.title_template_in_room ?? '$brand $status | $room_name';
+        this.titleTemplate = props.config.branding?.title_template ?? "$brand $status";
+        this.titleTemplateInRoom = props.config.branding?.title_template_in_room ?? "$brand $status | $room_name";
     }
 
     /**
@@ -1953,7 +1953,7 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
         const params: {
             $brand: string;
             $status: string;
-            $room_name: string|undefined;
+            $room_name: string | undefined;
         } = {
             $brand: SdkConfig.get().brand,
             $status: this.subTitleStatus,
@@ -1967,14 +1967,16 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
                 params.$room_name = room.name;
             }
         }
-        
+
         const titleTemplate = params.$room_name ? this.titleTemplateInRoom : this.titleTemplate;
 
         const title = Object.entries(params).reduce(
-            (title: string, [key, value]) => title.replaceAll(key, (value ?? '').replaceAll('$', '$_DLR$')), titleTemplate);
+            (title: string, [key, value]) => title.replaceAll(key, (value ?? "").replaceAll("$", "$_DLR$")),
+            titleTemplate,
+        );
 
         if (document.title !== title) {
-            document.title = title.replaceAll('$_DLR$', '$');
+            document.title = title.replaceAll("$_DLR$", "$");
         }
     }