+
+
+
+
+
@@ -218,9 +312,11 @@ yarn backend
To add a new translation key you can do these steps:
-1. Add the new key entry to the code where the new key is used: `t("some_new_key")`
+1. Add the new key entry to the code where the new key is used:
+ `t("some_new_key")`
1. Run `yarn i18n` to extract the new key and update the translation files. This
will add a skeleton entry to the `locales/en/app.json` file:
+
```jsonc
{
...
@@ -228,19 +324,39 @@ To add a new translation key you can do these steps:
...
}
```
-1. Update the skeleton entry in the `locales/en/app.json` file with
- the English translation:
-```jsonc
+1. Update the skeleton entry in the `locales/en/app.json` file with the English
+ translation:
+
+ ```jsonc
{
...
"some_new_key": "Some new key",
...
}
-```
+ ```
-## Documentation
+## 📖 Documentation
Usage and other technical details about the project can be found here:
[**Docs**](./docs/README.md)
+
+## 📝 Copyright & License
+
+Copyright 2021-2025 New Vector Ltd
+
+This software is dual-licensed by New Vector Ltd (Element). It can be used
+either:
+
+(1) for free under the terms of the GNU Affero General Public License (as
+published by the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version); OR
+
+(2) under the terms of a paid-for Element Commercial License agreement between
+you and Element (the terms of which may vary depending on what you and Element
+have agreed to). Unless required by applicable law or agreed to in writing,
+software distributed under the Licenses is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+Licenses for the specific language governing permissions and limitations under
+the Licenses.
diff --git a/WIDGET_TEST.md b/WIDGET_TEST.md
new file mode 100644
index 00000000..53e26a29
--- /dev/null
+++ b/WIDGET_TEST.md
@@ -0,0 +1,28 @@
+# Testing Element-Call in widget mode
+
+When running `yarn backend` the latest element-web develop will be deployed and served on `http://localhost:8081`.
+In a development environment, you might prefer to just use the `element-web` repo directly, but this setup is useful for CI/CD testing.
+
+## Setup
+
+The element-web configuration is modified to:
+
+- Enable to use the local widget instance (`element_call.url` https://localhost:3000).
+- Enable the labs features (`feature_group_calls`, `feature_element_call_video_rooms`).
+
+The default configuration used by docker-compose is in `test-container/config.json`. There is a fixture for playwright
+that uses
+
+## Running the element-web instance
+
+It is part of the existing backend setup. To start the backend, run:
+
+```sh
+yarn backend
+```
+
+Then open `http://localhost:8081` in your browser.
+
+## Basic fixture
+
+A base fixture is provided in `/playwright/fixtures/widget-user.ts` that will register two users that shares a room.
diff --git a/backend/dev_homeserver.yaml b/backend/dev_homeserver.yaml
index 5697c32e..eab4e698 100644
--- a/backend/dev_homeserver.yaml
+++ b/backend/dev_homeserver.yaml
@@ -1,5 +1,5 @@
-server_name: "synapse.localhost"
-public_baseurl: http://synapse.localhost:8008/
+server_name: "synapse.m.localhost"
+public_baseurl: https://synapse.m.localhost/
pid_file: /data/homeserver.pid
diff --git a/backend/dev_livekit.yaml b/backend/dev_livekit.yaml
index 0e0c5c7b..f0c5b3a4 100644
--- a/backend/dev_livekit.yaml
+++ b/backend/dev_livekit.yaml
@@ -21,3 +21,5 @@ turn:
external_tls: true
keys:
devkey: secret
+room:
+ auto_create: false
diff --git a/backend/dev_nginx.conf b/backend/dev_nginx.conf
new file mode 100644
index 00000000..a29b06d7
--- /dev/null
+++ b/backend/dev_nginx.conf
@@ -0,0 +1,161 @@
+# Synapse reverse proxy including .well-known/matrix/client
+server {
+ listen 80;
+ listen [::]:80;
+ listen 443 ssl;
+ listen 8448 ssl;
+ listen [::]:443 ssl;
+ listen [::]:8448 ssl;
+ server_name synapse.m.localhost;
+ ssl_certificate /root/ssl/cert.pem;
+ ssl_certificate_key /root/ssl/key.pem;
+
+ # well-known config adding rtc_foci backend
+ # Note well-known is currently not effective due to:
+ # https://spec.matrix.org/v1.12/client-server-api/#well-known-uri the spec
+ # says it must be at https://$server_name/... (implied port 443) Hence, we
+ # currently rely for local development environment on deprecated config.json
+ # setting for livekit_service_url
+ location /.well-known/matrix/client {
+ add_header Access-Control-Allow-Origin *;
+ return 200 '{"m.homeserver": {"base_url": "https://synapse.m.localhost"}, "org.matrix.msc4143.rtc_foci": [{"type": "livekit", "livekit_service_url": "https://matrix-rtc.m.localhost/livekit/jwt"}]}';
+ default_type application/json;
+ }
+
+ # Reverse proxy for Matrix Synapse Homeserver
+ # This is also required for development environment.
+ # Reason: the lk-jwt-service uses the federation API for the openid token
+ # verification, which requires TLS
+ location / {
+ proxy_pass "http://homeserver:8008";
+ proxy_http_version 1.1;
+ proxy_set_header Upgrade $http_upgrade;
+ proxy_set_header Connection "upgrade";
+ proxy_set_header Host $host;
+ proxy_set_header X-Forwarded-For $remote_addr;
+ proxy_set_header X-Forwarded-Proto $scheme;
+ }
+
+ error_page 500 502 503 504 /50x.html;
+
+}
+
+# MatrixRTC reverse proxy
+# - MatrixRTC Authorization Service
+# - LiveKit SFU websocket signaling connection
+upstream jwt-auth-services {
+ server auth-server:6080;
+ server host.docker.internal:6080;
+}
+
+server {
+ listen 80;
+ listen [::]:80;
+ listen 443 ssl;
+ listen [::]:443 ssl;
+ listen 8448 ssl;
+ listen [::]:8448 ssl;
+ server_name matrix-rtc.m.localhost;
+ ssl_certificate /root/ssl/cert.pem;
+ ssl_certificate_key /root/ssl/key.pem;
+
+
+ location ^~ /livekit/jwt/ {
+
+ proxy_set_header Host $host;
+ proxy_set_header X-Real-IP $remote_addr;
+ proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+ proxy_set_header X-Forwarded-Proto $scheme;
+
+ # JWT Service running at port 6080
+ proxy_pass http://jwt-auth-services/;
+
+ }
+
+ location ^~ /livekit/sfu/ {
+ proxy_set_header Host $host;
+ proxy_set_header X-Real-IP $remote_addr;
+ proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+ proxy_set_header X-Forwarded-Proto $scheme;
+
+ proxy_send_timeout 120;
+ proxy_read_timeout 120;
+ proxy_buffering off;
+
+ proxy_set_header Accept-Encoding gzip;
+ proxy_set_header Upgrade $http_upgrade;
+ proxy_set_header Connection "upgrade";
+
+ # LiveKit SFU websocket connection running at port 7880
+ proxy_pass http://livekit-sfu:7880/;
+ }
+
+ error_page 500 502 503 504 /50x.html;
+
+}
+
+# Convenience reverse proxy for the call.m.localhost domain to yarn dev --host
+server {
+ listen 80;
+ listen [::]:80;
+ server_name call.m.localhost;
+
+ return 301 https://$host$request_uri;
+}
+
+server {
+ listen 443 ssl;
+ listen [::]:443 ssl;
+ server_name call.m.localhost;
+ ssl_certificate /root/ssl/cert.pem;
+ ssl_certificate_key /root/ssl/key.pem;
+
+
+ location ^~ / {
+
+ proxy_set_header Host $host;
+ proxy_set_header X-Real-IP $remote_addr;
+ proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+ proxy_set_header X-Forwarded-Proto $scheme;
+
+ proxy_pass https://host.docker.internal:3000;
+ proxy_ssl_verify off;
+
+ }
+
+ error_page 500 502 503 504 /50x.html;
+
+}
+
+# Convenience reverse proxy app.m.localhost for element web
+server {
+ listen 80;
+ listen [::]:80;
+ server_name app.m.localhost;
+
+ return 301 https://$host$request_uri;
+}
+
+server {
+ listen 443 ssl;
+ listen [::]:443 ssl;
+ server_name app.m.localhost;
+ ssl_certificate /root/ssl/cert.pem;
+ ssl_certificate_key /root/ssl/key.pem;
+
+
+ location ^~ / {
+
+ proxy_set_header Host $host;
+ proxy_set_header X-Real-IP $remote_addr;
+ proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+ proxy_set_header X-Forwarded-Proto $scheme;
+
+ proxy_pass http://element-web:8081;
+ proxy_ssl_verify off;
+
+ }
+
+ error_page 500 502 503 504 /50x.html;
+
+}
diff --git a/backend/dev_tls_local-ca.crt b/backend/dev_tls_local-ca.crt
new file mode 100644
index 00000000..9c8ee3d7
--- /dev/null
+++ b/backend/dev_tls_local-ca.crt
@@ -0,0 +1,19 @@
+-----BEGIN CERTIFICATE-----
+MIIDGjCCAgKgAwIBAgIUGdiFHhH4KL2pqBjMQHQ+PVIkSV8wDQYJKoZIhvcNAQEL
+BQAwHjEcMBoGA1UEAwwTRWxlbWVudCBDYWxsIERldiBDQTAeFw0yNTA1MDUxMDMy
+MDJaFw0zNTA1MDMxMDMyMDJaMB4xHDAaBgNVBAMME0VsZW1lbnQgQ2FsbCBEZXYg
+Q0EwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEKAoIBAQDA2y0hjmNn1vRsVSdy
+8IOfo8N1q9UgkhQWpGKXzPh+D5d1fnuJEmHIVwtDEtS/PwQ43LTmegChPtKH9jdT
+tG0IihW9Ja5YNG+9xAwaoA/sB3CGCBYsz+2/XjVUpXoBJXIPoFBWsn+K0oeFw9fw
+eRO1z9abM4cl+LjKzMNM8CCyu9uI1MaGjYez2YIWvG854VucLxX7HSlMJxZNWnie
+Ui7fMakuJhB2+aiIQjdKxy4E5RHNhzYG/LXhvP+wBYBDPNRsP3rtzEaE9HAveL9K
+FGqd3R4cBia6r1WIXmpAzyu5RGP5Eou0TZlGkal96/bF0I7q/pKlL23Jt1BLPiQU
+KGKrAgMBAAGjUDBOMB0GA1UdDgQWBBQJqBjMu61c1p24txw/y+kv3D+V6DAfBgNV
+HSMEGDAWgBQJqBjMu61c1p24txw/y+kv3D+V6DAMBgNVHRMEBTADAQH/MA0GCSqG
+SIb3DQEBCwUAA4IBAQB8m2YfFGLugNt5vAAOvNxVqDA8c72yCVYr3CBCpmTIEY5Z
+d3qVGhG9//ux6+J8ntkSwd9nV5GJyYXHukCG1VavnAWolWdNF/WAllf0jhLuz7kD
+/cJnuI1By4tBsBmSz851i6HJ4t5k99Be+6GQVzi0e7zzfxTHZE4xP2J6Ox8QbPsP
+n0m76nIp/WbWaJqzvIIjJhmUUPPv+4wN+eOArgjiGLzptM2qTtGZtd0c9nS5gvep
++mEbSUN9zkhAroZf80wf+hEvy+fJ94VbZ9QjTzTg7odZLrsXGIe8DaG63EYRQ25b
+W5iYBAreln5fGSt7qHsGfqwZibTEk/Lx3dydO1Kg
+-----END CERTIFICATE-----
diff --git a/backend/dev_tls_local-ca.key b/backend/dev_tls_local-ca.key
new file mode 100644
index 00000000..c6de05c4
--- /dev/null
+++ b/backend/dev_tls_local-ca.key
@@ -0,0 +1,28 @@
+-----BEGIN PRIVATE KEY-----
+MIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQDA2y0hjmNn1vRs
+VSdy8IOfo8N1q9UgkhQWpGKXzPh+D5d1fnuJEmHIVwtDEtS/PwQ43LTmegChPtKH
+9jdTtG0IihW9Ja5YNG+9xAwaoA/sB3CGCBYsz+2/XjVUpXoBJXIPoFBWsn+K0oeF
+w9fweRO1z9abM4cl+LjKzMNM8CCyu9uI1MaGjYez2YIWvG854VucLxX7HSlMJxZN
+WnieUi7fMakuJhB2+aiIQjdKxy4E5RHNhzYG/LXhvP+wBYBDPNRsP3rtzEaE9HAv
+eL9KFGqd3R4cBia6r1WIXmpAzyu5RGP5Eou0TZlGkal96/bF0I7q/pKlL23Jt1BL
+PiQUKGKrAgMBAAECggEAAPX2kxi5AQ7ul82SzT1KgpSXyDHLdYaUyAoYnaX9RO+B
+8ylmpyeqygs4+KQS4EMJm9jpo85Oy37bIKdG3kljU6wQcKlL5Y+ZUOo1nzpV6fid
+hGVs6ts8VXw8KshKQ9AyccZ8L/pirUfgOffgTwfjY7/90zceAL/s98GuZWc62nkX
+55joQv/OikqYfAGP/U6Bp2Zyf23DwJB09Z3B6NnZj/ZyAbDrDEHuA15LhCOcCczp
+IU/mFEywBPHT9Tg4w4Beq78PeAETvku2UalYRLhP3RLlXr2oEbwUtINRVt2QjZ85
+Esps4uCqL/mgQluIebtudD9HL/YMlNPXue1mDXFxJQKBgQDgZZY4yJBcf488T1V6
+HNm06b/LvVGj253pKgw14hpY1xQu3Ymgzv1GEqzhSYdzxhpmj0tMUNHxAp+YdGQu
+SZ0wcPKhw0aYVkIjDRYDC3Wn5GJhyIEYHGYMo/n4l49UzHRBPOTDzp49DkHTKBgh
+XgIIazYT3CkjTIMRrkUv+qfIPQKBgQDcBGu/mqbjxs4sN3zqPS4aB21o6t6W0sXs
+ZP9w6RlTPQi5U2oRbftjZtYc0bbEgkMUImB1HwYPQT5pJ+MyC414xDvSc2exBr5d
+To6yyPIy78Tf5PHM12fpKV92nSvoz/pSjYcGxxDtKfPqu+t8mOJfjCV1lLLA+xuB
+DDaE4p8dBwKBgQCdAne6A5v/HMH8UQZeCxHJpESvKiiVnnU/UEx651nID7XvlNNX
+0X0mKqsMd4ZvW43ddSYan/JF0LAa3FW8jYWO/3jF9vzOWoysOdvNBZetgf/Uq5ao
+aDZ/YbzmVCXWD7jIbPMkjs3pqrAkL0mzDzQc7+dGviWKrV6IYIfIqnn7gQKBgDCz
+vdIk/qpO+JZrFfiX4Fucp0hhLTJ/p5ZDaRPqVVPKn+K+Jy2ChfIj8mNgvK9VEloj
+nexvGJ1J2PHYBX+vdPp1nbRhHWPfVUY8PHQw7QP/dToGaMvqJrNDGEGeWvjnCMc7
+UtdaO1H0Rm0AegkTopB56lTTvJnhO95eALd7nrMDAoGAEPdzJtWoKafp49svhSj0
+hiXQv2SPBwVUN4LZ4SOWiXUcmYYm80aNpYKLkBxYjrfqFWhE7NUHLGp8YorQWKY2
+acD9AReHk/xku0ABy6jeYmSCmCxASxst5liKD+l12sk0gB0rk5MBxB4Uu1MIbQZ2
+aCASX3AVD2/XyC2MKkzc8Eg=
+-----END PRIVATE KEY-----
diff --git a/backend/dev_tls_m.localhost.crt b/backend/dev_tls_m.localhost.crt
new file mode 100644
index 00000000..5d6251a9
--- /dev/null
+++ b/backend/dev_tls_m.localhost.crt
@@ -0,0 +1,21 @@
+-----BEGIN CERTIFICATE-----
+MIIDZzCCAk+gAwIBAgIUXizLjwkdqepX0bh0K3abeJxj68IwDQYJKoZIhvcNAQEL
+BQAwHjEcMBoGA1UEAwwTRWxlbWVudCBDYWxsIERldiBDQTAeFw0yNTA1MDUxMzU5
+MTFaFw0zNTA1MDMxMzU5MTFaMBgxFjAUBgNVBAMMDSoubS5sb2NhbGhvc3QwggEi
+MA0GCSqGSIb3DQEBAQUAA4IBDwAwggEKAoIBAQCrzGSScSgaQuZdELGFYiLiYRwr
+LKyUdNr0rsPcOo0bvbeZ3zQMeUMRNlA69zGFdarumiDRXUoAmZI39WmH95aX3d+A
+U7EFnWev7xpWSVhSYj8T0d4rke8HjGk3LpaffJ93tbJuagBIH1ouuN6AOdzWs8hp
+RYIomWleEeeuVnnfaMwaXOdc+ihJJ6wzm2hwQSfdpjZPWBDd/DFft1ZXxIZOCjDs
+rEIiI7uU8iZPLB3QEM/tgxSSAOxrcKvQvxZokk+FD7aMJFP71IfieLCEzMTP1VXa
+tP7UTAKAqB2NyDJ8m3IHbOINiqcdFvFR3R1D9bXOYE4oRynNvYZrQUGnL2RtAgMB
+AAGjgaIwgZ8wHwYDVR0jBBgwFoAUCagYzLutXNaduLccP8vpL9w/legwCQYDVR0T
+BAIwADALBgNVHQ8EBAMCBaAwEwYDVR0lBAwwCgYIKwYBBQUHAwEwMAYDVR0RBCkw
+J4IJbG9jYWxob3N0ggttLmxvY2FsaG9zdIINKi5tLmxvY2FsaG9zdDAdBgNVHQ4E
+FgQUfdh1p52ZgWyZcBgBXGwKi4EnUE0wDQYJKoZIhvcNAQELBQADggEBAKrHEuB6
+33j8+EwSHw3zrvt/DRXK2BDHI1Ir9JcztSunaKAjZXVvf/dvZp0Xs1dEdJIdnv6G
+iZYhBbOqDqpQZbf2h/h0kuu5yZSBUdnQXnYNxlhp2UaC/UEgw5iZT/p1rm7RjVie
+y4Dp2WytV5iZOLmLj6xDvd3DXazgJPWIRX8p8qJZbKTkwCjTr7nDIj8jjG1sVFf7
+1RJBO5/6WSnImrpDmlLUrvjiKvbxcdseDJyBOhTwdRdSk4S2M+s5tR5j2I1gXLOq
+J5ioN76+SCrTY0K0WKRy9oOXWO1/X3+VYcekp+0F3SGkd5w17jylCv1XIGHAdEsQ
+v2z2/aMI/7sAD2Q=
+-----END CERTIFICATE-----
diff --git a/backend/dev_tls_m.localhost.key b/backend/dev_tls_m.localhost.key
new file mode 100644
index 00000000..73d89ce4
--- /dev/null
+++ b/backend/dev_tls_m.localhost.key
@@ -0,0 +1,28 @@
+-----BEGIN PRIVATE KEY-----
+MIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQCrzGSScSgaQuZd
+ELGFYiLiYRwrLKyUdNr0rsPcOo0bvbeZ3zQMeUMRNlA69zGFdarumiDRXUoAmZI3
+9WmH95aX3d+AU7EFnWev7xpWSVhSYj8T0d4rke8HjGk3LpaffJ93tbJuagBIH1ou
+uN6AOdzWs8hpRYIomWleEeeuVnnfaMwaXOdc+ihJJ6wzm2hwQSfdpjZPWBDd/DFf
+t1ZXxIZOCjDsrEIiI7uU8iZPLB3QEM/tgxSSAOxrcKvQvxZokk+FD7aMJFP71Ifi
+eLCEzMTP1VXatP7UTAKAqB2NyDJ8m3IHbOINiqcdFvFR3R1D9bXOYE4oRynNvYZr
+QUGnL2RtAgMBAAECggEAJaFQii8U/KOYt9vXNoMnZvSkaeSQLLhn2V6Kciu1CtWE
+aMTWLsFE6nk+G5xXkYcTmM3T0GghtH3u5CjyI6EcsEkeEorCZJt0wbmayDmqiekR
+LfMzOdHuTHX5+edPgMGYYG1BFyRKyYFsjH1b5zRFZhXdGQnrl5760GsVlz9D1KZQ
+iHcT+q1S2tmZeoUukQnADENKXUMCyTGM5FCddgNtsWnGDsTDayh7hUdvDkB+mW4G
+lSp+BZuc3PCwpbD6qkXvfugWs6CUAAtXoV3ceWgxQ+TEnNlwxaG1AyugfgNUBolk
+8xgeZt4r5QId03jsHDf7hpBAofcaCd5EMIIQYFvWoQKBgQDlbAvAzEFPTZZn2nRV
+Xagw4xjqVc1LLEKLCWq0N5rEkwn0h90Dz5N7/3NuonP/sIDsDHCbyiOYBI1Ck6Xi
+0WuB+OyKDh+xeF2mekN9G9ywPahdK5lT/TVsxXFyZlwtVv1x/6KBO4yv5URizxqU
+gyAPDDxfD/KcNjkOBaodWEwQGQKBgQC/s2gPDBtQkjLwkHXchBomLww5eLlVrac1
+WK4UX6uSdOgrjJ375OOgMTxe8NVZdOuAKytGXRWDwgH3nVWvuZhe7dGlX3JMuSer
+e9VwDpBESrvqcR4ruL6wm8wej6BXyjH0wD3FHb0S5HfuBDxTn+4bDwrbRzOUMNgy
+lSppuflxdQKBgQDiZcIfazFT8evn5nMAvuC4BZNTxIJHmZC9JfjPiUPIkpWzYtOe
+7BvNtKOT3Op9uw8uYYRKqKqBXJSNy6ha8XCXHS9HeXKbLn20SFkLQBCDNwVLlDfF
+40zyXtF6JDr4XyzSb4NM5pgKCER5AYloXxGm59s3sEQpFXUuOjbKqJS/GQKBgAoI
+c7vF4HAZFr1sch62cz/oWnVvkhOf4Q5zs7ixQSOLJtOQqnwSgK9TpFs7s47ZBbJR
+kBRAru2Ua9Hv1Bo8VnMxczV6h1roneDlvEf/GyHX33nnrbKQGrrXjJlU3wl5NaAf
+p5v3cHvapUQ5yIZ/6lBUOzc6xMJOxCHxmKSr7Rg5AoGAbEE4lt6Xh2dnBPJ81eNI
+IDrw/3ITY53qAY4Bx88CByIFuu8CEUdUZprh98jSl6ic1tMinZfUhRMwABLrUD51
+DGst8iGLPD9u83iMcUHI/L+p7AbxrKLvWXZrF5UZm440c9mSWqfhPaTBosPtNDsG
+LfETwH1flKXMTXd2xA9RTE4=
+-----END PRIVATE KEY-----
diff --git a/backend/dev_tls_setup b/backend/dev_tls_setup
new file mode 100644
index 00000000..8a778dc8
--- /dev/null
+++ b/backend/dev_tls_setup
@@ -0,0 +1,38 @@
+#!/bin/bash
+
+# Step 1: Create a Root CA key and cert
+openssl genrsa -out dev_tls_local-ca.key 2048
+openssl req -x509 -new -nodes \
+ -days 3650 \
+ -subj "/CN=Element Call Dev CA" \
+ -key dev_tls_local-ca.key \
+ -out dev_tls_local-ca.crt \
+ -sha256 -addext "basicConstraints=CA:TRUE"
+
+# Step 2: Create a private key and CSR for *.m.localhost
+openssl req -new -nodes -newkey rsa:2048 \
+ -keyout dev_tls_m.localhost.key \
+ -out dev_tls_m.localhost.csr \
+ -subj "/CN=*.m.localhost"
+
+# Step 3: Sign the CSR with your CA
+openssl x509 \
+ -req -in dev_tls_m.localhost.csr \
+ -CA dev_tls_local-ca.crt -CAkey dev_tls_local-ca.key \
+ -CAcreateserial \
+ -out dev_tls_m.localhost.crt \
+ -days 3650 \
+ -sha256 \
+ -extfile <( cat <
-
-
-
-
-
-
+ {header === "standard" && (
+
+
+
+
+
+
+ )}
@@ -185,10 +189,10 @@ export const UnauthenticatedView: FC = () => {
)}
-
+
By clicking "Go", you agree to our{" "}
-
- End User Licensing Agreement (EULA)
+
+ Software and Services License Agreement (SSLA)
diff --git a/src/home/common.module.css b/src/home/common.module.css
index 2032420f..821da771 100644
--- a/src/home/common.module.css
+++ b/src/home/common.module.css
@@ -1,7 +1,7 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
diff --git a/src/home/useGroupCallRooms.ts b/src/home/useGroupCallRooms.ts
index 73464987..e89c3f14 100644
--- a/src/home/useGroupCallRooms.ts
+++ b/src/home/useGroupCallRooms.ts
@@ -1,18 +1,25 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
-import { type MatrixClient } from "matrix-js-sdk/src/client";
-import { type Room, RoomEvent } from "matrix-js-sdk/src/models/room";
-import { type RoomMember } from "matrix-js-sdk/src/models/room-member";
+import {
+ type MatrixClient,
+ type RoomMember,
+ type Room,
+ RoomEvent,
+ EventTimeline,
+ EventType,
+ JoinRule,
+ KnownMembership,
+} from "matrix-js-sdk";
import { useState, useEffect } from "react";
-import { EventTimeline, EventType, JoinRule } from "matrix-js-sdk/src/matrix";
-import { type MatrixRTCSession } from "matrix-js-sdk/src/matrixrtc/MatrixRTCSession";
-import { MatrixRTCSessionManagerEvents } from "matrix-js-sdk/src/matrixrtc/MatrixRTCSessionManager";
-import { KnownMembership } from "matrix-js-sdk/src/types";
+import {
+ MatrixRTCSessionManagerEvents,
+ type MatrixRTCSession,
+} from "matrix-js-sdk/lib/matrixrtc";
import { getKeyForRoom } from "../e2ee/sharedKeyManagement";
@@ -74,8 +81,9 @@ function sortRooms(client: MatrixClient, rooms: Room[]): Room[] {
}
const roomIsJoinable = (room: Room): boolean => {
- if (!room.hasEncryptionStateEvent() && !getKeyForRoom(room.roomId)) {
- // if we have an non encrypted room (no encryption state event) we need a locally stored shared key.
+ const password = getKeyForRoom(room.roomId);
+ if (!room.hasEncryptionStateEvent() && !password) {
+ // if we have a non encrypted room (no encryption state event) we need a locally stored shared key.
// in case this key also does not exists we cannot join the room.
return false;
}
diff --git a/src/index.css b/src/index.css
index aeeccaf4..dc914452 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,7 +1,7 @@
/*
Copyright 2021-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
@@ -45,6 +45,9 @@ layer(compound);
--small-drop-shadow: 0px 1.2px 2.4px 0px rgba(0, 0, 0, 0.15);
--subtle-drop-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
--background-gradient: url("graphics/backgroundGradient.svg");
+
+ --call-view-overlay-layer: 1;
+ --call-view-header-footer-layer: 2;
}
:root,
@@ -71,6 +74,13 @@ body {
-webkit-tap-highlight-color: transparent;
}
+/* This prohibits the view to scroll for pages smaller than 122px in width
+we use this for mobile pip webviews */
+.no-scroll-body {
+ position: fixed;
+ width: 100%;
+}
+
/* We use this to not render the page at all until we know the theme.*/
.no-theme {
opacity: 0;
@@ -100,7 +110,8 @@ body[data-platform="android"] {
}
body[data-platform="ios"] {
- --cpd-font-family-sans: -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
+ --cpd-font-family-sans:
+ -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
}
@layer compound-legacy {
diff --git a/src/initializer.test.ts b/src/initializer.test.ts
index 19f52b69..0e43ed1f 100644
--- a/src/initializer.test.ts
+++ b/src/initializer.test.ts
@@ -1,28 +1,162 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
-import { expect, test } from "vitest";
+import {
+ afterAll,
+ afterEach,
+ beforeAll,
+ beforeEach,
+ describe,
+ expect,
+ it,
+ vi,
+} from "vitest";
-import { Initializer } from "../src/initializer";
+import { mockConfig } from "./utils/test";
-test("initBeforeReact sets font family from URL param", async () => {
- window.location.hash = "#?font=DejaVu Sans";
- await Initializer.initBeforeReact();
- expect(
- getComputedStyle(document.documentElement).getPropertyValue(
- "--font-family",
- ),
- ).toBe('"DejaVu Sans"');
-});
-
-test("initBeforeReact sets font scale from URL param", async () => {
- window.location.hash = "#?fontScale=1.2";
- await Initializer.initBeforeReact();
- expect(
- getComputedStyle(document.documentElement).getPropertyValue("--font-scale"),
- ).toBe("1.2");
+const sentryInitSpy = vi.fn();
+
+// Place the mock after the spy is defined
+vi.mock("@sentry/react", () => ({
+ init: sentryInitSpy,
+ reactRouterV7BrowserTracingIntegration: vi.fn(),
+}));
+
+describe("Initializer", async () => {
+ // we import here to make sure that Sentry is mocked first
+ const { Initializer } = await import("./initializer.tsx");
+ describe("initBeforeReact()", () => {
+ it("sets font family from URL param", async () => {
+ window.location.hash = "#?font=DejaVu Sans";
+ await Initializer.initBeforeReact();
+ expect(
+ getComputedStyle(document.documentElement).getPropertyValue(
+ "--font-family",
+ ),
+ ).toBe('"DejaVu Sans"');
+ });
+
+ it("sets font scale from URL param", async () => {
+ window.location.hash = "#?fontScale=1.2";
+ await Initializer.initBeforeReact();
+ expect(
+ getComputedStyle(document.documentElement).getPropertyValue(
+ "--font-scale",
+ ),
+ ).toBe("1.2");
+ });
+ });
+
+ describe("init()", () => {
+ describe("sentry setup", () => {
+ describe("embedded package", () => {
+ beforeAll(() => {
+ vi.stubEnv("VITE_PACKAGE", "embedded");
+ });
+
+ beforeEach(() => {
+ mockConfig({});
+ window.location.hash = "#";
+ Initializer.reset();
+ });
+
+ afterEach(() => {
+ sentryInitSpy.mockClear();
+ });
+
+ afterAll(() => {
+ vi.unstubAllEnvs();
+ });
+
+ it("does not call Sentry.init() without config value", async () => {
+ await Initializer.init();
+ expect(sentryInitSpy).not.toHaveBeenCalled();
+ });
+
+ it("ignores config value and does not create instance", async () => {
+ mockConfig({
+ sentry: {
+ DSN: "https://config.example.com.localhost",
+ environment: "config",
+ },
+ });
+ await Initializer.init();
+ expect(sentryInitSpy).not.toHaveBeenCalled();
+ });
+
+ it("uses sentryDsn param if set", async () => {
+ window.location.hash = `#?sentryDsn=${encodeURIComponent("https://dsn.example.com.localhost")}`;
+ await Initializer.init();
+ expect(sentryInitSpy).toHaveBeenCalledWith(
+ expect.objectContaining({
+ dsn: "https://dsn.example.com.localhost",
+ environment: undefined,
+ }),
+ );
+ });
+
+ it("uses sentryDsn and sentryEnvironment params if set", async () => {
+ window.location.hash = `#?sentryDsn=${encodeURIComponent("https://dsn.example.com.localhost")}&sentryEnvironment=fooEnvironment`;
+ await Initializer.init();
+ expect(sentryInitSpy).toHaveBeenCalledWith(
+ expect.objectContaining({
+ dsn: "https://dsn.example.com.localhost",
+ environment: "fooEnvironment",
+ }),
+ );
+ });
+ });
+
+ describe("full package", () => {
+ beforeAll(() => {
+ vi.stubEnv("VITE_PACKAGE", "full");
+ });
+
+ beforeEach(() => {
+ mockConfig({});
+ window.location.hash = "#";
+ Initializer.reset();
+ });
+
+ afterEach(() => {
+ sentryInitSpy.mockClear();
+ });
+
+ afterAll(() => {
+ vi.unstubAllEnvs();
+ });
+
+ it("does not create instance without config value or URL param", async () => {
+ await Initializer.init();
+ expect(sentryInitSpy).not.toHaveBeenCalled();
+ });
+
+ it("ignores URL params and does not create instance", async () => {
+ window.location.hash = `#?sentryDsn=${encodeURIComponent("https://dsn.example.com.localhost")}&sentryEnvironment=fooEnvironment`;
+ await Initializer.init();
+ expect(sentryInitSpy).not.toHaveBeenCalled();
+ });
+
+ it("creates instance with config value", async () => {
+ mockConfig({
+ sentry: {
+ DSN: "https://dsn.example.com.localhost",
+ environment: "fooEnvironment",
+ },
+ });
+ await Initializer.init();
+ expect(sentryInitSpy).toHaveBeenCalledWith(
+ expect.objectContaining({
+ dsn: "https://dsn.example.com.localhost",
+ environment: "fooEnvironment",
+ }),
+ );
+ });
+ });
+ });
+ });
});
diff --git a/src/initializer.tsx b/src/initializer.tsx
index 46eb5952..d0797e9d 100644
--- a/src/initializer.tsx
+++ b/src/initializer.tsx
@@ -1,7 +1,7 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
@@ -14,7 +14,7 @@ import i18n, {
import { initReactI18next } from "react-i18next";
import LanguageDetector from "i18next-browser-languagedetector";
import * as Sentry from "@sentry/react";
-import { logger } from "matrix-js-sdk/src/logger";
+import { logger } from "matrix-js-sdk/lib/logger";
import { shouldPolyfill as shouldPolyfillSegmenter } from "@formatjs/intl-segmenter/should-polyfill";
import { shouldPolyfill as shouldPolyfillDurationFormat } from "@formatjs/intl-durationformat/should-polyfill";
import {
@@ -28,6 +28,7 @@ import { getUrlParams } from "./UrlParams";
import { Config } from "./config/Config";
import { ElementCallOpenTelemetry } from "./otel/otel";
import { platform } from "./Platform";
+import { isFailure } from "./utils/fetch";
// This generates a map of locale names to their URL (based on import.meta.url), which looks like this:
// {
@@ -79,7 +80,7 @@ const Backend = {
},
});
- if (!response.ok) {
+ if (isFailure(response)) {
throw Error(`Failed to fetch ${url}`);
}
@@ -108,11 +109,11 @@ class DependencyLoadStates {
}
export class Initializer {
- private static internalInstance: Initializer;
+ private static internalInstance: Initializer | undefined;
private isInitialized = false;
public static isInitialized(): boolean {
- return Initializer.internalInstance?.isInitialized;
+ return !!Initializer.internalInstance?.isInitialized;
}
public static async initBeforeReact(): Promise {
@@ -135,6 +136,11 @@ export class Initializer {
lookup: () => getUrlParams().lang ?? undefined,
});
+ // Synchronise the HTML lang attribute with the i18next language
+ i18n.on("languageChanged", (lng) => {
+ document.documentElement.lang = lng;
+ });
+
await i18n
.use(Backend)
.use(languageDetector)
@@ -192,11 +198,19 @@ export class Initializer {
Initializer.internalInstance.initPromise = new Promise((resolve) => {
// initStep calls itself recursively until everything is initialized in the correct order.
// Then the promise gets resolved.
- Initializer.internalInstance.initStep(resolve);
+ Initializer.internalInstance?.initStep(resolve);
});
return Initializer.internalInstance.initPromise;
}
+ /**
+ * Resets the initializer. This is used in tests to ensure that the initializer
+ * is re-initialized for each test.
+ */
+ public static reset(): void {
+ Initializer.internalInstance = undefined;
+ }
+
private loadStates = new DependencyLoadStates();
private initStep(resolve: (value: void | PromiseLike) => void): void {
@@ -219,12 +233,24 @@ export class Initializer {
this.loadStates.sentry === LoadState.None &&
this.loadStates.config === LoadState.Loaded
) {
- if (Config.get().sentry?.DSN && Config.get().sentry?.environment) {
+ let dsn: string | undefined;
+ let environment: string | undefined;
+ if (import.meta.env.VITE_PACKAGE === "embedded") {
+ // for the embedded package we always use the values from the URL as the widget host is responsible for analytics configuration
+ dsn = getUrlParams().sentryDsn ?? undefined;
+ environment = getUrlParams().sentryEnvironment ?? undefined;
+ }
+ if (import.meta.env.VITE_PACKAGE === "full") {
+ // in full package it is the server responsible for the analytics
+ dsn = Config.get().sentry?.DSN;
+ environment = Config.get().sentry?.environment;
+ }
+ if (dsn) {
Sentry.init({
- dsn: Config.get().sentry?.DSN,
- environment: Config.get().sentry?.environment,
+ dsn,
+ environment,
integrations: [
- Sentry.reactRouterV6BrowserTracingIntegration({
+ Sentry.reactRouterV7BrowserTracingIntegration({
useEffect: React.useEffect,
useLocation,
useNavigationType,
diff --git a/src/input/AvatarInputField.module.css b/src/input/AvatarInputField.module.css
index 3fe6b124..4213d7c1 100644
--- a/src/input/AvatarInputField.module.css
+++ b/src/input/AvatarInputField.module.css
@@ -1,7 +1,7 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
diff --git a/src/input/AvatarInputField.tsx b/src/input/AvatarInputField.tsx
index a4bccb27..4a3173b4 100644
--- a/src/input/AvatarInputField.tsx
+++ b/src/input/AvatarInputField.tsx
@@ -1,7 +1,7 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
diff --git a/src/input/FeedbackInput.module.css b/src/input/FeedbackInput.module.css
index 0a18f104..e931ba18 100644
--- a/src/input/FeedbackInput.module.css
+++ b/src/input/FeedbackInput.module.css
@@ -1,7 +1,7 @@
/*
Copyright 2023, 2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
diff --git a/src/input/Input.module.css b/src/input/Input.module.css
index cfe045c9..869416b6 100644
--- a/src/input/Input.module.css
+++ b/src/input/Input.module.css
@@ -1,7 +1,7 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
diff --git a/src/input/Input.tsx b/src/input/Input.tsx
index 761988ad..1f6d35e8 100644
--- a/src/input/Input.tsx
+++ b/src/input/Input.tsx
@@ -1,7 +1,7 @@
/*
Copyright 2022-2024 New Vector Ltd.
-SPDX-License-Identifier: AGPL-3.0-only
+SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE in the repository root for full details.
*/
@@ -9,9 +9,10 @@ import {
type ChangeEvent,
type FC,
type ForwardedRef,
- forwardRef,
type ReactNode,
useId,
+ type JSX,
+ type Ref,
} from "react";
import classNames from "classnames";
@@ -53,6 +54,7 @@ function Field({ children, className }: FieldProps): JSX.Element {
}
interface InputFieldProps {
+ ref?: Ref;
label?: string;
type: string;
prefix?: string;
@@ -77,88 +79,81 @@ interface InputFieldProps {
onChange?: (event: ChangeEvent) => void;
}
-export const InputField = forwardRef<
- HTMLInputElement | HTMLTextAreaElement,
- InputFieldProps
->(
- (
- {
- id,
- label,
- className,
- type,
- checked,
- prefix,
- suffix,
- description,
- disabled,
- min,
- ...rest
- },
- ref,
- ) => {
- const descriptionId = useId();
+export const InputField: FC = ({
+ ref,
+ id,
+ label,
+ className,
+ type,
+ checked,
+ prefix,
+ suffix,
+ description,
+ disabled,
+ min,
+ ...rest
+}) => {
+ const descriptionId = useId();
- return (
-
- {prefix && {prefix}}
- {type === "textarea" ? (
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
- // @ts-ignore
-
+