Add workflow for automated Claude review of pull requests

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

.github/labels.yml

@@ -102,6 +102,9 @@
 - name: "backport-candidate"
   description: "Something that is a candidate for backport to a particular release branch"
   color: "0B8D85"
+- name: "Claude-Review"
+  description: "Request code review from Claude"
+  color: "e57157"
 - name: "customer-retainer"
   color: "F44A5F"
 - name: "dependencies"

.github/workflows/claude.yaml

@@ -0,0 +1,90 @@
+name: Claude
+on:
+  pull_request:
+    types: [labeled]
+
+permissions:
+  # The action exchanges the GitHub OIDC token for a short-lived Anthropic
+  # access token. GitHub API access goes through CLAUDE_GH_TOKEN instead.
+  id-token: write
+
+jobs:
+  review:
+    name: Review
+    # Only run on labelling and skip forks.
+    if: github.event.label.name == 'Claude-Review' && github.event.pull_request.head.repo.full_name == github.repository
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@11d5960a326750d5838078e36cf38b85af677262 # v4.4.0
+        with:
+          # The review looks at the individual commits, not just the combined diff
+          fetch-depth: 0
+          persist-credentials: false
+      - name: Review
+        uses: anthropics/claude-code-action@6fed3ca145920b639991cb756090506e1bcaf515 # v1.0.245
+        with:
+          anthropic_federation_rule_id: fdrl_01XQmWo4nka1ZTqZdsdeScyr
+          anthropic_organization_id: dfbc9a23-d636-4653-8970-035204ef60fa
+          anthropic_service_account_id: svac_018Ay5qaA7ZW8X7XsbdekqUM
+          anthropic_workspace_id: wrkspc_01Aw8LHjBS6fZysu9yqzYifW
+          # The token used here must grant read access to code, issues, and metadata as well as
+          # read and write access to pull requests.
+          github_token: ${{ secrets.CLAUDE_GH_TOKEN }}
+          use_sticky_comment: true
+          track_progress: true
+          prompt: |
+            Review this pull request under the following (and no further) angles:
+
+            1. Scope:
+
+               - Does the PR do one thing?
+               - Is the PR free of unrelated fixes and drive-by refactorings?
+               - If the PR is large, could it reasonably be split into smaller PRs
+                 that still deliver value?
+
+            2. Commits:
+               
+               - Is the work split into self-contained commits of reasonable size?
+               - Are the commits arranged in a sensible order?
+               - Have required refactorings been split out into separate commits?
+               - Is the history free of "wip", checkpoint and fixup-style commits
+                 which only correct an earlier commit in the same PR?
+
+            3. Code:
+
+               - Are the code changes functionally correct?
+               - Do the changes introduce new security vulnerabilities or metadata
+                 leaks?
+               - Is the new code performant enough?
+               - Don't check anything that is already validated via other GitHub
+                 workflows like linting, formatting or tests passing.
+
+            Read the commits themselves with `git log` and `git diff` against
+            the base branch of the PR.
+
+            Drop any findings that are outside the above review angles or that don't
+            require resolution. Grade the severity of each finding as either "🟡 low",
+            "🟠 medium" or "🔴 high". Devise at least one possible resolution for each
+            finding.
+
+            Report the graded findings and resolutions from the "Code" angle as inline
+            comments. Add a footer "_-- Finding from automated review_" to each inline
+            comment.
+
+            Finally, report your overall result as PR comment. Start your message with
+            "# Automated review". Then add one section per review angle with:
+
+            - A verdict of "✅ PASS" or "❌ NEEDS WORK"
+            - A bullet list summarizing the remaining non-inlined graded findings and
+              resolutions (as nested bullets).
+
+            Be brief and concise in all your communication. Do not mention what you have
+            not covered and don't bring up issues that have already been fixed.
+
+            Use Markdown links for anything that can be navigated to on GitHub such
+            as files, commits, issues, pull requests, workflow runs, etc.
+          claude_args: |
+            --model claude-fable-5-1
+            --allowedTools "mcp__github_inline_comment__create_inline_comment,Bash(git log:*),Bash(git diff:*),Bash(git show:*)"
+            --max-turns 50

README.md

@@ -306,9 +306,10 @@ directory target it rather than the repository; run them from the repository
 root. The host imports the component from
 `@element-hq/element-call-component` and the stylesheet from
 `@element-hq/element-call-component/style.css`, and has to provide `react`,
-`react-dom`, `matrix-js-sdk`, `livekit-client`, `@vector-im/compound-web` and
+`react-dom`, `matrix-js-sdk`, `@vector-im/compound-web` and
 `@vector-im/compound-design-tokens` itself, since the bundle leaves them
-external. Compound's stylesheet are the host's to load too: the component shares
+external.
+Compound's stylesheet are the host's to load too: the component shares
 the host's copy of Compound, (required for example for tooltips)
 
 The component is large, and a host will usually load it lazily, only once a

component/package.json

@@ -40,7 +40,6 @@
   "peerDependencies": {
     "@vector-im/compound-design-tokens": "^11.0.0",
     "@vector-im/compound-web": "^10.0.0",
-    "livekit-client": "^2.18.1",
     "matrix-js-sdk": "*",
     "react": "^19",
     "react-dom": "^19"

docker-compose-playwright.yml

@@ -19,7 +19,7 @@ services:
       - ./backend/playwright_homeserver-othersite.yaml:/data/cfg/homeserver.yaml:Z
   element-web:
     # Pin to a SHA so that upstream cannot break our tests. Renovate handles regular updates.
-    image: ghcr.io/element-hq/element-web:develop@sha256:39c94f0c29e7c5614ac7264a872bb3643320158b3bf1730fc4742ddf672c27d6
+    image: ghcr.io/element-hq/element-web:develop@sha256:53a4fe6d60afc0647b95d9e1365d696679241821d63da94dfbfc33171a42ed6d
   element-web-1:
     # Pin to a SHA so that upstream cannot break our tests. Renovate handles regular updates.
-    image: ghcr.io/element-hq/element-web:develop@sha256:39c94f0c29e7c5614ac7264a872bb3643320158b3bf1730fc4742ddf672c27d6
+    image: ghcr.io/element-hq/element-web:develop@sha256:53a4fe6d60afc0647b95d9e1365d696679241821d63da94dfbfc33171a42ed6d

docs/agents/architecture.md

@@ -76,8 +76,10 @@ Code that builds in only one is a bug.
 - `build:component` — `@element-hq/element-call-component`, sources in `component/`
   (its own pnpm project; run pnpm from the repo root). Host API is in the README;
   `pnpm lint:externals` rejects an import of a `react` / `react-dom` /
-  `matrix-js-sdk` / `livekit-client` / `@vector-im/compound-web` /
+  `matrix-js-sdk` / `@vector-im/compound-web` /
   `@vector-im/compound-design-tokens` subpath the externals list omits.
+  `livekit-client` is bundled on purpose: no host imports it, and the pinned
+  version travels with the component.
   Compound's stylesheets are loaded by `src/index.css` for the page and by the
   host for the component, never by `src/base.css`. Two entry
   points: `index.tsx` (the component) and `api.ts` (types, enums and

pnpm-lock.yaml

@@ -222,7 +222,7 @@ importers:
         version: 10.6.1(postcss@8.5.26)
       postcss-selector-parser:
         specifier: ^7.1.1
-        version: 7.1.3
+        version: 7.1.6
       posthog-js:
         specifier: 1.408.2
         version: 1.408.2
@@ -5160,8 +5160,8 @@ packages:
     peerDependencies:
       postcss: ^8.4
 
-  postcss-selector-parser@7.1.3:
-    resolution: {integrity: sha512-ajnd7iZnqjJDkyHNfznl/ZVO0lWqvBmQXfKKENx9/p/bEiF/L3eHwdydNUg9RXZx6xfZWOCmXmBa5oeB+YrAPQ==}
+  postcss-selector-parser@7.1.6:
+    resolution: {integrity: sha512-7qASPzhKF2l2KLboRZux8CCTRMdGiV08vWmyKzPz22qZ7ZjQBOeY7rNzNoCLSUiftJ7HUq0GERHmxw/t0dCdMw==}
     engines: {node: '>=4'}
 
   postcss-value-parser@4.2.0:
@@ -6397,9 +6397,9 @@ snapshots:
 
   '@csstools/postcss-cascade-layers@5.0.2(postcss@8.5.26)':
     dependencies:
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.3)
+      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.6)
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   '@csstools/postcss-color-function-display-p3-linear@1.0.1(postcss@8.5.26)':
     dependencies:
@@ -6505,9 +6505,9 @@ snapshots:
 
   '@csstools/postcss-is-pseudo-class@5.0.3(postcss@8.5.26)':
     dependencies:
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.3)
+      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.6)
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   '@csstools/postcss-light-dark-function@2.0.11(postcss@8.5.26)':
     dependencies:
@@ -6609,7 +6609,7 @@ snapshots:
   '@csstools/postcss-scope-pseudo-class@4.0.1(postcss@8.5.26)':
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   '@csstools/postcss-sign-functions@1.1.4(postcss@8.5.26)':
     dependencies:
@@ -6653,13 +6653,13 @@ snapshots:
     dependencies:
       postcss: 8.5.26
 
-  '@csstools/selector-resolve-nested@3.1.0(postcss-selector-parser@7.1.3)':
+  '@csstools/selector-resolve-nested@3.1.0(postcss-selector-parser@7.1.6)':
     dependencies:
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
-  '@csstools/selector-specificity@5.0.0(postcss-selector-parser@7.1.3)':
+  '@csstools/selector-specificity@5.0.0(postcss-selector-parser@7.1.6)':
     dependencies:
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   '@csstools/utilities@2.0.0(postcss@8.5.26)':
     dependencies:
@@ -9216,13 +9216,13 @@ snapshots:
   css-blank-pseudo@7.0.1(postcss@8.5.26):
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   css-has-pseudo@7.0.3(postcss@8.5.26):
     dependencies:
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.3)
+      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.6)
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
       postcss-value-parser: 4.2.0
 
   css-prefers-color-scheme@10.0.0(postcss@8.5.26):
@@ -10666,7 +10666,7 @@ snapshots:
   postcss-attribute-case-insensitive@7.0.1(postcss@8.5.26):
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   postcss-clamp@4.1.0(postcss@8.5.26):
     dependencies:
@@ -10717,12 +10717,12 @@ snapshots:
       '@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4)
       '@csstools/css-tokenizer': 3.0.4
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   postcss-dir-pseudo-class@9.0.1(postcss@8.5.26):
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   postcss-double-position-gradients@6.0.4(postcss@8.5.26):
     dependencies:
@@ -10734,12 +10734,12 @@ snapshots:
   postcss-focus-visible@10.0.1(postcss@8.5.26):
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   postcss-focus-within@9.0.1(postcss@8.5.26):
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   postcss-font-variant@5.0.0(postcss@8.5.26):
     dependencies:
@@ -10771,10 +10771,10 @@ snapshots:
 
   postcss-nesting@13.0.2(postcss@8.5.26):
     dependencies:
-      '@csstools/selector-resolve-nested': 3.1.0(postcss-selector-parser@7.1.3)
-      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.3)
+      '@csstools/selector-resolve-nested': 3.1.0(postcss-selector-parser@7.1.6)
+      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.6)
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   postcss-opacity-percentage@3.0.0(postcss@8.5.26):
     dependencies:
@@ -10872,7 +10872,7 @@ snapshots:
   postcss-pseudo-class-any-link@10.0.1(postcss@8.5.26):
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
   postcss-replace-overflow-wrap@4.0.0(postcss@8.5.26):
     dependencies:
@@ -10881,9 +10881,9 @@ snapshots:
   postcss-selector-not@8.0.1(postcss@8.5.26):
     dependencies:
       postcss: 8.5.26
-      postcss-selector-parser: 7.1.3
+      postcss-selector-parser: 7.1.6
 
-  postcss-selector-parser@7.1.3:
+  postcss-selector-parser@7.1.6:
     dependencies:
       cssesc: 3.0.0
       util-deprecate: 1.0.2

scripts/check-component-externals.mjs

@@ -9,7 +9,7 @@ Please see LICENSE in the repository root for full details.
  * Checks that the component build leaves the packages a host must supply to
  * the host.
  *
- * A host application already has React, the Matrix SDK, LiveKit and Compound,
+ * A host application already has React, the Matrix SDK and Compound,
  * and a second copy of any of them is worse than dead weight: React would hold
  * two sets of hooks, the Matrix client would run two sync loops, and a second
  * Compound would style the tooltips it floats into the host's body with class
@@ -44,7 +44,6 @@ const MUST_BE_EXTERNAL = [
   "react",
   "react-dom",
   "matrix-js-sdk",
-  "livekit-client",
   "@vector-im/compound-web",
   "@vector-im/compound-design-tokens",
 ];

vite-component.config.ts

@@ -88,7 +88,6 @@ export default defineConfig(({ mode }) => {
           "react/compiler-runtime",
           "react-dom",
           "react-dom/client",
-          "livekit-client",
           "matrix-js-sdk",
           "matrix-js-sdk/lib/browser-index",
           "matrix-js-sdk/lib/client",