Compare commits

..
26 changed files with 110 additions and 290 deletions

View file

@ -57,7 +57,7 @@ body:
required: true required: true
- type: textarea - type: textarea
attributes: attributes:
label: Environment label: Environement
description: | description: |
Please provide information about your environment. Include the following: Please provide information about your environment. Include the following:
- OS: - OS:

View file

@ -12,7 +12,7 @@ jobs:
PR_NUMBER: ${{github.event.number}} PR_NUMBER: ${{github.event.number}}
steps: steps:
- name: Checkout repository - name: Checkout repository
uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0 uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
- name: Setup node - name: Setup node
uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0 uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
with: with:

View file

@ -39,7 +39,7 @@ jobs:
path: dist path: dist
- name: Deploy to Netlify - name: Deploy to Netlify
id: netlify id: netlify
uses: nwtgck/actions-netlify@d22a32a27c918fe470bbc562e984f80ec48c2668 # v4.0.0 uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654 # v3.0.0
with: with:
publish-dir: dist publish-dir: dist
deploy-message: "Deploy PR ${{ steps.pr.outputs.id }}" deploy-message: "Deploy PR ${{ steps.pr.outputs.id }}"

View file

@ -16,17 +16,17 @@ jobs:
steps: steps:
- name: Checkout repository - name: Checkout repository
uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0 uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
- name: Set up QEMU - name: Set up QEMU
uses: docker/setup-qemu-action@96fe6ef7f33517b61c61be40b68a1882f3264fb8 # v4.2.0 uses: docker/setup-qemu-action@c7c53464625b32c7a7e944ae62b3e17d2b600130 # v3.7.0
- name: Set up Docker Buildx - name: Set up Docker Buildx
uses: docker/setup-buildx-action@bb05f3f5519dd87d3ba754cc423b652a5edd6d2c # v4.2.0 uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3.12.0
- name: Login to Docker Hub #Do not update this action from a outside PR - name: Login to Docker Hub #Do not update this action from a outside PR
if: github.event.pull_request.head.repo.fork == false if: github.event.pull_request.head.repo.fork == false
uses: docker/login-action@af1e73f918a031802d376d3c8bbc3fe56130a9b0 # v4.4.0 uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
with: with:
username: ${{ secrets.DOCKER_USERNAME }} username: ${{ secrets.DOCKER_USERNAME }}
password: ${{ secrets.DOCKER_PASSWORD }} password: ${{ secrets.DOCKER_PASSWORD }}
@ -34,7 +34,7 @@ jobs:
- name: Login to the Github Container registry #Do not update this action from a outside PR - name: Login to the Github Container registry #Do not update this action from a outside PR
if: github.event.pull_request.head.repo.fork == false if: github.event.pull_request.head.repo.fork == false
uses: docker/login-action@af1e73f918a031802d376d3c8bbc3fe56130a9b0 # v4.4.0 uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
with: with:
registry: ghcr.io registry: ghcr.io
username: ${{ github.actor }} username: ${{ github.actor }}
@ -43,14 +43,14 @@ jobs:
- name: Extract metadata (tags, labels) for Docker, GHCR - name: Extract metadata (tags, labels) for Docker, GHCR
id: meta id: meta
uses: docker/metadata-action@dc802804100637a589fabce1cb79ff13a1411302 # v6.2.0 uses: docker/metadata-action@c299e40c65443455700f0fdfc63efafe5b349051 # v5.10.0
with: with:
images: | images: |
ajbura/cinny ajbura/cinny
ghcr.io/${{ github.repository }} ghcr.io/${{ github.repository }}
- name: Build Docker image (no push) - name: Build Docker image (no push)
uses: docker/build-push-action@53b7df96c91f9c12dcc8a07bcb9ccacbed38856a # v7.3.0 uses: docker/build-push-action@bcafcacb16a39f128d818304e6c9c0c18556b85f # v7.1.0
with: with:
context: . context: .
platforms: linux/amd64 platforms: linux/amd64

View file

@ -14,7 +14,7 @@ jobs:
pull-requests: write pull-requests: write
steps: steps:
- name: Checkout - name: Checkout
uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0 uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
- name: NPM Lockfile Changes - name: NPM Lockfile Changes
uses: codepunkt/npm-lockfile-changes@b40543471c36394409466fdb277a73a0856d7891 # v1.0.0 uses: codepunkt/npm-lockfile-changes@b40543471c36394409466fdb277a73a0856d7891 # v1.0.0
with: with:

View file

@ -11,7 +11,7 @@ jobs:
runs-on: ubuntu-latest runs-on: ubuntu-latest
steps: steps:
- name: Checkout repository - name: Checkout repository
uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0 uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
- name: Setup node - name: Setup node
uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0 uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
with: with:
@ -24,7 +24,7 @@ jobs:
NODE_OPTIONS: '--max_old_space_size=4096' NODE_OPTIONS: '--max_old_space_size=4096'
run: npm run build run: npm run build
- name: Deploy to Netlify - name: Deploy to Netlify
uses: nwtgck/actions-netlify@d22a32a27c918fe470bbc562e984f80ec48c2668 # v4.0.0 uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654 # v3.0.0
with: with:
publish-dir: dist publish-dir: dist
deploy-message: 'Dev deploy ${{ github.sha }}' deploy-message: 'Dev deploy ${{ github.sha }}'

View file

@ -10,7 +10,7 @@ jobs:
runs-on: ubuntu-latest runs-on: ubuntu-latest
steps: steps:
- name: Checkout repository - name: Checkout repository
uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0 uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
- name: Setup node - name: Setup node
uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0 uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
with: with:
@ -23,7 +23,7 @@ jobs:
NODE_OPTIONS: '--max_old_space_size=4096' NODE_OPTIONS: '--max_old_space_size=4096'
run: npm run build run: npm run build
- name: Deploy to Netlify - name: Deploy to Netlify
uses: nwtgck/actions-netlify@d22a32a27c918fe470bbc562e984f80ec48c2668 # v4.0.0 uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654 # v3.0.0
with: with:
publish-dir: dist publish-dir: dist
deploy-message: 'Prod deploy ${{ github.ref_name }}' deploy-message: 'Prod deploy ${{ github.ref_name }}'
@ -52,9 +52,8 @@ jobs:
gpg --export | xxd -p gpg --export | xxd -p
echo '${{ secrets.GNUPG_PASSPHRASE }}' | gpg --batch --yes --pinentry-mode loopback --passphrase-fd 0 --armor --detach-sign cinny-${{ steps.vars.outputs.tag }}.tar.gz echo '${{ secrets.GNUPG_PASSPHRASE }}' | gpg --batch --yes --pinentry-mode loopback --passphrase-fd 0 --armor --detach-sign cinny-${{ steps.vars.outputs.tag }}.tar.gz
- name: Upload tagged release - name: Upload tagged release
uses: softprops/action-gh-release@718ea10b132b3b2eba29c1007bb80653f286566b # v3.0.1 uses: softprops/action-gh-release@b4309332981a82ec1c5618f44dd2e27cc8bfbfda # v3.0.0
with: with:
tag_name: ${{ github.ref_name }}
files: | files: |
cinny-${{ steps.vars.outputs.tag }}.tar.gz cinny-${{ steps.vars.outputs.tag }}.tar.gz
cinny-${{ steps.vars.outputs.tag }}.tar.gz.asc cinny-${{ steps.vars.outputs.tag }}.tar.gz.asc
@ -67,31 +66,31 @@ jobs:
packages: write packages: write
steps: steps:
- name: Checkout repository - name: Checkout repository
uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0 uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
- name: Set up QEMU - name: Set up QEMU
uses: docker/setup-qemu-action@96fe6ef7f33517b61c61be40b68a1882f3264fb8 # v4.2.0 uses: docker/setup-qemu-action@c7c53464625b32c7a7e944ae62b3e17d2b600130 # v3.7.0
- name: Set up Docker Buildx - name: Set up Docker Buildx
uses: docker/setup-buildx-action@bb05f3f5519dd87d3ba754cc423b652a5edd6d2c # v4.2.0 uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3.12.0
- name: Login to Docker Hub #Do not update this action from a outside PR - name: Login to Docker Hub #Do not update this action from a outside PR
uses: docker/login-action@af1e73f918a031802d376d3c8bbc3fe56130a9b0 # v4.4.0 uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
with: with:
username: ${{ secrets.DOCKER_USERNAME }} username: ${{ secrets.DOCKER_USERNAME }}
password: ${{ secrets.DOCKER_PASSWORD }} password: ${{ secrets.DOCKER_PASSWORD }}
- name: Login to the Github Container registry #Do not update this action from a outside PR - name: Login to the Github Container registry #Do not update this action from a outside PR
uses: docker/login-action@af1e73f918a031802d376d3c8bbc3fe56130a9b0 # v4.4.0 uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
with: with:
registry: ghcr.io registry: ghcr.io
username: ${{ github.actor }} username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }} password: ${{ secrets.GITHUB_TOKEN }}
- name: Extract metadata (tags, labels) for Docker, GHCR - name: Extract metadata (tags, labels) for Docker, GHCR
id: meta id: meta
uses: docker/metadata-action@dc802804100637a589fabce1cb79ff13a1411302 # v6.2.0 uses: docker/metadata-action@c299e40c65443455700f0fdfc63efafe5b349051 # v5.10.0
with: with:
images: | images: |
${{ secrets.DOCKER_USERNAME }}/cinny ${{ secrets.DOCKER_USERNAME }}/cinny
ghcr.io/${{ github.repository }} ghcr.io/${{ github.repository }}
- name: Build and push Docker image - name: Build and push Docker image
uses: docker/build-push-action@53b7df96c91f9c12dcc8a07bcb9ccacbed38856a # v7.3.0 uses: docker/build-push-action@bcafcacb16a39f128d818304e6c9c0c18556b85f # v7.1.0
with: with:
context: . context: .
platforms: linux/amd64,linux/arm64 platforms: linux/amd64,linux/arm64

View file

@ -11,7 +11,7 @@ RUN npm run build
## App ## App
FROM nginx:1.31.2-alpine FROM nginx:1.29.8-alpine
COPY --from=builder /src/dist /app COPY --from=builder /src/dist /app
COPY --from=builder /src/docker-nginx.conf /etc/nginx/conf.d/default.conf COPY --from=builder /src/docker-nginx.conf /etc/nginx/conf.d/default.conf

166
package-lock.json generated
View file

@ -1,12 +1,12 @@
{ {
"name": "cinny", "name": "cinny",
"version": "4.12.6", "version": "4.12.2",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "cinny", "name": "cinny",
"version": "4.12.6", "version": "4.12.2",
"license": "AGPL-3.0-only", "license": "AGPL-3.0-only",
"dependencies": { "dependencies": {
"@atlaskit/pragmatic-drag-and-drop": "1.1.6", "@atlaskit/pragmatic-drag-and-drop": "1.1.6",
@ -32,7 +32,7 @@
"emojibase-data": "15.3.2", "emojibase-data": "15.3.2",
"file-saver": "2.0.5", "file-saver": "2.0.5",
"focus-trap-react": "10.0.2", "focus-trap-react": "10.0.2",
"folds": "2.7.1", "folds": "2.6.2",
"html-dom-parser": "4.0.0", "html-dom-parser": "4.0.0",
"html-react-parser": "4.2.0", "html-react-parser": "4.2.0",
"i18next": "23.12.2", "i18next": "23.12.2",
@ -43,7 +43,7 @@
"jotai": "2.6.0", "jotai": "2.6.0",
"linkify-react": "4.3.2", "linkify-react": "4.3.2",
"linkifyjs": "4.3.2", "linkifyjs": "4.3.2",
"matrix-js-sdk": "41.7.0", "matrix-js-sdk": "41.5.0",
"matrix-widget-api": "1.16.1", "matrix-widget-api": "1.16.1",
"millify": "6.1.0", "millify": "6.1.0",
"pdfjs-dist": "4.2.67", "pdfjs-dist": "4.2.67",
@ -58,7 +58,7 @@
"react-i18next": "15.0.0", "react-i18next": "15.0.0",
"react-range": "1.8.14", "react-range": "1.8.14",
"react-router-dom": "6.30.3", "react-router-dom": "6.30.3",
"sanitize-html": "2.17.6", "sanitize-html": "2.17.4",
"slate": "0.123.0", "slate": "0.123.0",
"slate-dom": "0.123.0", "slate-dom": "0.123.0",
"slate-history": "0.113.1", "slate-history": "0.113.1",
@ -66,7 +66,7 @@
"ua-parser-js": "1.0.35" "ua-parser-js": "1.0.35"
}, },
"devDependencies": { "devDependencies": {
"@element-hq/element-call-embedded": "0.20.1", "@element-hq/element-call-embedded": "0.19.1",
"@esbuild-plugins/node-globals-polyfill": "0.2.3", "@esbuild-plugins/node-globals-polyfill": "0.2.3",
"@rollup/plugin-inject": "5.0.3", "@rollup/plugin-inject": "5.0.3",
"@rollup/plugin-wasm": "6.1.1", "@rollup/plugin-wasm": "6.1.1",
@ -1774,9 +1774,9 @@
} }
}, },
"node_modules/@element-hq/element-call-embedded": { "node_modules/@element-hq/element-call-embedded": {
"version": "0.20.1", "version": "0.19.1",
"resolved": "https://registry.npmjs.org/@element-hq/element-call-embedded/-/element-call-embedded-0.20.1.tgz", "resolved": "https://registry.npmjs.org/@element-hq/element-call-embedded/-/element-call-embedded-0.19.1.tgz",
"integrity": "sha512-ODg2r7UmR8UjRpapLKbn6v1PS8fu/r58zdbvXMYaAlUEAC2f6L/9Moc9S4noG1+ARgWxY+m2vLmNDK9G9uFZYQ==", "integrity": "sha512-RDZY3P3LTx10ACaGhzkwh2+boNB3x54zHF/7v/cCyoQlAVfEYMhgMEb4CRTwJFwwYFe1r++6Higa0A0G5XxZ8Q==",
"dev": true "dev": true
}, },
"node_modules/@emotion/hash": { "node_modules/@emotion/hash": {
@ -2386,9 +2386,9 @@
} }
}, },
"node_modules/@matrix-org/matrix-sdk-crypto-wasm": { "node_modules/@matrix-org/matrix-sdk-crypto-wasm": {
"version": "18.3.1", "version": "18.3.0",
"resolved": "https://registry.npmjs.org/@matrix-org/matrix-sdk-crypto-wasm/-/matrix-sdk-crypto-wasm-18.3.1.tgz", "resolved": "https://registry.npmjs.org/@matrix-org/matrix-sdk-crypto-wasm/-/matrix-sdk-crypto-wasm-18.3.0.tgz",
"integrity": "sha512-VRjWhE1UgHnPpJ3b9B5+8z71ZC/HICFngPPFIN6ktzmUBKI5RusPujzbAQUoB3CgZ0yU58L99AfSQS4YTztSWw==", "integrity": "sha512-9a4feyt8QLysARu7PHKaRWT+wcCd+IYH074LXp9QK5WqfN4zUXueRhiSSMNT18Bm+8q3sBR/4zxDxOSDR0M8Kg==",
"license": "Apache-2.0", "license": "Apache-2.0",
"engines": { "engines": {
"node": ">= 18" "node": ">= 18"
@ -6216,16 +6216,12 @@
"optional": true "optional": true
}, },
"node_modules/content-type": { "node_modules/content-type": {
"version": "2.0.0", "version": "1.0.5",
"resolved": "https://registry.npmjs.org/content-type/-/content-type-2.0.0.tgz", "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
"integrity": "sha512-j/O/d7GcZCyNl7/hwZAb606rzqkyvaDctLmckbxLzHvFBzTJHuGEdodATcP3yIRoDrLHkIATJuvzbFlp/ki2cQ==", "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
"license": "MIT", "license": "MIT",
"engines": { "engines": {
"node": ">=18" "node": ">= 0.6"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/express"
} }
}, },
"node_modules/conventional-commit-types": { "node_modules/conventional-commit-types": {
@ -7906,9 +7902,9 @@
} }
}, },
"node_modules/folds": { "node_modules/folds": {
"version": "2.7.1", "version": "2.6.2",
"resolved": "https://registry.npmjs.org/folds/-/folds-2.7.1.tgz", "resolved": "https://registry.npmjs.org/folds/-/folds-2.6.2.tgz",
"integrity": "sha512-A1XGXJ4hp1W0cpFUIjYj9gPSzKVxqj9BlTBJTqmmtTUiEFDzXvhBITJdcqmlDsmcd756tu/iygSAzdky5fDcrg==", "integrity": "sha512-1HemxxSnBm8/U5kq1pDQrFkpltWgQN90DmWCZWkZb7D2pe8BhOJSwIRLjk9WxHcw6nn69oz2XNYIXtSw0LvX1w==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peerDependencies": { "peerDependencies": {
"@vanilla-extract/css": "1.9.2", "@vanilla-extract/css": "1.9.2",
@ -8483,7 +8479,6 @@
"version": "10.1.0", "version": "10.1.0",
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-10.1.0.tgz", "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-10.1.0.tgz",
"integrity": "sha512-VTZkM9GWRAtEpveh7MSF6SjjrpNVNNVJfFup7xTY3UpFtm67foy9HDVXneLtFVt4pMz5kZtgNcvCniNFb1hlEQ==", "integrity": "sha512-VTZkM9GWRAtEpveh7MSF6SjjrpNVNNVJfFup7xTY3UpFtm67foy9HDVXneLtFVt4pMz5kZtgNcvCniNFb1hlEQ==",
"dev": true,
"funding": [ "funding": [
"https://github.com/fb55/htmlparser2?sponsor=1", "https://github.com/fb55/htmlparser2?sponsor=1",
{ {
@ -8503,7 +8498,6 @@
"version": "7.0.1", "version": "7.0.1",
"resolved": "https://registry.npmjs.org/entities/-/entities-7.0.1.tgz", "resolved": "https://registry.npmjs.org/entities/-/entities-7.0.1.tgz",
"integrity": "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA==", "integrity": "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA==",
"dev": true,
"license": "BSD-2-Clause", "license": "BSD-2-Clause",
"engines": { "engines": {
"node": ">=0.12" "node": ">=0.12"
@ -10112,16 +10106,16 @@
"license": "Apache-2.0" "license": "Apache-2.0"
}, },
"node_modules/matrix-js-sdk": { "node_modules/matrix-js-sdk": {
"version": "41.7.0", "version": "41.5.0",
"resolved": "https://registry.npmjs.org/matrix-js-sdk/-/matrix-js-sdk-41.7.0.tgz", "resolved": "https://registry.npmjs.org/matrix-js-sdk/-/matrix-js-sdk-41.5.0.tgz",
"integrity": "sha512-MP0xNv/VVRbshq00TE6EVo77IIXsQk0KjiVtgKV0t9j/V77a6Klt00QrrO0XykkTUsNC0+mQeBMxnx75rZO86Q==", "integrity": "sha512-CK3h+qQJ4wkVEUgEWc5MdLjccXyiFqncCC53P+auqOhnX2U6tAFsRfnbML1QQiKIsFMzqTrAnF/4a5LUUOIeXg==",
"license": "Apache-2.0", "license": "Apache-2.0",
"dependencies": { "dependencies": {
"@babel/runtime": "^7.12.5", "@babel/runtime": "^7.12.5",
"@matrix-org/matrix-sdk-crypto-wasm": "^18.3.1", "@matrix-org/matrix-sdk-crypto-wasm": "^18.2.0",
"another-json": "^0.2.0", "another-json": "^0.2.0",
"bs58": "^6.0.0", "bs58": "^6.0.0",
"content-type": "^2.0.0", "content-type": "^1.0.4",
"jwt-decode": "^4.0.0", "jwt-decode": "^4.0.0",
"loglevel": "^1.9.2", "loglevel": "^1.9.2",
"matrix-events-sdk": "0.0.1", "matrix-events-sdk": "0.0.1",
@ -11682,122 +11676,18 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/sanitize-html": { "node_modules/sanitize-html": {
"version": "2.17.6", "version": "2.17.4",
"resolved": "https://registry.npmjs.org/sanitize-html/-/sanitize-html-2.17.6.tgz", "resolved": "https://registry.npmjs.org/sanitize-html/-/sanitize-html-2.17.4.tgz",
"integrity": "sha512-M4bo9tfv1yfhQZZKkc6dL07ALrGJtfvNOuhX3hU9AVPR/uPQ+nKOJBqTYc7LfMQblTW04mtSWDJWEyLvygJsLA==", "integrity": "sha512-2HW7v2ol/uAM7sX4hbD8Z59OGWmAPrvjL8E71UWlBcj6m+kcF6ilQBLny+cIgY214QJeJT5tQuxKKqX0SQqjGQ==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"deepmerge": "^4.2.2", "deepmerge": "^4.2.2",
"escape-string-regexp": "^4.0.0", "escape-string-regexp": "^4.0.0",
"htmlparser2": "^12.0.0", "htmlparser2": "^10.1.0",
"is-plain-object": "^5.0.0", "is-plain-object": "^5.0.0",
"launder": "^1.7.1", "launder": "^1.7.1",
"parse-srcset": "^1.0.2", "parse-srcset": "^1.0.2",
"postcss": "^8.3.11" "postcss": "^8.3.11"
},
"engines": {
"node": ">=22.12.0"
}
},
"node_modules/sanitize-html/node_modules/dom-serializer": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-3.1.1.tgz",
"integrity": "sha512-4MEa38/QexBob6gFNwu+EGdWvhJ1OKuNwdYY3Y3NyeWDQfnGeDYQUDfIRzWu5B5gsv03so2Uxd28YC6zrsx3Lw==",
"license": "MIT",
"dependencies": {
"domelementtype": "^3.0.0",
"domhandler": "^6.0.0",
"entities": "^8.0.0"
},
"engines": {
"node": ">=20.19.0"
},
"funding": {
"type": "github",
"url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
}
},
"node_modules/sanitize-html/node_modules/domelementtype": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-3.0.0.tgz",
"integrity": "sha512-umCQid3jKbDmVjx8jGaW7uUykm4DEUeyV21hPxNMo2nV955DhUThwqyOIDtreepP31hl84X7G5U9ZfsWvIB3Pg==",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/fb55"
}
],
"license": "BSD-2-Clause",
"engines": {
"node": ">=20.19.0"
}
},
"node_modules/sanitize-html/node_modules/domhandler": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/domhandler/-/domhandler-6.0.1.tgz",
"integrity": "sha512-gYzvtM72ZtxQO0T048kd6HWSbbGCNOUwcnfQ01cqIJ4X2IYKFFHZ5mKvrQETcFXxsRObZulDaKmy//R7TPtsBg==",
"license": "BSD-2-Clause",
"dependencies": {
"domelementtype": "^3.0.0"
},
"engines": {
"node": ">=20.19.0"
},
"funding": {
"type": "github",
"url": "https://github.com/fb55/domhandler?sponsor=1"
}
},
"node_modules/sanitize-html/node_modules/domutils": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/domutils/-/domutils-4.0.2.tgz",
"integrity": "sha512-qI4JLRKnSzqFqr7hAlS5xQDusBCjKSEG4t4+7aNrIQMHBcsC2TGEhuyABJdYkgSewL57PNLYEiibY2iPKhKpaA==",
"license": "BSD-2-Clause",
"dependencies": {
"dom-serializer": "^3.0.0",
"domelementtype": "^3.0.0",
"domhandler": "^6.0.0"
},
"engines": {
"node": ">=20.19.0"
},
"funding": {
"type": "github",
"url": "https://github.com/fb55/domutils?sponsor=1"
}
},
"node_modules/sanitize-html/node_modules/entities": {
"version": "8.0.0",
"resolved": "https://registry.npmjs.org/entities/-/entities-8.0.0.tgz",
"integrity": "sha512-zwfzJecQ/Uej6tusMqwAqU/6KL2XaB2VZ2Jg54Je6ahNBGNH6Ek6g3jjNCF0fG9EWQKGZNddNjU5F1ZQn/sBnA==",
"license": "BSD-2-Clause",
"engines": {
"node": ">=20.19.0"
},
"funding": {
"url": "https://github.com/fb55/entities?sponsor=1"
}
},
"node_modules/sanitize-html/node_modules/htmlparser2": {
"version": "12.0.0",
"resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-12.0.0.tgz",
"integrity": "sha512-Tz7u1i95/g2x2jz81+x0FBVhBhY5aRTvD3tXXdFaljuNdzDLJ8UGNRrTcj2cgQvAg3iW/h77Fz15nLW0L0CrZw==",
"funding": [
"https://github.com/fb55/htmlparser2?sponsor=1",
{
"type": "github",
"url": "https://github.com/sponsors/fb55"
}
],
"license": "MIT",
"dependencies": {
"domelementtype": "^3.0.0",
"domhandler": "^6.0.0",
"domutils": "^4.0.2",
"entities": "^8.0.0"
},
"engines": {
"node": ">=20.19.0"
} }
}, },
"node_modules/scheduler": { "node_modules/scheduler": {

View file

@ -1,6 +1,6 @@
{ {
"name": "cinny", "name": "cinny",
"version": "4.12.6", "version": "4.12.2",
"description": "Yet another matrix client", "description": "Yet another matrix client",
"main": "index.js", "main": "index.js",
"type": "module", "type": "module",
@ -56,7 +56,7 @@
"emojibase-data": "15.3.2", "emojibase-data": "15.3.2",
"file-saver": "2.0.5", "file-saver": "2.0.5",
"focus-trap-react": "10.0.2", "focus-trap-react": "10.0.2",
"folds": "2.7.1", "folds": "2.6.2",
"html-dom-parser": "4.0.0", "html-dom-parser": "4.0.0",
"html-react-parser": "4.2.0", "html-react-parser": "4.2.0",
"i18next": "23.12.2", "i18next": "23.12.2",
@ -67,7 +67,7 @@
"jotai": "2.6.0", "jotai": "2.6.0",
"linkify-react": "4.3.2", "linkify-react": "4.3.2",
"linkifyjs": "4.3.2", "linkifyjs": "4.3.2",
"matrix-js-sdk": "41.7.0", "matrix-js-sdk": "41.5.0",
"matrix-widget-api": "1.16.1", "matrix-widget-api": "1.16.1",
"millify": "6.1.0", "millify": "6.1.0",
"pdfjs-dist": "4.2.67", "pdfjs-dist": "4.2.67",
@ -82,7 +82,7 @@
"react-i18next": "15.0.0", "react-i18next": "15.0.0",
"react-range": "1.8.14", "react-range": "1.8.14",
"react-router-dom": "6.30.3", "react-router-dom": "6.30.3",
"sanitize-html": "2.17.6", "sanitize-html": "2.17.4",
"slate": "0.123.0", "slate": "0.123.0",
"slate-dom": "0.123.0", "slate-dom": "0.123.0",
"slate-history": "0.113.1", "slate-history": "0.113.1",
@ -90,7 +90,7 @@
"ua-parser-js": "1.0.35" "ua-parser-js": "1.0.35"
}, },
"devDependencies": { "devDependencies": {
"@element-hq/element-call-embedded": "0.20.1", "@element-hq/element-call-embedded": "0.19.1",
"@esbuild-plugins/node-globals-polyfill": "0.2.3", "@esbuild-plugins/node-globals-polyfill": "0.2.3",
"@rollup/plugin-inject": "5.0.3", "@rollup/plugin-inject": "5.0.3",
"@rollup/plugin-wasm": "6.1.1", "@rollup/plugin-wasm": "6.1.1",

View file

@ -148,13 +148,11 @@ function IncomingCall({ dm, info, onIgnore, onAnswer, onReject }: IncomingCallPr
/> />
</Avatar> </Avatar>
</Box> </Box>
<Box grow="Yes" direction="Column" gap="100" alignItems="Center"> <Box grow="Yes" direction="Column" gap="100">
<Text size="H3" align="Center" truncate> <Text size="H3" align="Center" truncate>
{roomName} {roomName}
</Text> </Text>
<Text size="T300" align="Center"> <Text size="T300">Incoming Call</Text>
Incoming Call
</Text>
</Box> </Box>
</Box> </Box>
{!livekitSupported && ( {!livekitSupported && (
@ -239,7 +237,6 @@ function IncomingCallListener({ callEmbed, joined }: IncomingCallListenerProps)
// only process rtc notification reference events. // only process rtc notification reference events.
// we do not want to wait to decrypt all events. // we do not want to wait to decrypt all events.
if (event.getRelation()?.rel_type !== RelationType.Reference) return; if (event.getRelation()?.rel_type !== RelationType.Reference) return;
if (room?.isCallRoom()) return;
if (event.isEncrypted()) { if (event.isEncrypted()) {
if (!event.isBeingDecrypted()) { if (!event.isBeingDecrypted()) {

View file

@ -241,15 +241,15 @@ export const getPointUntilChar = (
return targetPoint; return targetPoint;
}; };
export const getPrevWordRange = (editor: Editor): BaseRange | undefined => { export const getPrevWorldRange = (editor: Editor): BaseRange | undefined => {
const { selection } = editor; const { selection } = editor;
if (!selection || !Range.isCollapsed(selection)) return undefined; if (!selection || !Range.isCollapsed(selection)) return undefined;
const [cursorPoint] = Range.edges(selection); const [cursorPoint] = Range.edges(selection);
const wordStartPoint = getPointUntilChar(editor, cursorPoint, { const worldStartPoint = getPointUntilChar(editor, cursorPoint, {
reverse: true, reverse: true,
match: (char) => char === ' ' || char === '', match: (char) => char === ' ',
}); });
return wordStartPoint && Editor.range(editor, wordStartPoint, cursorPoint); return worldStartPoint && Editor.range(editor, worldStartPoint, cursorPoint);
}; };
export const isEmptyEditor = (editor: Editor): boolean => { export const isEmptyEditor = (editor: Editor): boolean => {

View file

@ -111,7 +111,6 @@ export const PageHeroSection = style([
}, },
]); ]);
export const PageContentCenter = style([ export const PageContentCenter = style([
DefaultReset, DefaultReset,
{ {

View file

@ -12,9 +12,6 @@ type MicrophoneButtonProps = {
disabled?: boolean; disabled?: boolean;
}; };
function MicrophoneButton({ enabled, onToggle, disabled }: MicrophoneButtonProps) { function MicrophoneButton({ enabled, onToggle, disabled }: MicrophoneButtonProps) {
const [micState, toggleMic] = useAsyncCallback(onToggle);
const loading = micState.status === AsyncStatus.Loading;
return ( return (
<TooltipProvider <TooltipProvider
position="Top" position="Top"
@ -31,9 +28,9 @@ function MicrophoneButton({ enabled, onToggle, disabled }: MicrophoneButtonProps
fill="Soft" fill="Soft"
radii="300" radii="300"
size="300" size="300"
onClick={toggleMic} onClick={() => onToggle()}
outlined outlined
disabled={disabled || loading} disabled={disabled}
> >
<Icon size="100" src={enabled ? Icons.Mic : Icons.MicMute} filled={!enabled} /> <Icon size="100" src={enabled ? Icons.Mic : Icons.MicMute} filled={!enabled} />
</IconButton> </IconButton>
@ -85,9 +82,6 @@ type VideoButtonProps = {
disabled?: boolean; disabled?: boolean;
}; };
function VideoButton({ enabled, onToggle, disabled }: VideoButtonProps) { function VideoButton({ enabled, onToggle, disabled }: VideoButtonProps) {
const [videoState, toggleVideo] = useAsyncCallback(onToggle);
const loading = videoState.status === AsyncStatus.Loading;
return ( return (
<TooltipProvider <TooltipProvider
position="Top" position="Top"
@ -104,9 +98,9 @@ function VideoButton({ enabled, onToggle, disabled }: VideoButtonProps) {
fill="Soft" fill="Soft"
radii="300" radii="300"
size="300" size="300"
onClick={toggleVideo} onClick={() => onToggle()}
outlined outlined
disabled={disabled || loading} disabled={disabled}
> >
<Icon <Icon
size="100" size="100"
@ -164,9 +158,6 @@ export function CallControl({
const { microphone, video, sound, screenshare } = useCallControlState(callEmbed.control); const { microphone, video, sound, screenshare } = useCallControlState(callEmbed.control);
const setCallEmbed = useSetAtom(callEmbedAtom); const setCallEmbed = useSetAtom(callEmbedAtom);
const handleMicrophoneToggle = useCallback(() => callEmbed.control.toggleMicrophone(), [callEmbed]);
const handleVideoToggle = useCallback(() => callEmbed.control.toggleVideo(), [callEmbed]);
const [hangupState, hangup] = useAsyncCallback( const [hangupState, hangup] = useAsyncCallback(
useCallback(() => callEmbed.hangup(), [callEmbed]) useCallback(() => callEmbed.hangup(), [callEmbed])
); );
@ -186,7 +177,7 @@ export function CallControl({
<Box alignItems="Inherit" gap="200"> <Box alignItems="Inherit" gap="200">
<MicrophoneButton <MicrophoneButton
enabled={microphone} enabled={microphone}
onToggle={handleMicrophoneToggle} onToggle={() => callEmbed.control.toggleMicrophone()}
disabled={!callJoined} disabled={!callJoined}
/> />
<SoundButton <SoundButton
@ -197,7 +188,7 @@ export function CallControl({
{!compact && <StatusDivider />} {!compact && <StatusDivider />}
<VideoButton <VideoButton
enabled={video} enabled={video}
onToggle={handleVideoToggle} onToggle={() => callEmbed.control.toggleVideo()}
disabled={!callJoined} disabled={!callJoined}
/> />
{!compact && ( {!compact && (

View file

@ -71,9 +71,6 @@ export function CallControls({ callEmbed }: CallControlsProps) {
setCords(undefined); setCords(undefined);
}; };
const handleMicrophoneToggle = useCallback(() => callEmbed.control.toggleMicrophone(), [callEmbed]);
const handleVideoToggle = useCallback(() => callEmbed.control.toggleVideo(), [callEmbed]);
const [hangupState, hangup] = useAsyncCallback( const [hangupState, hangup] = useAsyncCallback(
useCallback(() => callEmbed.hangup(), [callEmbed]) useCallback(() => callEmbed.hangup(), [callEmbed])
); );
@ -99,13 +96,13 @@ export function CallControls({ callEmbed }: CallControlsProps) {
<Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200"> <Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
<MicrophoneButton <MicrophoneButton
enabled={microphone} enabled={microphone}
onToggle={handleMicrophoneToggle} onToggle={() => callEmbed.control.toggleMicrophone()}
/> />
<SoundButton enabled={sound} onToggle={() => callEmbed.control.toggleSound()} /> <SoundButton enabled={sound} onToggle={() => callEmbed.control.toggleSound()} />
</Box> </Box>
{!compact && <ControlDivider />} {!compact && <ControlDivider />}
<Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200"> <Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
<VideoButton enabled={video} onToggle={handleVideoToggle} /> <VideoButton enabled={video} onToggle={() => callEmbed.control.toggleVideo()} />
<ScreenShareButton <ScreenShareButton
enabled={screenshare} enabled={screenshare}
onToggle={() => callEmbed.control.toggleScreenshare()} onToggle={() => callEmbed.control.toggleScreenshare()}

View file

@ -3,7 +3,6 @@ import { Icon, IconButton, Icons, Line, Text, Tooltip, TooltipProvider } from 'f
import { useAtom } from 'jotai'; import { useAtom } from 'jotai';
import * as css from './styles.css'; import * as css from './styles.css';
import { callChatAtom } from '../../state/callEmbed'; import { callChatAtom } from '../../state/callEmbed';
import { AsyncStatus, useAsyncCallback } from '../../hooks/useAsyncCallback';
export function ControlDivider() { export function ControlDivider() {
return ( return (
@ -13,12 +12,9 @@ export function ControlDivider() {
type MicrophoneButtonProps = { type MicrophoneButtonProps = {
enabled: boolean; enabled: boolean;
onToggle: () => Promise<unknown>; onToggle: () => void;
}; };
export function MicrophoneButton({ enabled, onToggle }: MicrophoneButtonProps) { export function MicrophoneButton({ enabled, onToggle }: MicrophoneButtonProps) {
const [micState, toggleMic] = useAsyncCallback(onToggle);
const loading = micState.status === AsyncStatus.Loading;
return ( return (
<TooltipProvider <TooltipProvider
position="Top" position="Top"
@ -36,9 +32,8 @@ export function MicrophoneButton({ enabled, onToggle }: MicrophoneButtonProps) {
fill="Soft" fill="Soft"
radii="400" radii="400"
size="400" size="400"
onClick={toggleMic} onClick={() => onToggle()}
outlined outlined
disabled={loading}
> >
<Icon size="400" src={enabled ? Icons.Mic : Icons.MicMute} filled={!enabled} /> <Icon size="400" src={enabled ? Icons.Mic : Icons.MicMute} filled={!enabled} />
</IconButton> </IconButton>
@ -85,12 +80,9 @@ export function SoundButton({ enabled, onToggle }: SoundButtonProps) {
type VideoButtonProps = { type VideoButtonProps = {
enabled: boolean; enabled: boolean;
onToggle: () => Promise<unknown>; onToggle: () => void;
}; };
export function VideoButton({ enabled, onToggle }: VideoButtonProps) { export function VideoButton({ enabled, onToggle }: VideoButtonProps) {
const [videoState, toggleVideo] = useAsyncCallback(onToggle);
const loading = videoState.status === AsyncStatus.Loading;
return ( return (
<TooltipProvider <TooltipProvider
position="Top" position="Top"
@ -108,9 +100,8 @@ export function VideoButton({ enabled, onToggle }: VideoButtonProps) {
fill="Soft" fill="Soft"
radii="400" radii="400"
size="400" size="400"
onClick={toggleVideo} onClick={() => onToggle()}
outlined outlined
disabled={loading}
> >
<Icon <Icon
size="400" size="400"

View file

@ -1,4 +1,4 @@
import React, { useCallback } from 'react'; import React from 'react';
import { Box, Button, Icon, Icons, Spinner, Text } from 'folds'; import { Box, Button, Icon, Icons, Spinner, Text } from 'folds';
import { SequenceCard } from '../../components/sequence-card'; import { SequenceCard } from '../../components/sequence-card';
import * as css from './styles.css'; import * as css from './styles.css';
@ -26,10 +26,6 @@ export function PrescreenControls({ canJoin }: PrescreenControlsProps) {
const { microphone, video, sound, toggleMicrophone, toggleVideo, toggleSound } = const { microphone, video, sound, toggleMicrophone, toggleVideo, toggleSound } =
useCallPreferences(); useCallPreferences();
const handleMicrophoneToggle = useCallback(async () => toggleMicrophone(), [toggleMicrophone]);
const handleVideoToggle = useCallback(async () => toggleVideo(), [toggleVideo]);
return ( return (
<SequenceCard <SequenceCard
className={css.ControlCard} className={css.ControlCard}
@ -41,12 +37,12 @@ export function PrescreenControls({ canJoin }: PrescreenControlsProps) {
wrap="Wrap" wrap="Wrap"
> >
<Box shrink="No" alignItems="Inherit" justifyContent="SpaceBetween" gap="200"> <Box shrink="No" alignItems="Inherit" justifyContent="SpaceBetween" gap="200">
<MicrophoneButton enabled={microphone} onToggle={handleMicrophoneToggle} /> <MicrophoneButton enabled={microphone} onToggle={toggleMicrophone} />
<SoundButton enabled={sound} onToggle={toggleSound} /> <SoundButton enabled={sound} onToggle={toggleSound} />
</Box> </Box>
<ControlDivider /> <ControlDivider />
<Box shrink="No" alignItems="Inherit" justifyContent="SpaceBetween" gap="200"> <Box shrink="No" alignItems="Inherit" justifyContent="SpaceBetween" gap="200">
<VideoButton enabled={video} onToggle={handleVideoToggle} /> <VideoButton enabled={video} onToggle={toggleVideo} />
<ChatButton /> <ChatButton />
</Box> </Box>
<Box grow="Yes" direction="Column"> <Box grow="Yes" direction="Column">

View file

@ -6,7 +6,6 @@ export const LobbyHeroTopic = style({
WebkitLineClamp: 3, WebkitLineClamp: 3,
WebkitBoxOrient: 'vertical', WebkitBoxOrient: 'vertical',
overflow: 'hidden', overflow: 'hidden',
wordBreak: 'break-word',
':hover': { ':hover': {
cursor: 'pointer', cursor: 'pointer',

View file

@ -39,7 +39,7 @@ import {
AutocompletePrefix, AutocompletePrefix,
AutocompleteQuery, AutocompleteQuery,
getAutocompleteQuery, getAutocompleteQuery,
getPrevWordRange, getPrevWorldRange,
resetEditor, resetEditor,
RoomMentionAutocomplete, RoomMentionAutocomplete,
UserMentionAutocomplete, UserMentionAutocomplete,
@ -411,7 +411,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
sendTypingStatus(!isEmptyEditor(editor)); sendTypingStatus(!isEmptyEditor(editor));
} }
const prevWordRange = getPrevWordRange(editor); const prevWordRange = getPrevWorldRange(editor);
const query = prevWordRange const query = prevWordRange
? getAutocompleteQuery<AutocompletePrefix>(editor, prevWordRange, AUTOCOMPLETE_PREFIXES) ? getAutocompleteQuery<AutocompletePrefix>(editor, prevWordRange, AUTOCOMPLETE_PREFIXES)
: undefined; : undefined;

View file

@ -35,7 +35,7 @@ import {
createEmoticonElement, createEmoticonElement,
customHtmlEqualsPlainText, customHtmlEqualsPlainText,
getAutocompleteQuery, getAutocompleteQuery,
getPrevWordRange, getPrevWorldRange,
htmlToEditorInput, htmlToEditorInput,
moveCursor, moveCursor,
plainToEditorInput, plainToEditorInput,
@ -187,7 +187,7 @@ export const MessageEditor = as<'div', MessageEditorProps>(
return; return;
} }
const prevWordRange = getPrevWordRange(editor); const prevWordRange = getPrevWorldRange(editor);
const query = prevWordRange const query = prevWordRange
? getAutocompleteQuery<AutocompletePrefix>(editor, prevWordRange, AUTOCOMPLETE_PREFIXES) ? getAutocompleteQuery<AutocompletePrefix>(editor, prevWordRange, AUTOCOMPLETE_PREFIXES)
: undefined; : undefined;

View file

@ -46,7 +46,7 @@ export function About({ requestClose }: AboutProps) {
<Box direction="Column" gap="100"> <Box direction="Column" gap="100">
<Box gap="100" alignItems="End"> <Box gap="100" alignItems="End">
<Text size="H3">Cinny</Text> <Text size="H3">Cinny</Text>
<Text size="T200">v4.12.6</Text> <Text size="T200">v4.12.2</Text>
</Box> </Box>
<Text>Yet another matrix client.</Text> <Text>Yet another matrix client.</Text>
</Box> </Box>

View file

@ -4,9 +4,9 @@ export const useAccountManagementActions = () => {
const actions = useMemo( const actions = useMemo(
() => ({ () => ({
profile: 'org.matrix.profile', profile: 'org.matrix.profile',
sessionsList: 'org.matrix.devices_list', sessionsList: 'org.matrix.sessions_list',
sessionView: 'org.matrix.device_view', sessionView: 'org.matrix.session_view',
sessionEnd: 'org.matrix.device_delete', sessionEnd: 'org.matrix.session_end',
accountDeactivate: 'org.matrix.account_deactivate', accountDeactivate: 'org.matrix.account_deactivate',
crossSigningReset: 'org.matrix.cross_signing_reset', crossSigningReset: 'org.matrix.cross_signing_reset',
}), }),

View file

@ -15,7 +15,7 @@ export function AuthFooter() {
target="_blank" target="_blank"
rel="noreferrer" rel="noreferrer"
> >
v4.12.6 v4.12.2
</Text> </Text>
<Text as="a" size="T300" href="https://twitter.com/cinnyapp" target="_blank" rel="noreferrer"> <Text as="a" size="T300" href="https://twitter.com/cinnyapp" target="_blank" rel="noreferrer">
Twitter Twitter

View file

@ -24,7 +24,7 @@ export function WelcomePage() {
target="_blank" target="_blank"
rel="noreferrer noopener" rel="noreferrer noopener"
> >
v4.12.6 v4.12.2
</a> </a>
</span> </span>
} }

View file

@ -14,12 +14,8 @@ export class CallControl extends EventEmitter implements CallControlState {
private iframe: HTMLIFrameElement; private iframe: HTMLIFrameElement;
private bodyMutationObserver: MutationObserver;
private controlMutationObserver: MutationObserver; private controlMutationObserver: MutationObserver;
private mediaStatePromiseResolver: undefined | (() => void);
private get document(): Document | undefined { private get document(): Document | undefined {
return this.iframe.contentDocument ?? this.iframe.contentWindow?.document; return this.iframe.contentDocument ?? this.iframe.contentWindow?.document;
} }
@ -32,25 +28,16 @@ export class CallControl extends EventEmitter implements CallControlState {
return screenshareBtn ?? undefined; return screenshareBtn ?? undefined;
} }
private get leaveButton(): Element | undefined { private get settingsButton(): HTMLElement | undefined {
const leaveBtn = this.document?.querySelector('[data-testid="incall_leave"]'); const leaveBtn = this.document?.querySelector('[data-testid="incall_leave"]');
return leaveBtn ?? undefined; const settingsButton = leaveBtn?.previousElementSibling as HTMLElement | null;
}
private get settingsButton(): HTMLElement | undefined { return settingsButton ?? undefined;
const settingsButtonLeft = this.document?.querySelector(
'[data-testid="settings-bottom-left"]'
) as HTMLButtonElement | undefined;
const settingsButtonCenter = this.document?.querySelector(
'[data-testid="settings-bottom-center"]'
) as HTMLButtonElement | undefined;
return settingsButtonLeft ?? settingsButtonCenter ?? undefined;
} }
private get reactionsButton(): HTMLElement | undefined { private get reactionsButton(): HTMLElement | undefined {
const reactionsButton = this.leaveButton?.previousElementSibling as HTMLElement | null; const reactionsButton = this.settingsButton?.previousElementSibling as HTMLElement | null;
return reactionsButton ?? undefined; return reactionsButton ?? undefined;
} }
@ -78,7 +65,6 @@ export class CallControl extends EventEmitter implements CallControlState {
this.call = call; this.call = call;
this.iframe = iframe; this.iframe = iframe;
this.bodyMutationObserver = new MutationObserver(this.onBodyMutation.bind(this));
this.controlMutationObserver = new MutationObserver(this.onControlMutation.bind(this)); this.controlMutationObserver = new MutationObserver(this.onControlMutation.bind(this));
} }
@ -116,30 +102,6 @@ export class CallControl extends EventEmitter implements CallControlState {
} }
public startObserving() { public startObserving() {
if (!this.document) return;
this.bodyMutationObserver.observe(this.document.body, {
childList: true,
subtree: false, // only direct children of body
});
this.onBodyMutation();
}
private onBodyMutation() {
if (!this.document) return;
this.document.body.style.setProperty('background', 'none', 'important');
const controls = this.leaveButton?.parentElement?.parentElement;
if (controls) {
controls.style.setProperty('position', 'absolute');
controls.style.setProperty('visibility', 'hidden');
}
this.observeControls();
}
private observeControls() {
this.controlMutationObserver.disconnect(); this.controlMutationObserver.disconnect();
const screenshareBtn = this.screenshareButton; const screenshareBtn = this.screenshareButton;
@ -163,14 +125,8 @@ export class CallControl extends EventEmitter implements CallControlState {
this.setSound(this.sound); this.setSound(this.sound);
} }
private async setMediaState(state: ElementMediaStatePayload) { private setMediaState(state: ElementMediaStatePayload) {
const data = await this.call.transport.send(ElementWidgetActions.DeviceMute, state); return this.call.transport.send(ElementWidgetActions.DeviceMute, state);
return new Promise<typeof data>(resolve => {
if (this.mediaStatePromiseResolver) {
this.mediaStatePromiseResolver();
}
this.mediaStatePromiseResolver = () => resolve(data);
});
} }
private setSound(sound: boolean): void { private setSound(sound: boolean): void {
@ -201,14 +157,9 @@ export class CallControl extends EventEmitter implements CallControlState {
if (this.microphone && !this.sound) { if (this.microphone && !this.sound) {
this.toggleSound(); this.toggleSound();
} }
if (this.mediaStatePromiseResolver) {
this.mediaStatePromiseResolver();
this.mediaStatePromiseResolver = undefined;
}
} }
private onControlMutation() { public onControlMutation() {
const screenshare: boolean = this.screenshareButton?.getAttribute('data-kind') === 'primary'; const screenshare: boolean = this.screenshareButton?.getAttribute('data-kind') === 'primary';
const spotlight: boolean = this.spotlightButton?.checked ?? false; const spotlight: boolean = this.spotlightButton?.checked ?? false;
@ -279,7 +230,6 @@ export class CallControl extends EventEmitter implements CallControlState {
} }
public dispose() { public dispose() {
this.bodyMutationObserver.disconnect();
this.controlMutationObserver.disconnect(); this.controlMutationObserver.disconnect();
} }

View file

@ -172,10 +172,6 @@ export class CallEmbed {
const controlState = initialControlState ?? new CallControlState(true, false, true); const controlState = initialControlState ?? new CallControlState(true, false, true);
this.control = new CallControl(controlState, call, iframe); this.control = new CallControl(controlState, call, iframe);
this.control.startObserving();
iframe.onload = () => {
this.control.startObserving();
};
let initialMediaEvent = true; let initialMediaEvent = true;
this.disposables.push( this.disposables.push(
@ -276,6 +272,21 @@ export class CallEmbed {
private onCallJoined(): void { private onCallJoined(): void {
this.joined = true; this.joined = true;
this.applyStyles();
this.control.startObserving();
}
private applyStyles(): void {
const doc = this.document;
if (!doc) return;
doc.body.style.setProperty('background', 'none', 'important');
const controls = doc.body.querySelector('[data-testid="incall_leave"]')?.parentElement
?.parentElement;
if (controls) {
controls.style.setProperty('position', 'absolute');
controls.style.setProperty('visibility', 'hidden');
}
} }
private onEvent(ev: MatrixEvent): void { private onEvent(ev: MatrixEvent): void {