fix: fix branding issues, mobile app urls etc.

CLAUDE.md

@@ -4,7 +4,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
 
 ## Prerequisites
 
-- Node.js >= 20.0.0
+- Node.js >= 22.18
 - Yarn 1.x (classic)
 
 ## Commands
@@ -97,6 +97,11 @@ Plugin architecture in `/src/modules/`:
 - Component files: UpperCamelCase, utilities: kebab-case
 - Use `Optional<T>` type instead of truly optional parameters when callers should explicitly acknowledge missing values
 - CSS class names must be prefixed with `mx_` and match component name (e.g., `mx_RoomTile`)
+- Import matrix-js-sdk via `matrix-js-sdk/src/matrix` only (not `matrix-js-sdk` or `matrix-js-sdk/src`)
+- Use `jest-matrix-react` instead of `@testing-library/react` for component tests
+- No `React.forwardRef` - use ref props directly instead
+- Use UIStore for window dimensions instead of `window.innerHeight`/`window.innerWidth`
+- Use Media helper for MXC URL handling instead of direct `mxcUrlToHttp` calls
 
 ### Linked Development with matrix-js-sdk
 For developing against local SDK changes:

res/manifest.json

@@ -44,17 +44,12 @@
     "related_applications": [
         {
             "platform": "play",
-            "url": "https://play.google.com/store/apps/details?id=im.vector.app",
-            "id": "im.vector.app"
-        },
-        {
-            "platform": "f-droid",
-            "url": "https://f-droid.org/repository/browse/?fdid=im.vector.app",
-            "id": "im.vector.app"
+            "url": "https://play.google.com/store/apps/details?id=ch.healthchat.element",
+            "id": "ch.healthchat.element"
         },
         {
             "platform": "itunes",
-            "url": "https://apps.apple.com/app/vector/id1083446067"
+            "url": "https://apps.apple.com/ch/app/healthchat/id6743060078"
         }
     ]
 }

res/themes/element/img/logos/element-logo.svg

@@ -1,7 +1,84 @@
-<svg width="200" height="200" viewBox="0 0 200 200" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M100 200C155.228 200 200 155.228 200 100C200 44.7715 155.228 0 100 0C44.7715 0 0 44.7715 0 100C0 155.228 44.7715 200 100 200Z" fill="#0DBD8B"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M81.7169 46.5946C81.7169 42.5581 84.9959 39.2859 89.0408 39.2859C116.456 39.2859 138.681 61.4642 138.681 88.8225C138.681 92.859 135.401 96.1312 131.357 96.1312C127.312 96.1312 124.033 92.859 124.033 88.8225C124.033 69.5372 108.366 53.9033 89.0408 53.9033C84.9959 53.9033 81.7169 50.6311 81.7169 46.5946Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M153.39 81.5137C157.435 81.5137 160.714 84.7859 160.714 88.8224C160.714 116.181 138.49 138.359 111.075 138.359C107.03 138.359 103.751 135.087 103.751 131.05C103.751 127.014 107.03 123.742 111.075 123.742C130.4 123.742 146.066 108.108 146.066 88.8224C146.066 84.7859 149.345 81.5137 153.39 81.5137Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M118.398 153.405C118.398 157.442 115.119 160.714 111.074 160.714C83.6592 160.714 61.4347 138.536 61.4347 111.177C61.4347 107.141 64.7138 103.869 68.7587 103.869C72.8035 103.869 76.0826 107.141 76.0826 111.177C76.0826 130.463 91.7489 146.097 111.074 146.097C115.119 146.097 118.398 149.369 118.398 153.405Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M46.6097 118.486C42.5648 118.486 39.2858 115.214 39.2858 111.178C39.2858 83.8193 61.5102 61.6409 88.9255 61.6409C92.9704 61.6409 96.2494 64.9132 96.2494 68.9497C96.2494 72.9862 92.9704 76.2584 88.9255 76.2584C69.6 76.2584 53.9337 91.8922 53.9337 111.178C53.9337 115.214 50.6546 118.486 46.6097 118.486Z" fill="white"/>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg1"
+   width="810.66669"
+   height="812"
+   viewBox="0 0 810.66669 812"
+   sodipodi:docname="SMC_button_RGB2.eps"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <radialGradient
+       fx="192.802"
+       fy="548.04102"
+       cx="192.802"
+       cy="548.04102"
+       r="0"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(10,0,0,10,20,-1160)"
+       spreadMethod="pad"
+       id="radialGradient3">
+      <stop
+         style="stop-opacity:1;stop-color:#006699"
+         offset="0"
+         id="stop1" />
+      <stop
+         style="stop-opacity:1;stop-color:#00b5e3"
+         offset="0.5625"
+         id="stop2" />
+      <stop
+         style="stop-opacity:1;stop-color:#7ae3ff"
+         offset="1"
+         id="stop3" />
+    </radialGradient>
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath3">
+      <path
+         d="M 5016.79,9.31641 H 1065.17 C 482.074,9.31641 4.98438,486.406 4.98438,1069.5 v 3951.6 c 0,583.13 477.08962,1060.19 1060.18562,1060.19 h 3951.62 c 583.1,0 1060.19,-477.06 1060.19,-1060.19 V 1069.5 C 6076.98,486.406 5599.89,9.31641 5016.79,9.31641 Z"
+         clip-rule="evenodd"
+         id="path3" />
+    </clipPath>
+  </defs>
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1">
+    <inkscape:page
+       x="0"
+       y="0"
+       inkscape:label="1"
+       id="page1"
+       width="810.66669"
+       height="812"
+       margin="0"
+       bleed="0" />
+  </sodipodi:namedview>
+  <g
+     id="g1"
+     inkscape:groupmode="layer"
+     inkscape:label="1">
+    <path
+       id="path1"
+       d="M 5016.79,9.31641 H 1065.17 C 482.074,9.31641 4.98438,486.406 4.98438,1069.5 v 3951.6 c 0,583.13 477.08962,1060.19 1060.18562,1060.19 h 3951.62 c 583.1,0 1060.19,-477.06 1060.19,-1060.19 V 1069.5 C 6076.98,486.406 5599.89,9.31641 5016.79,9.31641"
+       style="fill:url(#radialGradient3);fill-opacity:1;fill-rule:nonzero;stroke:none"
+       transform="matrix(0.13333333,0,0,-0.13333333,0,812)"
+       clip-path="url(#clipPath3)" />
+    <path
+       id="path4"
+       d="m 2800.93,3873.97 h 486.12 c 49.97,0 93.47,-41.51 93.47,-93.5 l 0.01,-454.88 c -0.01,-68.66 56.01,-124.66 124.63,-124.65 l 454.91,-0.01 c 53.51,0 91.5,-41.62 93.47,-93.47 v -486.1 c 0,-51.28 -41.9,-93.46 -93.47,-93.46 l -454.96,-0.02 c -68.5,0.01 -124.42,-55.8 -124.6,-124.29 l 0.01,-455.23 c 0,-53.15 -38.05,-87.04 -88.69,-93.34 -5.45,-0.68 -469.86,-1.63 -505.1,0.96 -44.23,3.25 -79.27,49.72 -79.27,92.38 l 0.01,455.23 c -0.18,68.49 -56.09,124.3 -124.59,124.29 l -454.96,0.02 c -51.58,0 -93.47,42.18 -93.47,93.46 v 486.1 c 1.99,52.06 40.17,93.47 93.46,93.47 l 454.91,0.01 c 68.63,-0.01 124.64,55.99 124.63,124.65 l 0.02,454.88 c 0,51.99 43.49,93.5 93.46,93.5 z m -487.53,627.25 c 662.23,234.86 1022.69,-36.14 1374.62,-0.28 351.94,35.86 -14.53,986.17 284.57,687.01 1256.91,-1257.22 1272.87,-3358.29 -285.25,-4003.72 -915.96,-379.39 -1969.7,54.09 -2345.46,971.56 -398.079,971.95 157,2056.61 971.52,2345.43 z m 1302.37,228.1 c 7.15,45.23 6.89,112.38 6.33,140.63 -3.78,190.53 -64.45,477.51 148.26,581.62 139.23,68.14 268.18,-1.91 366.08,-99.82 460.87,-461 791.32,-1055.14 922.35,-1694.94 120.26,-587.39 69.73,-1216.49 -221.46,-1748.2 C 4599.98,1475.22 4231.15,1158.77 3775.98,970.223 3268.12,759.84 2699.75,763.957 2195.04,981.633 1709.37,1191.05 1328.02,1578.34 1127.49,2067.97 c -212.537,518.97 -193.455,1100.34 33.79,1610.9 207.26,465.79 588.21,868.21 1074.7,1040.71 308.61,109.42 594.65,135.37 916.86,85.01 130.86,-20.47 321.71,-74.25 462.93,-75.27"
+       style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none"
+       transform="matrix(0.13333333,0,0,-0.13333333,0,812)" />
+  </g>
 </svg>

src/SdkConfig.ts

@@ -16,7 +16,7 @@ import { type DeepReadonly, type Defaultize } from "./@types/common";
 
 // see element-web config.md for docs, or the IConfigOptions interface for dev docs
 export const DEFAULTS: DeepReadonly<IConfigOptions> = {
-    brand: "Element",
+    brand: "HealthChat",
     help_url: "https://element.io/help",
     help_encryption_url: "https://element.io/help#encryption",
     integrations_ui_url: "https://scalar.vector.im/",
@@ -39,7 +39,7 @@ export const DEFAULTS: DeepReadonly<IConfigOptions> = {
     // everyone's config which has the camelCase property because our default would
     // be preferred over their config.
     desktopBuilds: {
-        available: true,
+        available: false,
         // eslint-disable-next-line @typescript-eslint/no-require-imports
         logo: require("../res/img/element-desktop-logo.svg").default,
         url: "https://element.io/get-started",
@@ -52,7 +52,7 @@ export const DEFAULTS: DeepReadonly<IConfigOptions> = {
     },
 
     desktop_builds: {
-        available: true,
+        available: false,
         logo: "vector-icons/1024.png",
         url: "https://element.io/download",
         url_macos: "https://packages.element.io/desktop/install/macos/Element.dmg",
@@ -61,9 +61,9 @@ export const DEFAULTS: DeepReadonly<IConfigOptions> = {
         url_linux: "https://element.io/download#linux",
     },
     mobile_builds: {
-        ios: "https://apps.apple.com/app/vector/id1083446067",
-        android: "https://play.google.com/store/apps/details?id=im.vector.app",
-        fdroid: "https://f-droid.org/repository/browse/?fdid=im.vector.app",
+        ios: "https://apps.apple.com/ch/app/healthchat/id6743060078",
+        android: "https://play.google.com/store/apps/details?id=ch.healthchat.element",
+        fdroid: "",
     },
 };
 

src/async-components/structures/ErrorView.tsx

@@ -35,7 +35,7 @@ export const ErrorView: React.FC<IProps> = ({ title, messages, footer, children
                 className="mx_ErrorView_logo"
                 height="160"
                 src="themes/element/img/logos/element-app-logo.png"
-                alt="Element"
+                alt="HealthChat"
             />
             <div className="mx_ErrorView_container">
                 <Heading size="md" weight="semibold">
@@ -121,7 +121,7 @@ export const UnsupportedBrowserView: React.FC<{
     onAccept?(): void;
 }> = ({ onAccept }) => {
     const config = SdkConfig.get();
-    const brand = config.brand ?? "Element";
+    const brand = config.brand ?? "HealthChat";
 
     const hasDesktopBuilds =
         config.desktop_builds?.available &&

src/vector/index.html

@@ -2,7 +2,7 @@
 <html lang="en" style="height: 100%;">
   <head>
     <meta charset="utf-8">
-    <title>Element</title>
+    <title>HealthChat</title>
     <link rel="apple-touch-icon" sizes="120x120" href="<%= require('../../res/vector-icons/120.png') %>">
     <link rel="apple-touch-icon" sizes="144x144" href="<%= require('../../res/vector-icons/144.png') %>">
     <link rel="apple-touch-icon" sizes="152x152" href="<%= require('../../res/vector-icons/152.png') %>">
@@ -13,8 +13,8 @@
     <link rel="icon" type="image/png" sizes="144x144" href="<%= require('../../res/vector-icons/144.png') %>">
     <link rel="icon" type="image/png" sizes="512x512" href="<%= require('../../res/vector-icons/512.png') %>">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <meta name="apple-mobile-web-app-title" content="Element">
-    <meta name="application-name" content="Element">
+    <meta name="apple-mobile-web-app-title" content="HealthChat">
+    <meta name="application-name" content="HealthChat">
     <meta name="theme-color" content="#ffffff">
     <meta property="og:image" content="<%= og_image_url %>" />
     <meta http-equiv="Content-Security-Policy" content="