🐛(frontend) fix joined notification tile no longer rendering properly

The toast is enqueued on `ParticipantConnected`, which livekit-client fires before the participant's track publications exist. At that point `getTrackPublication(Camera)` is `undefined`, and the track ref used by the toast is frozen that way — the toast never re-subscribes to the participant. Downstream effects: * LiveKit's `useIsMuted` initializes to `false` when there is no publication, so the tile first paints with `data-lk-video-muted="false"`, which the stock CSS maps to placeholder `opacity: 0` — a blank box. * Its effect then subscribes to `mutedObserver`, which defaults to `true` for the same situation, triggering a second render and only then starting the 200 ms fade-in. That render-effect-render transition is the visible lag behind the text. * Because the track ref never updates, no `VideoTrack` ever mounts. When the camera is later subscribed, the placeholder fades out again, leaving the tile empty. Re-derive the track ref inside the toast when the participant's publications become available, so `useIsMuted` sees the real state from the start and the tile renders the video (or a stable placeholder) instead of a blank box.
🐛(frontend) hoist mute confirmation dialog to VideoConference level
2026-08-21 23:57:00 +00:00 · 2026-08-21 22:55:28 +02:00 · 2026-08-21 22:55:28 +02:00 · 2026-08-21 22:55:28 +02:00 · 2026-08-21 22:55:28 +02:00 · 2026-08-21 22:55:28 +02:00
20 changed files with 261 additions and 175 deletions
@@ -8,14 +8,29 @@ and this project adheres to

 ## [Unreleased]

+### Added
+
+- 📈(frontend) track errors when starting or stopping a recording
+
 ### Changed

 - ✨(backend) accept form-urlencoded on the user token endpoint
+- ✨(summary) configurable s3 region
+- ⬆️(frontend) upgrade i18next and react-i18next patch versions
+- ⬆️(frontend) upgrade posthog-js from 1.395.0 to 1.404.1
+- ⬆️(frontend) upgrade livekit-client and @livekit/components-react
+- 💄(frontend) increase the blur intensity

 ### Fixed

 - 📝(docs) fix minor typos in comments and docstrings
 - ⬆️(backend) bump sqlparse from 0.5.5 to 0.6.0
+- ⬆️(mail) bump @html-to/text-cli from 0.6.0 to 0.6.1
+- 🐛(frontend) treat client-initiated connect aborts as events
+- 🐛(frontend) use state instead of a ref for MoreControls container
+- 🐛(frontend) stop init_virtual_background from firing on blur updates
+- 🐛(frontend) hoist mute confirmation dialog to VideoConference level
+- 🐛(frontend) fix joined notification tile no longer rendering properly

 ## [1.27.0] - 2026-08-14

@@ -180,7 +180,7 @@ services:
    working_dir: /app

  node:
-    image: node:18
+    image: node:22
    user: "${DOCKER_USER:-1000}"
    environment:
      HOME: /tmp
@@ -12,7 +12,7 @@
        "@fontsource-variable/lexend": "5.2.11",
        "@fontsource/opendyslexic": "5.2.5",
        "@libreaudio/la-call": "0.1.4",
-        "@livekit/components-react": "2.9.21",
+        "@livekit/components-react": "2.9.23",
        "@livekit/components-styles": "1.2.0",
        "@livekit/track-processors": "0.7.2",
        "@mediapipe/tasks-vision": "0.10.14",
@@ -24,17 +24,17 @@
        "crisp-sdk-web": "1.1.2",
        "hoofd": "1.7.3",
        "humanize-duration": "3.33.2",
-        "i18next": "26.3.1",
+        "i18next": "26.3.6",
        "i18next-browser-languagedetector": "8.2.1",
        "i18next-parser": "9.4.0",
        "i18next-resources-to-backend": "1.2.1",
-        "livekit-client": "2.20.0",
-        "posthog-js": "1.395.0",
+        "livekit-client": "2.21.0",
+        "posthog-js": "1.404.1",
        "react": "18.3.1",
        "react-aria": "3.50.0",
        "react-aria-components": "1.19.0",
        "react-dom": "18.3.1",
-        "react-i18next": "17.0.8",
+        "react-i18next": "17.0.10",
        "react-stately": "3.48.0",
        "use-sound": "5.0.0",
        "valtio": "2.3.2",
@@ -742,28 +742,28 @@
      }
    },
    "node_modules/@floating-ui/core": {
-      "version": "1.7.5",
-      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.5.tgz",
-      "integrity": "sha512-1Ih4WTWyw0+lKyFMcBHGbb5U5FtuHJuujoyyr5zTaWS5EYMeT6Jb2AuDeftsCsEuchO+mM2ij5+q9crhydzLhQ==",
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.8.0.tgz",
+      "integrity": "sha512-0CIZ5itps/8x7BG8dEIhs53BvCUH2PCoogtakwRTut+Arm58sJooJ0AuZhLw2HJYIR5cMLNPBSS728sPho2khQ==",
      "license": "MIT",
      "dependencies": {
-        "@floating-ui/utils": "^0.2.11"
+        "@floating-ui/utils": "^0.2.12"
      }
    },
    "node_modules/@floating-ui/dom": {
-      "version": "1.7.4",
-      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.4.tgz",
-      "integrity": "sha512-OOchDgh4F2CchOX94cRVqhvy7b3AFb+/rQXyswmzmGakRfkMgoWVjfnLWkRirfLEfuD4ysVW16eXzwt3jHIzKA==",
+      "version": "1.7.6",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.6.tgz",
+      "integrity": "sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==",
      "license": "MIT",
      "dependencies": {
-        "@floating-ui/core": "^1.7.3",
-        "@floating-ui/utils": "^0.2.10"
+        "@floating-ui/core": "^1.7.5",
+        "@floating-ui/utils": "^0.2.11"
      }
    },
    "node_modules/@floating-ui/utils": {
-      "version": "0.2.11",
-      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.11.tgz",
-      "integrity": "sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==",
+      "version": "0.2.12",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.12.tgz",
+      "integrity": "sha512-HpCo8tmWzLVad5s2d19EhAz5zqrrQ6s69qd6moPMQvkOuSwDT1YgRfWSVuc4ennqrgv3OHppiOGMQ7oC13yIww==",
      "license": "MIT"
    },
    "node_modules/@fontsource-variable/atkinson-hyperlegible-next": {
@@ -966,12 +966,12 @@
      "license": "GPL-3.0+"
    },
    "node_modules/@livekit/components-core": {
-      "version": "0.12.13",
-      "resolved": "https://registry.npmjs.org/@livekit/components-core/-/components-core-0.12.13.tgz",
-      "integrity": "sha512-DQmi84afHoHjZ62wm8y+XPNIDHTwFHAltjd3lmyXj8UZHOY7wcza4vFt1xnghJOD5wLRY58L1dkAgAw59MgWvw==",
+      "version": "0.12.14",
+      "resolved": "https://registry.npmjs.org/@livekit/components-core/-/components-core-0.12.14.tgz",
+      "integrity": "sha512-6OKP/1Ok2fCZewDLKd3SzaTb7KvfZl/6hjggI+TgUdhp0Y7HBg3+tHA7YmhZRc0BO8wIyVy4VgTPn7qkLHt2nQ==",
      "license": "Apache-2.0",
      "dependencies": {
-        "@floating-ui/dom": "1.7.4",
+        "@floating-ui/dom": "1.7.6",
        "loglevel": "1.9.1",
        "rxjs": "7.8.2"
      },
@@ -979,17 +979,17 @@
        "node": ">=18"
      },
      "peerDependencies": {
-        "livekit-client": "^2.17.2",
+        "livekit-client": "^2.20.1",
        "tslib": "^2.6.2"
      }
    },
    "node_modules/@livekit/components-react": {
-      "version": "2.9.21",
-      "resolved": "https://registry.npmjs.org/@livekit/components-react/-/components-react-2.9.21.tgz",
-      "integrity": "sha512-6hU9VucJJL+gAhilNGe4MBCDCZVk64qyjP9Ck86krvOIdVU76WeWksddg1MYUP10AlUwwrfD7davz41pJTcMJw==",
+      "version": "2.9.23",
+      "resolved": "https://registry.npmjs.org/@livekit/components-react/-/components-react-2.9.23.tgz",
+      "integrity": "sha512-clO+0g/u3YBpuOvnAjUSAJBH/o7w+RpUAseswjiSML9rHrXlTUhwBNm8LPk+qN5GOU3A6lzsNnFYVpUHUBVOkg==",
      "license": "Apache-2.0",
      "dependencies": {
-        "@livekit/components-core": "0.12.13",
+        "@livekit/components-core": "0.12.14",
        "clsx": "2.1.1",
        "events": "^3.3.0",
        "jose": "^6.0.12",
@@ -999,8 +999,8 @@
        "node": ">=18"
      },
      "peerDependencies": {
-        "@livekit/krisp-noise-filter": "^0.2.12 || ^0.3.0",
-        "livekit-client": "^2.18.2",
+        "@livekit/krisp-noise-filter": "^0.2.12 || ^0.3.0 || ^0.4.0",
+        "livekit-client": "^2.20.1",
        "react": ">=18",
        "react-dom": ">=18",
        "tslib": "^2.6.2"
@@ -1027,9 +1027,9 @@
      "license": "Apache-2.0"
    },
    "node_modules/@livekit/protocol": {
-      "version": "1.46.6",
-      "resolved": "https://registry.npmjs.org/@livekit/protocol/-/protocol-1.46.6.tgz",
-      "integrity": "sha512-upzlHP1vi/kZ/QqALZTFskQ0ifqc2f15RKucHYOsIHJsaXvEYanG75mAb7o+Yomfs4XhQ4BaRsdY+TFHXpaqrg==",
+      "version": "1.50.4",
+      "resolved": "https://registry.npmjs.org/@livekit/protocol/-/protocol-1.50.4.tgz",
+      "integrity": "sha512-L1uggNQAqyY21smQY8AllyOYbcv9Me9TaxwuLytL1R8ck9nbYPmQLNwEDi3pOFGAMa5F8I2nUi2Jc59W5awxlA==",
      "license": "Apache-2.0",
      "dependencies": {
        "@bufbuild/protobuf": "^1.10.0"
@@ -1720,18 +1720,18 @@
      "license": "MIT"
    },
    "node_modules/@posthog/core": {
-      "version": "1.39.5",
-      "resolved": "https://registry.npmjs.org/@posthog/core/-/core-1.39.5.tgz",
-      "integrity": "sha512-M8Imv7ZmmrT6derMOFXhX3c5VKKO2oG6OX70ozLnNpKJV73sNIhYmRX/raa90saF7OA0YmWWJlpKje3irGAyQQ==",
+      "version": "1.48.3",
+      "resolved": "https://registry.npmjs.org/@posthog/core/-/core-1.48.3.tgz",
+      "integrity": "sha512-kwVDVvwtCTXctApA2tpnwDjDDan8LrkwCW1Wv6PABaVs/s5ahbQ9W3pvdXcqr71HCuqukSA1jp7MySczebubGg==",
      "license": "MIT",
      "dependencies": {
-        "@posthog/types": "^1.392.0"
+        "@posthog/types": "^1.405.0"
      }
    },
    "node_modules/@posthog/types": {
-      "version": "1.392.0",
-      "resolved": "https://registry.npmjs.org/@posthog/types/-/types-1.392.0.tgz",
-      "integrity": "sha512-nctNujXL3FC1v99FktaTMSugSD9ZOZekEpahUSafkU2TSvW+XGKNkQZbokuJtiWvPBK208dwMJva8UfBkChqpw==",
+      "version": "1.405.0",
+      "resolved": "https://registry.npmjs.org/@posthog/types/-/types-1.405.0.tgz",
+      "integrity": "sha512-4rZ/taVXKQxs9Jrf7ZjlCRgrOSL69oKAgIWJQa5kRNJ6wll1UANbrJTSY+Su1e88LIG4zZVjKKKjyQHCkHdHcw==",
      "license": "MIT"
    },
    "node_modules/@react-aria/overlays": {
@@ -4393,11 +4393,14 @@
      }
    },
    "node_modules/core-js": {
-      "version": "3.39.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.39.0.tgz",
-      "integrity": "sha512-raM0ew0/jJUqkJ0E6e8UDtl+y/7ktFivgWvqw8dNSQeNWoSDLvQ1H/RN3aPXB9tBd4/FhyR4RDPGhsNIMsAn7g==",
+      "version": "3.50.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.50.0.tgz",
+      "integrity": "sha512-BRWgOLKkFeCgRudR6zrs8p9XJZcE14grzKMMssoYrk6krtuEZ7MTKPIY5RzOnqsEKIR9kst7wNzphttraT+Yqw==",
      "hasInstallScript": true,
      "license": "MIT",
+      "engines": {
+        "node": "*"
+      },
      "funding": {
        "type": "opencollective",
        "url": "https://opencollective.com/core-js"
@@ -6400,9 +6403,9 @@
      }
    },
    "node_modules/i18next": {
-      "version": "26.3.1",
-      "resolved": "https://registry.npmjs.org/i18next/-/i18next-26.3.1.tgz",
-      "integrity": "sha512-txQqd5EULsqEh9OJqRH15aCaOuy/nLJyhw5EHCSKLKJE1aBbb3Zve2+uQIxgWhPm1QqUQoWyQBm2kfmmIrzkcQ==",
+      "version": "26.3.6",
+      "resolved": "https://registry.npmjs.org/i18next/-/i18next-26.3.6.tgz",
+      "integrity": "sha512-Bu5Z2nAXgfVyM8xvW3jk9EKRIuX37PudsrBViThNFx7CR7aaYTpP01cxNB/E4c4UUzTDiAZRstEhsRfPOL/8xA==",
      "funding": [
        {
          "type": "individual",
@@ -6419,7 +6422,7 @@
      ],
      "license": "MIT",
      "peerDependencies": {
-        "typescript": "^5 || ^6"
+        "typescript": "^5 || ^6 || ^7"
      },
      "peerDependenciesMeta": {
        "typescript": {
@@ -8109,20 +8112,20 @@
      "license": "MIT"
    },
    "node_modules/livekit-client": {
-      "version": "2.20.0",
-      "resolved": "https://registry.npmjs.org/livekit-client/-/livekit-client-2.20.0.tgz",
-      "integrity": "sha512-RIJcpvBmOmwz3jTj3rmdY6Dzr55HrhcaJjMgY+HSmoEM+yIRyA40m7r8UKv0hnZWM3z/AYhP1q8C8ciz5UWFKQ==",
+      "version": "2.21.0",
+      "resolved": "https://registry.npmjs.org/livekit-client/-/livekit-client-2.21.0.tgz",
+      "integrity": "sha512-RBUhPkV/sl1nzl8lokVlK5uATPwn0AlsudCBZXissw/kDl9yz8ac4pNJ43iPpMVoHOeBYH/BZ3vUC1adqa/zFQ==",
      "license": "Apache-2.0",
      "dependencies": {
        "@livekit/mutex": "1.1.1",
-        "@livekit/protocol": "1.46.6",
+        "@livekit/protocol": "1.50.4",
        "events": "^3.3.0",
        "jose": "^6.1.0",
        "loglevel": "^1.9.2",
        "sdp-transform": "^2.15.0",
        "tslib": "2.8.1",
        "typed-emitter": "^2.1.0",
-        "webrtc-adapter": "9.0.5"
+        "webrtc-adapter": "9.0.6"
      },
      "peerDependencies": {
        "@types/dom-mediacapture-record": "^1"
@@ -9120,17 +9123,17 @@
      "license": "MIT"
    },
    "node_modules/posthog-js": {
-      "version": "1.395.0",
-      "resolved": "https://registry.npmjs.org/posthog-js/-/posthog-js-1.395.0.tgz",
-      "integrity": "sha512-5iTb00CGt2eQUUiBQysQiX89RAbCN6wK2sDNzvs9zv0alaY8mJ0ZySrUD3LQ+XyLhgM5pCpacBuUwChqiYDLDw==",
-      "license": "SEE LICENSE IN LICENSE",
+      "version": "1.404.1",
+      "resolved": "https://registry.npmjs.org/posthog-js/-/posthog-js-1.404.1.tgz",
+      "integrity": "sha512-ck/HOMKuZ6yefUk5OX+h2s9mUWBsnu0mGDUAWjIwAmQQrloZPShzOhOWuEuZQuMnCKORBFRVGsBAuzsl66cBJA==",
+      "license": "(Apache-2.0 AND MIT)",
      "dependencies": {
-        "@posthog/core": "^1.38.0",
-        "@posthog/types": "^1.391.1",
-        "core-js": "^3.38.1",
+        "@posthog/core": "^1.43.1",
+        "@posthog/types": "^1.397.0",
+        "core-js": "^3.49.0",
        "dompurify": "^3.3.2",
        "fflate": "^0.4.8",
-        "preact": "^10.29.2",
+        "preact": "^10.29.3",
        "query-selector-shadow-dom": "^1.0.1",
        "web-vitals": "^5.3.0"
      }
@@ -9422,9 +9425,9 @@
      }
    },
    "node_modules/react-i18next": {
-      "version": "17.0.8",
-      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-17.0.8.tgz",
-      "integrity": "sha512-0ooKbGLU8JXhe1zwpQUWIeXSgLPOfwJmgheWRIUpcoA0CpyabpGhayjdG+/eA5esC1AQ8h2jWpXjJfzQzeDOCw==",
+      "version": "17.0.10",
+      "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-17.0.10.tgz",
+      "integrity": "sha512-XneHftyYA774MJkkccSkZ5oKrUpCnXIPmxio3wemqrVzCRLWiGXOMbIzObrer03fNDEnm8g8R5yYls4HcE+esg==",
      "license": "MIT",
      "dependencies": {
        "@babel/runtime": "^7.29.2",
@@ -9434,7 +9437,7 @@
      "peerDependencies": {
        "i18next": ">= 26.2.0",
        "react": ">= 16.8.0",
-        "typescript": "^5 || ^6"
+        "typescript": "^5 || ^6 || ^7"
      },
      "peerDependenciesMeta": {
        "react-dom": {
@@ -11645,9 +11648,9 @@
      "license": "Apache-2.0"
    },
    "node_modules/webrtc-adapter": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-9.0.5.tgz",
-      "integrity": "sha512-U9vjByy/sK2OMXu5mmfuZFKTMIUQe34c0JXRO+oDrxJTsntdYT2iIFwYMOV7HhMTuktcZLGf2W1N/OcSf9ssWg==",
+      "version": "9.0.6",
+      "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-9.0.6.tgz",
+      "integrity": "sha512-CHbl2ZQbxx164IgWRgzJno4hWtM4tFbRam1QfI3Yxhs3w/DvqluVxVWeXs3oL5/fbGkSNLKo0Ty5MgUWceNhog==",
      "license": "BSD-3-Clause",
      "dependencies": {
        "sdp": "^3.2.0"
@@ -19,7 +19,7 @@
    "@fontsource-variable/lexend": "5.2.11",
    "@fontsource/opendyslexic": "5.2.5",
    "@libreaudio/la-call": "0.1.4",
-    "@livekit/components-react": "2.9.21",
+    "@livekit/components-react": "2.9.23",
    "@livekit/components-styles": "1.2.0",
    "@livekit/track-processors": "0.7.2",
    "@mediapipe/tasks-vision": "0.10.14",
@@ -31,17 +31,17 @@
    "crisp-sdk-web": "1.1.2",
    "hoofd": "1.7.3",
    "humanize-duration": "3.33.2",
-    "i18next": "26.3.1",
+    "i18next": "26.3.6",
    "i18next-browser-languagedetector": "8.2.1",
    "i18next-parser": "9.4.0",
    "i18next-resources-to-backend": "1.2.1",
-    "livekit-client": "2.20.0",
-    "posthog-js": "1.395.0",
+    "livekit-client": "2.21.0",
+    "posthog-js": "1.404.1",
    "react": "18.3.1",
    "react-aria": "3.50.0",
    "react-aria-components": "1.19.0",
    "react-dom": "18.3.1",
-    "react-i18next": "17.0.8",
+    "react-i18next": "17.0.10",
    "react-stately": "3.48.0",
    "use-sound": "5.0.0",
    "valtio": "2.3.2",
@@ -1,5 +1,5 @@
 import { useToast } from 'react-aria'
-import { useRef } from 'react'
+import { useMemo, useRef } from 'react'
 import { Button as RACButton } from 'react-aria-components'
 import { Track } from 'livekit-client'
 import Source = Track.Source
@@ -11,6 +11,7 @@ import { Div } from '@/primitives'
 import { useTranslation } from 'react-i18next'
 import { StyledToastContainer } from './StyledToastContainer'
 import { setPinnedTrack } from '@/stores/layout'
+import { useParticipantTracks } from '@livekit/components-react'

 const ClickableToast = styled(RACButton, {
  base: {
@@ -30,13 +31,17 @@ export function ToastJoined({ state, ...props }: Readonly<ToastProps>) {
  )
  const participant = props.toast.content.participant

-  if (!participant) return
+  const [cameraTrack] = useParticipantTracks(
+    [Source.Camera],
+    participant?.identity
+  )

-  const trackReference = {
-    participant,
-    publication: participant.getTrackPublication(Source.Camera),
-    source: Source.Camera,
-  }
+  const trackReference = useMemo(
+    () => cameraTrack ?? { participant, source: Source.Camera },
+    [cameraTrack, participant]
+  )
+
+  if (!participant) return

  return (
    <StyledToastContainer {...toastProps} ref={ref}>
@@ -1,11 +1,9 @@
 import { Participant, Track } from 'livekit-client'
 import { useTranslation } from 'react-i18next'
 import { useTrackMutedIndicator } from '@livekit/components-react'
-import { useMuteParticipant } from '@/features/rooms/api/muteParticipant'
-import { useState } from 'react'
 import { Button } from '@/primitives'
 import { RiMicLine, RiMicOffLine } from '@remixicon/react'
-import { MuteAlertDialog } from '@/features/rooms/livekit/components/MuteAlertDialog'
+import { openMuteDialog } from '@/stores/muteDialog'

 export const MuteButton = ({ participant }: { participant: Participant }) => {
  const { t } = useTranslation('rooms', { keyPrefix: 'participantTileFocus' })
@@ -15,31 +13,18 @@ export const MuteButton = ({ participant }: { participant: Participant }) => {
    source: Track.Source.Microphone,
  })

-  const { muteParticipant } = useMuteParticipant()
-  const [isAlertOpen, setIsAlertOpen] = useState(false)
-
  const name = participant.name || participant.identity

  return (
-    <>
-      <Button
-        isDisabled={isMuted}
-        size={'sm'}
-        variant={'primaryTextDark'}
-        square
-        onPress={() => setIsAlertOpen(true)}
-        tooltip={t('muteParticipant', { name })}
-      >
-        {!isMuted ? <RiMicLine /> : <RiMicOffLine />}
-      </Button>
-      <MuteAlertDialog
-        isOpen={isAlertOpen}
-        onSubmit={() =>
-          muteParticipant(participant).then(() => setIsAlertOpen(false))
-        }
-        onClose={() => setIsAlertOpen(false)}
-        name={name}
-      />
-    </>
+    <Button
+      isDisabled={isMuted}
+      size={'sm'}
+      variant={'primaryTextDark'}
+      square
+      onPress={() => openMuteDialog(participant)}
+      tooltip={t('muteParticipant', { name })}
+    >
+      {!isMuted ? <RiMicLine /> : <RiMicOffLine />}
+    </Button>
  )
 }
@@ -19,13 +19,11 @@ import {
 import Source = Track.Source
 import { RiMicFill, RiMicOffFill } from '@remixicon/react'
 import { Button } from '@/primitives'
-import { useState } from 'react'
-import { useMuteParticipant } from '@/features/rooms/api/muteParticipant'
 import { useCanMute } from '@/features/rooms/livekit/hooks/useCanMute'
 import { ParticipantMenuButton } from './menu/ParticipantMenuButton'
 import { PinBadge } from './PinBadge'
 import { UnauthenticatedBadge } from './UnauthenticatedBadge'
-import { MuteAlertDialog } from '@/features/rooms/livekit/components/MuteAlertDialog'
+import { openMuteDialog } from '@/stores/muteDialog'
 import { ParticipantName } from './ParticipantName'

 type MicIndicatorProps = {
@@ -34,7 +32,6 @@ type MicIndicatorProps = {

 const MicIndicator = ({ participant }: MicIndicatorProps) => {
  const { t } = useTranslation('rooms')
-  const { muteParticipant } = useMuteParticipant()
  const { isMuted } = useTrackMutedIndicator({
    participant: participant,
    source: Source.Microphone,
@@ -42,7 +39,6 @@ const MicIndicator = ({ participant }: MicIndicatorProps) => {

  const canMute = useCanMute(participant)
  const isSpeaking = useIsSpeaking(participant)
-  const [isAlertOpen, setIsAlertOpen] = useState(false)
  const name = participant.name || participant.identity

  const label = isLocal(participant)
@@ -52,46 +48,34 @@ const MicIndicator = ({ participant }: MicIndicatorProps) => {
      })

  return (
-    <>
-      <Button
-        square
-        variant="greyscale"
-        size="sm"
-        tooltip={label}
-        aria-label={label}
-        isDisabled={isMuted || !canMute}
-        onPress={async () =>
-          !isMuted && isLocal(participant)
-            ? await (participant as LocalParticipant)?.setMicrophoneEnabled(
-                false
-              )
-            : setIsAlertOpen(true)
-        }
-        data-attr="participants-mute"
-      >
-        {isMuted ? (
-          <RiMicOffFill color={'gray'} aria-hidden={true} />
-        ) : (
-          <RiMicFill
-            className={css({
-              color: isSpeaking ? 'primaryDark.300' : 'primaryDark.50',
-              animation: isSpeaking
-                ? 'pulse_background 800ms infinite'
-                : undefined,
-            })}
-            aria-hidden={true}
-          />
-        )}
-      </Button>
-      <MuteAlertDialog
-        isOpen={isAlertOpen}
-        onSubmit={() =>
-          muteParticipant(participant).then(() => setIsAlertOpen(false))
-        }
-        onClose={() => setIsAlertOpen(false)}
-        name={name}
-      />
-    </>
+    <Button
+      square
+      variant="greyscale"
+      size="sm"
+      tooltip={label}
+      aria-label={label}
+      isDisabled={isMuted || !canMute}
+      onPress={async () =>
+        !isMuted && isLocal(participant)
+          ? await (participant as LocalParticipant)?.setMicrophoneEnabled(false)
+          : openMuteDialog(participant)
+      }
+      data-attr="participants-mute"
+    >
+      {isMuted ? (
+        <RiMicOffFill color={'gray'} aria-hidden={true} />
+      ) : (
+        <RiMicFill
+          className={css({
+            color: isSpeaking ? 'primaryDark.300' : 'primaryDark.50',
+            animation: isSpeaking
+              ? 'pulse_background 800ms infinite'
+              : undefined,
+          })}
+          aria-hidden={true}
+        />
+      )}
+    </Button>
  )
 }

@@ -1,17 +1,20 @@
 import { useStartRecording, useStopRecording } from '@/features/recording'
 import { recordingStore } from '@/stores/recording'
+import { captureEvent } from '@/features/analytics/telemetry'

 export const useMutateRecording = () => {
  const { mutateAsync: startRecording, isPending: isPendingToStart } =
    useStartRecording({
      onError: () => {
        recordingStore.isErrorDialogOpen = 'start'
+        captureEvent('error-starting-recording')
      },
    })
  const { mutateAsync: stopRecording, isPending: isPendingToStop } =
    useStopRecording({
      onError: () => {
        recordingStore.isErrorDialogOpen = 'stop'
+        captureEvent('error-stopping-recording')
      },
    })

@@ -6,6 +6,8 @@ import {
  usePersistentUserChoices,
 } from '@livekit/components-react'
 import {
+  ConnectionError,
+  ConnectionErrorReason,
  DisconnectReason,
  MediaDeviceFailure,
  Room,
@@ -25,7 +27,11 @@ import { VideoConference } from '../livekit/prefabs/VideoConference'
 import { css } from '@/styled-system/css'
 import { BackgroundProcessorFactory } from '../livekit/components/blur'
 import { LocalUserChoices } from '@/stores/userChoices'
-import { captureMediaEvent, reportError } from '@/features/analytics/telemetry'
+import {
+  captureEvent,
+  captureMediaEvent,
+  reportError,
+} from '@/features/analytics/telemetry'
 import { useConfig } from '@/api/useConfig'
 import { isFireFox } from '@/utils/livekit'
 import { useIsMobile } from '@/utils/useIsMobile'
@@ -227,6 +233,16 @@ export const Conference = ({
          onError={(e) => {
            const failure = MediaDeviceFailure.getFailure(e)
            if (failure && failure !== MediaDeviceFailure.Other) return
+
+            // connect() was aborted by a disconnect() before the join completed
+            if (
+              e instanceof ConnectionError &&
+              e.reason === ConnectionErrorReason.Cancelled
+            ) {
+              void captureEvent('connection-cancelled')
+              return
+            }
+
            reportError('livekit_room_error', e, {
              path: 'connect_publish',
            })
@@ -0,0 +1,28 @@
+import { useRef } from 'react'
+import { useSnapshot } from 'valtio'
+import { useMuteParticipant } from '@/features/rooms/api/muteParticipant'
+import { closeMuteDialog, muteDialogStore } from '@/stores/muteDialog'
+import { MuteAlertDialog } from './MuteAlertDialog'
+
+export const MuteAlertDialogProvider = () => {
+  const { participant } = useSnapshot(muteDialogStore)
+  const { muteParticipant } = useMuteParticipant()
+
+  const lastNameRef = useRef('')
+  if (participant) {
+    lastNameRef.current = participant.name || participant.identity
+  }
+
+  return (
+    <MuteAlertDialog
+      isOpen={!!participant}
+      name={lastNameRef.current}
+      onClose={closeMuteDialog}
+      onSubmit={() => {
+        const target = muteDialogStore.participant
+        if (!target) return
+        muteParticipant(target).then(closeMuteDialog)
+      }}
+    />
+  )
+}
@@ -105,9 +105,7 @@ export class BackgroundCustomProcessor implements BackgroundProcessorInterface {

  _initVirtualBackgroundImage() {
    if (this.options.type !== 'virtual') {
-      throw new Error(
-        'Virtual background is only supported for virtual background'
-      )
+      return
    }

    const needsUpdate =
@@ -37,8 +37,8 @@ import { reportError } from '@/features/analytics/telemetry'

 enum BlurRadius {
  NONE = 0,
-  LIGHT = 5,
-  NORMAL = 10,
+  LIGHT = 10,
+  NORMAL = 20,
 }

 const isSupported = BackgroundProcessorFactory.isSupported()
@@ -9,7 +9,7 @@ import { SubtitlesToggle } from '../../components/controls/SubtitlesToggle'
 import { OptionsButton } from '../../components/controls/Options/OptionsButton'
 import { StartMediaButton } from '../../components/controls/StartMediaButton'
 import { MoreOptions } from './MoreOptions'
-import { useRef } from 'react'
+import { RefObject, useMemo, useState } from 'react'
 import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut'
 import { useFullScreen } from '../../hooks/useFullScreen'
 import { VideoDeviceControl } from '../../components/controls/Device/VideoDeviceControl'
@@ -21,7 +21,14 @@ export function DesktopControlBar({
  onDeviceError,
 }: Readonly<ControlBarAuxProps>) {
  const browserSupportsScreenSharing = supportsScreenSharing()
-  const desktopControlBarEl = useRef<HTMLDivElement>(null)
+
+  const [controlBarElement, setControlBarElement] =
+    useState<HTMLDivElement | null>(null)
+
+  const desktopControlBarEl = useMemo<RefObject<HTMLDivElement>>(
+    () => ({ current: controlBarElement }),
+    [controlBarElement]
+  )

  const { toggleFullScreen, isFullscreenAvailable } = useFullScreen({})

@@ -45,7 +52,7 @@ export function DesktopControlBar({

  return (
    <div
-      ref={desktopControlBarEl}
+      ref={setControlBarElement}
      className={css({
        width: '100vw',
        display: 'flex',
@@ -19,6 +19,7 @@ import { RoomMetadataSynchronizer } from '../components/RoomMetadataSynchronizer
 import { useNoiseReduction } from '../hooks/useNoiseReduction'
 import { VideoResolutionSubscription } from '../components/VideoResolutionSubscription'
 import { SettingsDialogProvider } from '@/features/settings/components/SettingsDialogProvider'
+import { MuteAlertDialogProvider } from '@/features/rooms/livekit/components/MuteAlertDialogProvider'
 import { IsIdleDisconnectModal } from '../components/IsIdleDisconnectModal'
 import { ReactionPortals } from '@/features/reactions/components/ReactionPortals'
 import { RoomContentArea } from '@/features/layout/components/RoomContentArea'
@@ -144,6 +145,7 @@ export function VideoConference({ ...props }: VideoConferenceProps) {
        <ConnectionStateToast />
        <RecordingProvider />
        <SettingsDialogProvider />
+        <MuteAlertDialogProvider />
        <ReactionPortals />
      </div>
    </>
@@ -0,0 +1,18 @@
+import { proxy, ref } from 'valtio'
+import type { Participant } from 'livekit-client'
+
+type State = {
+  participant: Participant | null
+}
+
+export const muteDialogStore = proxy<State>({
+  participant: null,
+})
+
+export const openMuteDialog = (participant: Participant) => {
+  muteDialogStore.participant = ref(participant)
+}
+
+export const closeMuteDialog = () => {
+  muteDialogStore.participant = null
+}
@@ -5,16 +5,26 @@ import { visualizer } from 'rollup-plugin-visualizer'
 import svgr from 'vite-plugin-svgr'
 import { viteStaticCopy } from 'vite-plugin-static-copy'

-const mediapipeVersion: string = JSON.parse(
-  readFileSync(
-    new URL(
-      './node_modules/@mediapipe/tasks-vision/package.json',
-      import.meta.url
-    ),
-    'utf-8'
-  )
+const readPackageJson = (path: string) =>
+  JSON.parse(readFileSync(new URL(path, import.meta.url), 'utf-8'))
+
+const mediapipeVersion: string = readPackageJson(
+  './node_modules/@mediapipe/tasks-vision/package.json'
 ).version

+const livekitMediapipeVersion: string = readPackageJson(
+  './node_modules/@livekit/track-processors/package.json'
+).dependencies['@mediapipe/tasks-vision']
+
+if (mediapipeVersion !== livekitMediapipeVersion) {
+  throw new Error(
+    `@mediapipe/tasks-vision@${mediapipeVersion} is installed, but ` +
+      `@livekit/track-processors declares "${livekitMediapipeVersion}". ` +
+      `The two must stay in sync: pin "@mediapipe/tasks-vision" to ` +
+      `"${livekitMediapipeVersion}" in package.json.`
+  )
+}
+
 // https://vitejs.dev/config/
 export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd())
@@ -9,7 +9,7 @@
      "version": "1.27.0",
      "license": "MIT",
      "dependencies": {
-        "@html-to/text-cli": "0.6.0",
+        "@html-to/text-cli": "0.6.1",
        "mjml": "5.4.0"
      }
    },
@@ -52,14 +52,14 @@
      "license": "MIT"
    },
    "node_modules/@html-to/text-cli": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/@html-to/text-cli/-/text-cli-0.6.0.tgz",
-      "integrity": "sha512-JwlrCBccUM/QkUpc37P+qG+hpkXRbWOVcHd9vM+5D+O82Ak2p8anGRxisr33//aJzlkYNKNg2I8LDh3Bx2tBPg==",
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/@html-to/text-cli/-/text-cli-0.6.1.tgz",
+      "integrity": "sha512-fnbLS8bra4BkGinXWzUKfalqLPYmz8E2ABT+TgHUZ4inhAUYF2rBEEctOKqZ6FgaJF1iZ//KBBLKVz6nm3RbhA==",
      "license": "MIT",
      "dependencies": {
        "@selderee/plugin-htmlparser2": "~0.12.0",
        "aspargvs": "~0.7.0",
-        "deepmerge-ts": "^7.1.5",
+        "deepmerge-ts": "^8.0.1",
        "htmlparser2": "^10.1.0",
        "selderee": "~0.12.0"
      },
@@ -656,9 +656,19 @@
      "license": "CC0-1.0"
    },
    "node_modules/deepmerge-ts": {
-      "version": "7.1.5",
-      "resolved": "https://registry.npmjs.org/deepmerge-ts/-/deepmerge-ts-7.1.5.tgz",
-      "integrity": "sha512-HOJkrhaYsweh+W+e74Yn7YStZOilkoPb6fycpwNLKzSPtruFs48nYis0zy5yJz1+ktUhHxoRDJ27RQAWLIJVJw==",
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/deepmerge-ts/-/deepmerge-ts-8.0.1.tgz",
+      "integrity": "sha512-szCXE7YLCvLKR9bFPJcvsezOShdalctSvrgN/LM/QGUEPZQajwjmsMObZ6/DuANT5lxzM/wtO8Feubwdkz8myA==",
+      "funding": [
+        {
+          "type": "ko-fi",
+          "url": "https://ko-fi.com/rebeccastevens"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/deepmerge-ts"
+        }
+      ],
      "license": "BSD-3-Clause",
      "engines": {
        "node": ">=16.0.0"
@@ -4,7 +4,7 @@
  "description": "An util to generate html and text django's templates from mjml templates",
  "type": "module",
  "dependencies": {
-    "@html-to/text-cli": "0.6.0",
+    "@html-to/text-cli": "0.6.1",
    "mjml": "5.4.0"
  },
  "private": true,
@@ -83,6 +83,7 @@ class Settings(BaseSettings):
    aws_s3_access_key_id: str
    aws_s3_secret_access_key: SecretStr
    aws_s3_secure_access: bool = True
+    aws_s3_region_name: str | None = None
    aws_transcript_path: str = "transcripts"
    aws_summary_path: str = "summaries"

@@ -282,6 +282,7 @@ class FileService:
            access_key=settings.aws_s3_access_key_id,
            secret_key=settings.aws_s3_secret_access_key.get_secret_value(),
            secure=settings.aws_s3_secure_access,
+            region=settings.aws_s3_region_name,
        )

        self._bucket_name = settings.aws_storage_bucket_name
Author	SHA1	Message	Date
lebaudantoine	e5f0b1c202	🐛(frontend) fix joined notification tile no longer rendering properly The toast is enqueued on `ParticipantConnected`, which livekit-client fires before the participant's track publications exist. At that point `getTrackPublication(Camera)` is `undefined`, and the track ref used by the toast is frozen that way — the toast never re-subscribes to the participant. Downstream effects: * LiveKit's `useIsMuted` initializes to `false` when there is no publication, so the tile first paints with `data-lk-video-muted="false"`, which the stock CSS maps to placeholder `opacity: 0` — a blank box. * Its effect then subscribes to `mutedObserver`, which defaults to `true` for the same situation, triggering a second render and only then starting the 200 ms fade-in. That render-effect-render transition is the visible lag behind the text. * Because the track ref never updates, no `VideoTrack` ever mounts. When the camera is later subscribed, the placeholder fades out again, leaving the tile empty. Re-derive the track ref inside the toast when the participant's publications become available, so `useIsMuted` sees the real state from the start and the tile renders the video (or a stable placeholder) instead of a blank box.	2026-08-21 22:55:28 +02:00
lebaudantoine	9e0d57a8c6	🐛(frontend) hoist mute confirmation dialog to VideoConference level `MuteButton` owned the confirmation dialog state locally. On the participant tile, the button lives inside `FadeOverlay`, which conditionally mounts its children based on tile mouse activity (3 s idle timeout). Once the user moved the pointer onto the react-aria portal, mouse events on the tile stopped, the idle timer expired, `FadeOverlay` unmounted `MuteButton`, and the dialog was destroyed with it — hence the "closes randomly" behavior. Render the dialog once at the VideoConference level via a shared `MuteAlertDialogProvider`, so its lifetime is independent from any button that opens it.	2026-08-21 22:55:28 +02:00
lebaudantoine	7ba0803b71	💄(frontend) increase the blur intensity Bump the blur strength applied to virtual backgrounds so it obscures the background more effectively. Requested by users.	2026-08-21 22:55:28 +02:00
lebaudantoine	beacfc3d3f	🐛(frontend) stop init_virtual_background from firing on blur updates A regression introduced with the custom virtual background feature (`16daf7b8`, March 26): every blur init on Firefox, and every update call, was going through `init_virtual_background`, which raised an error because there is no virtual background to initialize in that code path. The existing guard was incorrect. Replace it with an early return, so `init_virtual_background` is only executed when there is actually a virtual background to initialize. This does not fix the other virtual background issues that currently prevent some users from activating their camera; those will be addressed separately.	2026-08-21 22:55:28 +02:00
lebaudantoine	52e5d99e83	📈(frontend) track errors when starting or stopping a recording Send an analytics event whenever starting or stopping a recording fails, so we can monitor how often it happens. It also gives support the context needed to understand what went wrong when inspecting a user's session.	2026-08-21 22:55:28 +02:00
lebaudantoine	15ca2b41b4	🐛(frontend) use state instead of a ref for MoreControls container After the recent refactoring, `MoreControls` only renders once. On that first render, the container ref is `null`, and when it later gets a reference to the div, the ref update does not trigger a re-render. As a result, the additional controls were never showing up. Switch from a ref to a state to track the container element. State updates do trigger a re-render, so the controls now show as expected once the container is available.	2026-08-21 22:55:28 +02:00
lebaudantoine	e34f3dd219	🐛(frontend) treat client-initiated connect aborts as events `connect()` calls can be aborted by a `disconnect()` before the join completes — typically when the user leaves, refreshes, navigates away early, or when the component remounts. This is expected behavior, not a failure. Stop reporting these as errors. Track them as analytics events instead, so we can still monitor their volume without polluting error dashboards. Volume is relatively low, but keeping visibility helps troubleshoot users who complain about difficulty connecting to a room, and could also flag a component that is re-rendering and killing the connection.	2026-08-21 22:55:28 +02:00
lebaudantoine	feb573551f	💡(frontend) warn in vite config on MediaPipe asset/track-processor drift Add a build-time warning in the Vite config that fires when the MediaPipe assets copied by `vite-plugin-static-copy` fall out of sync with the version used by `@livekit/track-processors`. This catches at build time the kind of drift that would otherwise only surface at runtime as broken virtual backgrounds.	2026-08-21 18:09:31 +02:00
lebaudantoine	1d0a0cc637	⬆️(mail) upgrade Node image for mails-install to align with the frontend Node 18 is now legacy, and running `make mails-install` was failing with a "bad engine" error against the current image. Bump the Node image used for `mails-install` to a more recent version, aligned with the one used by the frontend, so the make target runs cleanly again. Note: the Alpine variant cannot be used here, as `bash` is required to build the mail templates.	2026-08-20 16:09:03 +02:00
snyk-bot	eae93f771f	🔒️(mail) fix vulnerabilities in src/mail/package.json Upgrade dependencies to fix the following reported vulnerability: * https://snyk.io/vuln/SNYK-JS-DEEPMERGETS-18912249	2026-08-20 16:09:03 +02:00
Florent Chehab	45175a2a54	♻️(summary) uniformized S3 settings case Quick commit to uniformize the S3 related settings case.	2026-08-20 12:50:26 +02:00
Florent Chehab	8b22059b18	✨(summary) configurable s3 region When using other S3 providers than minio, We neeed to configure the region	2026-08-20 12:41:48 +02:00
lebaudantoine	87dbd8069d	⬆️(frontend) upgrade livekit-client and @livekit/components-react Bump livekit-client 2.20.0 -> 2.21.0 and @livekit/components-react 2.9.21 -> 2.9.23. Patch/minor upgrade with data streams v2, data channel flow control and reliability fixes, iOS Safari double-playback fix, and a build-time type resolution fix for `skipLibCheck: false`. No breaking API changes.	2026-08-20 11:08:27 +02:00
lebaudantoine	c7420c59a3	⬆️(frontend) upgrade posthog-js from 1.395.0 to 1.404.1 Minor version upgrade with bug fixes and internal improvements. No breaking changes, API deprecations or required actions on our side. Highlights: * Better handling of `sendBeacon` quota rejections so events are no longer silently dropped. * Improved error catching for synchronous throws from a monkey-patched `window.fetch`. * Source map improvements for easier debugging.	2026-08-20 11:08:27 +02:00
lebaudantoine	f46babfcbd	⬆️(frontend) upgrade i18next and react-i18next patch versions Bump i18next from 26.3.1 to 26.3.6 and react-i18next from 17.0.8 to 17.0.10. Both are patch upgrades with bug fixes and no breaking changes, requiring no code modifications on our side. i18next: * 26.3.6: widen the optional TypeScript peer dependency range to include v7. * 26.3.1: fix a regression in type definitions related to `keyPrefix` to prevent incorrect type pollution. react-i18next: * 17.0.10: improve warning messages for `useTranslation` and `Trans` to help debug common issues, especially in monorepos. Add a new development-only warning when `useTranslation` suspends while loading translations. * 17.0.9: add TypeScript 7 support and fix related type-checking issues with the `<Trans>` component.	2026-08-20 11:08:27 +02:00