wip backend meet

💥(summary) removed summary v1 related code
We are in the process of moving meet to summary v2 routes and tasks. This commits removes code from summary and moves some code from summary to meet, which should have the responsability of this code.
2026-07-27 20:29:09 +00:00 · 2026-05-14 17:42:44 +02:00 · 2026-05-14 14:04:42 +02:00 · 2026-05-13 22:30:32 +02:00 · 2026-05-13 20:15:32 +02:00 · 2026-05-13 20:07:45 +02:00
108 changed files with 4086 additions and 4238 deletions
@@ -150,13 +150,14 @@ jobs:
        uses: actions/setup-python@v6
        with:
          python-version: "3.13"
-          cache: "pip"
-      - name: Install development dependencies
-        run: pip install --user .[dev]
+      - name: Install uv
+        uses: astral-sh/setup-uv@v7
+      - name: Install the project
+        run: uv sync --locked --all-extras
      - name: Check code formatting with ruff
-        run: ~/.local/bin/ruff format . --diff
+        run: uv run ruff format . --diff
      - name: Lint code with ruff
-        run: ~/.local/bin/ruff check .
+        run: uv run ruff check .

  lint-summary:
    runs-on: ubuntu-latest
@@ -8,17 +8,21 @@ and this project adheres to

 ## [Unreleased]

+## [1.16.0] - 2026-05-13
+
 ### Added

 - 🔒️(backend) add validation of Room.configuration
 - ✨(helm) add support multiple transcribe worker / endpoint #1247
 - ✨(backend) make LiveKit Egress recording encoding configurable #1288
 - ✨(summary) add speaker-to-participant assignment
- ✨(feat) Introduce Picture-in-Picture (PiP) #890

 ### Changed

 - ♻️(summary) change tasks endpoint signature
+- ⬆️(dependencies) update urllib3 to v2.7.0 [SECURITY]
+- 🧑‍💻(agents) use `uv` for package management
+- ✨(summary) improve speaker-to-participant assignment

 ### Fixed

@@ -28,6 +32,7 @@ and this project adheres to
 - ⬆️(mail) fix dependencies not having resolved or integrity field #1321
 - 🐛(summary) complete webm support #1328
 - 🐛(backend) add link to "Open" text in recording email
+- 🩹(frontend) fix spacing regression in mobile control bar

 ## [1.15.0] - 2026-04-30

@@ -109,7 +109,7 @@ build-frontend: ## build the frontend container
 .PHONY: build-frontend

 build-agents: ## build the multi-user-transcriber agent container
-	@$(COMPOSE) build multi-user-transcriber
+	@$(COMPOSE) build multi-user-transcriber-dev
 .PHONY: build-agents

 down: ## stop and remove containers, networks, images, and volumes
@@ -138,7 +138,7 @@ run-agents: ## start the multi-user-transcriber agent
 .PHONY: run-agents

 run-agent-multi-user-transcriber: ## start the LiveKit agents (multi users transcriber)
-	@$(COMPOSE) up --force-recreate -d multi-user-transcriber
+	@$(COMPOSE) up --force-recreate -d multi-user-transcriber-dev
 .PHONY: run-agent-multi-user-transcriber

 run-agent-metadata-collector: ## start the LiveKit agents (metadata collector)
@@ -249,6 +249,7 @@ services:
  metadata-collector-dev:
    build:
      context: ./src/agents
+      target: development
    command: ["python", "metadata_collector.py", "dev"]
    environment:
      - LIVEKIT_URL=ws://livekit:7880
@@ -261,6 +262,7 @@ services:
      - AWS_S3_SECURE_ACCESS=False
    volumes:
      - ./src/agents:/app
+      - /app/.venv
    depends_on:
      - livekit
      - minio
@@ -269,6 +271,16 @@ services:
        - action: rebuild
          path: ./src/agents

+  multi-user-transcriber-dev:
+    build:
+      context: ./src/agents
+      target: development
+    env_file:
+      - env.d/development/multi_user_transcriber
+    volumes:
+      - ./src/agents:/app
+      - /app/.venv
+
  redis-summary:
    image: redis
    ports:
@@ -330,14 +342,6 @@ services:
        - action: rebuild
          path: ./src/summary

-  multi-user-transcriber:
-    build:
-      context: ./src/agents
-    env_file:
-      - env.d/development/multi_user_transcriber
-    volumes:
-      - ./src/agents:/app
-
 networks:
  default:
  resource-server:
@@ -19,7 +19,7 @@
        "@types/office-runtime": "^1.0.35",
        "acorn": "^8.11.3",
        "babel-loader": "^9.1.3",
-        "copy-webpack-plugin": "^12.0.2",
+        "copy-webpack-plugin": "^14.0.0",
        "eslint-plugin-office-addins": "^4.0.3",
        "file-loader": "^6.2.0",
        "html-loader": "^5.0.0",
@@ -4319,44 +4319,6 @@
        "node": ">= 4.0.0"
      }
    },
-    "node_modules/@nodelib/fs.scandir": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
-      "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@nodelib/fs.stat": "2.0.5",
-        "run-parallel": "^1.1.9"
-      },
-      "engines": {
-        "node": ">= 8"
-      }
-    },
-    "node_modules/@nodelib/fs.stat": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
-      "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 8"
-      }
-    },
-    "node_modules/@nodelib/fs.walk": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
-      "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@nodelib/fs.scandir": "2.1.5",
-        "fastq": "^1.6.0"
-      },
-      "engines": {
-        "node": ">= 8"
-      }
-    },
    "node_modules/@pkgr/core": {
      "version": "0.2.9",
      "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.2.9.tgz",
@@ -4370,19 +4332,6 @@
        "url": "https://opencollective.com/pkgr"
      }
    },
-    "node_modules/@sindresorhus/merge-streams": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/@sindresorhus/merge-streams/-/merge-streams-2.3.0.tgz",
-      "integrity": "sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
    "node_modules/@types/body-parser": {
      "version": "1.19.6",
      "resolved": "https://registry.npmjs.org/@types/body-parser/-/body-parser-1.19.6.tgz",
@@ -6686,21 +6635,20 @@
      "license": "MIT"
    },
    "node_modules/copy-webpack-plugin": {
-      "version": "12.0.2",
-      "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-12.0.2.tgz",
-      "integrity": "sha512-SNwdBeHyII+rWvee/bTnAYyO8vfVdcSTud4EIb6jcZ8inLeWucJE0DnxXQBjlQ5zlteuuvooGQy3LIyGxhvlOA==",
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-14.0.0.tgz",
+      "integrity": "sha512-3JLW90aBGeaTLpM7mYQKpnVdgsUZRExY55giiZgLuX/xTQRUs1dOCwbBnWnvY6Q6rfZoXMNwzOQJCSZPppfqXA==",
      "dev": true,
      "license": "MIT",
      "dependencies": {
-        "fast-glob": "^3.3.2",
        "glob-parent": "^6.0.1",
-        "globby": "^14.0.0",
        "normalize-path": "^3.0.0",
        "schema-utils": "^4.2.0",
-        "serialize-javascript": "^6.0.2"
+        "serialize-javascript": "^7.0.3",
+        "tinyglobby": "^0.2.12"
      },
      "engines": {
-        "node": ">= 18.12.0"
+        "node": ">= 20.9.0"
      },
      "funding": {
        "type": "opencollective",
@@ -8062,36 +8010,6 @@
      "dev": true,
      "license": "Apache-2.0"
    },
-    "node_modules/fast-glob": {
-      "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz",
-      "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@nodelib/fs.stat": "^2.0.2",
-        "@nodelib/fs.walk": "^1.2.3",
-        "glob-parent": "^5.1.2",
-        "merge2": "^1.3.0",
-        "micromatch": "^4.0.8"
-      },
-      "engines": {
-        "node": ">=8.6.0"
-      }
-    },
-    "node_modules/fast-glob/node_modules/glob-parent": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "is-glob": "^4.0.1"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
    "node_modules/fast-json-stable-stringify": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
@@ -8180,16 +8098,6 @@
        "node": ">= 4.9.1"
      }
    },
-    "node_modules/fastq": {
-      "version": "1.20.1",
-      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz",
-      "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "reusify": "^1.0.4"
-      }
-    },
    "node_modules/faye-websocket": {
      "version": "0.11.4",
      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
@@ -8758,37 +8666,6 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
-    "node_modules/globby": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-14.1.0.tgz",
-      "integrity": "sha512-0Ia46fDOaT7k4og1PDW4YbodWWr3scS2vAr2lTbsplOt2WkKp0vQbkI9wKis/T5LV/dqPjO3bpS/z6GTJB82LA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@sindresorhus/merge-streams": "^2.1.0",
-        "fast-glob": "^3.3.3",
-        "ignore": "^7.0.3",
-        "path-type": "^6.0.0",
-        "slash": "^5.1.0",
-        "unicorn-magic": "^0.3.0"
-      },
-      "engines": {
-        "node": ">=18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "node_modules/globby/node_modules/ignore": {
-      "version": "7.0.5",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
-      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 4"
-      }
-    },
    "node_modules/gopd": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
@@ -11044,16 +10921,6 @@
      "dev": true,
      "license": "MIT"
    },
-    "node_modules/merge2": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
-      "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">= 8"
-      }
-    },
    "node_modules/methods": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
@@ -12638,19 +12505,6 @@
      "dev": true,
      "license": "MIT"
    },
-    "node_modules/path-type": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-6.0.0.tgz",
-      "integrity": "sha512-Vj7sf++t5pBD637NSfkxpHSMfWaeig5+DKWLhcqIYx6mWQz5hdJTGDVMQiJcw1ZYkhs7AazKDGpRVji1LJCZUQ==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
    "node_modules/pathval": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/pathval/-/pathval-1.1.1.tgz",
@@ -12985,37 +12839,6 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
-    "node_modules/queue-microtask": {
-      "version": "1.2.3",
-      "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
-      "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
-      "dev": true,
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
-        }
-      ],
-      "license": "MIT"
-    },
-    "node_modules/randombytes": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
-      "integrity": "sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "safe-buffer": "^5.1.0"
-      }
-    },
    "node_modules/range-parser": {
      "version": "1.2.1",
      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
@@ -13502,17 +13325,6 @@
        "node": ">= 4"
      }
    },
-    "node_modules/reusify": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz",
-      "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "iojs": ">=1.0.0",
-        "node": ">=0.10.0"
-      }
-    },
    "node_modules/rfdc": {
      "version": "1.4.1",
      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz",
@@ -13545,30 +13357,6 @@
        "node": ">=0.12.0"
      }
    },
-    "node_modules/run-parallel": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
-      "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
-      "dev": true,
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
-        }
-      ],
-      "license": "MIT",
-      "dependencies": {
-        "queue-microtask": "^1.2.2"
-      }
-    },
    "node_modules/rxjs": {
      "version": "7.8.2",
      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
@@ -13842,13 +13630,13 @@
      }
    },
    "node_modules/serialize-javascript": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz",
-      "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==",
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-7.0.5.tgz",
+      "integrity": "sha512-F4LcB0UqUl1zErq+1nYEEzSHJnIwb3AF2XWB94b+afhrekOUijwooAYqFyRbjYkm2PAKBabx6oYv/xDxNi8IBw==",
      "dev": true,
      "license": "BSD-3-Clause",
-      "dependencies": {
-        "randombytes": "^2.1.0"
+      "engines": {
+        "node": ">=20.0.0"
      }
    },
    "node_modules/serve-index": {
@@ -14260,19 +14048,6 @@
        "simple-concat": "^1.0.0"
      }
    },
-    "node_modules/slash": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz",
-      "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=14.16"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
    "node_modules/sockjs": {
      "version": "0.3.24",
      "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
@@ -15311,19 +15086,6 @@
        "node": ">=4"
      }
    },
-    "node_modules/unicorn-magic": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.3.0.tgz",
-      "integrity": "sha512-+QBBXBCvifc56fsbuxZQ6Sic3wqqc3WWaqxs58gvJrcOuN83HGTCwz3oS5phzU9LthRNE9VrJCFCLUgHeeFnfA==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
    "node_modules/universalify": {
      "version": "2.0.1",
      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
@@ -36,7 +36,7 @@
    "@types/office-runtime": "^1.0.35",
    "acorn": "^8.11.3",
    "babel-loader": "^9.1.3",
-    "copy-webpack-plugin": "^12.0.2",
+    "copy-webpack-plugin": "^14.0.0",
    "eslint-plugin-office-addins": "^4.0.3",
    "file-loader": "^6.2.0",
    "html-loader": "^5.0.0",
@@ -0,0 +1,38 @@
+# Python
+__pycache__
+*.pyc
+**/__pycache__
+**/*.pyc
+venv
+**/.venv
+
+# System-specific files
+.DS_Store
+**/.DS_Store
+
+# Docker
+compose.*
+env.d
+
+# Docs
+docs
+*.md
+*.log
+
+# Development/test cache & configurations
+data
+.cache
+.circleci
+.git
+.iml
+db.sqlite3
+.pylint.d
+
+**/.idea
+**/.vscode
+**/.pytest_cache
+**/.mypy_cache
+**/.ruff_cache
+
+# Env
+.env
@@ -6,31 +6,61 @@ RUN apt-get update && apt-get install -y \
    libgobject-2.0-0 \
    && rm -rf /var/lib/apt/lists/*

+
+# ---- Builder image ----
 FROM base AS builder

-WORKDIR /builder
+ENV UV_COMPILE_BYTECODE=1 \
+    UV_LINK_MODE=copy \
+    UV_PYTHON_DOWNLOADS=0

-COPY pyproject.toml .
-
-RUN mkdir /install && \
-  pip install --prefix=/install .
-
-FROM base AS development
+# Install uv
+COPY --from=ghcr.io/astral-sh/uv:0.10.9 /uv /uvx /bin/

 WORKDIR /app

-COPY pyproject.toml .
-RUN pip install --no-cache-dir ".[dev]"
+# Install production dependencies without the project itself (cacheable layer)
+RUN --mount=type=cache,target=/root/.cache/uv \
+    --mount=type=bind,source=uv.lock,target=uv.lock \
+    --mount=type=bind,source=pyproject.toml,target=pyproject.toml \
+    uv sync --locked --no-install-project --no-dev

-COPY . .
+# Install the project
+COPY . /app
+RUN --mount=type=cache,target=/root/.cache/uv \
+    uv sync --locked --no-dev

-CMD ["python", "metadata_collector.py", "dev"]

+# ---- Development image ----
+FROM base AS development
+
+ENV UV_COMPILE_BYTECODE=1 \
+    UV_LINK_MODE=copy \
+    UV_PYTHON_DOWNLOADS=0
+
+COPY --from=ghcr.io/astral-sh/uv:0.10.9 /uv /uvx /bin/
+
+WORKDIR /app
+
+COPY . /app
+
+RUN --mount=type=cache,target=/root/.cache/uv \
+    uv sync --locked --all-extras
+
+ENV PATH="/app/.venv/bin:$PATH"
+
+CMD ["python", "multi_user_transcriber.py", "dev"]
+
+
+# ---- Production image ----
 FROM base AS production

 WORKDIR /app

-COPY --from=builder /install /usr/local
+# Copy the pre-built virtualenv and application source
+COPY --from=builder /app /app
+
+ENV PATH="/app/.venv/bin:$PATH"

 # Remove pip to reduce attack surface in production
 RUN pip uninstall -y pip
@@ -39,6 +69,4 @@ RUN pip uninstall -y pip
 ARG DOCKER_USER
 USER ${DOCKER_USER}

-COPY ./*.py /app/
-
 CMD ["python", "multi_user_transcriber.py", "start"]
@@ -1,7 +1,7 @@

 [project]
 name = "agents"
-version = "1.15.0"
+version = "1.16.0"
 requires-python = ">=3.12"
 dependencies = [
    "livekit-agents==1.4.5",
@@ -18,12 +18,8 @@ dev = [
    "ruff==0.15.6",
 ]

-[tool.setuptools]
-py-modules = ["multi_user_transcriber", "metadata_collector", "exceptions"]
-
-[build-system]
-requires = ["setuptools>=61.0"]
-build-backend = "setuptools.build_meta"
+[tool.uv]
+package = false

 [tool.ruff]
 target-version = "py313"
@@ -0,0 +1,52 @@
+"""Analytics module."""
+
+import logging
+from enum import StrEnum
+
+from django.conf import settings
+
+import posthog
+
+from core.models import User
+
+logger = logging.getLogger(__name__)
+
+
+class EventName(StrEnum):
+    """Analytics event names."""
+
+    TRANSCRIPT_GENERATION_SUCCESS = "transcript_generation_success"
+    TRANSCRIPT_GENERATION_FAILURE = "transcript_generation_failure"
+    SUMMARY_GENERATION_SUCCESS = "summary_generation_success"
+    SUMMARY_GENERATION_FAILURE = "summary_generation_failure"
+
+
+def capture_event(event_name: EventName, *, user: User, properties=None) -> None:
+    """
+    Capture an analytics event with user properties.
+    """
+    if not settings.POSTHOG_ENABLED:
+        return
+
+    properties = properties or {}
+    properties["$set"] = {
+        "name": user.full_name,
+        "email": user.email,
+        "sub": user.sub,
+    }
+    posthog.capture(event_name, distinct_id=user.id, properties=properties)
+
+
+def is_feature_enabled(feature_name: str, distinct_id: str) -> bool:
+    """Check if a feature flag is enabled for a user."""
+    if not settings.POSTHOG_ENABLED:
+        return False
+
+    try:
+        return posthog.feature_enabled(feature_name, distinct_id)
+    except Exception as e:  # noqa: BLE001
+        logger.error("Error checking feature flag %s: %s", feature_name, e)
+        return False
+
+
+__all__ = ["EventName", "capture_event", "is_feature_enabled"]
@@ -136,3 +136,15 @@ class FilePermission(IsAuthenticated):
            raise Http404

        return obj.get_abilities(request.user).get(view.action, False)
+
+
+class TranscribeWebhookPermission(permissions.BasePermission):
+    """
+    Permissions applying to the summary webhook endpoint.
+    """
+
+    def has_permission(self, request, view):
+        return request.method == "POST"
+
+    def has_object_permission(self, request, view, obj):
+        return False
@@ -17,6 +17,7 @@ from django.utils.text import slugify
 from django.utils.translation import gettext_lazy as _

 from django_filters import rest_framework as django_filters
+from pydantic import ValidationError
 from rest_framework import (
    decorators,
    filters,
@@ -34,7 +35,7 @@ from rest_framework import (
    status as drf_status,
 )

-from core import enums, models, utils
+from core import analytics, enums, models, utils
 from core.api.filters import ListFileFilter
 from core.enums import MEDIA_STORAGE_URL_PATTERN
 from core.recording.enums import FileExtension
@@ -80,6 +81,10 @@ from core.services.subtitle import SubtitleException, SubtitleService
 from core.tasks.file import process_file_deletion

 from ..authentication.livekit import LiveKitTokenAuthentication
+from ..authentication.webhooks import AiWebhookAuthentication
+from ..models import AiJobStatusChoices, AiRecordingJob
+from ..tasks.ai_job import handle_summary_received, handle_transcript_received
+from ..transcription import webhook_schemas
 from . import permissions, serializers, throttling
 from .feature_flag import FeatureFlag

@@ -915,15 +920,9 @@ class RecordingViewSet(

        # Attempt to notify external services about the recording
        # This is a non-blocking operation - failures are logged but don't interrupt the flow
-        notification_succeeded = notification_service.notify_external_services(
-            recording
-        )
+        notification_service.notify_external_services(recording)

-        recording.status = (
-            models.RecordingStatusChoices.NOTIFICATION_SUCCEEDED
-            if notification_succeeded
-            else models.RecordingStatusChoices.SAVED
-        )
+        recording.status = models.RecordingStatusChoices.SAVED
        recording.save()

        return drf_response.Response(
@@ -1332,3 +1331,92 @@ class FileViewSet(
        request = utils.generate_s3_authorization_headers(f"{url_params.get('key'):s}")

        return drf_response.Response("authorized", headers=request.headers, status=200)
+
+
+class AiJobViewSet(
+    viewsets.GenericViewSet,
+):
+    """AI jobs API."""
+
+    permission_classes = []
+    serializer_class = None
+
+    def get_queryset(self):
+        """Restrict AI jobs to current user except webhook endpoint."""
+
+        raise NotImplementedError()
+
+    @decorators.action(
+        detail=False,
+        methods=["post"],
+        url_path="webhook",
+        authentication_classes=[AiWebhookAuthentication],
+        permission_classes=[permissions.TranscribeWebhookPermission],
+    )
+    def on_ai_event(self, request):
+        """Handle incoming hook events for recordings."""
+        logger.debug("Received transcribe webhook event: %s", request.data)
+
+        try:
+            payload = webhook_schemas.webhook_payload_adapter.validate_python(
+                request.data
+            )
+        except ValidationError as exc:
+            logger.error("Invalid webhook payload: %s", exc)
+            raise drf_exceptions.ValidationError(detail=exc) from exc
+
+        ai_recording_job = AiRecordingJob.objects.filter(
+            remote_job_id=payload.job_id
+        ).first()
+
+        if not ai_recording_job:
+            logger.warning("No AI recording job found for job ID: %s", payload.job_id)
+            return drf_response.Response(
+                {"message": "No AI recording job found for job ID, ignoring."},
+            )
+
+        if ai_recording_job.status == AiJobStatusChoices.SUCCESS:
+            logger.warning(
+                "AI recording job already in success state for job ID: %s",
+                payload.job_id,
+            )
+            return drf_response.Response(
+                {"message": "AI recording job already in success state, ignoring."},
+            )
+
+        if isinstance(payload, webhook_schemas.TranscribeWebhookSuccessPayload):
+            handle_transcript_received.apply_async(
+                args=[payload.job_id, payload.transcription_data_url]
+            )
+        elif isinstance(payload, webhook_schemas.SummarizeWebhookSuccessPayload):
+            handle_summary_received.apply_async(
+                args=[payload.job_id, payload.summary_data_url]
+            )
+        elif isinstance(
+            payload,
+            (
+                webhook_schemas.SummarizeWebhookFailurePayload,
+                webhook_schemas.TranscribeWebhookFailurePayload,
+            ),
+        ):
+            ai_recording_job.status = AiJobStatusChoices.FAILED
+            ai_recording_job.save()
+            analytics.capture_event(
+                analytics.EventName.TRANSCRIPT_GENERATION_FAILURE
+                if isinstance(payload, webhook_schemas.TranscribeWebhookFailurePayload)
+                else analytics.EventName.SUMMARY_GENERATION_FAILURE,
+                user=ai_recording_job.user,
+                properties={
+                    "generation_time_seconds": (
+                        timezone.now() - ai_recording_job.created_at
+                    ).total_seconds(),
+                    "ai_recording_job_id": ai_recording_job.id,
+                    "recording_id": ai_recording_job.recording.id,
+                },
+            )
+        else:
+            raise NotImplementedError()
+
+        return drf_response.Response(
+            {"message": "Event processed."},
+        )
@@ -0,0 +1,34 @@
+"""Webhooks authentication."""
+
+import logging
+
+from django.conf import settings
+from django.contrib.auth.models import AnonymousUser
+
+from rest_framework.authentication import BaseAuthentication
+from rest_framework.exceptions import AuthenticationFailed
+
+logger = logging.getLogger(__name__)
+
+
+class AiWebhookAuthentication(BaseAuthentication):
+    """
+    Custom authentication class for AI webhook requests.
+    Validates the API key in the Authorization header.
+    """
+
+    def authenticate(self, request):
+        """
+        Authenticate the request and return a two-tuple of (user, token).
+        """
+
+        authorization_header: str = request.headers.get("Authorization") or ""
+        if authorization_header.removeprefix("Bearer ") != settings.AI_WEBHOOK_API_KEY:
+            logger.warning(
+                "Authentication failed: Bad Authorization header (ip: %s)",
+                request.META.get("REMOTE_ADDR"),
+            )
+            raise AuthenticationFailed()
+
+        # No users are associated with the transcribe webhooks
+        return AnonymousUser(), None
@@ -0,0 +1,36 @@
+# Generated by Django 5.2.14 on 2026-05-14 12:40
+
+import django.db.models.deletion
+import uuid
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('core', '0018_rename_active_application_is_active'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='AiRecordingJob',
+            fields=[
+                ('id', models.UUIDField(default=uuid.uuid4, editable=False, help_text='primary key for the record as UUID', primary_key=True, serialize=False, verbose_name='id')),
+                ('created_at', models.DateTimeField(auto_now_add=True, help_text='date and time at which a record was created', verbose_name='created on')),
+                ('updated_at', models.DateTimeField(auto_now=True, help_text='date and time at which a record was last updated', verbose_name='updated on')),
+                ('remote_job_id', models.CharField(blank=True, max_length=255, null=True, unique=True)),
+                ('type', models.CharField(choices=[('transcript', 'Transcript'), ('summary', 'Summary')], max_length=25)),
+                ('status', models.CharField(choices=[('pending', 'Pending'), ('success', 'Success'), ('failed', 'Failed')], max_length=25)),
+                ('language', models.CharField(choices=[('fr', 'fr'), ('en', 'en'), ('de', 'de'), ('nl', 'nl')], default='fr', max_length=2)),
+                ('docs_app_id', models.CharField(blank=True, max_length=255, null=True)),
+                ('recording', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='ai_jobs', to='core.recording')),
+            ],
+            options={
+                'verbose_name': 'AiJob',
+                'verbose_name_plural': 'AiJobs',
+                'db_table': 'ai_job',
+                'ordering': ('created_at',),
+                'indexes': [models.Index(fields=['recording', 'type', '-created_at'], name='ai_job_recordi_ca452e_idx')],
+            },
+        ),
+    ]
@@ -590,6 +590,16 @@ class Recording(BaseModel):
        verbose_name=_("Recording options"),
        help_text=_("Recording options"),
    )
+    started_at = models.DateTimeField(
+        null=True,
+        blank=True,
+        help_text=_("Recording start timestamp as recorded by livekit."),
+    )
+    ended_at = models.DateTimeField(
+        null=True,
+        blank=True,
+        help_text=_("Recording end timestamp as recorded by livekit."),
+    )

    class Meta:
        db_table = "meet_recording"
@@ -736,6 +746,66 @@ class RecordingAccess(BaseAccess):
        return self._get_abilities(self.recording, user)


+class AiJobStatusChoices(models.TextChoices):
+    """Possible states of a file."""
+
+    PENDING = "pending", _("Pending")
+    SUCCESS = "success", _("Success")
+    FAILED = "failed", _("Failed")
+
+
+class AiJobTypeChoices(models.TextChoices):
+    """Possible types of Ai Jobs."""
+
+    TRANSCRIPT = "transcript", _("Transcript")
+    SUMMARIZE = "summary", _("Summary")
+
+
+class AiRecordingJob(BaseModel):
+    """
+    A job that is run to process an audio file.
+    """
+
+    remote_job_id = models.CharField(max_length=255, unique=True, null=True, blank=True)
+    type = models.CharField(
+        max_length=25,
+        choices=AiJobTypeChoices.choices,
+    )
+    recording = models.ForeignKey(
+        Recording, on_delete=models.CASCADE, related_name="ai_jobs"
+    )
+    status = models.CharField(
+        max_length=25,
+        choices=AiJobStatusChoices.choices,
+    )
+    language = models.CharField(
+        max_length=2,
+        choices=(("fr", "fr"), ("en", "en"), ("de", "de"), ("nl", "nl")),
+        default="fr",
+    )
+    docs_app_id = models.CharField(max_length=255, null=True, blank=True)
+
+    class Meta:
+        db_table = "ai_job"
+        verbose_name = _("AiJob")
+        verbose_name_plural = _("AiJobs")
+        ordering = ("created_at",)
+        indexes = [
+            models.Index(fields=["recording", "type", "-created_at"]),
+        ]
+
+    def __str__(self):
+        return f"{self.recording.id} - {self.type} - {self.status}"
+
+    @property
+    def user(self):
+        return (
+            RecordingAccess.objects.select_related("user")
+            .filter(role=RoleChoices.OWNER, recording_id=self.recording.id)
+            .first()
+        ).user
+
+
 class ApplicationScope(models.TextChoices):
    """Available permission scopes for application operations."""

@@ -12,11 +12,11 @@ from django.utils.translation import get_language, override
 from django.utils.translation import gettext_lazy as _

 import aiohttp
-import requests
 from asgiref.sync import async_to_sync
 from livekit import api as livekit_api

 from core import models, utils
+from core.tasks.ai_job import call_transcribe_service

 logger = logging.getLogger(__name__)

@@ -45,22 +45,17 @@ class NotificationService:
        """Process a recording based on its mode."""

        if recording.mode == models.RecordingModeChoices.TRANSCRIPT:
-            return self._notify_summary_service(recording)
-
-        if recording.mode == models.RecordingModeChoices.SCREEN_RECORDING:
-            summary_success = True
+            self._notify_summary_service(recording)
+        elif recording.mode == models.RecordingModeChoices.SCREEN_RECORDING:
            if recording.options.get("transcribe", False):
-                summary_success = self._notify_summary_service(recording)
-
-            email_success = self._notify_user_by_email(recording)
-            return email_success and summary_success
-
-        logger.error(
-            "Unknown recording mode %s for recording %s",
-            recording.mode,
-            recording.id,
-        )
-        return False
+                self._notify_summary_service(recording)
+            self._notify_user_by_email(recording)
+        else:
+            logger.error(
+                "Unknown recording mode %s for recording %s",
+                recording.mode,
+                recording.id,
+            )

    @staticmethod
    def _notify_user_by_email(recording) -> bool:
@@ -187,71 +182,17 @@ class NotificationService:
            or not settings.SUMMARY_SERVICE_API_TOKEN
        ):
            logger.error("Summary service not configured")
-            return False
-
-        owner_access = (
-            models.RecordingAccess.objects.select_related("user")
-            .filter(
-                role=models.RoleChoices.OWNER,
-                recording_id=recording.id,
-            )
-            .first()
-        )
-
-        if settings.METADATA_COLLECTOR_ENABLED and recording.options.get(
-            "collect_metadata", False
-        ):
-            output_folder = settings.METADATA_COLLECTOR_OUTPUT_FOLDER
-            metadata_filename = f"{output_folder}/{recording.id}-metadata.json"
-        else:
-            metadata_filename = None
-
-        if not owner_access:
-            logger.error("No owner found for recording %s", recording.id)
-            return False
+            return

        started_at, ended_at = async_to_sync(
            NotificationService._get_recording_timestamps
        )(recording.worker_id)

-        payload = {
-            "owner_id": str(owner_access.user.id),
-            "recording_filename": recording.key,
-            "metadata_filename": metadata_filename,
-            "email": owner_access.user.email,
-            "sub": owner_access.user.sub,
-            "room": recording.room.name,
-            "language": recording.options.get("language"),
-            "owner_timezone": str(owner_access.user.timezone),
-            "download_link": f"{get_recording_download_base_url()}/{recording.id}",
-            "context_language": owner_access.user.language,
-            "recording_start_at": (started_at.isoformat() if started_at else None),
-            "recording_end_at": (ended_at.isoformat() if ended_at else None),
-        }
+        recording.started_at = started_at
+        recording.ended_at = ended_at
+        recording.save()

-        headers = {
-            "Content-Type": "application/json",
-            "Authorization": f"Bearer {settings.SUMMARY_SERVICE_API_TOKEN}",
-        }
-
-        try:
-            response = requests.post(
-                settings.SUMMARY_SERVICE_ENDPOINT,
-                json=payload,
-                headers=headers,
-                timeout=30,
-            )
-            response.raise_for_status()
-        except requests.RequestException as exc:
-            logger.exception(
-                "Summary service error for recording %s. URL: %s. Exception: %s",
-                recording.id,
-                settings.SUMMARY_SERVICE_ENDPOINT,
-                exc,
-            )
-            return False
-
-        return True
+        call_transcribe_service.apply_async(args=[recording.id])


 notification_service = NotificationService()
@@ -0,0 +1,319 @@
+import logging
+from datetime import datetime
+from urllib.parse import urljoin
+
+from django.conf import settings
+from django.utils import timezone
+
+import requests
+
+from core import analytics, models
+from core.models import (
+    AiJobStatusChoices,
+    AiJobTypeChoices,
+    AiRecordingJob,
+    Recording,
+)
+from core.tasks._task import task
+from core.transcription.locales import get_locale
+from core.transcription.transcript_formatter import TranscriptFormatter
+from core.transcription.webhook_schemas import WhisperXResponse
+from core.utils import generate_download_s3_file_url
+
+logger = logging.getLogger(__name__)
+
+
+@task
+def call_transcribe_service(recording_id):
+    """
+    Call the transcribe service for a given recording.
+    """
+    try:
+        recording = Recording.objects.get(id=recording_id)
+    except Recording.DoesNotExist:
+        logger.error("Recoding %s does not exist", recording_id)
+        return None
+
+    owner_access = (
+        models.RecordingAccess.objects.select_related("user")
+        .filter(
+            role=models.RoleChoices.OWNER,
+            recording_id=recording.id,
+        )
+        .first()
+    )
+
+    if not owner_access:
+        logger.error("No owner found for recording %s", recording.id)
+        return False
+
+    metadata = None
+    if (
+        settings.METADATA_COLLECTOR_ENABLED
+        and recording.options.get("collect_metadata", False)
+        and recording.started_at
+        and recording.ended_at
+    ):
+        output_folder = settings.METADATA_COLLECTOR_OUTPUT_FOLDER
+        metadata_filename = f"{output_folder}/{recording.id}-metadata.json"
+        metadata = {
+            "cloud_storage_url": generate_download_s3_file_url(metadata_filename),
+            "start_at": recording.started_at,
+            "end_at": recording.ended_at,
+        }
+
+    language = (
+        recording.options.get("language") or settings.TRANSCRIPTION_DEFAULT_LANGUAGE
+    )
+    ai_transcribe_job = AiRecordingJob.objects.create(
+        remote_job_id=None,
+        recording=recording,
+        type=AiJobTypeChoices.TRANSCRIPT,
+        status=AiJobStatusChoices.PENDING,
+        language=language,
+    )
+
+    try:
+        response = requests.post(
+            settings.AI_SERVICE_URL + "async-jobs/transcribe/",
+            json={
+                "user_sub": owner_access.user.sub,
+                "language": language,
+                "cloud_storage_url": generate_download_s3_file_url(
+                    recording.key, expires_in=60 * 60 * 24, override_domain=False
+                ),
+                "metadata": metadata,
+            },
+            headers={
+                "Authorization": f"Bearer {settings.AI_SERVICE_API_KEY}",
+            },
+            timeout=10,
+        )
+        response.raise_for_status()
+    except Exception as e:
+        logger.error(
+            "Creating transcription job failed for recording %s: %s", recording_id, e
+        )
+        ai_transcribe_job.status = AiJobStatusChoices.FAILED
+        ai_transcribe_job.save()
+        raise e
+
+    data = response.json()
+
+    ai_transcribe_job.remote_job_id = data["job_id"]
+    ai_transcribe_job.save()
+
+    recording.status = models.RecordingStatusChoices.NOTIFICATION_SUCCEEDED
+    recording.save()
+
+    logger.info("Transcription job created for recording %s", recording_id)
+    return ai_transcribe_job.id
+
+
+def format_transcript(  # noqa: PLR0913
+    transcription,
+    *,
+    context_language: str | None,
+    language: str,
+    room: str | None,
+    recording_datetime: datetime | None,
+    owner_timezone: str | None,
+    download_link: str | None,
+) -> tuple[str, str]:
+    """Format a transcription into readable content with a title.
+
+    Resolves the locale from context_language / language, then uses
+    TranscriptFormatter to produce markdown content and a title.
+
+    Returns a (content, title) tuple.
+    """
+    locale = get_locale(context_language, language)
+    formatter = TranscriptFormatter(locale)
+
+    return formatter.format(
+        transcription,
+        room=room,
+        recording_datetime=recording_datetime,
+        owner_timezone=owner_timezone,
+        download_link=download_link,
+    )
+
+
+@task
+def handle_transcript_received(remote_job_id, url):
+    """
+    Store the transcript and call the summarize service for a given recording.
+    """
+    ai_transcript_job = AiRecordingJob.objects.filter(
+        remote_job_id=remote_job_id, type=AiJobTypeChoices.TRANSCRIPT
+    ).first()
+    if not ai_transcript_job:
+        logger.warning("No AI recording job found for job ID: %s", remote_job_id)
+        return
+
+    user = ai_transcript_job.user
+    recording = ai_transcript_job.recording
+
+    response = requests.get(url, timeout=(10, 20))
+    response.raise_for_status()
+    transcript = WhisperXResponse(**response.json())
+
+    # Format output
+    content, title = format_transcript(
+        transcript,
+        context_language=user.language,
+        language=ai_transcript_job.language,
+        room=recording.room.name,
+        recording_datetime=recording.started_at or recording.created_at,
+        owner_timezone=user.timezone,
+        download_link=urljoin(settings.RECORDING_DOWNLOAD_BASE_URL, recording.id),
+    )
+
+    create_document_in_docs(
+        title=title, content=content, email=user.email, sub=user.sub
+    )
+
+    ai_transcript_job.status = AiJobStatusChoices.SUCCESS
+    ai_transcript_job.save()
+
+    analytics.capture_event(
+        analytics.EventName.TRANSCRIPT_GENERATION_SUCCESS,
+        user=ai_transcript_job.user,
+        properties={
+            "generation_time_seconds": (
+                timezone.now() - ai_transcript_job.created_at
+            ).total_seconds(),
+            "ai_recording_job_id": ai_transcript_job.id,
+            "language": ai_transcript_job.language,
+            "recording_id": ai_transcript_job.recording.id,
+            "transcript_size": len(response.content),
+        },
+    )
+
+    # LLM Summarization
+    if analytics.is_feature_enabled("summary-enabled", distinct_id=user.sub):
+        ai_summary_job = AiRecordingJob.objects.create(
+            remote_job_id=None,
+            file=recording,
+            type=AiJobTypeChoices.SUMMARIZE,
+            status=AiJobStatusChoices.PENDING,
+            language=ai_transcript_job.language,
+        )
+
+        try:
+            summary_response = requests.post(
+                settings.AI_SERVICE_URL + "async-jobs/summarize/",
+                json={
+                    "user_sub": ai_summary_job.user.sub,
+                    "language": ai_transcript_job.language,
+                    "content": content,
+                },
+                headers={
+                    "Authorization": f"Bearer {settings.AI_SERVICE_API_KEY}",
+                },
+                timeout=10,
+            )
+            summary_response.raise_for_status()
+        except Exception as e:
+            logger.error(
+                "Creating summary job failed for recording %s: %s", recording.id, e
+            )
+            ai_summary_job.status = AiJobStatusChoices.FAILED
+            ai_summary_job.save()
+            raise e
+
+        ai_summary_job.remote_job_id = summary_response.json()["job_id"]
+        ai_summary_job.save()
+
+        logger.info("Summary job created for recording %s", recording.id)
+
+
+@task
+def handle_summary_received(remote_job_id, url):
+    """
+    Store the summary of a given file.
+    """
+    ai_summary_job = AiRecordingJob.objects.filter(
+        remote_job_id=remote_job_id, type=AiJobTypeChoices.SUMMARIZE
+    ).first()
+    if not ai_summary_job:
+        logger.warning("No AI file job found for job ID: %s", remote_job_id)
+        return
+
+    recording = ai_summary_job.recording
+
+    logger.info("Storing summary for recording %s & url %s", recording.id, url)
+    response = requests.get(url, timeout=(10, 20))
+    response.raise_for_status()
+
+    user = ai_summary_job.user
+
+    # We dynamically recompute the title for the document since we don't have access to the transcript
+    _, title = format_transcript(
+        None,
+        context_language=user.language,
+        language=ai_summary_job.language,
+        room=recording.room.name,
+        recording_datetime=recording.started_at or recording.created_at,
+        owner_timezone=user.timezone,
+        download_link=urljoin(settings.RECORDING_DOWNLOAD_BASE_URL, recording.id),
+    )
+
+    create_document_in_docs(
+        title=get_locale(user.language).summary_title_template.format(title=title),
+        content=response.text,
+        email=user.email,
+        sub=user.sub,
+    )
+
+    logger.info("Summary created in docs for recording %s & url %s", recording.id, url)
+    ai_summary_job.status = AiJobStatusChoices.SUCCESS
+    ai_summary_job.save()
+
+    analytics.capture_event(
+        analytics.EventName.TRANSCRIPT_GENERATION_SUCCESS,
+        user=ai_summary_job.user,
+        properties={
+            "generation_time_seconds": (
+                timezone.now() - ai_summary_job.created_at
+            ).total_seconds(),
+            "ai_recording_job_id": ai_summary_job.id,
+            "language": ai_summary_job.language,
+            "recording_id": ai_summary_job.recording.id,
+            "transcript_size": len(response.content),
+        },
+    )
+
+
+def create_document_in_docs(*, title: str, content: str, email: str, sub: str) -> str:
+    """
+    Create a document in Docs for a given file.
+    """
+
+    response = requests.post(
+        urljoin(settings.DOCS_BASE_URL, "/api/v1.0/documents/create-for-owner/"),
+        json={
+            "title": title,
+            "content": content,
+            "email": email,
+            "sub": sub,
+        },
+        headers={
+            "Authorization": f"Bearer {settings.DOCS_SERVER_TO_SERVER_API_KEY}",
+        },
+        timeout=20,
+    )
+
+    if response.status_code != 201:
+        logger.error(
+            "Failed to create document in Docs %s",
+            title,
+        )
+        response.raise_for_status()
+
+    docs_app_id = response.json()["id"]
+    logger.info(
+        "Document created in Docs => %s (in docs)",
+        docs_app_id,
+    )
+    return docs_app_id
@@ -2,9 +2,10 @@

 from typing import Optional

-from summary.core.config import get_settings
-from summary.core.locales import de, en, fr, nl
-from summary.core.locales.strings import LocaleStrings
+from django.conf import settings
+
+from core.transcription.locales import de, en, fr, nl
+from core.transcription.locales.strings import LocaleStrings

 _LOCALES = {"fr": fr, "en": en, "de": de, "nl": nl}

@@ -27,4 +28,4 @@ def get_locale(*languages: Optional[str]) -> LocaleStrings:
        if base_lang in _LOCALES:
            return _LOCALES[base_lang].STRINGS

-    return _LOCALES[get_settings().default_context_language].STRINGS
+    return _LOCALES[settings.TRANSCRIPTION_DEFAULT_LANGUAGE].STRINGS
@@ -1,6 +1,6 @@
 """German locale strings."""

-from summary.core.locales.strings import LocaleStrings
+from core.transcription.locales.strings import LocaleStrings

 STRINGS = LocaleStrings(
    empty_transcription="""
@@ -30,4 +30,5 @@ Einige Punkte, die wir Ihnen empfehlen zu überprüfen:
    document_title_template=(
        'Besprechung "{room}" am {room_recording_date} um {room_recording_time}'
    ),
+    summary_title_template="Zusammenfassung von {title}",
 )
@@ -1,6 +1,6 @@
 """English locale strings."""

-from summary.core.locales.strings import LocaleStrings
+from core.transcription.locales.strings import LocaleStrings

 STRINGS = LocaleStrings(
    empty_transcription="""
@@ -30,4 +30,5 @@ A few things we recommend you check:
    document_title_template=(
        'Meeting "{room}" on {room_recording_date} at {room_recording_time}'
    ),
+    summary_title_template="Summary of {title}",
 )
@@ -1,6 +1,6 @@
 """French locale strings (default)."""

-from summary.core.locales.strings import LocaleStrings
+from core.transcription.locales.strings import LocaleStrings

 STRINGS = LocaleStrings(
    empty_transcription="""
@@ -30,4 +30,5 @@ Quelques points que nous vous conseillons de vérifier :
    document_title_template=(
        'Réunion "{room}" du {room_recording_date} à {room_recording_time}'
    ),
+    summary_title_template="Résumé de {title}",
 )
@@ -1,6 +1,6 @@
 """Dutch locale strings."""

-from summary.core.locales.strings import LocaleStrings
+from core.transcription.locales.strings import LocaleStrings

 STRINGS = LocaleStrings(
    empty_transcription="""
@@ -30,4 +30,5 @@ Een paar punten die wij u aanraden te controleren:
    document_title_template=(
        'Vergadering "{room}" op {room_recording_date} om {room_recording_time}'
    ),
+    summary_title_template="Samenvatting van {title}",
 )
@@ -13,3 +13,4 @@ class LocaleStrings:
    hallucination_replacement_text: str
    document_default_title: str
    document_title_template: str
+    summary_title_template: str
@@ -5,10 +5,9 @@ from datetime import datetime
 from typing import Tuple
 from zoneinfo import ZoneInfo

-from summary.core.config import get_settings
-from summary.core.locales import LocaleStrings
+from django.conf import settings

-settings = get_settings()
+from core.transcription.locales.strings import LocaleStrings

 logger = logging.getLogger(__name__)

@@ -38,11 +37,11 @@ class TranscriptFormatter:

        return None

-    def format(
+    def format(  # pylint: disable=too-many-arguments,too-many-positional-arguments
        self,
        transcription,
        room: str | None = None,
-        recording_datetime: str | None = None,
+        recording_datetime: datetime | None = None,
        owner_timezone: str | None = None,
        download_link: str | None = None,
    ) -> Tuple[str, str]:
@@ -100,14 +99,14 @@ class TranscriptFormatter:
    def _generate_title(
        self,
        room: str | None = None,
-        recording_datetime: str | None = None,
+        recording_datetime: datetime | None = None,
        owner_timezone: str | None = None,
    ) -> str:
        """Generate title from context or return default."""
        if not room or not recording_datetime:
            return self._locale.document_default_title

-        dt = datetime.fromisoformat(recording_datetime)
+        dt = recording_datetime
        if owner_timezone:
            dt = dt.astimezone(ZoneInfo(owner_timezone))

@@ -0,0 +1,163 @@
+"""Transcribe / summary Shared / Webhook models."""
+
+from typing import Annotated, Literal, Union
+
+from pydantic import BaseModel, Field, TypeAdapter
+
+
+class WordSegment(BaseModel):
+    """Word segment model for transcription tasks."""
+
+    word: str = Field(title="Word")
+    start: float | None = Field(
+        default=None, title="Start Time", description="Start time in seconds."
+    )
+    end: float | None = Field(
+        default=None, title="End Time", description="End time in seconds."
+    )
+    score: float | None = Field(
+        default=None,
+        title="Confidence Score",
+        description="Confidence score for the word segment.",
+    )
+    speaker: str | None = Field(
+        default=None,
+        title="Speaker",
+        description="Speaker identifier for the word segment.",
+    )
+
+
+class Segment(BaseModel):
+    """Segment model for transcription tasks."""
+
+    start: float | None = Field(
+        default=None, title="Start Time", description="Start time in seconds."
+    )
+    end: float | None = Field(
+        default=None, title="End Time", description="End time in seconds."
+    )
+    text: str = Field(
+        title="Segment Text", description="Transcribed text for the segment."
+    )
+    words: tuple[WordSegment, ...] | None = Field(
+        title="Word Segments", description="List of word segments within the segment."
+    )
+    speaker: str | None = Field(
+        default=None, title="Speaker", description="Speaker identifier for the segment."
+    )
+
+
+class WhisperXResponse(BaseModel):
+    """Model for WhisperX response."""
+
+    segments: tuple[Segment, ...] = Field(
+        title="Segments", description="List of transcribed segments."
+    )
+    word_segments: tuple[WordSegment, ...] = Field(
+        title="Word Segments", description="List of word segments."
+    )
+
+
+class BaseWebhook(BaseModel):
+    """Base webhook payload."""
+
+    job_id: str = Field(
+        title="Job ID",
+        description="The ID of the job document in the receiver system.",
+    )
+
+
+class TranscribeWebhookSuccessPayload(BaseWebhook):
+    """Payload for a successful transcription webhook."""
+
+    type: Literal["transcript"] = Field(default="transcript")
+    status: Literal["success"] = Field(default="success")
+    transcription_data_url: str = Field(
+        title="Transcript", description="URL to the raw transcription data."
+    )
+
+
+class TranscribeWebhookPendingPayload(BaseWebhook):
+    """Payload for a pending transcription webhook-like response."""
+
+    type: Literal["transcript"] = Field(default="transcript")
+    status: Literal["pending"] = Field(default="pending")
+
+
+class TranscribeWebhookFailurePayload(BaseWebhook):
+    """Payload for a failed transcription webhook."""
+
+    type: Literal["transcript"] = Field(default="transcript")
+    status: Literal["failure"] = Field(default="failure")
+    error_code: Literal["unknown_error"] = Field(
+        title="Error code", description="The error code."
+    )
+
+
+TranscribeWebhookPayloads = Annotated[
+    Union[
+        TranscribeWebhookSuccessPayload,
+        TranscribeWebhookPendingPayload,
+        TranscribeWebhookFailurePayload,
+    ],
+    Field(discriminator="status"),
+]
+
+
+class SummarizeWebhookSuccessPayload(BaseWebhook):
+    """Payload for a successful summarization webhook."""
+
+    type: Literal["summary"] = Field(default="summary")
+    status: Literal["success"] = Field(default="success")
+    summary_data_url: str = Field(
+        title="Summary", description="URL to the raw summary data."
+    )
+
+
+class SummarizeWebhookPendingPayload(BaseWebhook):
+    """Payload for a pending summarization webhook-like response."""
+
+    type: Literal["summary"] = Field(default="summary")
+    status: Literal["pending"] = Field(default="pending")
+
+
+class SummarizeWebhookFailurePayload(BaseWebhook):
+    """Payload for a failed summarization webhook."""
+
+    type: Literal["summary"] = Field(default="summary")
+    status: Literal["failure"] = Field(default="failure")
+    error_code: Literal["unknown_error"] = Field(
+        title="Error code", description="The error code."
+    )
+
+
+SummarizeWebhookPayloads = Annotated[
+    Union[
+        SummarizeWebhookSuccessPayload,
+        SummarizeWebhookPendingPayload,
+        SummarizeWebhookFailurePayload,
+    ],
+    Field(discriminator="status"),
+]
+
+WebhookPayloads = Annotated[
+    Union[TranscribeWebhookPayloads, SummarizeWebhookPayloads],
+    Field(discriminator="type"),
+]
+
+
+webhook_payload_adapter = TypeAdapter(WebhookPayloads)
+
+__all__ = [
+    "TranscribeWebhookSuccessPayload",
+    "TranscribeWebhookPendingPayload",
+    "TranscribeWebhookFailurePayload",
+    "SummarizeWebhookSuccessPayload",
+    "SummarizeWebhookPendingPayload",
+    "SummarizeWebhookFailurePayload",
+    "TranscribeWebhookPayloads",
+    "SummarizeWebhookPayloads",
+    "WebhookPayloads",
+    "WhisperXResponse",
+    "webhook_payload_adapter",
+]
@@ -16,6 +16,7 @@ router.register("users", viewsets.UserViewSet, basename="users")
 router.register("rooms", viewsets.RoomViewSet, basename="rooms")
 router.register("recordings", viewsets.RecordingViewSet, basename="recordings")
 router.register("files", viewsets.FileViewSet, basename="files")
+router.register("ai-jobs", viewsets.AiJobViewSet, basename="ai-jobs")
 router.register(
    "resource-accesses", viewsets.ResourceAccessViewSet, basename="resource_accesses"
 )
@@ -455,3 +455,38 @@ def generate_upload_policy(file):
    )

    return policy
+
+
+def generate_download_s3_file_url(
+    key, *, expires_in: int, override_domain: bool = True
+):
+    """
+    Generate a S3 signed download url for a given key.
+    """
+
+    # This settings should be used if the backend application and the frontend application
+    # can't connect to the object storage with the same domain. This is the case in the
+    # docker compose stack used in development. The frontend application will use localhost
+    # to connect to the object storage while the backend application will use the object storage
+    # service name declared in the docker compose stack.
+    # This is needed because the domain name is used to compute the signature. So it can't be
+    # changed dynamically by the frontend application.
+    if settings.AWS_S3_DOMAIN_REPLACE and override_domain:
+        s3_client = boto3.client(
+            "s3",
+            aws_access_key_id=settings.AWS_S3_ACCESS_KEY_ID,
+            aws_secret_access_key=settings.AWS_S3_SECRET_ACCESS_KEY,
+            endpoint_url=settings.AWS_S3_DOMAIN_REPLACE,
+            config=botocore.client.Config(
+                region_name=settings.AWS_S3_REGION_NAME,
+                signature_version=settings.AWS_S3_SIGNATURE_VERSION,
+            ),
+        )
+    else:
+        s3_client = default_storage.connection.meta.client
+
+    return s3_client.generate_presigned_url(
+        ClientMethod="get_object",
+        Params={"Bucket": default_storage.bucket_name, "Key": key},
+        ExpiresIn=expires_in,
+    )
@@ -19,6 +19,7 @@ from socket import gethostbyname, gethostname
 from django.utils.translation import gettext_lazy as _

 import dj_database_url
+import posthog
 import sentry_sdk
 from configurations import Configuration, values
 from lasuite.configuration.values import SecretFileValue
@@ -451,6 +452,11 @@ class Base(Configuration):
    CELERY_BROKER_URL = values.Value("redis://redis:6379/0", environ_prefix=None)
    CELERY_BROKER_TRANSPORT_OPTIONS = values.DictValue({}, environ_prefix=None)

+    # Analytics
+    POSTHOG_ENABLED = values.BooleanValue(False, environ_prefix=None)
+    POSTHOG_API_KEY = values.Value(None, environ_prefix=None)
+    POSTHOG_API_HOST = values.Value(None, environ_prefix=None)
+
    # Session
    SESSION_ENGINE = values.Value(
        default="django.contrib.sessions.backends.cache",
@@ -744,6 +750,20 @@ class Base(Configuration):
    SUMMARY_SERVICE_API_TOKEN = SecretFileValue(
        None, environ_name="SUMMARY_SERVICE_API_TOKEN", environ_prefix=None
    )
+    DOCS_BASE_URL = values.Value(
+        "https://example.com",
+        environ_name="DOCS_BASE_URL",
+        environ_prefix=None,
+    )
+    DOCS_SERVER_TO_SERVER_API_KEY = SecretFileValue(
+        None,
+        environ_name="DOCS_SERVER_TO_SERVER_API_KEY",
+        environ_prefix=None,
+    )
+    TRANSCRIPTION_DEFAULT_LANGUAGE = values.Value(
+        default="fr", environ_name="TRANSCRIPTION_DEFAULT_LANGUAGE", environ_prefix=None
+    )
+
    SCREEN_RECORDING_BASE_URL = values.Value(
        None, environ_name="SCREEN_RECORDING_BASE_URL", environ_prefix=None
    )
@@ -7,7 +7,7 @@ build-backend = "uv_build"

 [project]
 name = "meet"
-version = "1.15.0"
+version = "1.16.0"
 authors = [{ "name" = "DINUM", "email" = "dev@mail.numerique.gouv.fr" }]
 classifiers = [
    "Development Status :: 5 - Production/Stable",
@@ -61,6 +61,8 @@ dependencies = [
    "mozilla-django-oidc==5.0.2",
    "livekit-api==1.1.0",
    "aiohttp==3.13.4",
+    "urllib3==2.7.0",
+    "posthog>=7.14.2",
 ]

 [project.urls]
@@ -148,6 +148,15 @@ wheels = [
    { url = "https://files.pythonhosted.org/packages/64/b4/17d4b0b2a2dc85a6df63d1157e028ed19f90d4cd97c36717afef2bc2f395/attrs-26.1.0-py3-none-any.whl", hash = "sha256:c647aa4a12dfbad9333ca4e71fe62ddc36f4e63b2d260a37a8b83d2f043ac309", size = 67548, upload-time = "2026-03-19T14:22:23.645Z" },
 ]

+[[package]]
+name = "backoff"
+version = "2.2.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/47/d7/5bbeb12c44d7c4f2fb5b56abce497eb5ed9f34d85701de869acedd602619/backoff-2.2.1.tar.gz", hash = "sha256:03f829f5bb1923180821643f8753b0502c3b682293992485b0eef2807afa5cba", size = 17001, upload-time = "2022-10-05T19:19:32.061Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/df/73/b6e24bd22e6720ca8ee9a85a0c4a2971af8497d8f3193fa05390cbd46e09/backoff-2.2.1-py3-none-any.whl", hash = "sha256:63579f9a0628e06278f7e47b7d7d5b6ce20dc65c5e96a6f3ca99a6adca0396e8", size = 15148, upload-time = "2022-10-05T19:19:30.546Z" },
+]
+
 [[package]]
 name = "billiard"
 version = "4.2.4"
@@ -559,6 +568,15 @@ wheels = [
    { url = "https://files.pythonhosted.org/packages/1e/77/dc8c558f7593132cf8fefec57c4f60c83b16941c574ac5f619abb3ae7933/dill-0.4.1-py3-none-any.whl", hash = "sha256:1e1ce33e978ae97fcfcff5638477032b801c46c7c65cf717f95fbc2248f79a9d", size = 120019, upload-time = "2026-01-19T02:36:55.663Z" },
 ]

+[[package]]
+name = "distro"
+version = "1.9.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/fc/f8/98eea607f65de6527f8a2e8885fc8015d3e6f5775df186e443e0964a11c3/distro-1.9.0.tar.gz", hash = "sha256:2fa77c6fd8940f116ee1d6b94a2f90b13b5ea8d019b98bc8bafdcabcdd9bdbed", size = 60722, upload-time = "2023-12-24T09:54:32.31Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/12/b3/231ffd4ab1fc9d679809f356cebee130ac7daa00d6d6f3206dd4fd137e9e/distro-1.9.0-py3-none-any.whl", hash = "sha256:7bffd925d65168f85027d8da9af6bddab658135b840670a223589bc0c8ef02b2", size = 20277, upload-time = "2023-12-24T09:54:30.421Z" },
+]
+
 [[package]]
 name = "dj-database-url"
 version = "3.1.2"
@@ -1173,7 +1191,7 @@ wheels = [

 [[package]]
 name = "meet"
-version = "1.15.0"
+version = "1.16.0"
 source = { editable = "." }
 dependencies = [
    { name = "aiohttp" },
@@ -1204,6 +1222,7 @@ dependencies = [
    { name = "markdown" },
    { name = "mozilla-django-oidc" },
    { name = "nested-multipart-parser" },
+    { name = "posthog" },
    { name = "psycopg", extra = ["binary"] },
    { name = "pydantic" },
    { name = "pyjwt" },
@@ -1212,6 +1231,7 @@ dependencies = [
    { name = "redis" },
    { name = "requests" },
    { name = "sentry-sdk" },
+    { name = "urllib3" },
    { name = "whitenoise" },
 ]

@@ -1265,6 +1285,7 @@ requires-dist = [
    { name = "markdown", specifier = "==3.10.2" },
    { name = "mozilla-django-oidc", specifier = "==5.0.2" },
    { name = "nested-multipart-parser", specifier = "==1.6.0" },
+    { name = "posthog", specifier = ">=7.14.2" },
    { name = "psycopg", extras = ["binary"], specifier = "==3.3.3" },
    { name = "pydantic", specifier = "==2.12.5" },
    { name = "pyjwt", specifier = "==2.12.1" },
@@ -1273,6 +1294,7 @@ requires-dist = [
    { name = "redis", specifier = "==5.2.1" },
    { name = "requests", specifier = "==2.33.0" },
    { name = "sentry-sdk", specifier = "==2.54.0" },
+    { name = "urllib3", specifier = "==2.7.0" },
    { name = "whitenoise", specifier = "==6.12.0" },
 ]

@@ -1504,6 +1526,21 @@ wheels = [
    { url = "https://files.pythonhosted.org/packages/54/20/4d324d65cc6d9205fabedc306948156824eb9f0ee1633355a8f7ec5c66bf/pluggy-1.6.0-py3-none-any.whl", hash = "sha256:e920276dd6813095e9377c0bc5566d94c932c33b27a3e3945d8389c374dd4746", size = 20538, upload-time = "2025-05-15T12:30:06.134Z" },
 ]

+[[package]]
+name = "posthog"
+version = "7.14.2"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "backoff" },
+    { name = "distro" },
+    { name = "requests" },
+    { name = "typing-extensions" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/ca/e6/fe25f9eaeb5b4b66aa738554ba1ef9feece8b1d5b6a9ea431782b6c6c58f/posthog-7.14.2.tar.gz", hash = "sha256:b913dc23acc301a95ca9b851c193b261932d01a66a9af91eb6e9883cd05d5b6b", size = 205633, upload-time = "2026-05-13T16:36:27.153Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/c5/b8/75f9eed446c1d48405871542b36fdf1dba3333756a477bcb0d9ef70d17a4/posthog-7.14.2-py3-none-any.whl", hash = "sha256:f78b45a5ad5c72e55bf1cadebe8cf46bae2a6094e7fe01cbc7b5ec0531aab4d8", size = 240750, upload-time = "2026-05-13T16:36:25.544Z" },
+]
+
 [[package]]
 name = "pprintpp"
 version = "0.4.0"
@@ -2260,11 +2297,11 @@ wheels = [

 [[package]]
 name = "urllib3"
-version = "2.6.3"
+version = "2.7.0"
 source = { registry = "https://pypi.org/simple" }
-sdist = { url = "https://files.pythonhosted.org/packages/c7/24/5f1b3bdffd70275f6661c76461e25f024d5a38a46f04aaca912426a2b1d3/urllib3-2.6.3.tar.gz", hash = "sha256:1b62b6884944a57dbe321509ab94fd4d3b307075e0c2eae991ac71ee15ad38ed", size = 435556, upload-time = "2026-01-07T16:24:43.925Z" }
+sdist = { url = "https://files.pythonhosted.org/packages/53/0c/06f8b233b8fd13b9e5ee11424ef85419ba0d8ba0b3138bf360be2ff56953/urllib3-2.7.0.tar.gz", hash = "sha256:231e0ec3b63ceb14667c67be60f2f2c40a518cb38b03af60abc813da26505f4c", size = 433602, upload-time = "2026-05-07T16:13:18.596Z" }
 wheels = [
-    { url = "https://files.pythonhosted.org/packages/39/08/aaaad47bc4e9dc8c725e68f9d04865dbcb2052843ff09c97b08904852d84/urllib3-2.6.3-py3-none-any.whl", hash = "sha256:bf272323e553dfb2e87d9bfd225ca7b0f467b919d7bbd355436d3fd37cb0acd4", size = 131584, upload-time = "2026-01-07T16:24:42.685Z" },
+    { url = "https://files.pythonhosted.org/packages/7f/3e/5db95bcf282c52709639744ca2a8b149baccf648e39c8cc87553df9eae0c/urllib3-2.7.0-py3-none-any.whl", hash = "sha256:9fb4c81ebbb1ce9531cce37674bbc6f1360472bc18ca9a553ede278ef7276897", size = 131087, upload-time = "2026-05-07T16:13:17.151Z" },
 ]

 [[package]]
@@ -1,18 +0,0 @@
-import type * as React from 'react';
-
-declare module '@react-aria/overlays' {
-  export type PortalProviderContextValue = {
-    getContainer: () => HTMLElement | null;
-  };
-
-  export type PortalProviderProps = {
-    getContainer: () => HTMLElement | null;
-    children: React.ReactNode;
-  };
-
-  export function useUNSAFE_PortalContext(): PortalProviderContextValue;
-  export function UNSAFE_PortalProvider(
-    props: PortalProviderProps,
-  ): JSX.Element;
-}
-
@@ -1,7 +1,7 @@
 {
  "name": "meet",
  "private": true,
-  "version": "1.15.0",
+  "version": "1.16.0",
  "type": "module",
  "scripts": {
    "dev": "panda codegen && vite",
@@ -47,7 +47,7 @@
    "wouter": "3.9.0"
  },
  "devDependencies": {
-    "@pandacss/dev": "1.8.2",
+    "@pandacss/dev": "1.11.1",
    "@tanstack/eslint-plugin-query": "5.91.4",
    "@tanstack/react-query-devtools": "5.91.3",
    "@types/humanize-duration": "3.27.4",
@@ -62,7 +62,7 @@
    "eslint-plugin-jsx-a11y": "6.10.2",
    "eslint-plugin-react-hooks": "5.2.0",
    "eslint-plugin-react-refresh": "0.4.20",
-    "postcss": "8.5.10",
+    "postcss": "8.5.14",
    "prettier": "3.8.1",
    "typescript": "5.8.3",
    "vite": "7.3.2",
@@ -1,121 +0,0 @@
-<svg width="102" height="72" viewBox="0 0 102 72" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_13227_1168)">
-<g filter="url(#filter0_d_13227_1168)">
-<rect x="16" y="8.77759" width="51.852" height="41.4816" rx="7.71815" fill="#969EB0"/>
-<rect x="16" y="8.77759" width="51.852" height="41.4816" rx="7.71815" fill="#181B24" fill-opacity="0.7"/>
-<rect x="16.5963" y="9.37389" width="50.6595" height="40.289" rx="7.12186" stroke="#969EB0" stroke-width="1.1926"/>
-<rect x="16.5963" y="9.37389" width="50.6595" height="40.289" rx="7.12186" stroke="#181B24" stroke-opacity="0.6" stroke-width="1.1926"/>
-<g filter="url(#filter1_d_13227_1168)">
-<rect x="21.1851" y="13.9629" width="19.4445" height="14.2593" rx="2.5926" fill="#969EB0"/>
-<rect x="21.1851" y="13.9629" width="19.4445" height="14.2593" rx="2.5926" fill="#181B24" fill-opacity="0.6"/>
-</g>
-<g filter="url(#filter2_d_13227_1168)">
-<rect x="21.1851" y="30.8149" width="19.4445" height="14.2593" rx="2.5926" fill="#969EB0"/>
-<rect x="21.1851" y="30.8149" width="19.4445" height="14.2593" rx="2.5926" fill="#181B24" fill-opacity="0.6"/>
-</g>
-<g filter="url(#filter3_d_13227_1168)">
-<rect x="43.2222" y="13.9629" width="19.4445" height="14.2593" rx="2.5926" fill="#969EB0"/>
-<rect x="43.2222" y="13.9629" width="19.4445" height="14.2593" rx="2.5926" fill="#181B24" fill-opacity="0.6"/>
-</g>
-<g filter="url(#filter4_d_13227_1168)">
-<rect x="43.2222" y="30.8149" width="19.4445" height="14.2593" rx="2.5926" fill="#969EB0"/>
-<rect x="43.2222" y="30.8149" width="19.4445" height="14.2593" rx="2.5926" fill="#181B24" fill-opacity="0.6"/>
-</g>
-</g>
-<g filter="url(#filter5_d_13227_1168)">
-<rect x="52.2964" y="34.7036" width="33.7038" height="28.5186" rx="7.71815" fill="#7E98FF"/>
-<rect x="52.2964" y="34.7036" width="33.7038" height="28.5186" rx="7.71815" fill="#181B24" fill-opacity="0.7"/>
-<rect x="52.2964" y="34.7036" width="33.7038" height="28.5186" rx="7.71815" fill="url(#paint0_linear_13227_1168)" fill-opacity="0.05"/>
-<rect x="52.8927" y="35.2999" width="32.5112" height="27.326" rx="7.12186" stroke="#7E98FF" stroke-width="1.1926"/>
-<rect x="52.8927" y="35.2999" width="32.5112" height="27.326" rx="7.12186" stroke="#181B24" stroke-opacity="0.45" stroke-width="1.1926"/>
-<rect width="5.1852" height="5.1852" rx="1.94445" transform="matrix(-1 0 0 1 65.2593 54.1482)" fill="#7E98FF"/>
-<rect width="5.1852" height="5.1852" rx="1.94445" transform="matrix(-1 0 0 1 65.2593 54.1482)" fill="#181B24" fill-opacity="0.45"/>
-<rect width="5.1852" height="5.1852" rx="1.94445" transform="matrix(-1 0 0 1 71.7407 54.1482)" fill="#7E98FF"/>
-<rect width="5.1852" height="5.1852" rx="1.94445" transform="matrix(-1 0 0 1 71.7407 54.1482)" fill="#181B24" fill-opacity="0.45"/>
-<rect width="5.1852" height="5.1852" rx="1.94445" transform="matrix(-1 0 0 1 78.2222 54.1482)" fill="#FF706E"/>
-<rect width="5.1852" height="5.1852" rx="1.94445" transform="matrix(-1 0 0 1 78.2222 54.1482)" fill="#181B24" fill-opacity="0.45"/>
-</g>
-<g filter="url(#filter6_d_13227_1168)">
-<path d="M50.3653 53.4428C51.0628 53.4428 51.6941 53.2682 52.2593 52.9191C52.8304 52.576 53.2844 52.1135 53.6211 51.5316C53.9638 50.9558 54.1352 50.3156 54.1352 49.6112C54.1352 48.9006 53.9638 48.2543 53.6211 47.6724C53.2844 47.0965 52.8304 46.634 52.2593 46.2849C51.6941 45.9418 51.0628 45.7703 50.3653 45.7703H47.344C46.1836 45.7703 45.1555 45.6539 44.2596 45.4211C43.3637 45.1884 42.5731 44.7871 41.8876 44.2174C41.2022 43.6539 40.598 42.8698 40.0749 41.8652C39.9185 41.5711 39.7412 41.3843 39.5428 41.3046C39.3504 41.225 39.158 41.1852 38.9656 41.1852C38.7251 41.1852 38.5086 41.2924 38.3162 41.5068C38.1298 41.7151 38.0366 42.0183 38.0366 42.4165C38.0366 44.1133 38.217 45.6386 38.5777 46.9924C38.9445 48.3523 39.5037 49.5131 40.2552 50.4749C41.0128 51.4366 41.9778 52.1717 43.1503 52.6801C44.3287 53.1886 45.7266 53.4428 47.344 53.4428H50.3653ZM47.6056 42.2603V56.9161C47.6056 57.2224 47.7048 57.4858 47.9032 57.7063C48.1076 57.9268 48.3692 58.0371 48.6878 58.0371C48.9043 58.0371 49.0997 57.985 49.274 57.8809C49.4544 57.7829 49.6649 57.6175 49.9054 57.3847L57.0212 50.6035C57.1955 50.4381 57.3158 50.2697 57.3819 50.0981C57.4481 49.9266 57.4811 49.7643 57.4811 49.6112C57.4811 49.4641 57.4481 49.3049 57.3819 49.1333C57.3158 48.9618 57.1955 48.7934 57.0212 48.628L49.9054 41.7825C49.6889 41.5742 49.4815 41.4241 49.2831 41.3322C49.0907 41.2342 48.8862 41.1852 48.6698 41.1852C48.3631 41.1852 48.1076 41.2863 47.9032 41.4884C47.7048 41.6906 47.6056 41.9478 47.6056 42.2603Z" fill="#969EB0"/>
-</g>
-</g>
-<defs>
-<filter id="filter0_d_13227_1168" x="7.82784" y="4.69151" width="68.1964" height="57.826" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset dy="4.08608"/>
-<feGaussianBlur stdDeviation="4.08608"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 0.0941176 0 0 0 0 0.105882 0 0 0 0 0.141176 0 0 0 0.05 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_13227_1168"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_13227_1168" result="shape"/>
-</filter>
-<filter id="filter1_d_13227_1168" x="17.3569" y="10.1348" width="27.1006" height="21.9156" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset/>
-<feGaussianBlur stdDeviation="1.91407"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.02 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_13227_1168"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_13227_1168" result="shape"/>
-</filter>
-<filter id="filter2_d_13227_1168" x="17.3569" y="26.9868" width="27.1006" height="21.9156" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset/>
-<feGaussianBlur stdDeviation="1.91407"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.02 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_13227_1168"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_13227_1168" result="shape"/>
-</filter>
-<filter id="filter3_d_13227_1168" x="39.394" y="10.1348" width="27.1006" height="21.9156" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset/>
-<feGaussianBlur stdDeviation="1.91407"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.02 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_13227_1168"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_13227_1168" result="shape"/>
-</filter>
-<filter id="filter4_d_13227_1168" x="39.394" y="26.9868" width="27.1006" height="21.9156" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset/>
-<feGaussianBlur stdDeviation="1.91407"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.02 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_13227_1168"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_13227_1168" result="shape"/>
-</filter>
-<filter id="filter5_d_13227_1168" x="44.1242" y="30.6175" width="50.0479" height="44.8629" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset dy="4.08608"/>
-<feGaussianBlur stdDeviation="4.08608"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 0.0941176 0 0 0 0 0.105882 0 0 0 0 0.141176 0 0 0 0.05 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_13227_1168"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_13227_1168" result="shape"/>
-</filter>
-<filter id="filter6_d_13227_1168" x="29.8645" y="37.0992" width="35.7887" height="33.1961" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-<feOffset dy="4.08608"/>
-<feGaussianBlur stdDeviation="4.08608"/>
-<feComposite in2="hardAlpha" operator="out"/>
-<feColorMatrix type="matrix" values="0 0 0 0 0.0941176 0 0 0 0 0.105882 0 0 0 0 0.141176 0 0 0 0.05 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_13227_1168"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_13227_1168" result="shape"/>
-</filter>
-<linearGradient id="paint0_linear_13227_1168" x1="69.1483" y1="34.7036" x2="69.1483" y2="63.2222" gradientUnits="userSpaceOnUse">
-<stop stop-color="#F6F8F9" stop-opacity="0.975"/>
-<stop offset="1" stop-color="#F6F8F9" stop-opacity="0"/>
-</linearGradient>
-<clipPath id="clip0_13227_1168">
-<rect width="102" height="72" fill="white"/>
-</clipPath>
-</defs>
-</svg>
@@ -12,7 +12,7 @@ const controlBarRegion = cva({
  variants: {
    mobile: {
      true: {
-        justifyContent: 'space-between',
+        justifyContent: 'center',
        width: '330px',
      },
    },
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef } from 'react'
+import { useCallback, useEffect } from 'react'
 import { useRoomContext } from '@livekit/components-react'
 import { Participant, RemoteParticipant, RoomEvent } from 'livekit-client'
 import { ChatMessage, isMobileBrowser } from '@livekit/components-core'
@@ -16,10 +16,6 @@ import { useScreenReaderAnnounce } from '@/hooks/useScreenReaderAnnounce'
 import { Emoji } from '@/features/reactions/types'
 import { useReactions } from '@/features/reactions/hooks/useReactions'

-// Sliding window of recent chat ids kept for deduplication. Sized to comfortably
-// cover bursts and re-emits while staying negligible in memory.
-const MAX_TRACKED_CHAT_IDS = 16
-
 export const MainNotificationToast = () => {
  const room = useRoomContext()
  const { triggerNotificationSound } = useNotificationSound()
@@ -28,23 +24,12 @@ export const MainNotificationToast = () => {

  const { appendReaction } = useReactions()

-  // Multiple Chat instances may re-emit the same RoomEvent.ChatMessage.
-  // Dedupe against a small ring of recent ids.
-  const seenChatMsgIdsRef = useRef<string[]>([])
-
  useEffect(() => {
    const handleChatMessage = (
      chatMessage: ChatMessage,
      participant?: Participant | undefined
    ) => {
      if (!participant || participant.isLocal) return
-      const id = chatMessage.id
-      if (id) {
-        const seen = seenChatMsgIdsRef.current
-        if (seen.includes(id)) return
-        seen.push(id)
-        if (seen.length > MAX_TRACKED_CHAT_IDS) seen.shift()
-      }
      triggerNotificationSound(NotificationType.MessageReceived)
      toastQueue.add(
        {
@@ -1,236 +0,0 @@
-import { type ReactNode, useEffect, useMemo, useRef, useState } from 'react'
-import { createPortal } from 'react-dom'
-import { useTranslation } from 'react-i18next'
-import { useDocumentPiP } from '../hooks/useDocumentPiP'
-import { useScreenReaderAnnounce } from '@/hooks/useScreenReaderAnnounce'
-import { useRestoreFocus } from '@/hooks/useRestoreFocus'
-import { UNSAFE_PortalProvider as PortalProvider } from '@react-aria/overlays'
-import { VisualOnlyTooltipsContext } from '@/primitives/VisualOnlyTooltipsContext'
-
-// Minimal base styles so the PiP window renders correctly on first paint.
-const ensureBaseStyles = (target: Document) => {
-  if (target.getElementById('pip-base-styles')) return
-  const style = target.createElement('style')
-  style.id = 'pip-base-styles'
-  style.textContent = `
-    html, body { margin: 0; padding: 0; height: 100%; background: #0b0f19; }
-    body { overflow: hidden; }
-    * { box-sizing: border-box; }
-  `
-  target.head.appendChild(style)
-}
-
-// Clone existing styles to keep the PiP window visually consistent.
-const copyStyles = (source: Document, target: Document) => {
-  if (target.getElementById('pip-style-clone')) return
-  const marker = target.createElement('meta')
-  marker.id = 'pip-style-clone'
-  target.head.appendChild(marker)
-
-  source.querySelectorAll('style, link[rel="stylesheet"]').forEach((node) => {
-    const cloned = node.cloneNode(true) as HTMLElement
-    target.head.appendChild(cloned)
-  })
-}
-
-const syncThemeAttribute = (source: Document, target: Document) => {
-  const theme = source.documentElement.dataset.lkTheme
-  if (theme) {
-    target.documentElement.dataset.lkTheme = theme
-  } else {
-    delete target.documentElement.dataset.lkTheme
-  }
-}
-
-const cssVarNameCacheByElement = new WeakMap<HTMLElement, string[]>()
-const cssVarNameCacheByUri = new Map<string, string[]>()
-
-const syncCssVariables = (source: Document, target: Document) => {
-  const sourceView = source.defaultView
-  if (!sourceView) return
-
-  const getCachedVarNames = () => {
-    const docEl = source.documentElement
-    if (!docEl) return []
-
-    const cachedByElement = cssVarNameCacheByElement.get(docEl)
-    if (cachedByElement) return cachedByElement
-
-    const cachedByUri = source.baseURI
-      ? cssVarNameCacheByUri.get(source.baseURI)
-      : undefined
-    if (cachedByUri) return cachedByUri
-
-    const varNames = new Set<string>()
-    const collectVarsFrom = (element: HTMLElement | null) => {
-      if (!element) return
-      const styles = sourceView.getComputedStyle(element)
-      for (const property of Array.from(styles)) {
-        if (property.startsWith('--')) {
-          varNames.add(property)
-        }
-      }
-    }
-
-    collectVarsFrom(source.documentElement)
-    collectVarsFrom(source.body)
-
-    const result = Array.from(varNames)
-    cssVarNameCacheByElement.set(docEl, result)
-    if (source.baseURI) {
-      cssVarNameCacheByUri.set(source.baseURI, result)
-    }
-    return result
-  }
-
-  const varNames = getCachedVarNames()
-  if (!varNames.length) return
-
-  const rootStyles = sourceView.getComputedStyle(source.documentElement)
-  const bodyStyles = source.body
-    ? sourceView.getComputedStyle(source.body)
-    : null
-
-  varNames.forEach((property) => {
-    const bodyValue = bodyStyles?.getPropertyValue(property)
-    const value = bodyValue || rootStyles.getPropertyValue(property)
-    if (value) {
-      target.documentElement.style.setProperty(property, value)
-    }
-  })
-}
-
-/**
- * React portal into a Document Picture-in-Picture window. Handles window
- * lifecycle, style/theme sync and routes React Aria overlays via
- * `UNSAFE_PortalProvider` so they render inside the PiP document.
- */
-export const DocumentPiPPortal = ({
-  isOpen,
-  width,
-  height,
-  children,
-  onClose,
-}: {
-  isOpen: boolean
-  width?: number
-  height?: number
-  children: React.ReactNode
-  onClose?: () => void
-}): ReactNode => {
-  const { openPiP, closePiP, pipWindow, isSupported } = useDocumentPiP({
-    width,
-    height,
-  })
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'options.items.pictureInPicture',
-  })
-  const announce = useScreenReaderAnnounce()
-  const [container, setContainer] = useState<HTMLElement | null>(null)
-  const containerRef = useRef<HTMLElement | null>(null)
-  const prevOpenRef = useRef(false)
-
-  useEffect(() => {
-    if (!isOpen) {
-      closePiP()
-      setContainer(null)
-      containerRef.current = null
-      return
-    }
-
-    if (!isSupported) return
-
-    let cancelled = false
-    openPiP().then((win) => {
-      if (!win || cancelled) return
-      const doc = win.document
-      ensureBaseStyles(doc)
-      copyStyles(document, doc)
-      syncThemeAttribute(document, doc)
-      syncCssVariables(document, doc)
-
-      doc.documentElement.setAttribute('lang', document.documentElement.lang)
-      doc.title = t('windowLabel')
-
-      const existingContainer = containerRef.current
-      if (!existingContainer || existingContainer.ownerDocument !== doc) {
-        const nextContainer = doc.createElement('div')
-        nextContainer.id = 'pip-root'
-        nextContainer.style.width = '100%'
-        nextContainer.style.height = '100%'
-        nextContainer.style.display = 'flex'
-        nextContainer.style.alignItems = 'stretch'
-        nextContainer.style.justifyContent = 'center'
-        doc.body.appendChild(nextContainer)
-        containerRef.current = nextContainer
-        setContainer(nextContainer)
-      } else {
-        setContainer(existingContainer)
-      }
-    })
-
-    return () => {
-      cancelled = true
-    }
-  }, [closePiP, isOpen, isSupported, openPiP, t])
-
-  // Focus stays on the trigger; PiP is announced as an auxiliary surface.
-  useEffect(() => {
-    const wasOpen = prevOpenRef.current
-    prevOpenRef.current = isOpen
-
-    if (isOpen && !wasOpen) {
-      announce(t('opened'), 'polite')
-    }
-    if (!isOpen && wasOpen) {
-      announce(t('closed'), 'polite')
-    }
-  }, [isOpen, announce, t])
-
-  useRestoreFocus(isOpen, { restoreFocusRaf: true })
-
-  // Escape from either document closes PiP (unless a nested overlay handled it).
-  useEffect(() => {
-    if (!isOpen) return
-    const handleKeyDown = (event: KeyboardEvent) => {
-      if (event.key !== 'Escape' || event.defaultPrevented) return
-      event.preventDefault()
-      onClose?.()
-    }
-    document.addEventListener('keydown', handleKeyDown)
-    pipWindow?.document.addEventListener('keydown', handleKeyDown)
-    return () => {
-      document.removeEventListener('keydown', handleKeyDown)
-      pipWindow?.document.removeEventListener('keydown', handleKeyDown)
-    }
-  }, [isOpen, onClose, pipWindow])
-
-  useEffect(() => {
-    if (!pipWindow) return
-    const handleClose = () => {
-      containerRef.current = null
-      setContainer(null)
-      onClose?.()
-    }
-    pipWindow.addEventListener('pagehide', handleClose)
-    pipWindow.addEventListener('beforeunload', handleClose)
-    return () => {
-      pipWindow.removeEventListener('pagehide', handleClose)
-      pipWindow.removeEventListener('beforeunload', handleClose)
-    }
-  }, [onClose, pipWindow])
-
-  const portal = useMemo(() => {
-    if (!container) return null
-    return createPortal(
-      <PortalProvider getContainer={() => container}>
-        <VisualOnlyTooltipsContext.Provider value={true}>
-          {children}
-        </VisualOnlyTooltipsContext.Provider>
-      </PortalProvider>,
-      container
-    )
-  }, [children, container])
-
-  return portal as unknown as ReactNode
-}
@@ -1,126 +0,0 @@
-import { styled } from '@/styled-system/jsx'
-import { useRef, useMemo, useCallback } from 'react'
-import { useTranslation } from 'react-i18next'
-import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut'
-import { findFirstFocusable } from '@/utils/dom'
-import { AudioDevicesControl } from '@/features/rooms/livekit/components/controls/Device/AudioDevicesControl'
-import { VideoDeviceControl } from '@/features/rooms/livekit/components/controls/Device/VideoDeviceControl'
-import { ScreenShareToggle } from '@/features/rooms/livekit/components/controls/ScreenShareToggle'
-import { LeaveButton } from '@/features/rooms/livekit/components/controls/LeaveButton'
-import { HandToggle } from '@/features/rooms/livekit/components/controls/HandToggle'
-import { StartMediaButton } from '@/features/rooms/livekit/components/controls/StartMediaButton'
-import { usePipElementSize } from '../hooks/usePipElementSize'
-import { PipOptionsMenu } from './controls/PipOptionsMenu'
-import { ReactionsToggle } from '@/features/reactions/components/ReactionsToggle'
-
-export const CollapsibleControls = {
-  HAND: 'hand',
-  SCREEN_SHARE: 'screenShare',
-  REACTIONS: 'reactions',
-} as const
-
-export type CollapsibleControl =
-  (typeof CollapsibleControls)[keyof typeof CollapsibleControls]
-
-const COLLAPSE_ORDER: CollapsibleControl[] = [
-  CollapsibleControls.HAND,
-  CollapsibleControls.SCREEN_SHARE,
-  CollapsibleControls.REACTIONS,
-]
-
-const BUTTON_SLOT = 50
-const ESSENTIAL_WIDTH = 260
-
-const getHiddenControls = (
-  containerWidth: number,
-  showScreenShare: boolean
-): Set<CollapsibleControl> => {
-  const hidden = new Set<CollapsibleControl>()
-  if (containerWidth <= 0) return hidden
-
-  const collapsible = showScreenShare
-    ? COLLAPSE_ORDER
-    : COLLAPSE_ORDER.filter((c) => c !== CollapsibleControls.SCREEN_SHARE)
-
-  const available = containerWidth - ESSENTIAL_WIDTH
-  const maxVisible = Math.max(0, Math.floor(available / BUTTON_SLOT))
-
-  for (let i = 0; i < collapsible.length - maxVisible; i++) {
-    hidden.add(collapsible[i])
-  }
-  return hidden
-}
-
-export const PipControlBar = ({
-  showScreenShare,
-}: {
-  showScreenShare: boolean
-}) => {
-  const containerRef = useRef<HTMLDivElement>(null)
-  const { width } = usePipElementSize(containerRef)
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'options.items.pictureInPicture',
-  })
-
-  const hidden = useMemo(
-    () => getHiddenControls(width, showScreenShare),
-    [width, showScreenShare]
-  )
-
-  useRegisterKeyboardShortcut({
-    id: 'focus-toolbar',
-    handler: useCallback(() => {
-      const doc = containerRef.current?.ownerDocument ?? document
-      findFirstFocusable(doc.getElementById('pip-control-bar'))?.focus()
-    }, []),
-  })
-
-  return (
-    <PipControls
-      ref={containerRef}
-      id="pip-control-bar"
-      role="toolbar"
-      aria-label={t('controlBar')}
-    >
-      <PipControlsCenter>
-        <AudioDevicesControl hideMenu />
-        <VideoDeviceControl hideMenu />
-        {!hidden.has(CollapsibleControls.REACTIONS) && (
-          <ReactionsToggle id="pip-reactions-toggle" />
-        )}
-        {showScreenShare && !hidden.has(CollapsibleControls.SCREEN_SHARE) && (
-          <ScreenShareToggle />
-        )}
-        {!hidden.has(CollapsibleControls.HAND) && <HandToggle />}
-        <PipOptionsMenu overflowControls={hidden} />
-        <LeaveButton />
-        <StartMediaButton />
-      </PipControlsCenter>
-    </PipControls>
-  )
-}
-
-const PipControls = styled('div', {
-  base: {
-    flex: '0 0 auto',
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-    gap: '0.5rem',
-    padding: '0.5rem 0.75rem',
-    backgroundColor: 'primaryDark.50',
-    width: '100%',
-    position: 'relative',
-  },
-})
-
-const PipControlsCenter = styled('div', {
-  base: {
-    display: 'flex',
-    flexWrap: 'nowrap',
-    justifyContent: 'center',
-    alignItems: 'center',
-    gap: '0.4rem',
-    flex: '1 1 auto',
-  },
-})
@@ -1,85 +0,0 @@
-import { useTranslation } from 'react-i18next'
-import { styled } from '@/styled-system/jsx'
-import { useRoomPiP } from '../hooks/useRoomPiP'
-
-export const PipPlaceholder = () => {
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'options.items.pictureInPicture.placeholder',
-  })
-  const { close } = useRoomPiP()
-
-  return (
-    <Container>
-      <Illustration
-        src="/assets/pip.svg"
-        alt=""
-        width={102}
-        height={72}
-        aria-hidden="true"
-      />
-      <Title>{t('title')}</Title>
-      <Description>{t('description')}</Description>
-      <BringBackLink onClick={close}>{t('bringBack')}</BringBackLink>
-    </Container>
-  )
-}
-
-const Container = styled('div', {
-  base: {
-    display: 'flex',
-    flexDirection: 'column',
-    alignItems: 'center',
-    justifyContent: 'center',
-    width: '100%',
-    height: '100%',
-    gap: '0.5rem',
-    padding: '1.5rem',
-    textAlign: 'center',
-  },
-})
-
-const Illustration = styled('img', {
-  base: {
-    marginBottom: '0.25rem',
-  },
-})
-
-const Title = styled('p', {
-  base: {
-    color: 'white',
-    fontSize: '0.875rem',
-    fontWeight: 600,
-    lineHeight: 1.3,
-    margin: 0,
-  },
-})
-
-const Description = styled('p', {
-  base: {
-    color: '#DFE2EA',
-    fontSize: '0.75rem',
-    fontWeight: 400,
-    lineHeight: 1.4,
-    margin: 0,
-    maxWidth: '312px',
-  },
-})
-
-const BringBackLink = styled('button', {
-  base: {
-    color: '#A2B6FF',
-    fontSize: '0.75rem',
-    fontWeight: 500,
-    lineHeight: 1.4,
-    cursor: 'pointer',
-    marginTop: '0.25rem',
-    borderRadius: '2px',
-    _hover: {
-      textDecoration: 'underline',
-    },
-    _focusVisible: {
-      outline: '2px solid #A2B6FF',
-      outlineOffset: '2px',
-    },
-  },
-})
@@ -1,51 +0,0 @@
-import { useMemo, useRef } from 'react'
-import { useSnapshot } from 'valtio'
-import { css } from '@/styled-system/css'
-import { reactionsStore } from '@/stores/reactions'
-import { FloatingReaction } from '@/features/reactions/components/ReactionPortals'
-import type { Reaction } from '@/features/reactions/types'
-
-/**
- * Renders floating emoji reactions inside the PiP window.
- * Reads the same shared reactionsStore used by the main window.
- */
-export const PipReactionPortals = () => {
-  const { reactions } = useSnapshot(reactionsStore)
-
-  return (
-    <>
-      {reactions.map((reaction) => (
-        <PipFloatingReaction key={reaction.id} reaction={reaction} />
-      ))}
-    </>
-  )
-}
-
-const PipFloatingReaction = ({ reaction }: { reaction: Reaction }) => {
-  const containerRef = useRef<HTMLDivElement>(null)
-  const speed = useMemo(() => Math.random() * 1.5 + 0.5, [])
-  const scale = useMemo(() => Math.max(Math.random() + 0.5, 1), [])
-
-  return (
-    <div
-      ref={containerRef}
-      className={css({
-        position: 'absolute',
-        top: 0,
-        left: 0,
-        width: '100%',
-        height: '100%',
-        pointerEvents: 'none',
-        overflow: 'hidden',
-      })}
-    >
-      <FloatingReaction
-        emoji={reaction.emoji}
-        speed={speed}
-        scale={scale}
-        name={reaction.participantName}
-        isLocal={reaction.isLocal}
-      />
-    </div>
-  )
-}
@@ -1,125 +0,0 @@
-import { useCallback, useRef } from 'react'
-import { supportsScreenSharing } from '@livekit/components-core'
-import { useTranslation } from 'react-i18next'
-import { styled } from '@/styled-system/jsx'
-import { SidePanel } from '@/features/rooms/livekit/components/SidePanel'
-import {
-  SidePanelStoreProvider,
-  useSidePanel,
-} from '@/features/rooms/livekit/hooks/useSidePanel'
-import { ReactionsToolbarStoreProvider } from '@/features/reactions/hooks/useReactionsToolbar'
-import { pipLayoutStore } from '../stores/pipLayoutStore'
-import { useEscapeDismiss } from '../hooks/useEscapeDismiss'
-import { usePipKeyboardShortcuts } from '../hooks/usePipKeyboardShortcuts'
-import { usePipRestoreFocus } from '../hooks/usePipRestoreFocus'
-import { usePipFocusModality } from '../hooks/usePipFocusModality'
-import { PipControlBar } from './PipControlBar'
-import { ReactionsToolbar } from '@/features/reactions/components/toolbar/ReactionsToolbar'
-import { PipStage } from './layouts/PipStage'
-import { PipNotificationOverlay } from './notifications/PipNotificationOverlay'
-import { PipConnectionStateToast } from './notifications/PipConnectionStateToast'
-import { PipReactionPortals } from './PipReactionPortals'
-
-export const PipView = () => {
-  return (
-    <SidePanelStoreProvider value={pipLayoutStore}>
-      <ReactionsToolbarStoreProvider value={pipLayoutStore}>
-        <PipViewContent />
-      </ReactionsToolbarStoreProvider>
-    </SidePanelStoreProvider>
-  )
-}
-
-const PipViewContent = () => {
-  const browserSupportsScreenSharing = supportsScreenSharing()
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'options.items.pictureInPicture',
-  })
-  const containerRef = useRef<HTMLDivElement>(null)
-  const { isSidePanelOpen, closePanel } = useSidePanel()
-
-  // Escape closes the side panel instead of the whole PiP window.
-  useEscapeDismiss(containerRef, isSidePanelOpen, closePanel)
-
-  // Forward keyboard shortcuts (Ctrl+D, Ctrl+E, etc.) to the main store.
-  usePipKeyboardShortcuts(containerRef)
-
-  // Sync React Aria's focus-visible modality with the PiP document.
-  usePipFocusModality(containerRef)
-
-  // Side panels open via a menu item that unmounts on click; fall back to the
-  // options button so focus returns somewhere visible.
-  const resolveTrigger = useCallback((activeEl: HTMLElement | null) => {
-    if (activeEl?.tagName === 'DIV') {
-      const doc = containerRef.current?.ownerDocument ?? document
-      return doc.getElementById('room-options-trigger')
-    }
-    return activeEl
-  }, [])
-  usePipRestoreFocus(containerRef, isSidePanelOpen, { resolveTrigger })
-
-  return (
-    <PipContainer
-      ref={containerRef}
-      role="region"
-      aria-label={t('windowLabel')}
-    >
-      <PipStage />
-      <ReactionsToolbar
-        toggleId="pip-reactions-toggle"
-        controlBarId="pip-control-bar"
-      />
-      <PipControlBar showScreenShare={browserSupportsScreenSharing} />
-      <SidePanel />
-      <PipReactionPortals />
-      <OverlayStack>
-        <PipConnectionStateToast />
-        <PipNotificationOverlay />
-      </OverlayStack>
-    </PipContainer>
-  )
-}
-
-const OverlayStack = styled('div', {
-  base: {
-    position: 'absolute',
-    top: '0.5rem',
-    left: '0.5rem',
-    right: '0.5rem',
-    display: 'flex',
-    flexDirection: 'column',
-    alignItems: 'center',
-    gap: '0.375rem',
-    pointerEvents: 'none',
-    zIndex: 1000,
-    '& > *': { pointerEvents: 'auto' },
-  },
-})
-
-const PipContainer = styled('div', {
-  base: {
-    position: 'relative',
-    width: '100%',
-    height: '100%',
-    display: 'grid',
-    gridTemplateRows: 'minmax(0, 1fr) auto auto',
-    backgroundColor: 'primaryDark.50',
-    // Disable LiveKit's own border-radius on tiles so our containers
-    // (GridCell, Thumbnail, StageFrame) own the clipping exclusively.
-    '--lk-border-radius': '4px',
-    '& .lk-participant-tile': {
-      height: '100%',
-    },
-    '& .lk-participant-media': {
-      height: '100%',
-    },
-    '& .lk-participant-media-video': {
-      height: '100%',
-      objectFit: 'cover',
-    },
-    '& .lk-grid-layout': {
-      height: '100%',
-      width: '100%',
-    },
-  },
-})
@@ -1,30 +0,0 @@
-import { useEffect, type ReactNode } from 'react'
-
-import { roomPiPStore } from '@/stores/roomPiP'
-import { DocumentPiPPortal } from './DocumentPiPPortal'
-import { PipView } from './PipView'
-import { useRoomPiP } from '../hooks/useRoomPiP'
-
-/**
- * Wrapper that mounts the PiP UI when room-level PiP state is enabled.
- * Bridges Valtio-backed PiP state with DocumentPiPPortal and PipView rendering.
- * PiP panel state is decoupled via explicit pipLayoutStore injection.
- */
-export const RoomPiP = (): ReactNode => {
-  const { isOpen, close } = useRoomPiP()
-
-  // Reset PiP state on unmount (e.g. leaving the room) so the next session
-  // starts with PiP closed and doesn't try to auto-reopen without a user gesture.
-  useEffect(() => {
-    return () => {
-      roomPiPStore.isOpen = false
-    }
-  }, [])
-
-  const portal = DocumentPiPPortal({
-    isOpen,
-    onClose: close,
-    children: <PipView />,
-  })
-  return portal
-}
@@ -1,105 +0,0 @@
-import { useEffect, useRef, useState } from 'react'
-import { RiMoreFill } from '@remixicon/react'
-import { FocusScope } from '@react-aria/focus'
-import { Box, Button } from '@/primitives'
-import { css } from '@/styled-system/css'
-import { useTranslation } from 'react-i18next'
-import { PipOptionsMenuItems } from './PipOptionsMenuItems'
-import { useEscapeDismiss } from '@/features/pip/hooks/useEscapeDismiss'
-import type { CollapsibleControl } from '../PipControlBar'
-
-type PipOptionsMenuProps = {
-  overflowControls?: Set<CollapsibleControl>
-}
-
-/**
- * PiP-native options menu. The shared `Menu` primitive mis-positions its
- * popover and loses focus across documents, so we drive open/close, focus
- * and dismissal ourselves.
- */
-export const PipOptionsMenu = ({ overflowControls }: PipOptionsMenuProps) => {
-  const { t } = useTranslation('rooms')
-  const wrapperRef = useRef<HTMLDivElement>(null)
-  const triggerRef = useRef<HTMLButtonElement>(null)
-  const [isOpen, setIsOpen] = useState(false)
-  const label = t('options.buttonLabel')
-
-  useEscapeDismiss(wrapperRef, isOpen, () => {
-    setIsOpen(false)
-    requestAnimationFrame(() => triggerRef.current?.focus())
-  })
-
-  useEffect(() => {
-    if (!isOpen) return
-    const doc = wrapperRef.current?.ownerDocument ?? document
-
-    const handleMenuItemClick = (event: MouseEvent) => {
-      const target = event.target as HTMLElement | null
-      const wrapper = wrapperRef.current
-      if (!wrapper || !target) return
-      if (wrapper.querySelector('button')?.contains(target)) return
-      if (target.closest('[role="menuitem"]')) {
-        requestAnimationFrame(() => {
-          setIsOpen(false)
-          triggerRef.current?.focus()
-        })
-      }
-    }
-
-    const handleOutsideClick = (event: MouseEvent) => {
-      const target = event.target as HTMLElement | null
-      const wrapper = wrapperRef.current
-      if (!wrapper || !target) return
-      if (wrapper.contains(target)) return
-      setIsOpen(false)
-    }
-
-    doc.addEventListener('click', handleMenuItemClick, true)
-    doc.addEventListener('mousedown', handleOutsideClick, true)
-    return () => {
-      doc.removeEventListener('click', handleMenuItemClick, true)
-      doc.removeEventListener('mousedown', handleOutsideClick, true)
-    }
-  }, [isOpen])
-
-  return (
-    <div
-      ref={wrapperRef}
-      className={css({
-        position: 'relative',
-      })}
-    >
-      <Button
-        ref={triggerRef}
-        id="room-options-trigger"
-        square
-        variant="primaryDark"
-        aria-label={label}
-        aria-haspopup="menu"
-        aria-expanded={isOpen}
-        tooltip={label}
-        onPress={() => setIsOpen(!isOpen)}
-      >
-        <RiMoreFill />
-      </Button>
-      {isOpen && (
-        <div
-          className={css({
-            position: 'absolute',
-            left: '50%',
-            bottom: 'calc(100% + 0.85rem)',
-            transform: 'translateX(-50%)',
-            zIndex: 10,
-          })}
-        >
-          {/* eslint-disable-next-line jsx-a11y/no-autofocus */}
-          <FocusScope autoFocus>
-            <Box size="sm" type="popover" variant="dark">
-              <PipOptionsMenuItems overflowControls={overflowControls} />
-            </Box>
-          </FocusScope>
-        </div>
-      )}
-    </div>
-  )
-}
@@ -1,47 +0,0 @@
-import { Menu as RACMenu, MenuSection } from 'react-aria-components'
-import { Separator } from '@/primitives/Separator'
-import { FeedbackMenuItem } from '@/features/rooms/livekit/components/controls/Options/FeedbackMenuItem'
-import { EffectsMenuItem } from '@/features/rooms/livekit/components/controls/Options/EffectsMenuItem'
-import { SupportMenuItem } from '@/features/rooms/livekit/components/controls/Options/SupportMenuItem'
-import { PictureInPictureMenuItem } from '@/features/rooms/livekit/components/controls/Options/PictureInPictureMenuItem'
-import { PipOverflowItems } from './PipOverflowItems'
-import type { CollapsibleControl } from '../PipControlBar'
-
-type PipOptionsMenuItemsProps = {
-  overflowControls?: Set<CollapsibleControl>
-}
-
-export const PipOptionsMenuItems = ({
-  overflowControls,
-}: PipOptionsMenuItemsProps) => {
-  const hasOverflow = (overflowControls?.size ?? 0) > 0
-
-  const hasOverflowControls = hasOverflow && overflowControls
-
-  return (
-    <RACMenu
-      style={{
-        minWidth: '150px',
-        width: '300px',
-      }}
-    >
-      {hasOverflowControls && (
-        <>
-          <MenuSection>
-            <PipOverflowItems overflowControls={overflowControls} />
-          </MenuSection>
-          <Separator />
-        </>
-      )}
-      <MenuSection>
-        <PictureInPictureMenuItem />
-        <EffectsMenuItem />
-      </MenuSection>
-      <Separator />
-      <MenuSection>
-        <SupportMenuItem />
-        <FeedbackMenuItem />
-      </MenuSection>
-    </RACMenu>
-  )
-}
@@ -1,65 +0,0 @@
-import React from 'react'
-import { MenuItem } from 'react-aria-components'
-import { RiHand, RiArrowUpLine, RiEmotionLine } from '@remixicon/react'
-import { useTranslation } from 'react-i18next'
-import { Track } from 'livekit-client'
-import { menuRecipe } from '@/primitives/menuRecipe'
-import { useRoomContext, useTrackToggle } from '@livekit/components-react'
-import { useRaisedHand } from '@/features/rooms/livekit/hooks/useRaisedHand'
-import { useReactionsToolbar } from '@/features/reactions/hooks/useReactionsToolbar'
-import { CollapsibleControls, type CollapsibleControl } from '../PipControlBar'
-
-type PipOverflowItemsProps = {
-  overflowControls: Set<CollapsibleControl>
-}
-
-export const PipOverflowItems = ({
-  overflowControls,
-}: PipOverflowItemsProps) => {
-  const { t } = useTranslation('rooms')
-  const room = useRoomContext()
-  const { isHandRaised, toggleRaisedHand } = useRaisedHand({
-    participant: room.localParticipant,
-  })
-  const { buttonProps: screenShareProps, enabled: isScreenSharing } =
-    useTrackToggle({
-      source: Track.Source.ScreenShare,
-      captureOptions: { audio: true, selfBrowserSurface: 'include' },
-    })
-  const { toggle: toggleReactions } = useReactionsToolbar()
-  const itemClass = menuRecipe({ icon: true, variant: 'dark' }).item
-
-  return (
-    <>
-      {overflowControls.has(CollapsibleControls.REACTIONS) && (
-        <MenuItem onAction={toggleReactions} className={itemClass}>
-          <RiEmotionLine size={20} />
-          {t('controls.reactions.button')}
-        </MenuItem>
-      )}
-      {overflowControls.has(CollapsibleControls.SCREEN_SHARE) && (
-        <MenuItem
-          onAction={() =>
-            screenShareProps.onClick?.(
-              {} as React.MouseEvent<HTMLButtonElement>
-            )
-          }
-          className={itemClass}
-        >
-          <RiArrowUpLine size={20} />
-          {t(
-            isScreenSharing
-              ? 'controls.screenShare.stop'
-              : 'controls.screenShare.start'
-          )}
-        </MenuItem>
-      )}
-      {overflowControls.has(CollapsibleControls.HAND) && (
-        <MenuItem onAction={toggleRaisedHand} className={itemClass}>
-          <RiHand size={20} />
-          {isHandRaised ? t('controls.hand.lower') : t('controls.hand.raise')}
-        </MenuItem>
-      )}
-    </>
-  )
-}
@@ -1,76 +0,0 @@
-import { memo } from 'react'
-import type { TrackReferenceOrPlaceholder } from '@livekit/components-core'
-import { styled } from '@/styled-system/jsx'
-import { ParticipantTile } from '@/features/rooms/livekit/components/ParticipantTile'
-import { getTrackKey } from '../../utils/pipTrackSelection'
-
-type PipFocusLayoutProps = {
-  mainTrack: TrackReferenceOrPlaceholder
-  thumbnailTrack?: TrackReferenceOrPlaceholder
-}
-
-/**
- * Focus layout used when 1-2 tracks are visible in the PiP window.
- *
- * The main tile is letterboxed (object-fit: contain) so the camera is
- * never stretched to a non-video aspect and leaves dark padding
- * above/below when the window shape doesn't match the source.
- * The thumbnail keeps the usual cover fill.
- */
-export const PipFocusLayout = memo(
-  ({ mainTrack, thumbnailTrack }: PipFocusLayoutProps) => {
-    return (
-      <FocusContainer>
-        <MainSlot>
-          <ParticipantTile key={getTrackKey(mainTrack)} trackRef={mainTrack} />
-        </MainSlot>
-        {thumbnailTrack && (
-          <Thumbnail>
-            <ParticipantTile
-              key={getTrackKey(thumbnailTrack)}
-              trackRef={thumbnailTrack}
-            />
-          </Thumbnail>
-        )}
-      </FocusContainer>
-    )
-  }
-)
-PipFocusLayout.displayName = 'PipFocusLayout'
-
-const FocusContainer = styled('div', {
-  base: {
-    position: 'relative',
-    width: '100%',
-    height: '100%',
-    borderRadius: '4px',
-    overflow: 'hidden',
-    backgroundColor: 'primaryDark.100',
-  },
-})
-
-const MainSlot = styled('div', {
-  base: {
-    width: '100%',
-    height: '100%',
-    '& .lk-participant-media-video': {
-      objectFit: 'contain',
-    },
-  },
-})
-
-const Thumbnail = styled('div', {
-  base: {
-    position: 'absolute',
-    right: '1rem',
-    bottom: '1rem',
-    width: '42%',
-    maxWidth: '220px',
-    minWidth: '140px',
-    aspectRatio: '16 / 9',
-    borderRadius: '4px',
-    overflow: 'hidden',
-    boxShadow: 'md',
-    zIndex: 2,
-  },
-})
@@ -1,81 +0,0 @@
-import { memo, useMemo, useRef } from 'react'
-import type { TrackReferenceOrPlaceholder } from '@livekit/components-core'
-import { styled } from '@/styled-system/jsx'
-import { ParticipantTile } from '@/features/rooms/livekit/components/ParticipantTile'
-import { usePipElementSize } from '../../hooks/usePipElementSize'
-import { usePipFlipAnimations } from '../../hooks/usePipFlipAnimations'
-import { computePipGridLayout } from '../../utils/pipGrid'
-import { getTrackKey } from '../../utils/pipTrackSelection'
-
-type PipGridLayoutProps = {
-  tracks: TrackReferenceOrPlaceholder[]
-}
-
-/**
- * Adaptive grid used when 3+ tracks are visible in the PiP window.
- *
- * All grid math (shape choice + partial-row stretching) is delegated to
- * `computePipGridLayout`. This component only measures the container,
- * applies the returned placements, and plays a FLIP animation when the
- * tile set or grid shape changes (participant joins/leaves or shape shift).
- *
- * Tiles keep a stable key so resizing never remounts <video> elements.
- */
-export const PipGridLayout = memo(({ tracks }: PipGridLayoutProps) => {
-  const containerRef = useRef<HTMLDivElement>(null)
-  const { width, height } = usePipElementSize(containerRef)
-
-  const tileKeys = useMemo(() => tracks.map(getTrackKey), [tracks])
-
-  const { rows, subColumns, placements } = useMemo(
-    () => computePipGridLayout(tracks.length, width, height),
-    [tracks.length, width, height]
-  )
-
-  const gridStyle = useMemo(
-    () => ({
-      gridTemplateColumns: `repeat(${subColumns}, minmax(0, 1fr))`,
-      gridTemplateRows: `repeat(${rows}, minmax(0, 1fr))`,
-    }),
-    [subColumns, rows]
-  )
-
-  usePipFlipAnimations(containerRef, tileKeys)
-
-  return (
-    <GridContainer ref={containerRef} style={gridStyle}>
-      {tracks.map((track, index) => (
-        <GridCell key={tileKeys[index]} style={placements[index]}>
-          <ParticipantTile trackRef={track} />
-        </GridCell>
-      ))}
-    </GridContainer>
-  )
-})
-PipGridLayout.displayName = 'PipGridLayout'
-
-const GridContainer = styled('div', {
-  base: {
-    width: '100%',
-    height: '100%',
-    display: 'grid',
-    gap: '0.25rem',
-  },
-})
-
-const GridCell = styled('div', {
-  base: {
-    position: 'relative',
-    minWidth: 0,
-    minHeight: 0,
-    borderRadius: '4px',
-    overflow: 'hidden',
-    backgroundColor: 'primaryDark.100',
-    // Paint on own layer so FLIP transforms don't trigger layout thrash.
-    willChange: 'transform',
-    '& .lk-participant-tile': {
-      width: '100%',
-      height: '100%',
-    },
-  },
-})
@@ -1,88 +0,0 @@
-import { useEffect, useMemo, useRef } from 'react'
-import { useTranslation } from 'react-i18next'
-import { useTracks } from '@livekit/components-react'
-import { Track } from 'livekit-client'
-import { styled } from '@/styled-system/jsx'
-import {
-  isCameraTrack,
-  pickLocalCameraTrack,
-  pickRemoteCameraTrack,
-  pickScreenShareTrack,
-} from '../../utils/pipTrackSelection'
-import { PipFocusLayout } from './PipFocusLayout'
-import { PipGridLayout } from './PipGridLayout'
-
-/**
- * Above this count the PiP stage switches from the focus layout
- * (main + thumbnail) to the adaptive grid layout.
- */
-const FOCUS_MAX_TILES = 2
-
-// Handles which layout to render inside the PiP stage.
-
-export const PipStage = () => {
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'options.items.pictureInPicture',
-  })
-  const tracks = useTracks(
-    [
-      { source: Track.Source.Camera, withPlaceholder: true },
-      { source: Track.Source.ScreenShare, withPlaceholder: false },
-    ],
-    { onlySubscribed: false }
-  )
-
-  const screenShareTrack = useMemo(() => pickScreenShareTrack(tracks), [tracks])
-
-  // Order the list so the "focus target" (screen share when available,
-  // otherwise a remote camera) is first. Both layouts consume this order.
-  const stageTracks = useMemo(() => {
-    const cameraTracks = tracks.filter(isCameraTrack)
-    if (!screenShareTrack) return cameraTracks
-    return [screenShareTrack, ...cameraTracks]
-  }, [tracks, screenShareTrack])
-
-  // avoid tabbing to the stage when it's not visible
-  const frameRef = useRef<HTMLDivElement>(null)
-  useEffect(() => {
-    frameRef.current?.setAttribute('inert', '')
-  }, [])
-
-  if (stageTracks.length === 0) return null
-
-  const stageLabel = t('stage')
-
-  if (stageTracks.length > FOCUS_MAX_TILES) {
-    return (
-      <StageFrame ref={frameRef} role="region" aria-label={stageLabel}>
-        <PipGridLayout tracks={stageTracks} />
-      </StageFrame>
-    )
-  }
-
-  const localCameraTrack = pickLocalCameraTrack(stageTracks)
-  const remoteCameraTrack = pickRemoteCameraTrack(stageTracks)
-  const mainTrack = screenShareTrack ?? remoteCameraTrack ?? stageTracks[0]
-  const thumbnailTrack =
-    localCameraTrack && localCameraTrack !== mainTrack
-      ? localCameraTrack
-      : stageTracks.find((track) => track !== mainTrack)
-
-  return (
-    <StageFrame ref={frameRef} role="region" aria-label={stageLabel}>
-      <PipFocusLayout mainTrack={mainTrack} thumbnailTrack={thumbnailTrack} />
-    </StageFrame>
-  )
-}
-
-const StageFrame = styled('div', {
-  base: {
-    position: 'relative',
-    minWidth: 0,
-    minHeight: 0,
-    marginLeft: '0.5rem',
-    marginRight: '0.5rem',
-    borderRadius: '4px',
-    overflow: 'hidden',
-  },
-})
@@ -1,45 +0,0 @@
-import { useConnectionState, useRoomContext } from '@livekit/components-react'
-import { ConnectionState } from 'livekit-client'
-import { useTranslation } from 'react-i18next'
-import { styled } from '@/styled-system/jsx'
-
-/**
- * Banner surfaced inside the PiP when the room connection degrades.
- *
- * Scoped to `Reconnecting` / `Disconnected` - the two states the user needs
- * to see while their attention is on the PiP rather than the main window.
- */
-export const PipConnectionStateToast = () => {
-  const room = useRoomContext()
-  const state = useConnectionState(room)
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'options.items.pictureInPicture.connection',
-  })
-
-  const connectionLabels: Partial<Record<ConnectionState, string>> = {
-    [ConnectionState.Reconnecting]: t('reconnecting'),
-    [ConnectionState.Disconnected]: t('disconnected'),
-  }
-  const label = connectionLabels[state] ?? null
-
-  if (!label) return null
-
-  return <Banner role="status">{label}</Banner>
-}
-
-const Banner = styled('div', {
-  base: {
-    backgroundColor: 'greyscale.800',
-    color: 'white',
-    fontSize: '0.8125rem',
-    lineHeight: 1.3,
-    padding: '0.375rem 0.75rem',
-    borderRadius: '6px',
-    boxShadow:
-      'rgba(0, 0, 0, 0.4) 0px 2px 6px 0px, rgba(0, 0, 0, 0.25) 0px 4px 12px 2px',
-    animation: 'fade 200ms',
-    '@media (prefers-reduced-motion: reduce)': {
-      animation: 'none',
-    },
-  },
-})
@@ -1,71 +0,0 @@
-import { useToastQueue } from '@react-stately/toast'
-import { RiCloseLine } from '@remixicon/react'
-import { styled } from '@/styled-system/jsx'
-import { Button } from '@/primitives'
-import { useTranslation } from 'react-i18next'
-import {
-  toastQueue,
-  type ToastData,
-} from '@/features/notifications/components/ToastProvider'
-import { StyledToastContainer } from '@/features/notifications/components/Toast'
-import { PipToastBody } from './PipToastBody'
-
-/**
- * Shows shared toasts in the PiP window.
- * We use a local aria-live region so screen readers can read them in PiP.
- */
-const MAX_VISIBLE = 3
-
-export const PipNotificationOverlay = () => {
-  const state = useToastQueue<ToastData>(toastQueue)
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'options.items.pictureInPicture',
-  })
-
-  if (state.visibleToasts.length === 0) return null
-
-  const toasts = state.visibleToasts.slice(0, MAX_VISIBLE)
-
-  return (
-    <Region
-      role="region"
-      aria-label={t('notificationsLabel')}
-      aria-live="polite"
-    >
-      {toasts.map((toast) => (
-        <StyledToastContainer
-          key={toast.key}
-          aria-atomic="true"
-          css={{
-            margin: 0,
-            marginLeft: 0,
-            display: 'flex',
-            alignItems: 'center',
-            paddingRight: '0.25rem',
-          }}
-        >
-          <PipToastBody toast={toast} />
-          <Button
-            square
-            size="sm"
-            invisible
-            aria-label={t('dismissNotification')}
-            onPress={() => state.close(toast.key)}
-          >
-            <RiCloseLine size={16} color="white" aria-hidden="true" />
-          </Button>
-        </StyledToastContainer>
-      ))}
-    </Region>
-  )
-}
-
-const Region = styled('div', {
-  base: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '0.375rem',
-    alignItems: 'center',
-    width: '100%',
-  },
-})
@@ -1,119 +0,0 @@
-import type { QueuedToast } from '@react-stately/toast'
-import { useTranslation } from 'react-i18next'
-import { RiHand, RiMessage2Line } from '@remixicon/react'
-import type { ReactNode } from 'react'
-import { css } from '@/styled-system/css'
-import { HStack } from '@/styled-system/jsx'
-import { NotificationType } from '@/features/notifications/NotificationType'
-import type { ToastData } from '@/features/notifications/components/ToastProvider'
-import { RecordingMode } from '@/features/recording'
-
-type Props = {
-  toast: QueuedToast<ToastData>
-}
-
-/**
- * Renders the toast content used in PiP.
- * PiP stays display-only, so main-window actions are not shown here.
- */
-export const PipToastBody = ({ toast }: Props) => {
-  const { t } = useTranslation('notifications')
-  const { type, participant, message, removedSources } = toast.content
-  const name = participant?.name || t('defaultName')
-
-  switch (type) {
-    case NotificationType.ParticipantJoined:
-      return <Line>{t('joined.description', { name })}</Line>
-
-    case NotificationType.ParticipantMuted:
-      return <Line>{t('muted', { name })}</Line>
-
-    case NotificationType.HandRaised:
-      return (
-        <Line>
-          <RiHand
-            size={16}
-            color="white"
-            className={iconStyle}
-            aria-hidden="true"
-          />
-          {t('raised.description', { name })}
-        </Line>
-      )
-
-    case NotificationType.MessageReceived:
-      return (
-        <Line>
-          <RiMessage2Line
-            size={16}
-            color="white"
-            className={iconStyle}
-            aria-hidden="true"
-          />
-          <span>
-            <strong>{name}</strong>
-            {message ? ` - ${message}` : null}
-          </span>
-        </Line>
-      )
-
-    case NotificationType.TranscriptionStarted:
-      return <Line>{t('transcript.started', { name })}</Line>
-    case NotificationType.TranscriptionStopped:
-      return <Line>{t('transcript.stopped', { name })}</Line>
-    case NotificationType.TranscriptionLimitReached:
-      return <Line>{t('transcript.limitReached')}</Line>
-    case NotificationType.TranscriptionRequested:
-      return <Line>{t('transcript.requested', { name })}</Line>
-
-    case NotificationType.ScreenRecordingStarted:
-      return <Line>{t('screenRecording.started', { name })}</Line>
-    case NotificationType.ScreenRecordingStopped:
-      return <Line>{t('screenRecording.stopped', { name })}</Line>
-    case NotificationType.ScreenRecordingLimitReached:
-      return <Line>{t('screenRecording.limitReached')}</Line>
-    case NotificationType.ScreenRecordingRequested:
-      return <Line>{t('screenRecording.requested', { name })}</Line>
-
-    case NotificationType.RecordingSaving: {
-      const mode = toast.content.mode as RecordingMode | undefined
-      const key =
-        mode === RecordingMode.ScreenRecording
-          ? 'recordingSave.screenRecording.default'
-          : 'recordingSave.transcript.default'
-      return <Line>{t(key)}</Line>
-    }
-
-    case NotificationType.PermissionsRemoved: {
-      const key = resolvePermissionsKey(removedSources)
-      if (!key) return null
-      return <Line>{t(`permissionsRemoved.${key}`)}</Line>
-    }
-
-    default:
-      return message ? <Line>{message}</Line> : null
-  }
-}
-
-const resolvePermissionsKey = (sources: unknown): string | null => {
-  if (!Array.isArray(sources) || sources.length === 0) return null
-  if (sources.length === 1) return sources[0] as string
-  if (sources.includes('screen_share')) return 'screen_share'
-  return null
-}
-
-const Line = ({ children }: { children: ReactNode }) => (
-  <HStack
-    alignItems="center"
-    gap="0.5rem"
-    padding="0.625rem 0.75rem"
-    className={css({
-      fontSize: '0.8125rem',
-      lineHeight: 1.3,
-    })}
-  >
-    {children}
-  </HStack>
-)
-
-const iconStyle = css({ flexShrink: 0 })
@@ -1,107 +0,0 @@
-import { useCallback, useEffect, useRef, useState } from 'react'
-
-type DocumentPictureInPicture = {
-  requestWindow: (options?: {
-    width?: number
-    height?: number
-  }) => Promise<Window>
-}
-
-type WindowWithDocumentPiP = Window & {
-  documentPictureInPicture?: DocumentPictureInPicture
-}
-
-export const useDocumentPiP = ({
-  width = 400,
-  height = 480,
-}: {
-  width?: number
-  height?: number
-} = {}) => {
-  const [pipWindow, setPipWindow] = useState<Window | null>(null)
-  const pipWindowRef = useRef<Window | null>(null)
-  const pendingPiPRef = useRef<Promise<Window | null> | null>(null)
-
-  const [isSupported] = useState(() => {
-    if (typeof globalThis === 'undefined') return false
-    return 'documentPictureInPicture' in globalThis
-  })
-
-  const openPiP = useCallback(async () => {
-    if (!isSupported) return null
-    const existingWindow = pipWindowRef.current
-    if (existingWindow && !existingWindow.closed) return existingWindow
-
-    if (pendingPiPRef.current) return pendingPiPRef.current
-
-    // Request a new PiP window from the browser API.
-    const pip = (globalThis as unknown as WindowWithDocumentPiP)
-      .documentPictureInPicture
-    if (!pip) return null
-
-    const requestPromise = (async () => {
-      try {
-        const win = await pip.requestWindow({ width, height })
-        const currentWindow = pipWindowRef.current
-        if (currentWindow && !currentWindow.closed) return currentWindow
-        setPipWindow(win)
-        return win
-      } catch (error) {
-        // Avoid unhandled rejections if the user blocks or closes the request.
-        console.error('Failed to open Picture-in-Picture window', error)
-        return null
-      } finally {
-        pendingPiPRef.current = null
-      }
-    })()
-
-    pendingPiPRef.current = requestPromise
-    return requestPromise
-  }, [height, isSupported, width])
-
-  const closePiP = useCallback(() => {
-    if (!pipWindow) return
-    if (!pipWindow.closed) {
-      pipWindow.close()
-    }
-    setPipWindow(null)
-  }, [pipWindow])
-
-  useEffect(() => {
-    pipWindowRef.current = pipWindow
-  }, [pipWindow])
-
-  // Force-close the native PiP window when the hook unmounts (e.g. the user
-  // hangs up and the room is navigated away before `closePiP` could run).
-  useEffect(() => {
-    return () => {
-      const win = pipWindowRef.current
-      if (win && !win.closed) win.close()
-      pipWindowRef.current = null
-    }
-  }, [])
-
-  useEffect(() => {
-    if (!pipWindow) return
-
-    const handleClose = () => {
-      setPipWindow(null)
-    }
-
-    pipWindow.addEventListener('pagehide', handleClose)
-    pipWindow.addEventListener('beforeunload', handleClose)
-
-    return () => {
-      pipWindow.removeEventListener('pagehide', handleClose)
-      pipWindow.removeEventListener('beforeunload', handleClose)
-    }
-  }, [pipWindow])
-
-  return {
-    isSupported,
-    isOpen: !!pipWindow && !pipWindow.closed,
-    pipWindow,
-    openPiP,
-    closePiP,
-  }
-}
@@ -1,28 +0,0 @@
-import { useEffect, useRef, type RefObject } from 'react'
-
-export const useEscapeDismiss = (
-  ref: RefObject<HTMLElement | null>,
-  isActive: boolean,
-  onDismiss: () => void
-) => {
-  const latestOnDismiss = useRef(onDismiss)
-  useEffect(() => {
-    latestOnDismiss.current = onDismiss
-  })
-
-  useEffect(() => {
-    if (!isActive) return
-    const el = ref.current
-    if (!el) return
-
-    const handler = (event: KeyboardEvent) => {
-      if (event.key !== 'Escape' || event.defaultPrevented) return
-      event.preventDefault()
-      event.stopPropagation()
-      latestOnDismiss.current()
-    }
-
-    el.addEventListener('keydown', handler)
-    return () => el.removeEventListener('keydown', handler)
-  }, [ref, isActive])
-}
@@ -1,42 +0,0 @@
-import { useCallback, useEffect, useState, type RefObject } from 'react'
-
-type Size = { width: number; height: number }
-
-/**
- * Observes an element's size, even when mounted in the PiP document.
- * Resolves `ResizeObserver` from the element's own window.
- */
-export const usePipElementSize = <T extends HTMLElement>(
-  ref: RefObject<T | null>
-): Size => {
-  const [size, setSize] = useState<Size>({ width: 0, height: 0 })
-
-  const measure = useCallback(() => {
-    const el = ref.current
-    if (!el) return
-    const rect = el.getBoundingClientRect()
-    setSize({ width: rect.width, height: rect.height })
-  }, [ref])
-
-  useEffect(() => {
-    const el = ref.current
-    if (!el) return
-
-    measure()
-
-    const RO =
-      el.ownerDocument.defaultView?.ResizeObserver ?? globalThis.ResizeObserver
-    if (!RO) return
-
-    const observer = new RO((entries) => {
-      const entry = entries[0]
-      if (!entry) return
-      const { width, height } = entry.contentRect
-      setSize({ width, height })
-    })
-    observer.observe(el)
-    return () => observer.disconnect()
-  }, [ref, measure])
-
-  return size
-}
@@ -1,91 +0,0 @@
-import { useLayoutEffect, useRef, type RefObject } from 'react'
-
-type Options = {
-  /** Animation duration in ms. */
-  duration?: number
-  /** CSS easing function. */
-  easing?: string
-}
-
-/**
- * FLIP (First, Last, Invert, Play) animation hook.
- *
- * For every keyed direct child of `containerRef`, records its position
- * before a render (the "first" rect) and, once the DOM has committed, plays
- * an inverse transform back to the identity position. The effect is a
- * smooth slide whenever tiles are added, removed, reordered, or a new grid
- * shape shifts them.
- *
- * Safe to call inside a Document PiP window: uses the element's own
- * Web Animations API (element.animate) which lives in the PiP document.
- * Respects `prefers-reduced-motion` and no-ops on the first mount.
- */
-export const usePipFlipAnimations = <T extends HTMLElement>(
-  containerRef: RefObject<T | null>,
-  keys: ReadonlyArray<string>,
-  { duration = 220, easing = 'cubic-bezier(0.2, 0, 0, 1)' }: Options = {}
-) => {
-  const prevRectsRef = useRef<Map<string, DOMRect>>(new Map())
-  const firstRunRef = useRef(true)
-
-  useLayoutEffect(() => {
-    const container = containerRef.current
-    if (!container) return
-
-    const doc = container.ownerDocument
-    const view = doc.defaultView
-    const reduceMotion = view?.matchMedia(
-      '(prefers-reduced-motion: reduce)'
-    ).matches
-
-    const children = Array.from(container.children) as HTMLElement[]
-    const nextRects = new Map<string, DOMRect>()
-    children.forEach((el, i) => {
-      const key = keys[i]
-      if (!key) return
-      nextRects.set(key, el.getBoundingClientRect())
-    })
-
-    if (firstRunRef.current) {
-      firstRunRef.current = false
-      prevRectsRef.current = nextRects
-      return
-    }
-
-    if (!reduceMotion) {
-      children.forEach((el, i) => {
-        const key = keys[i]
-        if (!key) return
-        const prev = prevRectsRef.current.get(key)
-        const next = nextRects.get(key)
-        if (!prev || !next) return
-
-        const dx = prev.left - next.left
-        const dy = prev.top - next.top
-        const sx = next.width === 0 ? 1 : prev.width / next.width
-        const sy = next.height === 0 ? 1 : prev.height / next.height
-
-        // Skip no-ops: sub-pixel shifts don't benefit from animation.
-        if (
-          Math.abs(dx) < 1 &&
-          Math.abs(dy) < 1 &&
-          Math.abs(sx - 1) < 0.01 &&
-          Math.abs(sy - 1) < 0.01
-        )
-          return
-
-        el.animate(
-          [
-            {
-              transform: `translate(${dx}px, ${dy}px) scale(${sx}, ${sy})`,
-            },
-            { transform: 'translate(0, 0) scale(1, 1)' },
-          ],
-          { duration, easing, fill: 'backwards' }
-        )
-      })
-    }
-
-    prevRectsRef.current = nextRects
-  }, [containerRef, duration, easing, keys])
-}
@@ -1,26 +0,0 @@
-import { useEffect, type RefObject } from 'react'
-import { setInteractionModality } from '@react-aria/interactions'
-
-/**
- * Sync React Aria's interaction modality with the PiP document.
- * React Aria only installs keyboard/mouse listeners on the main document,
- * so focus-visible rings never appear in PiP without this bridge.
- */
-export const usePipFocusModality = (
-  containerRef: RefObject<HTMLElement | null>
-) => {
-  useEffect(() => {
-    const doc = containerRef.current?.ownerDocument
-    if (!doc || doc === document) return
-
-    const onKeyDown = () => setInteractionModality('keyboard')
-    const onMouseDown = () => setInteractionModality('pointer')
-
-    doc.addEventListener('keydown', onKeyDown, true)
-    doc.addEventListener('mousedown', onMouseDown, true)
-    return () => {
-      doc.removeEventListener('keydown', onKeyDown, true)
-      doc.removeEventListener('mousedown', onMouseDown, true)
-    }
-  }, [containerRef])
-}
@@ -1,45 +0,0 @@
-import { useEffect, type RefObject } from 'react'
-import { keyboardShortcutsStore } from '@/stores/keyboardShortcuts'
-import { formatShortcutKey } from '@/features/shortcuts/utils'
-import { isMacintosh } from '@/utils/livekit'
-
-/**
- * Mirror the main-window keyboard shortcuts inside the PiP document.
- *
- * The central `useKeyboardShortcuts` hook listens on `window`, which is the
- * main document's window. Keydown events from the PiP document never reach
- * it. This hook attaches the same dispatch logic to the PiP document so that
- * Ctrl+D (mic), Ctrl+E (cam), etc. work identically in both contexts.
- */
-export const usePipKeyboardShortcuts = (
-  containerRef: RefObject<HTMLElement | null>
-) => {
-  useEffect(() => {
-    const doc = containerRef.current?.ownerDocument
-    if (!doc || doc === document) return
-
-    const onKeyDown = (e: KeyboardEvent) => {
-      const { key, metaKey, ctrlKey, shiftKey, altKey } = e
-      if (!key) return
-
-      const shortcutKey = formatShortcutKey({
-        key,
-        ctrlKey: ctrlKey || (isMacintosh() && metaKey),
-        shiftKey,
-        altKey,
-      })
-
-      let handler = keyboardShortcutsStore.shortcuts.get(shortcutKey)
-      if (!handler && shortcutKey === 'ctrl+shift+?') {
-        handler = keyboardShortcutsStore.shortcuts.get('ctrl+shift+/')
-      }
-      if (!handler) return
-
-      e.preventDefault()
-      handler()
-    }
-
-    doc.addEventListener('keydown', onKeyDown)
-    return () => doc.removeEventListener('keydown', onKeyDown)
-  }, [containerRef])
-}
@@ -1,41 +0,0 @@
-import { useEffect, useRef, type RefObject } from 'react'
-
-type Options = {
-  /** Remap the captured trigger (e.g. when it unmounts on click). */
-  resolveTrigger?: (activeEl: HTMLElement | null) => HTMLElement | null
-}
-
-/**
- * `useRestoreFocus`: captures and restores focus via the PiP
- * document instead of the main one.
- */
-export const usePipRestoreFocus = (
-  ref: RefObject<HTMLElement | null>,
-  isOpen: boolean,
-  { resolveTrigger }: Options = {}
-) => {
-  const prevOpenRef = useRef(false)
-  const triggerRef = useRef<HTMLElement | null>(null)
-
-  useEffect(() => {
-    const doc = ref.current?.ownerDocument
-    const wasOpen = prevOpenRef.current
-    prevOpenRef.current = isOpen
-
-    if (!doc) return
-
-    if (!wasOpen && isOpen) {
-      const activeEl = doc.activeElement as HTMLElement | null
-      triggerRef.current = resolveTrigger ? resolveTrigger(activeEl) : activeEl
-      return
-    }
-
-    if (wasOpen && !isOpen) {
-      const trigger = triggerRef.current
-      triggerRef.current = null
-      if (trigger && doc.contains(trigger)) {
-        requestAnimationFrame(() => trigger.focus({ preventScroll: true }))
-      }
-    }
-  }, [ref, isOpen, resolveTrigger])
-}
@@ -1,30 +0,0 @@
-import { useCallback } from 'react'
-import { useSnapshot } from 'valtio'
-import { roomPiPStore } from '@/stores/roomPiP'
-
-export const useRoomPiP = () => {
-  const { isOpen } = useSnapshot(roomPiPStore)
-  const isSupported =
-    typeof globalThis !== 'undefined' &&
-    'documentPictureInPicture' in globalThis
-
-  const open = useCallback(() => {
-    roomPiPStore.isOpen = true
-  }, [])
-
-  const close = useCallback(() => {
-    roomPiPStore.isOpen = false
-  }, [])
-
-  const toggle = useCallback(() => {
-    roomPiPStore.isOpen = !roomPiPStore.isOpen
-  }, [])
-
-  return {
-    isSupported,
-    isOpen,
-    open,
-    close,
-    toggle,
-  }
-}
@@ -1,19 +0,0 @@
-import { proxy } from 'valtio'
-import type { PanelId, SubPanelId } from '@/features/rooms/livekit/types/panel'
-
-type PipLayoutState = {
-  activePanelId: PanelId | null
-  activeSubPanelId: SubPanelId | null
-  showReactionsToolbar: boolean
-}
-
-/**
- * Separate layout store for the PiP window.
- * Decouples PiP side panel state from the main view so opening Chat/Info/etc.
- * in PiP does not affect the main window and vice versa.
- */
-export const pipLayoutStore = proxy<PipLayoutState>({
-  activePanelId: null,
-  activeSubPanelId: null,
-  showReactionsToolbar: false,
-})
@@ -1,114 +0,0 @@
-export type PipTilePlacement = {
-  gridColumn: string
-  gridRow: number
-}
-
-export type PipGridLayout = {
-  cols: number
-  rows: number
-  /** Number of CSS sub-columns; use as `repeat(subColumns, 1fr)`. */
-  subColumns: number
-  /** One entry per tile, in input order. */
-  placements: PipTilePlacement[]
-}
-
-/**
- * Target tile aspect ratio used to score candidate grid shapes.
- *
- * Video sources are 16:9, but picking 16:9 as the target makes the
- * scorer indifferent between a stretched 2-col slab (aspect ~2.7) and a
- * squarer 3-col tile (aspect ~1.2) because log distance is symmetric.
- * The UI works better with square, face-friendly tiles. This target keeps
- * wide windows from collapsing to 2 columns with short, stretched rows
- * and pushes the scorer to add a column instead.
- */
-const TARGET_TILE_ASPECT = 1
-
-/**
- * Smallest count from which we force at least two columns.
- * For 1-3 participants it is acceptable to stack vertically in tall
- * windows, but from 4 people onwards we keep >=2 columns to
- * avoid endless vertical scrolling; the scorer handles the rest.
- */
-const FORCE_TWO_COLS_COUNT = 4
-
-const pickGridShape = (
-  count: number,
-  width: number,
-  height: number
-): { cols: number; rows: number } => {
-  if (count <= 1) return { cols: 1, rows: Math.max(1, count) }
-  if (width <= 0 || height <= 0) return { cols: count, rows: 1 }
-
-  const minCols = count >= FORCE_TWO_COLS_COUNT ? 2 : 1
-
-  let best = {
-    cols: minCols,
-    rows: Math.ceil(count / minCols),
-    score: -Infinity,
-  }
-  for (let cols = minCols; cols <= count; cols++) {
-    const rows = Math.ceil(count / cols)
-    const tileW = width / cols
-    const tileH = height / rows
-    if (tileW <= 0 || tileH <= 0) continue
-
-    // Score: aspect close to target, few empty cells, large tile area,
-    // and a tiny bias toward fewer rows so ties (perfectly square shapes)
-    // resolve in favour of a shorter, wider grid.
-    const aspectScore = -Math.abs(Math.log(tileW / tileH / TARGET_TILE_ASPECT))
-    const emptyCells = cols * rows - count
-    const fillScore = -emptyCells * 0.1
-    const areaScore = Math.log(tileW * tileH) * 0.5
-    const rowsPenalty = -rows * 0.01
-
-    const score = aspectScore * 2 + fillScore + areaScore + rowsPenalty
-    if (score > best.score) best = { cols, rows, score }
-  }
-  return { cols: best.cols, rows: best.rows }
-}
-
-/**
- * Pure function. Given a tile count and stage dimensions, returns the CSS
- * grid layout for the PiP stage:
- *
- *  - picks a cols x rows shape close to 16:9 tiles,
- *  - stretches any partial last row so its tiles share the full row width
- *    (no empty cells, no small centered tile).
- *
- * Callers consume the result directly: `subColumns` feeds
- * `grid-template-columns: repeat(N, 1fr)` and each tile reads its own
- * `gridColumn`/`gridRow` from `placements`.
- */
-export const computePipGridLayout = (
-  count: number,
-  width: number,
-  height: number
-): PipGridLayout => {
-  if (count <= 0) {
-    return { cols: 1, rows: 1, subColumns: 1, placements: [] }
-  }
-
-  const { cols, rows } = pickGridShape(count, width, height)
-  const tilesInLastRow = count - cols * (rows - 1)
-  const hasPartialRow = tilesInLastRow > 0 && tilesInLastRow < cols
-
-  const subColumns = hasPartialRow ? cols * tilesInLastRow : cols
-  const fullRowSpan = hasPartialRow ? tilesInLastRow : 1
-  const lastRowSpan = hasPartialRow ? cols : 1
-
-  const placements: PipTilePlacement[] = []
-  for (let i = 0; i < count; i++) {
-    const row = Math.floor(i / cols)
-    const colIndex = i % cols
-    const isLastRow = row === rows - 1 && hasPartialRow
-    const span = isLastRow ? lastRowSpan : fullRowSpan
-    const colStart = colIndex * span + 1
-    placements.push({
-      gridColumn: `${colStart} / span ${span}`,
-      gridRow: row + 1,
-    })
-  }
-
-  return { cols, rows, subColumns, placements }
-}
@@ -1,48 +0,0 @@
-import {
-  isTrackReference,
-  TrackReferenceOrPlaceholder,
-} from '@livekit/components-core'
-import { Track } from 'livekit-client'
-
-/**
- * Helpers used by the PiP layouts to classify/pick tracks.
- * Kept free of React so they are trivially testable and cheap to call.
- */
-
-export const pickScreenShareTrack = (
-  tracks: TrackReferenceOrPlaceholder[]
-): TrackReferenceOrPlaceholder | undefined =>
-  tracks
-    .filter((track) => isTrackReference(track))
-    .find((track) => track.publication.source === Track.Source.ScreenShare)
-
-export const pickLocalCameraTrack = (
-  tracks: TrackReferenceOrPlaceholder[]
-): TrackReferenceOrPlaceholder | undefined =>
-  tracks.find(
-    (track) =>
-      track.source === Track.Source.Camera && track.participant?.isLocal
-  )
-
-export const pickRemoteCameraTrack = (
-  tracks: TrackReferenceOrPlaceholder[]
-): TrackReferenceOrPlaceholder | undefined =>
-  tracks.find(
-    (track) =>
-      track.source === Track.Source.Camera && !track.participant?.isLocal
-  )
-
-export const isCameraTrack = (track: TrackReferenceOrPlaceholder): boolean =>
-  track.source === Track.Source.Camera
-
-/**
- * Produces a stable React key for a track so resizes/reshuffles of the grid
- * do not remount the underlying <video> element.
- */
-export const getTrackKey = (track: TrackReferenceOrPlaceholder): string => {
-  const identity = track.participant?.identity ?? 'unknown'
-  if (isTrackReference(track)) {
-    return `${identity}::${track.source}::${track.publication.trackSid}`
-  }
-  return `${identity}::${track.source}::placeholder`
-}
@@ -1,4 +1,4 @@
-import { useCallback, useRef } from 'react'
+import { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import { RiEmotionLine } from '@remixicon/react'
 import { ToggleButton } from '@/primitives'
@@ -6,37 +6,37 @@ import { ToggleButton } from '@/primitives'
 import { useRegisterKeyboardShortcut } from '@/features/shortcuts/useRegisterKeyboardShortcut'
 import { REACTIONS_TOOLBAR_ID } from '../constants'
 import { useReactionsToolbar } from '../hooks/useReactionsToolbar'
+import { layoutStore } from '@/stores/layout'

-type ReactionsToggleProps = {
-  id?: string
+const focusReactionsToolbar = () => {
+  document
+    .getElementById(REACTIONS_TOOLBAR_ID)
+    ?.querySelector<HTMLElement>('button')
+    ?.focus()
 }

-export const ReactionsToggle = ({
-  id = 'reactions-toggle',
-}: ReactionsToggleProps) => {
+export const ReactionsToggle = () => {
  const { t } = useTranslation('rooms', { keyPrefix: 'controls.reactions' })
+
  const { isOpen, toggle } = useReactionsToolbar()
-  const buttonRef = useRef<HTMLButtonElement>(null)

  const handleShortcut = useCallback(() => {
-    if (isOpen) {
-      const doc = buttonRef.current?.ownerDocument ?? document
-      doc
-        .getElementById(REACTIONS_TOOLBAR_ID)
-        ?.querySelector<HTMLElement>('button')
-        ?.focus()
+    if (layoutStore.showReactionsToolbar) {
+      focusReactionsToolbar()
    } else {
-      toggle()
+      layoutStore.showReactionsToolbar = true
    }
-  }, [isOpen, toggle])
+  }, [])

-  useRegisterKeyboardShortcut({ id: 'reaction', handler: handleShortcut })
+  useRegisterKeyboardShortcut({
+    id: 'reaction',
+    handler: handleShortcut,
+  })

  return (
    <ToggleButton
-      ref={buttonRef}
-      id={id}
-      data-attr={id}
+      id="reactions-toggle"
+      data-attr="reactions-toggle"
      square
      variant="primaryDark"
      aria-label={t('button')}
@@ -1,65 +0,0 @@
-import { useRef, type ReactNode } from 'react'
-import { useTranslation } from 'react-i18next'
-import { useFocusManager } from '@react-aria/focus'
-import { findFirstFocusable } from '@/utils/dom'
-import { useReactionsToolbar } from '../../hooks/useReactionsToolbar'
-import { REACTIONS_TOOLBAR_ID } from '../../constants'
-
-type Props = {
-  children: ReactNode
-  toggleId?: string
-  controlBarId?: string
-}
-
-export const ReactionsKeyboardNavigation = ({
-  children,
-  toggleId = 'reactions-toggle',
-  controlBarId = 'control-bar',
-}: Props) => {
-  const { t } = useTranslation('rooms', { keyPrefix: 'controls.reactions' })
-  const focusManager = useFocusManager()
-  const rootRef = useRef<HTMLDivElement>(null)
-  const { close } = useReactionsToolbar()
-
-  const onFocus = (event: React.FocusEvent<HTMLDivElement>) => {
-    const fromOutside = !event.currentTarget.contains(event.relatedTarget)
-    if (fromOutside) focusManager?.focusFirst()
-  }
-
-  const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {
-    const doc = rootRef.current?.ownerDocument ?? document
-
-    switch (event.key) {
-      case 'ArrowRight':
-        focusManager?.focusNext({ wrap: true })
-        break
-      case 'ArrowLeft':
-        focusManager?.focusPrevious({ wrap: true })
-        break
-      case 'Escape':
-        event.preventDefault()
-        doc.getElementById(toggleId)?.focus()
-        close()
-        break
-      case 'Tab':
-        if (!event.shiftKey) {
-          event.preventDefault()
-          findFirstFocusable(doc.getElementById(controlBarId))?.focus()
-        }
-        break
-    }
-  }
-
-  return (
-    <div
-      ref={rootRef}
-      id={REACTIONS_TOOLBAR_ID}
-      role="toolbar"
-      aria-label={t('toolbar')}
-      onFocus={onFocus}
-      onKeyDown={onKeyDown}
-    >
-      {children}
-    </div>
-  )
-}
@@ -1,158 +0,0 @@
-import { useCallback, useEffect, useMemo, useState } from 'react'
-import { useTranslation } from 'react-i18next'
-import { RiArrowLeftSLine, RiArrowRightSLine } from '@remixicon/react'
-import { styled } from '@/styled-system/jsx'
-import { ReactionButton } from './ReactionButton'
-import {
-  computeReactionsPage,
-  getMaxPageStart,
-} from '../../utils/reactionsPagination'
-
-type Props = { isOpen: boolean; availableWidth: number }
-
-export const ReactionsPill = ({ isOpen, availableWidth }: Props) => {
-  const { t } = useTranslation('rooms', {
-    keyPrefix: 'controls.reactions',
-  })
-  const [isVisible, setIsVisible] = useState(false)
-  const [pageStart, setPageStart] = useState(0)
-
-  useEffect(() => {
-    if (!isOpen) {
-      setIsVisible(false)
-      return
-    }
-    const id = requestAnimationFrame(() => setIsVisible(true))
-    return () => cancelAnimationFrame(id)
-  }, [isOpen])
-
-  const { visibleEmojis, hasOverflow, canGoLeft, canGoRight, visibleCount } =
-    useMemo(
-      () => computeReactionsPage(availableWidth, pageStart),
-      [availableWidth, pageStart]
-    )
-
-  useEffect(() => {
-    if (!hasOverflow) {
-      setPageStart(0)
-      return
-    }
-    const maxStart = getMaxPageStart(visibleCount)
-    if (pageStart > maxStart) setPageStart(maxStart)
-  }, [hasOverflow, pageStart, visibleCount])
-
-  const paginate = useCallback((direction: 'left' | 'right') => {
-    setPageStart((current) =>
-      direction === 'left' ? Math.max(0, current - 1) : current + 1
-    )
-  }, [])
-
-  return (
-    <Pill isVisible={isVisible}>
-      {hasOverflow && (
-        <ArrowSlot>
-          <ArrowButton
-            type="button"
-            onClick={() => paginate('left')}
-            aria-label={t('previousReactions')}
-            disabled={!canGoLeft}
-          >
-            <RiArrowLeftSLine size={16} />
-          </ArrowButton>
-        </ArrowSlot>
-      )}
-      <EmojiRow>
-        {visibleEmojis.map((emoji) => (
-          <ReactionButton key={emoji} emoji={emoji} />
-        ))}
-      </EmojiRow>
-      {hasOverflow && (
-        <ArrowSlot>
-          <ArrowButton
-            type="button"
-            onClick={() => paginate('right')}
-            aria-label={t('nextReactions')}
-            disabled={!canGoRight}
-          >
-            <RiArrowRightSLine size={16} />
-          </ArrowButton>
-        </ArrowSlot>
-      )}
-    </Pill>
-  )
-}
-
-const Pill = styled('div', {
-  base: {
-    display: 'flex',
-    alignItems: 'center',
-    gap: '0.2rem',
-    borderRadius: '21px',
-    padding: '0.15rem',
-    backgroundColor: 'primaryDark.100',
-    maxWidth: '100%',
-    overflow: 'hidden',
-    width: 'fit-content',
-    opacity: 0,
-    transform: 'translateY(3.25rem)',
-    transition: 'opacity, transform',
-    transitionDuration: '0.5s',
-    transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
-    pointerEvents: 'none',
-  },
-  variants: {
-    isVisible: {
-      true: {
-        opacity: 1,
-        transform: 'translateY(0)',
-        pointerEvents: 'auto',
-      },
-    },
-  },
-})
-
-const EmojiRow = styled('div', {
-  base: {
-    display: 'flex',
-    gap: '0.2rem',
-    '& > *': {
-      flexShrink: 0,
-    },
-  },
-})
-
-const ArrowSlot = styled('div', {
-  base: {
-    width: '32px',
-    minWidth: '32px',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-})
-
-const ArrowButton = styled('button', {
-  base: {
-    flexShrink: 0,
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    width: '28px',
-    height: '28px',
-    borderRadius: '50%',
-    border: 'none',
-    backgroundColor: 'primaryDark.200',
-    color: 'white',
-    cursor: 'pointer',
-    opacity: 0.85,
-    _hover: {
-      opacity: 1,
-      backgroundColor: 'primaryDark.300',
-    },
-    _disabled: {
-      opacity: 0.3,
-      cursor: 'default',
-      pointerEvents: 'none',
-    },
-  },
-})
@@ -1,69 +1,155 @@
-import { useEffect, useRef } from 'react'
-import { FocusScope } from '@react-aria/focus'
-import { styled } from '@/styled-system/jsx'
+import { FocusScope, useFocusManager } from '@react-aria/focus'
+import { REACTIONS_TOOLBAR_ID } from '../../constants'
 import { useReactionsToolbar } from '../../hooks/useReactionsToolbar'
+import { ReactionButton } from './ReactionButton'
+import { Emoji } from '../../types'
+import { styled } from '@/styled-system/jsx'
+import { layoutStore } from '@/stores/layout'
+import { getFirstControlBarFocusable } from '@/utils/dom'
+import { useIsMobile } from '@/utils/useIsMobile'
+import { useEffect, useRef, useState } from 'react'
 import { useDelayUnmount } from '@/hooks/useDelayUnmount'
-import { usePipElementSize } from '@/features/pip/hooks/usePipElementSize'
-import { ReactionsKeyboardNavigation } from './ReactionsKeyboardNavigation'
-import { ReactionsPill } from './ReactionsPill'
+import { useTranslation } from 'react-i18next'

-type ReactionsToolbarProps = {
-  toggleId?: string
-  controlBarId?: string
-}
-
-export const ReactionsToolbar = ({
-  toggleId = 'reactions-toggle',
-  controlBarId = 'control-bar',
-}: ReactionsToolbarProps) => {
-  const { isOpen } = useReactionsToolbar()
-  const renderContent = useDelayUnmount(isOpen, 500)
-  const contentRef = useRef<HTMLDivElement>(null)
-  const wrapperRef = useRef<HTMLDivElement>(null)
-  const { width: availableWidth } = usePipElementSize(wrapperRef)
-
-  useEffect(() => {
-    const el = contentRef.current
-    if (!el) return
-    if (isOpen) el.removeAttribute('inert')
-    else el.setAttribute('inert', '')
-  }, [isOpen, renderContent])
-
-  return (
-    <Wrapper ref={wrapperRef} isOpen={isOpen}>
-      {renderContent && (
-        <div ref={contentRef}>
-          {/* eslint-disable-next-line jsx-a11y/no-autofocus */}
-          <FocusScope autoFocus>
-            <ReactionsKeyboardNavigation
-              toggleId={toggleId}
-              controlBarId={controlBarId}
-            >
-              <ReactionsPill isOpen={isOpen} availableWidth={availableWidth} />
-            </ReactionsKeyboardNavigation>
-          </FocusScope>
-        </div>
-      )}
-    </Wrapper>
-  )
-}
-
-const Wrapper = styled('div', {
+const Container = styled('div', {
  base: {
    display: 'flex',
    justifyContent: 'center',
-    overflow: 'hidden',
-    maxHeight: 0,
-    width: '100%',
-    transition:
-      'max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), padding 0.5s cubic-bezier(0.4, 0, 0.2, 1)',
+    position: 'absolute',
+    bottom: 'var(--sizes-room-control-bar)',
+    left: 0,
+    right: 0,
+    pointerEvents: 'none',
+  },
+})
+
+const StyledStrip = styled('div', {
+  base: {
+    display: 'flex',
+    gap: '0.2rem',
+    borderRadius: '21px',
+    padding: '0.15rem',
+    backgroundColor: 'primaryDark.100',
+    opacity: 0,
+    transform: 'translateY(3.25rem)',
+    transition: 'opacity, transform',
+    transitionDuration: '0.5s',
+    transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
+    pointerEvents: 'none',
  },
  variants: {
-    isOpen: {
+    isVisible: {
      true: {
-        maxHeight: '60px',
-        padding: '0.5rem 0',
+        opacity: 1,
+        transform: 'translateY(0)',
+        pointerEvents: 'auto',
+      },
+    },
+    desktopOffset: {
+      true: {
+        // Ideally this value should be calculated dynamically in JavaScript to keep
+        // the reaction toolbar perfectly centered relative to the reaction toggle.
+        // However, for simplicity and to follow a pragmatic 80/20 approach,
+        // this value is currently hardcoded in CSS.
+        marginRight: '30px',
      },
    },
  },
 })
+
+const Strip = ({ children }: { children: React.ReactNode }) => {
+  const { isOpen } = useReactionsToolbar()
+  const isMobile = useIsMobile()
+  const ref = useRef<HTMLDivElement>(null)
+
+  const [isVisible, setIsVisible] = useState(false)
+
+  useEffect(() => {
+    if (isOpen) {
+      // defer one frame so the browser paints opacity:0 first
+      const id = requestAnimationFrame(() => setIsVisible(true))
+      return () => cancelAnimationFrame(id)
+    } else {
+      setIsVisible(false)
+    }
+  }, [isOpen])
+
+  return (
+    <StyledStrip
+      ref={ref}
+      aria-hidden={!isOpen}
+      isVisible={isVisible}
+      desktopOffset={!isMobile}
+    >
+      {children}
+    </StyledStrip>
+  )
+}
+
+const KeyboardNavigation = ({ children }: { children: React.ReactNode }) => {
+  const { t } = useTranslation('rooms', { keyPrefix: 'controls.reactions' })
+  const focusManager = useFocusManager()
+
+  const onFocus = (e: React.FocusEvent<HTMLDivElement>) => {
+    const comingFromOutside = !e.currentTarget.contains(e.relatedTarget)
+    if (comingFromOutside) {
+      focusManager?.focusFirst()
+    }
+  }
+
+  const onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {
+    switch (e.key) {
+      case 'ArrowRight':
+        focusManager?.focusNext({ wrap: true })
+        break
+      case 'ArrowLeft':
+        focusManager?.focusPrevious({ wrap: true })
+        break
+      case 'Escape':
+        e.preventDefault()
+        document.getElementById('reactions-toggle')?.focus()
+        layoutStore.showReactionsToolbar = false
+        break
+      case 'Tab':
+        if (!e.shiftKey) {
+          e.preventDefault()
+          getFirstControlBarFocusable('control-bar')?.focus()
+        }
+        break
+    }
+  }
+
+  return (
+    <div
+      id={REACTIONS_TOOLBAR_ID}
+      role="toolbar"
+      aria-label={t('toolbar')}
+      onKeyDown={onKeyDown}
+      onFocus={onFocus}
+    >
+      {children}
+    </div>
+  )
+}
+
+export const ReactionsToolbar = () => {
+  const { isOpen } = useReactionsToolbar()
+  const shouldMount = useDelayUnmount(isOpen, 300)
+
+  if (!shouldMount) return null
+
+  return (
+    <Container>
+      {/* eslint-disable-next-line jsx-a11y/no-autofocus*/}
+      <FocusScope autoFocus>
+        <KeyboardNavigation>
+          <Strip>
+            {Object.values(Emoji).map((emoji) => (
+              <ReactionButton key={emoji} emoji={emoji} />
+            ))}
+          </Strip>
+        </KeyboardNavigation>
+      </FocusScope>
+    </Container>
+  )
+}
@@ -1,28 +1,13 @@
-import { createContext, useContext } from 'react'
 import { useSnapshot } from 'valtio'
 import { layoutStore } from '@/stores/layout'

-export type ReactionsToolbarStore = {
-  showReactionsToolbar: boolean
-}
-
-const ReactionsToolbarStoreContext =
-  createContext<ReactionsToolbarStore>(layoutStore)
-
-export const ReactionsToolbarStoreProvider =
-  ReactionsToolbarStoreContext.Provider
-
 export const useReactionsToolbar = () => {
-  const store = useContext(ReactionsToolbarStoreContext)
-  const snap = useSnapshot(store)
+  const layoutSnap = useSnapshot(layoutStore)

  return {
-    isOpen: snap.showReactionsToolbar,
+    isOpen: layoutSnap.showReactionsToolbar,
    toggle: () => {
-      store.showReactionsToolbar = !store.showReactionsToolbar
-    },
-    close: () => {
-      store.showReactionsToolbar = false
+      layoutStore.showReactionsToolbar = !layoutSnap.showReactionsToolbar
    },
  }
 }
@@ -1,62 +0,0 @@
-import { Emoji } from '@/features/reactions/types'
-
-export const EMOJI_SLOT_WIDTH = 40
-export const ARROW_SLOT_WIDTH = 32
-export const PILL_HORIZONTAL_PADDING = 12
-export const WRAPPER_HORIZONTAL_PADDING = 16
-
-const EMOJIS = Object.values(Emoji)
-
-export type ReactionsPage = {
-  visibleEmojis: Emoji[]
-  hasOverflow: boolean
-  canGoLeft: boolean
-  canGoRight: boolean
-  visibleCount: number
-}
-
-/**
- * Compute how many emojis fit in `availableWidth` and slice the visible page.
- * Arrow slots are reserved only when the list overflows.
- */
-export const computeReactionsPage = (
-  availableWidth: number,
-  pageStart: number
-): ReactionsPage => {
-  const usableWidth =
-    availableWidth - WRAPPER_HORIZONTAL_PADDING - PILL_HORIZONTAL_PADDING
-  const maxWithoutArrows = Math.max(
-    1,
-    Math.floor(usableWidth / EMOJI_SLOT_WIDTH)
-  )
-
-  if (EMOJIS.length <= maxWithoutArrows) {
-    return {
-      visibleEmojis: EMOJIS,
-      hasOverflow: false,
-      canGoLeft: false,
-      canGoRight: false,
-      visibleCount: EMOJIS.length,
-    }
-  }
-
-  const visibleCount = Math.max(
-    1,
-    Math.floor((usableWidth - ARROW_SLOT_WIDTH * 2) / EMOJI_SLOT_WIDTH)
-  )
-  const clampedStart = Math.min(
-    Math.max(0, pageStart),
-    Math.max(0, EMOJIS.length - visibleCount)
-  )
-
-  return {
-    visibleEmojis: EMOJIS.slice(clampedStart, clampedStart + visibleCount),
-    hasOverflow: true,
-    canGoLeft: clampedStart > 0,
-    canGoRight: clampedStart + visibleCount < EMOJIS.length,
-    visibleCount,
-  }
-}
-
-export const getMaxPageStart = (visibleCount: number): number =>
-  Math.max(0, EMOJIS.length - visibleCount)
@@ -1,3 +1,4 @@
+import { layoutStore } from '@/stores/layout'
 import { css } from '@/styled-system/css'
 import { Heading } from 'react-aria-components'
 import { text } from '@/primitives/Text'
@@ -155,8 +156,6 @@ export const SidePanel = () => {
    isInfoOpen,
    isSubPanelOpen,
    activeSubPanelId,
-    closePanel,
-    goBack,
  } = useSidePanel()
  const { t } = useTranslation('rooms', { keyPrefix: 'sidePanel' })
  const title = t(`heading.${activeSubPanelId || activePanelId}`)
@@ -167,7 +166,10 @@ export const SidePanel = () => {
    <StyledSidePanel
      title={title}
      ariaLabel={t('ariaLabel', { title })}
-      onClose={closePanel}
+      onClose={() => {
+        layoutStore.activePanelId = null
+        layoutStore.activeSubPanelId = null
+      }}
      closeButtonTooltip={t('closeButton', {
        content: t(`content.${activeSubPanelId || activePanelId}`),
      })}
@@ -175,7 +177,7 @@ export const SidePanel = () => {
      isSubmenu={isSubPanelOpen}
      isReactionToolbarOpen={isReactionToolbarOpen}
      backButtonLabel={t('backToTools')}
-      onBack={goBack}
+      onBack={() => (layoutStore.activeSubPanelId = null)}
    >
      <Panel isOpen={isParticipantsOpen}>
        <ParticipantsList />
@@ -7,7 +7,6 @@ import { EffectsMenuItem } from './EffectsMenuItem'
 import { SupportMenuItem } from './SupportMenuItem'
 import { TranscriptMenuItem } from './TranscriptMenuItem'
 import { ScreenRecordingMenuItem } from './ScreenRecordingMenuItem'
-import { PictureInPictureMenuItem } from './PictureInPictureMenuItem'

 // @todo try refactoring it to use MenuList component
 export const OptionsMenuItems = () => {
@@ -22,7 +21,6 @@ export const OptionsMenuItems = () => {
        <TranscriptMenuItem />
        <ScreenRecordingMenuItem />
        <FullScreenMenuItem />
-        <PictureInPictureMenuItem />
        <EffectsMenuItem />
      </MenuSection>
      <Separator />
@@ -1,23 +0,0 @@
-import { MenuItem } from 'react-aria-components'
-import { useTranslation } from 'react-i18next'
-import { RiPictureInPicture2Line } from '@remixicon/react'
-import { menuRecipe } from '@/primitives/menuRecipe'
-import { useRoomPiP } from '@/features/pip/hooks/useRoomPiP'
-
-export const PictureInPictureMenuItem = () => {
-  const { t } = useTranslation('rooms', { keyPrefix: 'options.items' })
-  const { isSupported, isOpen, toggle } = useRoomPiP()
-
-  // Hide the entry when the browser doesn't support Document PiP.
-  if (!isSupported) return null
-
-  return (
-    <MenuItem
-      onAction={toggle}
-      className={menuRecipe({ icon: true, variant: 'dark' }).item}
-    >
-      <RiPictureInPicture2Line size={20} />
-      {isOpen ? t('pictureInPicture.exit') : t('pictureInPicture.enter')}
-    </MenuItem>
-  )
-}
@@ -1,84 +1,74 @@
-import { createContext, useContext } from 'react'
 import { useSnapshot } from 'valtio'
 import { layoutStore } from '@/stores/layout'
-import { PanelId, SubPanelId } from '../types/panel'

-export { PanelId, SubPanelId } from '../types/panel'
-
-export type SidePanelStore = {
-  activePanelId: PanelId | null
-  activeSubPanelId: SubPanelId | null
+export enum PanelId {
+  PARTICIPANTS = 'participants',
+  EFFECTS = 'effects',
+  CHAT = 'chat',
+  TOOLS = 'tools',
+  ADMIN = 'admin',
+  INFO = 'info',
 }

-const SidePanelStoreContext = createContext<SidePanelStore>(layoutStore)
+export enum SubPanelId {
+  TRANSCRIPT = 'transcript',
+  SCREEN_RECORDING = 'screenRecording',
+}

-export const SidePanelStoreProvider = SidePanelStoreContext.Provider
-
-export const useSidePanel = (store?: SidePanelStore) => {
-  const currentStore = useContext(SidePanelStoreContext)
-  store ??= currentStore
-  const layoutSnap = useSnapshot(store)
+export const useSidePanel = () => {
+  const layoutSnap = useSnapshot(layoutStore)
  const activePanelId = layoutSnap.activePanelId
  const activeSubPanelId = layoutSnap.activeSubPanelId

-  const isParticipantsOpen = activePanelId === PanelId.PARTICIPANTS
-  const isEffectsOpen = activePanelId === PanelId.EFFECTS
-  const isChatOpen = activePanelId === PanelId.CHAT
-  const isToolsOpen = activePanelId === PanelId.TOOLS
-  const isAdminOpen = activePanelId === PanelId.ADMIN
-  const isInfoOpen = activePanelId === PanelId.INFO
-  const isTranscriptOpen = activeSubPanelId === SubPanelId.TRANSCRIPT
-  const isScreenRecordingOpen = activeSubPanelId === SubPanelId.SCREEN_RECORDING
+  const isParticipantsOpen = activePanelId == PanelId.PARTICIPANTS
+  const isEffectsOpen = activePanelId == PanelId.EFFECTS
+  const isChatOpen = activePanelId == PanelId.CHAT
+  const isToolsOpen = activePanelId == PanelId.TOOLS
+  const isAdminOpen = activePanelId == PanelId.ADMIN
+  const isInfoOpen = activePanelId == PanelId.INFO
+  const isTranscriptOpen = activeSubPanelId == SubPanelId.TRANSCRIPT
+  const isScreenRecordingOpen = activeSubPanelId == SubPanelId.SCREEN_RECORDING
  const isSidePanelOpen = !!activePanelId
  const isSubPanelOpen = !!activeSubPanelId

  const toggleAdmin = () => {
-    store.activePanelId = isAdminOpen ? null : PanelId.ADMIN
-    if (layoutSnap.activeSubPanelId) store.activeSubPanelId = null
+    layoutStore.activePanelId = isAdminOpen ? null : PanelId.ADMIN
+    if (layoutSnap.activeSubPanelId) layoutStore.activeSubPanelId = null
  }

  const toggleParticipants = () => {
-    store.activePanelId = isParticipantsOpen ? null : PanelId.PARTICIPANTS
-    if (layoutSnap.activeSubPanelId) store.activeSubPanelId = null
+    layoutStore.activePanelId = isParticipantsOpen ? null : PanelId.PARTICIPANTS
+    if (layoutSnap.activeSubPanelId) layoutStore.activeSubPanelId = null
  }

  const toggleChat = () => {
-    store.activePanelId = isChatOpen ? null : PanelId.CHAT
-    if (layoutSnap.activeSubPanelId) store.activeSubPanelId = null
+    layoutStore.activePanelId = isChatOpen ? null : PanelId.CHAT
+    if (layoutSnap.activeSubPanelId) layoutStore.activeSubPanelId = null
  }

  const toggleEffects = () => {
-    store.activePanelId = isEffectsOpen ? null : PanelId.EFFECTS
-    if (layoutSnap.activeSubPanelId) store.activeSubPanelId = null
+    layoutStore.activePanelId = isEffectsOpen ? null : PanelId.EFFECTS
+    if (layoutSnap.activeSubPanelId) layoutStore.activeSubPanelId = null
  }

  const toggleTools = () => {
-    store.activePanelId = isToolsOpen ? null : PanelId.TOOLS
-    if (layoutSnap.activeSubPanelId) store.activeSubPanelId = null
+    layoutStore.activePanelId = isToolsOpen ? null : PanelId.TOOLS
+    if (layoutSnap.activeSubPanelId) layoutStore.activeSubPanelId = null
  }

  const toggleInfo = () => {
-    store.activePanelId = isInfoOpen ? null : PanelId.INFO
-    if (layoutSnap.activeSubPanelId) store.activeSubPanelId = null
+    layoutStore.activePanelId = isInfoOpen ? null : PanelId.INFO
+    if (layoutSnap.activeSubPanelId) layoutStore.activeSubPanelId = null
  }

  const openTranscript = () => {
-    store.activeSubPanelId = SubPanelId.TRANSCRIPT
-    store.activePanelId = PanelId.TOOLS
+    layoutStore.activeSubPanelId = SubPanelId.TRANSCRIPT
+    layoutStore.activePanelId = PanelId.TOOLS
  }

  const openScreenRecording = () => {
-    store.activeSubPanelId = SubPanelId.SCREEN_RECORDING
-    store.activePanelId = PanelId.TOOLS
-  }
-
-  const closePanel = () => {
-    store.activePanelId = null
-    store.activeSubPanelId = null
-  }
-
-  const goBack = () => {
-    store.activeSubPanelId = null
+    layoutStore.activeSubPanelId = SubPanelId.SCREEN_RECORDING
+    layoutStore.activePanelId = PanelId.TOOLS
  }

  return {
@@ -92,8 +82,6 @@ export const useSidePanel = (store?: SidePanelStore) => {
    toggleInfo,
    openTranscript,
    openScreenRecording,
-    closePanel,
-    goBack,
    isSubPanelOpen,
    isChatOpen,
    isParticipantsOpen,
@@ -16,20 +16,17 @@ import { VideoDeviceControl } from '../../components/controls/Device/VideoDevice
 import { AudioDevicesControl } from '../../components/controls/Device/AudioDevicesControl'
 import { ReactionsToggle } from '@/features/reactions/components/ReactionsToggle'
 import { ControlBarRegion } from '@/features/layout/components/ControlBarRegion'
-import { useRoomPiP } from '@/features/pip/hooks/useRoomPiP'

 export function DesktopControlBar({
  onDeviceError,
 }: Readonly<ControlBarAuxProps>) {
  const browserSupportsScreenSharing = supportsScreenSharing()
  const desktopControlBarEl = useRef<HTMLDivElement>(null)
-  const { isOpen: isPiPOpen } = useRoomPiP()

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

  useRegisterKeyboardShortcut({
    id: 'focus-toolbar',
-    isDisabled: isPiPOpen,
    handler: () => {
      const root = desktopControlBarEl.current
      if (!root) return
@@ -34,9 +34,6 @@ import { SettingsDialogExtendedKey } from '@/features/settings/type'
 import { useVideoResolutionSubscription } from '../hooks/useVideoResolutionSubscription'
 import { SettingsDialogProvider } from '@/features/settings/components/SettingsDialogProvider'
 import { IsIdleDisconnectModal } from '../components/IsIdleDisconnectModal'
-import { RoomPiP } from '@/features/pip/components/RoomPiP'
-import { PipPlaceholder } from '@/features/pip/components/PipPlaceholder'
-import { useRoomPiP } from '@/features/pip/hooks/useRoomPiP'
 import { getParticipantName } from '@/features/rooms/utils/getParticipantName'
 import { useScreenReaderAnnounce } from '@/hooks/useScreenReaderAnnounce'
 import { ReactionPortals } from '@/features/reactions/components/ReactionPortals'
@@ -230,8 +227,6 @@ export function VideoConference({ ...props }: VideoConferenceProps) {
  ])
  /* eslint-enable react-hooks/exhaustive-deps */

-  const { isOpen: isPiPOpen } = useRoomPiP()
-
  const [isShareErrorVisible, setIsShareErrorVisible] = useState(false)

  return (
@@ -253,38 +248,32 @@ export function VideoConference({ ...props }: VideoConferenceProps) {
          />
          <IsIdleDisconnectModal />
          <RoomContentArea>
-            {isPiPOpen ? (
-              <PipPlaceholder />
+            {!focusTrack ? (
+              <div
+                className="lk-grid-layout-wrapper"
+                style={{ height: 'auto' }}
+              >
+                <GridLayout tracks={tracks} style={{ padding: 0 }}>
+                  <ParticipantTile />
+                </GridLayout>
+              </div>
            ) : (
-              <>
-                {!focusTrack ? (
-                  <div
-                    className="lk-grid-layout-wrapper"
-                    style={{ height: 'auto' }}
+              <div
+                className="lk-focus-layout-wrapper"
+                style={{ height: 'auto' }}
+              >
+                <FocusLayoutContainer style={{ padding: 0 }}>
+                  <CarouselLayout
+                    tracks={carouselTracks}
+                    style={{
+                      minWidth: '200px',
+                    }}
                  >
-                    <GridLayout tracks={tracks} style={{ padding: 0 }}>
-                      <ParticipantTile />
-                    </GridLayout>
-                  </div>
-                ) : (
-                  <div
-                    className="lk-focus-layout-wrapper"
-                    style={{ height: 'auto' }}
-                  >
-                    <FocusLayoutContainer style={{ padding: 0 }}>
-                      <CarouselLayout
-                        tracks={carouselTracks}
-                        style={{
-                          minWidth: '200px',
-                        }}
-                      >
-                        <ParticipantTile />
-                      </CarouselLayout>
-                      {focusTrack && <FocusLayout trackRef={focusTrack} />}
-                    </FocusLayoutContainer>
-                  </div>
-                )}
-              </>
+                    <ParticipantTile />
+                  </CarouselLayout>
+                  {focusTrack && <FocusLayout trackRef={focusTrack} />}
+                </FocusLayoutContainer>
+              </div>
            )}
          </RoomContentArea>
          <ControlBar
@@ -300,7 +289,6 @@ export function VideoConference({ ...props }: VideoConferenceProps) {
            }}
          />
          <SidePanel />
-          <RoomPiP />
        </LayoutContextProvider>
      )}
      <RoomAudioRenderer />
@@ -1,17 +0,0 @@
-/**
- * Panel identifiers for the side panel (Info, Chat, Participants, etc.).
- * Extracted to avoid circular dependencies between layout store and useSidePanel.
- */
-export enum PanelId {
-  PARTICIPANTS = 'participants',
-  EFFECTS = 'effects',
-  CHAT = 'chat',
-  TOOLS = 'tools',
-  ADMIN = 'admin',
-  INFO = 'info',
-}
-
-export enum SubPanelId {
-  TRANSCRIPT = 'transcript',
-  SCREEN_RECORDING = 'screenRecording',
-}
@@ -19,14 +19,10 @@ export const useRegisterKeyboardShortcut = ({
    const descriptor = getShortcutDescriptorById(id)
    if (!descriptor?.shortcut) return
    const formattedKey = formatShortcutKey(descriptor.shortcut)
-    if (!isDisabled) {
+    if (isDisabled) {
+      keyboardShortcutsStore.shortcuts.delete(formattedKey)
+    } else {
      keyboardShortcutsStore.shortcuts.set(formattedKey, handler)
    }
-    return () => {
-      // Remove only if this is still the registered handler
-      if (keyboardShortcutsStore.shortcuts.get(formattedKey) === handler) {
-        keyboardShortcutsStore.shortcuts.delete(formattedKey)
-      }
-    }
  }, [handler, id, isDisabled])
 }
@@ -219,8 +219,6 @@
      "toolbar": "Reaktion senden",
      "announce": "{{name}} : {{emoji}}",
      "you": "du",
-      "previousReactions": "Vorherige Reaktionen",
-      "nextReactions": "Nächste Reaktionen",
      "emojis": {
        "thumbs-up": "Daumen hoch",
        "thumbs-down": "Daumen runter",
@@ -243,26 +241,6 @@
      "username": "Deinen Namen aktualisieren",
      "effects": "Effekte anwenden",
      "switchCamera": "Kamera wechseln",
-      "pictureInPicture": {
-        "enter": "Bild-im-Bild",
-        "exit": "Bild-im-Bild schließen",
-        "opened": "Bild-im-Bild-Modus aktiviert",
-        "closed": "Bild-im-Bild-Modus deaktiviert",
-        "windowLabel": "Bild-im-Bild Besprechung",
-        "stage": "Teilnehmer",
-        "controlBar": "Besprechungssteuerung",
-        "notificationsLabel": "Benachrichtigungen",
-        "dismissNotification": "Benachrichtigung schließen",
-        "connection": {
-          "reconnecting": "Verbindung wird wiederhergestellt…",
-          "disconnected": "Verbindung getrennt"
-        },
-        "placeholder": {
-          "title": "Ihr Videoanruf befindet sich in einem anderen Fenster.",
-          "description": "Im Bild-im-Bild-Modus bleiben Sie mit dem Anruf verbunden, während Sie andere Aufgaben erledigen.",
-          "bringBack": "Anruf hierher zurückholen"
-        }
-      },
      "fullscreen": {
        "enter": "Vollbild",
        "exit": "Vollbildmodus verlassen"
@@ -219,8 +219,6 @@
      "toolbar": "Send reaction",
      "announce": "{{name}} : {{emoji}}",
      "you": "you",
-      "previousReactions": "Previous reactions",
-      "nextReactions": "Next reactions",
      "emojis": {
        "thumbs-up": "thumbs up",
        "thumbs-down": "thumbs down",
@@ -243,26 +241,6 @@
      "username": "Update Your Name",
      "effects": "Backgrounds and Effects",
      "switchCamera": "Switch camera",
-      "pictureInPicture": {
-        "enter": "Picture-in-picture",
-        "exit": "Close picture-in-picture",
-        "opened": "Picture-in-picture mode enabled",
-        "closed": "Picture-in-picture mode disabled",
-        "windowLabel": "Picture-in-picture meeting",
-        "stage": "Participants",
-        "controlBar": "Meeting controls",
-        "notificationsLabel": "Notifications",
-        "dismissNotification": "Dismiss notification",
-        "connection": {
-          "reconnecting": "Reconnecting…",
-          "disconnected": "Disconnected"
-        },
-        "placeholder": {
-          "title": "Your video call is in another window.",
-          "description": "Picture-in-Picture mode allows you to stay connected to the call while performing other tasks.",
-          "bringBack": "Bring the call back here"
-        }
-      },
      "fullscreen": {
        "enter": "Fullscreen",
        "exit": "Exit fullscreen mode"
@@ -219,8 +219,6 @@
      "toolbar": "Envoyer une réaction",
      "announce": "{{name}} : {{emoji}}",
      "you": "vous",
-      "previousReactions": "Réactions précédentes",
-      "nextReactions": "Réactions suivantes",
      "emojis": {
        "thumbs-up": "pouce levé",
        "thumbs-down": "pouce baissé",
@@ -243,26 +241,6 @@
      "username": "Choisir votre nom",
      "effects": "Arrière-plans et effets",
      "switchCamera": "Changer de caméra",
-      "pictureInPicture": {
-        "enter": "Image dans l'image",
-        "exit": "Fermer l'image dans l'image",
-        "opened": "Mode image dans l'image activé",
-        "closed": "Mode image dans l'image désactivé",
-        "windowLabel": "Réunion en image dans l'image",
-        "stage": "Participants",
-        "controlBar": "Commandes de la réunion",
-        "notificationsLabel": "Notifications",
-        "dismissNotification": "Fermer la notification",
-        "connection": {
-          "reconnecting": "Reconnexion…",
-          "disconnected": "Déconnecté"
-        },
-        "placeholder": {
-          "title": "Votre appel vidéo est dans une autre fenêtre.",
-          "description": "Le mode image dans l'image vous permet de rester connecté à l'appel tout en effectuant d'autres tâches.",
-          "bringBack": "Ramener l'appel ici"
-        }
-      },
      "fullscreen": {
        "enter": "Plein écran",
        "exit": "Quitter le mode plein écran"
@@ -219,8 +219,6 @@
      "toolbar": "Stuur reactie",
      "announce": "{{name}} : {{emoji}}",
      "you": "U",
-      "previousReactions": "Vorige reacties",
-      "nextReactions": "Volgende reacties",
      "emojis": {
        "thumbs-up": "duim omhoog",
        "thumbs-down": "duim omlaag",
@@ -243,26 +241,6 @@
      "username": "Verander uw naam",
      "effects": "Pas effecten toe",
      "switchCamera": "Selecteer camera",
-      "pictureInPicture": {
-        "enter": "Beeld-in-beeld",
-        "exit": "Beeld-in-beeld sluiten",
-        "opened": "Beeld-in-beeld-modus ingeschakeld",
-        "closed": "Beeld-in-beeld-modus uitgeschakeld",
-        "windowLabel": "Beeld-in-beeld vergadering",
-        "stage": "Deelnemers",
-        "controlBar": "Vergaderbesturing",
-        "notificationsLabel": "Meldingen",
-        "dismissNotification": "Melding sluiten",
-        "connection": {
-          "reconnecting": "Opnieuw verbinden…",
-          "disconnected": "Verbinding verbroken"
-        },
-        "placeholder": {
-          "title": "Uw videogesprek bevindt zich in een ander venster.",
-          "description": "Met de beeld-in-beeld-modus kunt u verbonden blijven met het gesprek terwijl u andere taken uitvoert.",
-          "bringBack": "Gesprek hier terughalen"
-        }
-      },
      "fullscreen": {
        "enter": "Volledig scherm",
        "exit": "Stop volledig scherm stand"
@@ -2,29 +2,24 @@ import { ReactNode } from 'react'
 import { MenuTrigger } from 'react-aria-components'
 import { StyledPopover } from './Popover'
 import { Box } from './Box'
-import { useOverlayBoundaryElement } from './useOverlayPortalContainer'

 /**
 * a Menu is a tuple of a trigger component (most usually a Button) that toggles menu items in a tooltip around the trigger
- *
- * Uses UNSAFE_PortalProvider context automatically for portal container (no need for UNSTABLE_portalContainer).
 */
 export const Menu = ({
  children,
  variant = 'light',
-  placement = 'top',
+  placement,
 }: {
  children: [trigger: ReactNode, menu: ReactNode]
  variant?: 'dark' | 'light'
  placement?: 'bottom' | 'top' | 'left' | 'right'
 }) => {
  const [trigger, menu] = children
-  const boundaryElement = useOverlayBoundaryElement()
-
  return (
    <MenuTrigger>
      {trigger}
-      <StyledPopover placement={placement} boundaryElement={boundaryElement}>
+      <StyledPopover placement={placement}>
        <Box size="sm" type="popover" variant={variant}>
          {menu}
        </Box>
@@ -8,7 +8,6 @@ import {
 } from 'react-aria-components'
 import { styled } from '@/styled-system/jsx'
 import { Box } from './Box'
-import { useOverlayBoundaryElement } from './useOverlayPortalContainer'

 export const StyledPopover = styled(RACPopover, {
  base: {
@@ -66,8 +65,6 @@ const StyledOverlayArrow = styled(OverlayArrow, {
 *
 * Note: to show a list of actionable items, like a dropdown menu, prefer using a <Menu> or <Select>.
 * This is here when needing to show unrestricted content in a box.
- *
- * Uses UNSAFE_PortalProvider context automatically for portal container (no need for UNSTABLE_portalContainer).
 */
 export const Popover = ({
  children,
@@ -85,11 +82,10 @@ export const Popover = ({
  withArrow?: boolean
 } & Omit<DialogProps, 'children'>) => {
  const [trigger, popoverContent] = children
-  const boundaryElement = useOverlayBoundaryElement()
  return (
    <DialogTrigger>
      {trigger}
-      <StyledPopover boundaryElement={boundaryElement}>
+      <StyledPopover>
        {withArrow && (
          <StyledOverlayArrow variant={variant}>
            <svg width={12} height={12} viewBox="0 0 12 12">
@@ -1,4 +1,4 @@
-import { type ReactElement, type ReactNode } from 'react'
+import { type ReactNode } from 'react'
 import {
  OverlayArrow,
  Tooltip as RACTooltip,
@@ -6,17 +6,12 @@ import {
  type TooltipProps,
 } from 'react-aria-components'
 import { styled } from '@/styled-system/jsx'
-import { VisualOnlyTooltip } from './VisualOnlyTooltip'
-import { useVisualOnlyTooltips } from './VisualOnlyTooltipsContext'

 export type TooltipWrapperProps = {
  tooltip?: string
  tooltipType?: 'instant' | 'delayed'
 }

-const INSTANT_TOOLTIP_DELAY_MS = 150
-const DELAYED_TOOLTIP_DELAY_MS = 1000
-
 /**
 * Wrap a component you want to apply a tooltip on (for example a Button)
 *
@@ -27,25 +22,15 @@ export const TooltipWrapper = ({
  tooltipType,
  children,
 }: {
-  children: ReactElement
+  children: ReactNode
 } & TooltipWrapperProps) => {
-  const visualOnly = useVisualOnlyTooltips()
-  const tooltipDelay =
-    tooltipType === 'instant'
-      ? INSTANT_TOOLTIP_DELAY_MS
-      : DELAYED_TOOLTIP_DELAY_MS
-
-  if (!tooltip) return children
-
-  if (visualOnly) {
-    return <VisualOnlyTooltip tooltip={tooltip}>{children}</VisualOnlyTooltip>
-  }
-
-  return (
-    <TooltipTrigger delay={tooltipDelay}>
+  return tooltip ? (
+    <TooltipTrigger delay={tooltipType === 'instant' ? 150 : 1000}>
      {children}
      <Tooltip>{tooltip}</Tooltip>
    </TooltipTrigger>
+  ) : (
+    children
  )
 }

@@ -54,8 +39,6 @@ export const TooltipWrapper = ({
 *
 * Style taken from example at https://react-spectrum.adobe.com/react-aria/Tooltip.html
 */
-const DEFAULT_TOOLTIP_GAP_PX = 8
-
 const StyledTooltip = styled(RACTooltip, {
  base: {
    boxShadow: '0 8px 20px rgba(0 0 0 / 0.1)',
@@ -70,11 +53,11 @@ const StyledTooltip = styled(RACTooltip, {
    fontSize: 14,
    transform: 'translate3d(0, 0, 0)',
    '&[data-placement=top]': {
-      marginBottom: `${DEFAULT_TOOLTIP_GAP_PX}px`,
+      marginBottom: '8px',
      '--origin': 'translateY(4px)',
    },
    '&[data-placement=bottom]': {
-      marginTop: `${DEFAULT_TOOLTIP_GAP_PX}px`,
+      marginTop: '8px',
      '--origin': 'translateY(-4px)',
    },
    '&[data-placement=right]': {
@@ -124,13 +107,10 @@ const TooltipArrow = () => {

 const Tooltip = ({
  children,
-  arrowBoundaryOffset,
  ...props
-}: {
-  children: ReactNode
-} & Partial<Omit<TooltipProps, 'children'>>) => {
+}: Omit<TooltipProps, 'children'> & { children: ReactNode }) => {
  return (
-    <StyledTooltip arrowBoundaryOffset={arrowBoundaryOffset ?? 0} {...props}>
+    <StyledTooltip {...props}>
      <TooltipArrow />
      {children}
    </StyledTooltip>
@@ -2,14 +2,11 @@ import {
  type ReactElement,
  cloneElement,
  isValidElement,
-  useLayoutEffect,
-  useMemo,
  useRef,
  useState,
 } from 'react'
 import { createPortal } from 'react-dom'
 import { css } from '@/styled-system/css'
-import { useUNSAFE_PortalContext } from '@react-aria/overlays'

 export type VisualOnlyTooltipProps = {
  children: ReactElement
@@ -35,29 +32,19 @@ export const VisualOnlyTooltip = ({
  tooltipPosition = 'top',
 }: VisualOnlyTooltipProps) => {
  const [isVisible, setIsVisible] = useState(false)
-  const { getContainer } = useUNSAFE_PortalContext()
  const wrapperRef = useRef<HTMLDivElement>(null)
-  const tooltipRef = useRef<HTMLDivElement>(null)
  const [position, setPosition] = useState<{
    top: number
    left: number
  } | null>(null)
-  const [computedStyle, setComputedStyle] = useState<{
-    left: number
-    arrowLeft: number
-  } | null>(null)

-  const [effectiveBottom, setEffectiveBottom] = useState(
-    tooltipPosition === 'bottom'
-  )
+  const isBottom = tooltipPosition === 'bottom'

  const showTooltip = () => {
    if (!wrapperRef.current) return
    const rect = wrapperRef.current.getBoundingClientRect()
-    const preferBottom = tooltipPosition === 'bottom'
-    setEffectiveBottom(preferBottom)
    setPosition({
-      top: preferBottom ? rect.bottom + 8 : rect.top - 8,
+      top: isBottom ? rect.bottom + 8 : rect.top - 8,
      left: rect.left + rect.width / 2,
    })
    setIsVisible(true)
@@ -66,67 +53,15 @@ export const VisualOnlyTooltip = ({
  const hideTooltip = () => {
    setIsVisible(false)
    setPosition(null)
-    setComputedStyle(null)
  }

-  useLayoutEffect(() => {
-    if (!tooltipRef.current || !wrapperRef.current || !isVisible || !position)
-      return
-    const tooltipRect = tooltipRef.current.getBoundingClientRect()
-    const triggerRect = wrapperRef.current.getBoundingClientRect()
-    const doc = tooltipRef.current.ownerDocument
-    const viewportWidth = doc.defaultView?.innerWidth ?? globalThis.innerWidth
-    const padding = 8
-
-    // Vertical flip: if tooltip overflows the top, switch to bottom
-    if (!effectiveBottom && position.top - tooltipRect.height < 0) {
-      const flippedTop = triggerRect.bottom + 8
-      setEffectiveBottom(true)
-      setPosition({ top: flippedTop, left: position.left })
-      return
-    }
-
-    // Horizontal clamping (both edges)
-    const desiredLeft = position.left - tooltipRect.width / 2
-    const minLeft = padding
-    const maxLeft = viewportWidth - padding - tooltipRect.width
-
-    if (desiredLeft >= minLeft && desiredLeft <= maxLeft) {
-      setComputedStyle(null)
-      return
-    }
-
-    const clampedLeft = Math.max(minLeft, Math.min(maxLeft, desiredLeft))
-    setComputedStyle({
-      left: clampedLeft,
-      arrowLeft: position.left - clampedLeft,
-    })
-  }, [isVisible, position, effectiveBottom])
-
-  const portalContainer = useMemo(() => {
-    if (getContainer) return getContainer()
-    return wrapperRef.current?.ownerDocument?.body ?? document.body
-  }, [getContainer])
+  const tooltipData = isVisible && position ? { isVisible, position } : null
  const wrappedChild = isValidElement(children)
    ? cloneElement(children, {
        ...(ariaLabel ? { 'aria-label': ariaLabel } : {}),
      })
    : children

-  const translateY = effectiveBottom ? 'translateY(0)' : 'translateY(-100%)'
-  const translateXY = effectiveBottom
-    ? 'translate(-50%, 0)'
-    : 'translate(-50%, -100%)'
-
-  const tooltipInlineStyle: React.CSSProperties & Record<string, string> = {
-    top: `${position?.top}px`,
-    left: computedStyle ? `${computedStyle.left}px` : `${position?.left}px`,
-    transform: computedStyle ? translateY : translateXY,
-    ...(computedStyle
-      ? { '--tooltip-arrow-left': `${computedStyle.arrowLeft}px` }
-      : null),
-  }
-
  return (
    <>
      <div
@@ -138,14 +73,11 @@ export const VisualOnlyTooltip = ({
      >
        {wrappedChild}
      </div>
-      {isVisible &&
-        position &&
-        portalContainer &&
+      {tooltipData &&
        createPortal(
          <div
            aria-hidden="true"
            role="presentation"
-            ref={tooltipRef}
            className={css({
              position: 'fixed',
              padding: '2px 8px',
@@ -155,15 +87,15 @@ export const VisualOnlyTooltip = ({
              fontSize: 14,
              whiteSpace: 'nowrap',
              pointerEvents: 'none',
-              zIndex: 100001,
+              zIndex: 9999,
              boxShadow: '0 8px 20px rgba(0 0 0 / 0.1)',
              '&::after': {
                content: '""',
                position: 'absolute',
-                left: 'var(--tooltip-arrow-left, 50%)',
+                left: '50%',
                transform: 'translateX(-50%)',
                border: '4px solid transparent',
-                ...(effectiveBottom
+                ...(isBottom
                  ? {
                      bottom: '100%',
                      borderBottomColor: 'primaryDark.100',
@@ -174,11 +106,17 @@ export const VisualOnlyTooltip = ({
                    }),
              },
            })}
-            style={tooltipInlineStyle}
+            style={{
+              top: `${tooltipData.position.top}px`,
+              left: `${tooltipData.position.left}px`,
+              transform: isBottom
+                ? 'translate(-50%, 0)'
+                : 'translate(-50%, -100%)',
+            }}
          >
            {tooltip}
          </div>,
-          portalContainer
+          document.body
        )}
    </>
  )
@@ -1,10 +0,0 @@
-import { createContext, useContext } from 'react'
-
-/**
- * When true, tooltips render as visual-only (no aria-describedby).
- * Provided by surfaces where React Aria TooltipTrigger doesn't work
- * correctly (e.g. cross-document portals).
- */
-export const VisualOnlyTooltipsContext = createContext(false)
-
-export const useVisualOnlyTooltips = () => useContext(VisualOnlyTooltipsContext)
@@ -1,21 +0,0 @@
-import { useMemo } from 'react'
-import { useUNSAFE_PortalContext } from '@react-aria/overlays'
-
-/**
- * Hook to retrieve the portal container for overlays (menus, tooltips, popovers).
- * Returns the container from UNSAFE_PortalProvider context (pip-root in PiP, undefined in main window).
- */
-export const useOverlayPortalContainer = () => {
-  const { getContainer } = useUNSAFE_PortalContext()
-
-  return useMemo(() => getContainer?.() ?? undefined, [getContainer])
-}
-
-/**
- * Hook to retrieve the boundary element for overlay positioning.
- * Returns the portal container in PiP (for PiP-relative positioning), undefined in main window.
- */
-export const useOverlayBoundaryElement = () => {
-  const portalContainer = useOverlayPortalContainer()
-  return portalContainer
-}
@@ -1,5 +1,8 @@
 import { proxy } from 'valtio'
-import { PanelId, SubPanelId } from '@/features/rooms/livekit/types/panel'
+import {
+  PanelId,
+  SubPanelId,
+} from '@/features/rooms/livekit/hooks/useSidePanel'

 type State = {
  showHeader: boolean
@@ -1,9 +0,0 @@
-import { proxy } from 'valtio'
-
-type State = {
-  isOpen: boolean
-}
-
-export const roomPiPStore = proxy<State>({
-  isOpen: false,
-})
@@ -1,20 +1,6 @@
-const FOCUSABLE_SELECTOR =
-  'input, select, textarea, button, object, a, area[href], [tabindex]'
-
-/**
- * Find the first focusable descendant of `root`.
- * Works across documents (useful for the PiP window, which has its own
- * `document`). Pass the result of `ownerDocument.getElementById(...)` to
- * target an element in a specific document.
- */
-export const findFirstFocusable = (
-  root: HTMLElement | null | undefined
-): HTMLElement | null =>
-  root?.querySelector<HTMLElement>(FOCUSABLE_SELECTOR) ?? null
-
-/**
- * Wrapper for the main document. Use `findFirstFocusable` when
- * working with a non-main document (e.g. the PiP window).
- */
 export const getFirstControlBarFocusable = (id: string): HTMLElement | null =>
-  findFirstFocusable(document.getElementById(id))
+  document
+    .getElementById(id)
+    ?.querySelector(
+      'input, select, textarea, button, object, a, area[href], [tabindex]'
+    ) ?? null
@@ -1,12 +1,12 @@
 {
  "name": "mail_mjml",
-  "version": "1.15.0",
+  "version": "1.16.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "mail_mjml",
-      "version": "1.15.0",
+      "version": "1.16.0",
      "license": "MIT",
      "dependencies": {
        "@html-to/text-cli": "0.5.4",
@@ -1588,9 +1588,9 @@
      }
    },
    "node_modules/semver": {
-      "version": "7.7.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz",
-      "integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==",
+      "version": "7.8.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
+      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
      "license": "ISC",
      "bin": {
        "semver": "bin/semver.js"
@@ -1,6 +1,6 @@
 {
  "name": "mail_mjml",
-  "version": "1.15.0",
+  "version": "1.16.0",
  "description": "An util to generate html and text django's templates from mjml templates",
  "type": "module",
  "dependencies": {
@@ -1,12 +1,12 @@
 {
  "name": "sdk",
-  "version": "1.15.0",
+  "version": "1.16.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "sdk",
-      "version": "1.15.0",
+      "version": "1.16.0",
      "license": "ISC",
      "workspaces": [
        "./library",
@@ -1,6 +1,6 @@
 {
  "name": "sdk",
-  "version": "1.15.0",
+  "version": "1.16.0",
  "author": "",
  "license": "ISC",
  "description": "",
@@ -1,7 +1,7 @@

 [project]
 name = "summary"
-version = "1.15.0"
+version = "1.16.0"
 dependencies = [
    "fastapi[standard]>=0.105.0",
    "uvicorn>=0.24.0",
@@ -2,11 +2,8 @@

 from fastapi import APIRouter, Depends

-from summary.api.route import tasks, tasks_v2
+from summary.api.route import tasks_v2
 from summary.core.security import verify_tenant_api_key

-api_router_v1 = APIRouter(dependencies=[Depends(verify_tenant_api_key)])
-api_router_v1.include_router(tasks.router_tasks_v1, tags=["tasks"])
-
 api_router_v2 = APIRouter(dependencies=[Depends(verify_tenant_api_key)])
 api_router_v2.include_router(tasks_v2.router_tasks_v2, tags=["tasks"])
@@ -1,79 +0,0 @@
-"""API routes related to application tasks."""
-
-import time
-from typing import Optional
-
-from celery.result import AsyncResult
-from fastapi import APIRouter
-from pydantic import BaseModel, field_validator
-
-from summary.core.celery_worker import (
-    process_audio_transcribe_summarize_v2,
-)
-from summary.core.config import get_settings
-
-settings = get_settings()
-
-
-class TranscribeSummarizeTaskCreation(BaseModel):
-    """Transcription and summarization parameters."""
-
-    owner_id: str
-    recording_filename: str
-    metadata_filename: Optional[str] = None
-    email: str
-    sub: str
-    version: Optional[int] = 2
-    room: Optional[str]
-    owner_timezone: Optional[str]
-    language: Optional[str]
-    download_link: Optional[str]
-    context_language: Optional[str] = None
-    recording_start_at: Optional[str] = None
-    recording_end_at: Optional[str] = None
-
-    @field_validator("language")
-    @classmethod
-    def validate_language(cls, v):
-        """Validate 'language' parameter."""
-        if v is not None and v not in settings.whisperx_allowed_languages:
-            raise ValueError(
-                f"Language '{v}' is not allowed. "
-                f"Allowed languages: {', '.join(settings.whisperx_allowed_languages)}"
-            )
-        return v
-
-
-router_tasks_v1 = APIRouter(prefix="/tasks")
-
-
-@router_tasks_v1.post("/")
-async def create_transcribe_summarize_task(request: TranscribeSummarizeTaskCreation):
-    """Create a transcription and summarization task."""
-    task = process_audio_transcribe_summarize_v2.apply_async(
-        args=[
-            request.owner_id,
-            request.recording_filename,
-            request.metadata_filename,
-            request.email,
-            request.sub,
-            time.time(),
-            request.room,
-            request.owner_timezone,
-            request.language,
-            request.download_link,
-            request.context_language,
-            request.recording_start_at,
-            request.recording_end_at,
-        ],
-        queue=settings.transcribe_queue,
-    )
-
-    return {"id": task.id, "message": "Task created"}
-
-
-@router_tasks_v1.get("/{task_id}")
-async def get_task_status(task_id: str):
-    """Check task status by ID."""
-    task = AsyncResult(task_id)
-    return {"id": task_id, "status": task.status}
@@ -4,7 +4,6 @@

 import json
 import time
-from datetime import datetime

 import openai
 import sentry_sdk
@@ -16,8 +15,8 @@ from summary.core.analytics import MetadataManager, get_analytics
 from summary.core.config import get_settings
 from summary.core.file_service import FileService, FileServiceException
 from summary.core.llm_service import LLMException, LLMObservability, LLMService
-from summary.core.locales import get_locale
 from summary.core.models import (
+    RecordingMetadata,
    SummarizeTaskV2Payload,
    TranscribeTaskV2Payload,
 )
@@ -39,11 +38,9 @@ from summary.core.shared_models import (
    WhisperXResponse,
    webhook_payload_adapter,
 )
-from summary.core.transcript_formatter import TranscriptFormatter
 from summary.core.user_assign import resolve_speaker_identities
 from summary.core.webhook_service import (
    call_webhook_v2,
-    submit_content,
 )

 settings = get_settings()
@@ -79,23 +76,17 @@ file_service = FileService()
 def transcribe_audio(
    *,
    task_id: str,
-    recording_filename: str | None = None,
    language: str,
-    cloud_storage_url=None,
+    cloud_storage_url: str,
    raises: bool = False,
 ):
    """Transcribe an audio file using WhisperX.

-    Downloads the audio from MinIO or a cloud storage URL, sends it to
+    Downloads the audio from a cloud storage URL, sends it to
    WhisperX for transcription, and tracks metadata throughout the process.

    Returns the transcription object, or None if the file could not be retrieved.
    """
-    if bool(recording_filename) == bool(cloud_storage_url):
-        raise ValueError(
-            "Either filename or cloud_storage_url must be provided, but not both."
-        )
-
    logger.info("Initiating WhisperX client")
    whisperx_client = openai.OpenAI(
        api_key=settings.whisperx_api_key.get_secret_value(),
@@ -106,7 +97,6 @@ def transcribe_audio(
    # Transcription
    try:
        with file_service.prepare_audio_file(
-            remote_object_key=recording_filename,
            cloud_storage_url=cloud_storage_url,
        ) as (audio_file, metadata):
            metadata_manager.track(task_id, {"audio_length": metadata["duration"]})
@@ -150,10 +140,8 @@ def transcribe_audio(
        )
        logger.exception(
            (
-                "Unexpected error while preparing file | filename: %s "
-                "| cloud_storage_url: %s"
+                "Unexpected error while preparing file %s "
            ),
-            recording_filename,
            redacted_cloud_storage_url,
        )
        return None
@@ -163,41 +151,31 @@ def transcribe_audio(


 def resolve_speaker_identities_and_apply_to(
-    transcription, recording_start_at, recording_end_at, metadata_filename, task_id
-):
+    *, transcription: WhisperXResponse, recording_metadata: RecordingMetadata, task_id
+) -> WhisperXResponse:
    """Assign users to detected speakers and rewrite the transcriptions.

    Args:
        transcription: output of meet-whisperx after transcription and diarization
-        recording_start_at: sourced from LiveKit FileInfo via the egress_ended webhook
-        recording_end_at: sourced from LiveKit FileInfo via the egress_ended webhook
-        metadata_filename: name of metadata file containing VAD information in S3
+        recording_metadata: Metadata of the recording
        task_id: current task id, for logging purposes
    """
-    recording_start_dt = (
-        datetime.fromisoformat(recording_start_at) if recording_start_at else None
-    )
-    recording_end_dt = (
-        datetime.fromisoformat(recording_end_at) if recording_end_at else None
-    )
-
    logger.debug(
        "recording_start_dt: %s ; recording_end_dt: %s",
-        recording_start_dt,
-        recording_end_dt,
+        recording_metadata.start_at,
+        recording_metadata.end_at,
    )
-    if (recording_start_dt is None) or (recording_end_dt is None):
-        logger.debug("Skipping resolve_speaker_identities")
-        return transcription

    logger.debug("Running resolve_speaker_identities")
    try:
-        metadata = file_service.read_json(metadata_filename)
+        metadata = file_service.read_cloud_storage_json(
+            recording_metadata.cloud_storage_url
+        )
        speaker_mapping = resolve_speaker_identities(
            metadata,
            transcription,
-            recording_start_dt,
-            recording_end_dt,
+            recording_metadata.start_at,
+            recording_metadata.end_at,
        )
        new_transcription = speaker_mapping.apply_to(transcription.model_dump())
        return new_transcription
@@ -221,34 +199,6 @@ def resolve_speaker_identities_and_apply_to(
        return transcription


-def format_transcript(
-    transcription,
-    context_language: str | None,
-    language: str,
-    room: str | None,
-    recording_datetime: str | None,
-    owner_timezone: str | None,
-    download_link: str | None,
-) -> tuple[str, str]:
-    """Format a transcription into readable content with a title.
-
-    Resolves the locale from context_language / language, then uses
-    TranscriptFormatter to produce markdown content and a title.
-
-    Returns a (content, title) tuple.
-    """
-    locale = get_locale(context_language, language)
-    formatter = TranscriptFormatter(locale)
-
-    return formatter.format(
-        transcription,
-        room=room,
-        recording_datetime=recording_datetime,
-        owner_timezone=owner_timezone,
-        download_link=download_link,
-    )
-
-
 def format_actions(llm_output: dict) -> str:
    """Format the actions from the LLM output into a markdown list.

@@ -267,126 +217,23 @@ def format_actions(llm_output: dict) -> str:
    return ""


-@celery.task(
-    bind=True,
-    autoretry_for=[exceptions.HTTPError],
-    max_retries=settings.celery_max_retries,
-    queue=settings.transcribe_queue,
-)
-def process_audio_transcribe_summarize_v2(
-    self,
-    owner_id: str,
-    recording_filename: str,
-    metadata_filename: str | None,
-    email: str,
-    sub: str,
-    received_at: float,
-    room: str | None,
-    owner_timezone: str | None,
-    language: str | None,
-    download_link: str | None,
-    context_language: str | None = None,
-    recording_start_at: str | None = None,
-    recording_end_at: str | None = None,
-):
-    """Process an audio file by transcribing it and generating a summary.
-
-    This Celery task orchestrates:
-    1. Audio transcription via WhisperX
-    2. Transcript formatting
-    3. Webhook submission
-    4. Conditional summarization queuing
-
-    Args:
-        self: Celery task instance (passed on with bind=True)
-        owner_id: Unique identifier of the recording owner.
-        recording_filename: Name of the audio file in MinIO storage.
-        metadata_filename: Name of the audio file in MinIO storage.
-        email: Email address of the recording owner.
-        sub: OIDC subject identifier of the recording owner.
-        received_at: Unix timestamp when the recording was received.
-        room: room name where the recording took place.
-        owner_timezone: IANA timezone of the recording owner (e.g. "Europe/Paris").
-        language: ISO 639-1 language code for transcription.
-        download_link: URL to download the original recording.
-        context_language: ISO 639-1 language code of the meeting summary context text.
-        recording_start_at: ISO 8601 timestamp of when file recording actually started
-            (from LiveKit FileInfo.started_at via the egress_ended webhook).
-        recording_end_at: ISO 8601 timestamp of when file recording ended
-            (from LiveKit FileInfo.ended_at via the egress_ended webhook).
-    """
-    logger.info(
-        "Notification received | Owner: %s | Room: %s",
-        owner_id,
-        room,
-    )
-
-    task_id = self.request.id
-
-    # Transcribe the audio
-    transcription = transcribe_audio(
-        task_id=task_id, recording_filename=recording_filename, language=language
-    )
-    if transcription is None:
-        return
-
-    # Assign speakers and rewrite transcription/diarization output
-    if settings.is_resolve_speaker_identities_enabled and (
-        metadata_filename is not None
-    ):
-        transcription = resolve_speaker_identities_and_apply_to(
-            transcription,
-            recording_start_at,
-            recording_end_at,
-            metadata_filename,
-            task_id,
-        )
-
-    # Format output
-    content, title = format_transcript(
-        transcription,
-        context_language,
-        language,
-        room,
-        recording_start_at,
-        owner_timezone,
-        download_link,
-    )
-
-    submit_content(content, title, email, sub)
-    metadata_manager.capture(task_id, settings.posthog_event_success)
-
-    # LLM Summarization
-    if (
-        analytics.is_feature_enabled("summary-enabled", distinct_id=owner_id)
-        and settings.is_summary_enabled
-    ):
-        logger.info("Queuing summary generation task.")
-        summarize_transcription.apply_async(
-            args=[owner_id, content, email, sub, title],
-            queue=settings.summarize_queue,
-        )
-    else:
-        logger.info("Summary generation not enabled for this user. Skipping.")
-
-
-@signals.task_prerun.connect(sender=process_audio_transcribe_summarize_v2)
-def task_started(task_id=None, task=None, args=None, **kwargs):
-    """Signal handler called before task execution begins."""
-    task_args = args or []
-    metadata_manager.create(task_id, task_args)
-
-
-@signals.task_retry.connect(sender=process_audio_transcribe_summarize_v2)
-def task_retry_handler(request=None, reason=None, einfo=None, **kwargs):
-    """Signal handler called when task execution retries."""
-    metadata_manager.retry(request.id)
-
-
-@signals.task_failure.connect(sender=process_audio_transcribe_summarize_v2)
-def task_failure_handler(task_id, exception=None, **kwargs):
-    """Signal handler called when task execution fails permanently."""
-    metadata_manager.capture(task_id, settings.posthog_event_failure)
+# @signals.task_prerun.connect(sender=process_audio_transcribe_summarize_v2)
+# def task_started(task_id=None, task=None, args=None, **kwargs):
+#     """Signal handler called before task execution begins."""
+#     task_args = args or []
+#     metadata_manager.create(task_id, task_args)
+#
+#
+# @signals.task_retry.connect(sender=process_audio_transcribe_summarize_v2)
+# def task_retry_handler(request=None, reason=None, einfo=None, **kwargs):
+#     """Signal handler called when task execution retries."""
+#     metadata_manager.retry(request.id)
+#
+#
+# @signals.task_failure.connect(sender=process_audio_transcribe_summarize_v2)
+# def task_failure_handler(task_id, exception=None, **kwargs):
+#     """Signal handler called when task execution fails permanently."""
+#     metadata_manager.capture(task_id, settings.posthog_event_failure)


 def summarize_transcription_internals(
@@ -468,29 +315,6 @@ def summarize_transcription_internals(
    return summary


-@celery.task(
-    bind=True,
-    autoretry_for=[LLMException, Exception],
-    max_retries=settings.celery_max_retries,
-    queue=settings.summarize_queue,
-)
-def summarize_transcription(
-    self, owner_id: str, transcript: str, email: str, sub: str, title: str
-):
-    """Generate a summary from the provided transcription text.
-
-    This Celery task performs the following operations:
-    1. Run summary internals
-    2. Sends the final summary via webhook.
-    """
-    summary = summarize_transcription_internals(
-        owner_id=owner_id, transcript=transcript, session_id=self.request.id
-    )
-    summary_title = settings.summary_title_template.format(title=title)
-
-    submit_content(summary, summary_title, email, sub)
-
-
 ##################################################################################
 # Tasks v2
 ##################################################################################
@@ -549,6 +373,17 @@ def process_audio_transcribe_v2_task(
        ).model_dump()
    )

+    # Assign speakers and rewrite transcription/diarization output
+    if settings.is_resolve_speaker_identities_enabled and payload.metadata is not None:
+        try:
+            transcription_res = resolve_speaker_identities_and_apply_to(
+                transcription=transcription_res,
+                recording_metadata=payload.metadata,
+                task_id=job_id,
+            )
+        except BaseException as e:
+            logger.error(f"Failed to resolve speaker identities, skipping: {e}")
+
    file_service.store_transcript(
        transcript=transcription_res,
        job_id=job_id,
@@ -561,6 +396,8 @@ def process_audio_transcribe_v2_task(
    call_webhook_v2_task.apply_async(
        args=[success_payload.model_dump(), payload.tenant_id]
    )
+    metadata_manager.capture(job_id, settings.posthog_event_success)
+
    return success_payload.model_dump()


--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Florent Chehab	01ff215901	wip backend meet	2026-05-14 17:42:44 +02:00
Florent Chehab	217c74e830	💥(summary) removed summary v1 related code We are in the process of moving meet to summary v2 routes and tasks. This commits removes code from summary and moves some code from summary to meet, which should have the responsability of this code.	2026-05-14 14:04:42 +02:00
lebaudantoine	35951ba2a6	🔖(minor) bump release to 1.16.0	2026-05-13 22:30:32 +02:00
lebaudantoine	72184e1370	🩹(frontend) fix spacing regression in mobile control bar Correct excessive spacing between action buttons in the mobile control bar introduced by a recent layout change.	2026-05-13 20:15:32 +02:00
leo	1b4a8fbac2	🔧(agents) fix Docker setup Fix two issues. 1: Missmatch between commands in dev and production in Dockerfile, leading to unexpected behaviors. 2: Naming of multi-user-transcriber -> multi-user-transcriber-dev for coherence.	2026-05-13 20:07:45 +02:00
lebaudantoine	1e2fad5444	⏪️(mail) revert mail upgrade due to unhandled breaking changes Rollback the mail package upgrade after identifying multiple breaking changes introduced in v5 that were not fully accounted for. Local testing initially missed the issue because the mail Docker image had not been rebuilt automatically, causing broken emails to go unnoticed.	2026-05-13 19:55:54 +02:00
leo	96f97ed2d0	✨(summary) improve speaker assignment Speaker-to-participant assignment relie on WhisperX word timings, but incorrect word durations in the output can lead to inaccurate overlap scoring and wrong user attribution. Add a custom heuristic to trim overly long word durations before computing assignments.	2026-05-12 16:58:07 +02:00
lebaudantoine	02d16cb55c	⬆️(addons) update dependencies	2026-05-12 16:26:16 +02:00
lebaudantoine	7268ff6777	⬆️(mail) update dependencies	2026-05-12 16:26:16 +02:00
lebaudantoine	cca5bc2186	⬆️(frontend) update dependencies	2026-05-12 16:26:16 +02:00
leo	ec67a12fe4	✨(agents) use uv for dependency management Change from pip to uv for dependancy management in src/agents.	2026-05-12 13:47:19 +02:00
leo	05f32d008a	⬆️ (dependencies) Bump urllib3 from 2.6.3 to 2.7.0 [SECURITY] Fix CVE-2026-44431 and CVE-2026-44432.	2026-05-12 11:23:00 +02:00