update folds

.cinny-config.json

@@ -1,17 +0,0 @@
-{
-  "defaultHomeserver": 0,
-  "homeserverList": [
-    "matrix.lotusguild.org"
-  ],
-  "allowCustomHomeservers": false,
-  "featuredCommunities": {
-    "openAsDefault": false,
-    "spaces": [],
-    "rooms": [],
-    "servers": []
-  },
-  "hashRouter": {
-    "enabled": false,
-    "basename": "/"
-  }
-}

.cinny-config.json.bak

@@ -1,17 +0,0 @@
-{
-  "defaultHomeserver": 0,
-  "homeserverList": [
-    "matrix.lotusguild.org"
-  ],
-  "allowCustomHomeservers": false,
-  "featuredCommunities": {
-    "openAsDefault": false,
-    "spaces": [],
-    "rooms": [],
-    "servers": []
-  },
-  "hashRouter": {
-    "enabled": false,
-    "basename": "/"
-  }
-}

.env.production

@@ -1,2 +0,0 @@
-VITE_SENTRY_DSN=https://264a5e95c5d31fe080a2e92fb008294d@o4511430568378368.ingest.us.sentry.io/4511430571982849
-VITE_APP_VERSION=lotus

.github/DISCUSSION_TEMPLATE/issue-triage.yml

@@ -1,127 +0,0 @@
-labels: ["needs-confirmation"]
-body:
-  - type: markdown #add faqs in future
-    attributes:
-      value: |
-        > [!IMPORTANT]
-        > Please read through [the Discussion rules](https://github.com/cinnyapp/cinny/discussions/2653) and check for both existing [Discussions](https://github.com/cinnyapp/cinny/discussions?discussions_q=) and [Issues](https://github.com/cinnyapp/cinny/issues?q=sort%3Areactions-desc) prior to opening a new Discussion.
-  - type: markdown
-    attributes:
-      value: "# Issue Details"
-  - type: textarea
-    attributes:
-      label: Issue Description
-      description: |
-        Provide a detailed description of the issue.  Include relevant information, such as:
-        - The feature or configuration option you encounter the issue with.
-        - Screenshots, screen recordings, or other supporting media (as needed).
-        - If this is a regression of an existing issue that was closed or resolved, please include the previous item reference (Discussion, Issue, PR, commit) in your description.
-      placeholder: |
-        When I try to send a message in a room, the message doesn't appear in the timeline.
-        OR
-        The application crashes when I click on the settings button.
-    validations:
-      required: true
-  - type: textarea
-    attributes:
-      label: Expected Behavior
-      description: |
-        Describe how you expect Cinny to behave in this situation.
-      placeholder: |
-        I expected the message to appear in the room timeline immediately after sending.
-        OR
-        The settings panel should open smoothly without any crashes.
-    validations:
-      required: true
-  - type: textarea
-    attributes:
-      label: Actual Behavior
-      description: |
-        Describe how Cinny actually behaves in this situation.  If it is not immediately obvious how the actual behavior differs from the expected behavior described above, please be sure to mention the deviation specifically.
-      placeholder: |
-        The application freezes for 3 seconds and then shows a white screen.
-    validations:
-      required: true
-  - type: textarea
-    attributes:
-      label: Reproduction Steps
-      description: |
-        Provide a detailed set of step-by-step instructions for reproducing this issue.
-      placeholder: |
-        1. Open Cinny and log in to my account
-        2. Navigate to the #general room
-        3. Type a message in the message box
-        4. Press Enter to send
-        5. Notice that the message doesn't appear in the timeline
-    validations:
-      required: true
-  - type: textarea
-    attributes:
-      label: Environement
-      description: |
-        Please provide information about your environment. Include the following:
-        - OS:
-        - Browser: 
-        - Cinny Web Version: (app.cinny.in or self hosted)
-        - Cinny desktop Version: (appimage or deb or flatpak)
-        - Matrix Homeserver: 
-      placeholder: |
-        - OS: Windows 11
-        - Browser: Chrome 120.0.6099.109
-        - Cinny Web Version: 3.2.0 (app.cinny.in or self hosted)
-        - Cinny desktop Version: 3.2.0 (appimage or deb or flatpak)
-        - Matrix Homeserver: matrix.org (Synapse 1.97.0)
-      render: text
-    validations:
-      required: true
-  - type: textarea
-    id: logs
-    attributes:
-      label: Relevant Logs
-      description: |
-        If applicable, add browser console logs to help explain your problem.
-        
-        **To get browser console logs:**
-        - Chrome/Edge: Press F12 → Console tab
-        - Firefox: Press F12 → Console tab  
-        - Safari: Develop → Show Web Inspector → Console
-        
-        Please wrap large log outputs in code blocks with triple backticks (```).
-      placeholder: |
-        ```
-        Error: Failed to send message
-            at MessageComposer.sendMessage (composer.js:245)
-            at HTMLButtonElement.onClick (composer.js:189)
-        TypeError: Cannot read property 'content' of undefined
-            at RoomTimeline.render (timeline.js:567)
-        ```
-      render: shell
-    validations:
-      required: false
-  - type: textarea 
-    attributes:
-      label: Additional context
-      description: |
-        Add any other context about the problem here (e.g., when did this start happening, does it happen on different homeservers, etc.)
-      placeholder: |
-        - This started happening after I updated to version 3.2.0
-        - It only happens in encrypted rooms, not in public rooms
-        - I've tried on both Firefox and Chrome with the same result
-        - It works fine on my phone using the same account
-        - This happens on all homeservers I've tested (matrix.org, mozilla.org)
-    validations:
-      required: false
-  - type: markdown
-    attributes:
-      value: |
-        # User Acknowledgements
-        > [!TIP]
-        > Use these links to review the existing Cinny [Discussions](https://github.com/cinnyapp/cinny/discussions?discussions_q=) and [Issues](https://github.com/cinnyapp/cinny/issues?q=sort%3Areactions-desc).
-  - type: checkboxes #add faqs in future
-    attributes:
-      label: "I acknowledge that:"
-      options:
-        - label: I have searched the Cinny repository (both open and closed Discussions and Issues) and confirm this is not a duplicate of an existing issue or discussion.
-          required: true
-        - label: I have checked the "Preview" tab on all text fields to ensure that everything looks right, and have wrapped all configuration and code in code blocks with a group of three backticks (` ``` `) on separate lines.
-          required: true

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -0,0 +1,57 @@
+name: 🐞 Bug Report
+description: Report a bug
+
+body:
+  - type: markdown
+    attributes:
+      value: |
+        ## First of all
+        1. Please search for [existing issues](https://github.com/ajbura/cinny/issues?q=is%3Aissue) about this problem first.
+        2. Make sure Cinny is up to date.
+        3. Make sure it's an issue with Cinny and not something else you are using.
+        4. Remember to be friendly.
+
+  - type: textarea
+    id: description
+    attributes:
+      label: Describe the bug
+      description: A clear description of what the bug is. Include screenshots if applicable.
+      placeholder: Bug description
+    validations:
+      required: true
+
+  - type: textarea
+    id: reproduction
+    attributes:
+      label: Reproduction
+      description: Steps to reproduce the behavior.
+      placeholder: |
+        1. Go to ...
+        2. Click on ...
+        3. See error
+
+  - type: textarea
+    id: expected-behavior
+    attributes:
+      label: Expected behavior
+      description: A clear description of what you expected to happen.
+
+  - type: textarea
+    id: info
+    attributes:
+      label: Platform and versions
+      description: "Provide OS, browser and Cinny version with your Homeserver."
+      placeholder: |
+       1. OS: [e.g. Windows 10, MacOS]
+       2. Browser: [e.g. chrome 99.5, firefox 97.2]
+       3. Cinny version: [e.g. 1.8.1 (app.cinny.in)]
+       4. Matrix homeserver: [e.g. matrix.org]
+      render: shell
+    validations:
+      required: true
+
+  - type: textarea
+    id: context
+    attributes:
+      label: Additional context
+      description: Add any other context about the problem here.

.github/ISSUE_TEMPLATE/config.yml

@@ -1,5 +1,4 @@
-blank_issues_enabled: false
 contact_links:
-  - name: Features, Bug Reports, Questions
+  - name: 💬 Matrix Chat
-    url: https://github.com/cinnyapp/cinny/discussions/new/choose
+    url: https://matrix.to/#/#cinny:matrix.org
-    about: Our preferred starting point if you have any questions or suggestions about features or behavior.
+    about: Ask questions and talk to other Cinny users and the maintainers

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -0,0 +1,33 @@
+name: 💡 Feature Request
+description: Suggest an idea
+
+body:
+  - type: textarea
+    id: problem
+    attributes:
+      label: Describe the problem
+      description: A clear description of the problem this feature would solve
+      placeholder: "I'm always frustrated when..."
+    validations:
+      required: true
+
+  - type: textarea
+    id: solution
+    attributes:
+      label: "Describe the solution you'd like"
+      description: A clear description of what change you would like
+      placeholder: "I would like to..."
+    validations:
+      required: true
+
+  - type: textarea
+    id: alternatives
+    attributes:
+      label: Alternatives considered
+      description: "Any alternative solutions you've considered"
+
+  - type: textarea
+    id: context
+    attributes:
+      label: Additional context
+      description: Add any other context about the problem here.

.github/ISSUE_TEMPLATE/preapproved.md

@@ -1,9 +0,0 @@
----
-name: Pre-Discussed and Approved Topics
-about: |-
-  Only for topics already discussed and approved in the GitHub Discussions section.
----
-
-**DO NOT OPEN A NEW ISSUE. PLEASE USE THE DISCUSSIONS SECTION.**
-
-**I DIDN'T READ THE ABOVE LINE. PLEASE CLOSE THIS ISSUE.**

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,22 @@
+<!-- Please read https://github.com/ajbura/cinny/blob/dev/CONTRIBUTING.md before submitting your pull request -->
+
+### Description
+<!-- Please include a summary of the change. Please also include relevant motivation and context. List any dependencies that are required for this change. -->
+
+
+Fixes #
+
+#### Type of change
+
+- [ ] Bug fix (non-breaking change which fixes an issue)
+- [ ] New feature (non-breaking change which adds functionality)
+- [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
+- [ ] This change requires a documentation update
+
+### Checklist:
+
+- [ ] My code follows the style guidelines of this project
+- [ ] I have performed a self-review of my own code
+- [ ] I have commented my code, particularly in hard-to-understand areas
+- [ ] I have made corresponding changes to the documentation
+- [ ] My changes generate no new warnings

.github/SECURITY.md

@@ -0,0 +1,3 @@
+# Reporting a Vulnerability
+
+**If you've found a security vulnerability, please report it to cinnyapp@gmail.com**

.github/renovate.json

@@ -1,22 +1,10 @@
 {
   "$schema": "https://docs.renovatebot.com/renovate-schema.json",
-  "extends": [
+  "extends": ["config:recommended", ":dependencyDashboardApproval"],
-    "config:recommended",
-    ":dependencyDashboardApproval",
-    ":semanticCommits",
-    "group:monorepos"
-  ],
   "labels": ["Dependencies"],
-  "rebaseWhen": "conflicted",
   "packageRules": [
     {
       "matchUpdateTypes": ["lockFileMaintenance"]
-    },
-    {
-      "matchPackageNames": ["slate", "slate-dom", "slate-history", "slate-react"]
-    },
-    {
-      "matchPackageNames": ["linkifyjs", "linkify-react"]
     }
   ],
   "lockFileMaintenance": {

.github/workflows/build-pull-request.yml

@@ -12,12 +12,12 @@ jobs:
       PR_NUMBER: ${{github.event.number}}
     steps:
       - name: Checkout repository
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@v4.2.0
       - name: Setup node
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        uses: actions/setup-node@v4.4.0
         with:
-          node-version-file: ".node-version"
+          node-version: 20.12.2
-          package-manager-cache: false
+          cache: 'npm'
       - name: Install dependencies
         run: npm ci
       - name: Build app
@@ -25,7 +25,7 @@ jobs:
           NODE_OPTIONS: '--max_old_space_size=4096'
         run: npm run build
       - name: Upload artifact
-        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        uses: actions/upload-artifact@v4.6.2
         with:
           name: preview
           path: dist
@@ -33,7 +33,7 @@ jobs:
       - name: Save pr number
         run: echo ${PR_NUMBER} > ./pr.txt
       - name: Upload pr number
-        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
+        uses: actions/upload-artifact@v4.6.2
         with:
           name: pr
           path: ./pr.txt

.github/workflows/cla.yml

@@ -12,7 +12,7 @@ jobs:
       - name: 'CLA Assistant'
         if: (github.event.comment.body == 'recheck' || github.event.comment.body == 'I have read the CLA Document and I hereby sign the CLA') || github.event_name == 'pull_request_target'
         # Beta Release
-        uses: cla-assistant/github-action@ca4a40a7d1004f18d9960b404b97e5f30a505a08 # v2.6.1
+        uses: cla-assistant/github-action@v2.6.1
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           # the below token should have repo scope and must be manually added by you in the repository's secret

.github/workflows/deploy-pull-request.yml

@@ -1,5 +1,4 @@
 name: Deploy PR to Netlify
-run-name: "Deploy PR to Netlify (${{ github.event.workflow_run.head_branch }})"
 
 on:
   workflow_run:
@@ -16,22 +15,16 @@ jobs:
     if: ${{ github.event.workflow_run.conclusion == 'success' }}
     steps:
       - name: Download pr number
-        uses: dawidd6/action-download-artifact@b6e2e70617bc3265edd6dab6c906732b2f1ae151 # v21
+        uses: dawidd6/action-download-artifact@ac66b43f0e6a346234dd65d4d0c8fbb31cb316e5
         with:
           workflow: ${{ github.event.workflow.id }}
           run_id: ${{ github.event.workflow_run.id }}
           name: pr
-      - name: Validate and output pr number
+      - name: Output pr number
         id: pr
-        run: |
+        run: echo "id=$(<pr.txt)" >> $GITHUB_OUTPUT
-          PR_ID=$(<pr.txt)
-          if ! [[ "${PR_ID}" =~ ^[0-9]+$ ]]; then
-            echo "::error::pr.txt contains non-numeric content: ${PR_ID}"
-            exit 1
-          fi
-          echo "id=${PR_ID}" >> "${GITHUB_OUTPUT}"
       - name: Download artifact
-        uses: dawidd6/action-download-artifact@b6e2e70617bc3265edd6dab6c906732b2f1ae151 # v21
+        uses: dawidd6/action-download-artifact@ac66b43f0e6a346234dd65d4d0c8fbb31cb316e5
         with:
           workflow: ${{ github.event.workflow.id }}
           run_id: ${{ github.event.workflow_run.id }}
@@ -39,7 +32,7 @@ jobs:
           path: dist
       - name: Deploy to Netlify
         id: netlify
-        uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654 # v3.0.0
+        uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654
         with:
           publish-dir: dist
           deploy-message: "Deploy PR ${{ steps.pr.outputs.id }}"
@@ -48,16 +41,16 @@ jobs:
           enable-pull-request-comment: false
           enable-commit-comment: false
         env:
-          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN_PR }}
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
           NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID_PR_CINNY }}
         timeout-minutes: 1
       - name: Comment preview on PR
-        uses: thollander/actions-comment-pull-request@24bffb9b452ba05a4f3f77933840a6a841d1b32b #v3.0.1
+        uses: thollander/actions-comment-pull-request@fabd468d3a1a0b97feee5f6b9e499eab0dd903f6
         env:
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         with:
-          pr-number: ${{ steps.pr.outputs.id }}
+          pr_number: ${{ steps.pr.outputs.id }}
-          comment-tag: ${{ steps.pr.outputs.id }}
+          comment_tag: ${{ steps.pr.outputs.id }}
           message: |
               Preview: ${{ steps.netlify.outputs.deploy-url }}
-              ⚠️ Exercise caution. Use test accounts. ⚠️
+              ⚠️ Exercise caution. Use test accounts. ⚠️

.github/workflows/docker-pr.yml

@@ -5,59 +5,15 @@ on:
     paths:
       - 'Dockerfile'
       - '.github/workflows/docker-pr.yml'
-      - '.github/workflows/prod-deploy.yml'
 
 jobs:
   docker-build:
     runs-on: ubuntu-latest
-    permissions:
-      contents: read
-      packages: write
-
     steps:
       - name: Checkout repository
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@v4.2.0
-
+      - name: Build Docker image
-      - name: Set up QEMU
+        uses: docker/build-push-action@v6.18.0
-        uses: docker/setup-qemu-action@c7c53464625b32c7a7e944ae62b3e17d2b600130 # v3.7.0
-        
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3.12.0
-
-      - name: Login to Docker Hub #Do not update this action from a outside PR
-        if: github.event.pull_request.head.repo.fork == false
-        uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
-        with:
-          username: ${{ secrets.DOCKER_USERNAME }}
-          password: ${{ secrets.DOCKER_PASSWORD }}
-        continue-on-error: true
-
-      - 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
-        uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
-        with:
-          registry: ghcr.io
-          username: ${{ github.actor }}
-          password: ${{ secrets.GITHUB_TOKEN }}
-        continue-on-error: true
-
-      - name: Extract metadata (tags, labels) for Docker, GHCR
-        id: meta
-        uses: docker/metadata-action@c299e40c65443455700f0fdfc63efafe5b349051 # v5.10.0
-        with:
-          images: |
-            ajbura/cinny
-            ghcr.io/${{ github.repository }}
-
-      - name: Build Docker image (no push)
-        uses: docker/build-push-action@bcafcacb16a39f128d818304e6c9c0c18556b85f # v7.1.0
         with:
           context: .
-          platforms: linux/amd64
           push: false
-          load: true
-          tags: ${{ steps.meta.outputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}
-
-      - name: Show Docker images
-        run: docker images

.github/workflows/lockfile.yml

@@ -14,9 +14,9 @@ jobs:
       pull-requests: write
     steps:
       - name: Checkout
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@v4.2.0
       - name: NPM Lockfile Changes
-        uses: codepunkt/npm-lockfile-changes@b40543471c36394409466fdb277a73a0856d7891 # v1.0.0
+        uses: codepunkt/npm-lockfile-changes@b40543471c36394409466fdb277a73a0856d7891
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
           # Optional inputs, can be deleted safely if you are happy with default values.

.github/workflows/netlify-dev.yml

@@ -11,12 +11,12 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@v4.2.0
       - name: Setup node
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        uses: actions/setup-node@v4.4.0
         with:
-          node-version-file: ".node-version"
+          node-version: 20.12.2
-          package-manager-cache: false
+          cache: 'npm'
       - name: Install dependencies
         run: npm ci
       - name: Build app
@@ -24,7 +24,7 @@ jobs:
           NODE_OPTIONS: '--max_old_space_size=4096'
         run: npm run build
       - name: Deploy to Netlify
-        uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654 # v3.0.0
+        uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654
         with:
           publish-dir: dist
           deploy-message: 'Dev deploy ${{ github.sha }}'

.github/workflows/pr-title.yml

@@ -1,15 +0,0 @@
-name: Check PR title
-
-on:
-  pull_request_target:
-    types:
-      - opened
-      - edited
-
-jobs:
-  lint:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: amannn/action-semantic-pull-request@48f256284bd46cdaab1048c3721360e808335d50 # v6.1.1
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/prod-deploy.yml

@@ -1,48 +1,32 @@
 name: Production deploy
 
 on:
-  workflow_dispatch:
+  release:
+    types: [published]
 
 jobs:
   deploy-and-tarball:
     name: Netlify deploy and tarball
-    outputs:
-      version: ${{ steps.vars.outputs.tag }}
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repository
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@v4.2.0
-        with:
-          fetch-depth: 0
       - name: Setup node
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        uses: actions/setup-node@v4.4.0
         with:
-          node-version-file: ".node-version"
+          node-version: 20.12.2
-          package-manager-cache: false
+          cache: 'npm'
       - name: Install dependencies
         run: npm ci
-      - name: Run semantic release
-        run: npm run semantic-release
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          GIT_AUTHOR_NAME: ${{ secrets.GIT_AUTHOR_NAME }}
-          GIT_AUTHOR_EMAIL: ${{ secrets.GIT_AUTHOR_EMAIL }}
-          GIT_COMMITTER_NAME: ${{ secrets.GIT_AUTHOR_NAME }}
-          GIT_COMMITTER_EMAIL: ${{ secrets.GIT_AUTHOR_EMAIL }}
-      - name: Get version from tag
-        id: vars
-        run: |
-          TAG=$(git describe --tags --abbrev=0) 
-          echo "tag=$TAG" >> $GITHUB_OUTPUT
       - name: Build app
         env:
           NODE_OPTIONS: '--max_old_space_size=4096'
         run: npm run build
       - name: Deploy to Netlify
-        uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654 # v3.0.0
+        uses: nwtgck/actions-netlify@4cbaf4c08f1a7bfa537d6113472ef4424e4eb654
         with:
           publish-dir: dist
-          deploy-message: 'Prod deploy ${{ steps.vars.outputs.tag }}'
+          deploy-message: 'Prod deploy ${{ github.ref_name }}'
           enable-commit-comment: false
           github-token: ${{ secrets.GITHUB_TOKEN }}
           production-deploy: true
@@ -52,6 +36,9 @@ jobs:
           NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
           NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID_APP }}
         timeout-minutes: 1
+      - name: Get version from tag
+        id: vars
+        run: echo "tag=${GITHUB_REF#refs/*/}" >> $GITHUB_OUTPUT
       - name: Create tar.gz
         run: tar -czvf cinny-${{ steps.vars.outputs.tag }}.tar.gz dist
       - name: Sign tar.gz
@@ -65,57 +52,48 @@ jobs:
           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
       - name: Upload tagged release
-        uses: softprops/action-gh-release@b4309332981a82ec1c5618f44dd2e27cc8bfbfda # v3.0.0
+        uses: softprops/action-gh-release@6cbd405e2c4e67a21c47fa9e383d020e4e28b836
         with:
-          tag_name: ${{ steps.vars.outputs.tag }}
           files: |
             cinny-${{ steps.vars.outputs.tag }}.tar.gz
             cinny-${{ steps.vars.outputs.tag }}.tar.gz.asc
 
   publish-image:
-    name: Push Docker image to Docker Hub, GHCR
+    name: Push Docker image to Docker Hub, ghcr
-    needs: deploy-and-tarball
-    env:
-      VERSION: ${{ needs.deploy-and-tarball.outputs.version }}
     runs-on: ubuntu-latest
     permissions:
       contents: read
       packages: write
     steps:
       - name: Checkout repository
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+        uses: actions/checkout@v4.2.0
-        with:
-          fetch-depth: 0
       - name: Set up QEMU
-        uses: docker/setup-qemu-action@c7c53464625b32c7a7e944ae62b3e17d2b600130 # v3.7.0
+        uses: docker/setup-qemu-action@v3.6.0
       - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3.12.0
+        uses: docker/setup-buildx-action@v3.11.1
-      - name: Login to Docker Hub #Do not update this action from a outside PR
+      - name: Login to Docker Hub
-        uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
+        uses: docker/login-action@v3.5.0
         with:
           username: ${{ secrets.DOCKER_USERNAME }}
           password: ${{ secrets.DOCKER_PASSWORD }}
-      - name: Login to the Github Container registry #Do not update this action from a outside PR
+      - name: Login to the Container registry
-        uses: docker/login-action@4907a6ddec9925e35a0a9e82d7399ccc52663121 # v4.1.0
+        uses: docker/login-action@v3.5.0
         with:
           registry: ghcr.io
           username: ${{ github.actor }}
           password: ${{ secrets.GITHUB_TOKEN }}
-      - name: Extract metadata (tags, labels) for Docker, GHCR
+      - name: Extract metadata (tags, labels) for Docker
         id: meta
-        uses: docker/metadata-action@c299e40c65443455700f0fdfc63efafe5b349051 # v5.10.0
+        uses: docker/metadata-action@v5.8.0
         with:
           images: |
             ${{ secrets.DOCKER_USERNAME }}/cinny
             ghcr.io/${{ github.repository }}
-          tags: |
-            type=raw,value=${{ env.VERSION }}
-            type=raw,value=latest
       - name: Build and push Docker image
-        uses: docker/build-push-action@bcafcacb16a39f128d818304e6c9c0c18556b85f # v7.1.0
+        uses: docker/build-push-action@v6.18.0
         with:
           context: .
           platforms: linux/amd64,linux/arm64
           push: true
           tags: ${{ steps.meta.outputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}
+          labels: ${{ steps.meta.outputs.labels }}

.husky/pre-commit

@@ -1,3 +0,0 @@
-# These are commented until we enable lint and typecheck
-# npx tsc -p tsconfig.json --noEmit
-# npx lint-staged

.node-version

@@ -1 +0,0 @@
-24.13.1

CONTRIBUTING.md

@@ -18,7 +18,7 @@ Bug reports and feature suggestions must use descriptive and concise titles and
 ## Pull requests
 
 > ### Legal Notice
-> When contributing to this project, you must agree that you have authored 100% of the content, that you have the necessary rights to the content and that the content you contribute may be provided under the project license. You will also be asked to [sign the CLA](https://github.com/cinnyapp/cla) upon submiting your pull request.
+> When contributing to this project, you must agree that you have authored 100% of the content, that you have the necessary rights to the content and that the content you contribute may be provided under the project license.
 
 **NOTE: If you want to add new features, please discuss with maintainers before coding or opening a pull request.** This is to ensure that we are on same track and following our roadmap.
 

Dockerfile

@@ -1,5 +1,5 @@
 ## Builder
-FROM node:24.13.1-alpine AS builder
+FROM node:20.12.2-alpine3.18 as builder
 
 WORKDIR /src
 
@@ -11,7 +11,7 @@ RUN npm run build
 
 
 ## App
-FROM nginx:1.29.8-alpine
+FROM nginx:1.29.1-alpine
 
 COPY --from=builder /src/dist /app
 COPY --from=builder /src/docker-nginx.conf /etc/nginx/conf.d/default.conf

README.md

@@ -1,160 +1,111 @@
-# Lotus Chat
+# Cinny
+<p>
+    <a href="https://github.com/ajbura/cinny/releases">
+        <img alt="GitHub release downloads" src="https://img.shields.io/github/downloads/ajbura/cinny/total?logo=github&style=social"></a>
+    <a href="https://hub.docker.com/r/ajbura/cinny">
+        <img alt="DockerHub downloads" src="https://img.shields.io/docker/pulls/ajbura/cinny?logo=docker&style=social"></a>
+    <a href="https://fosstodon.org/@cinnyapp">
+        <img alt="Follow on Mastodon" src="https://img.shields.io/mastodon/follow/106845779685925461?domain=https%3A%2F%2Ffosstodon.org&logo=mastodon&style=social"></a>
+    <a href="https://twitter.com/intent/follow?screen_name=cinnyapp">
+        <img alt="Follow on Twitter" src="https://img.shields.io/twitter/follow/cinnyapp?logo=twitter&style=social"></a>
+    <a href="https://cinny.in/#sponsor">
+        <img alt="Sponsor Cinny" src="https://img.shields.io/opencollective/all/cinny?logo=opencollective&style=social"></a>
+</p>
 
-A Matrix client for [Lotus Guild](https://lotusguild.org) — forked from [Cinny](https://github.com/cinnyapp/cinny) v4.12.1.
+A Matrix client focusing primarily on simple, elegant and secure interface. The main goal is to have an instant messaging application that is easy on people and has a modern touch.
+- [Roadmap](https://github.com/orgs/cinnyapp/projects/1)
+- [Contributing](./CONTRIBUTING.md)
 
-Deployed at [chat.lotusguild.org](https://chat.lotusguild.org).
+<img align="center" src="https://raw.githubusercontent.com/cinnyapp/cinny-site/main/assets/preview2-light.png" height="380">
 
----
+## Getting started
+The web app is available at [app.cinny.in](https://app.cinny.in/) and gets updated on each new release. The `dev` branch is continuously deployed at [dev.cinny.in](https://dev.cinny.in) but keep in mind that it could have things broken.
 
-## Changes from upstream Cinny
+You can also download our desktop app from the [cinny-desktop repository](https://github.com/cinnyapp/cinny-desktop).
 
-### Branding & Identity
+## Self-hosting
+To host Cinny on your own, simply download the tarball from [GitHub releases](https://github.com/cinnyapp/cinny/releases/latest), and serve the files from `dist/` using your preferred webserver. Alternatively, you can just pull the docker image from [DockerHub](https://hub.docker.com/r/ajbura/cinny) or [GitHub Container Registry](https://github.com/cinnyapp/cinny/pkgs/container/cinny).
 
-- Package renamed to `lotus-chat`, description updated to "Lotus Chat — Matrix client for Lotus Guild"
+* The default homeservers and explore pages are defined in [`config.json`](config.json).
-- App title changed from "Cinny" to "Lotus Chat" throughout
-- Favicon, PWA icons, and all icon sizes (57×57 → 180×180 Apple touch icons) replaced with Lotus.png variants
-- Logo in About dialog and Auth page replaced with official Lotus.png
-- Auth footer rewritten: shows dynamic version from `package.json`, links to lotusguild.org, chat.lotusguild.org, and matrix.lotusguild.org
-- Welcome page tagline changed from "Yet another matrix client" to "A Matrix client for Lotus Guild"
-- Encryption key export filename changed from `cinny-keys.txt` to `lotus-keys.txt`
-- `manifest.json` updated with Lotus name, description, and branding colors
 
-### LotusGuild Terminal Design System (TDS) v1.2
+* You need to set up redirects to serve the assests. Example configurations; [netlify](netlify.toml), [nginx](contrib/nginx/cinny.domain.tld.conf), [caddy](contrib/caddy/caddyfile).
+    * If you have trouble configuring redirects you can [enable hash routing](config.json#L35) — the url in the browser will have a `/#/` between the domain and open channel (ie. `app.cinny.in/#/home/` instead of `app.cinny.in/home/`) but you won't have to configure your webserver.
 
-A full custom theme engine layered on top of Cinny's vanilla-extract theming:
+* To deploy on subdirectory, you need to rebuild the app youself after updating the `base` path in [`build.config.ts`](build.config.ts).
+    * For example, if you want to deploy on `https://cinny.in/app`, then set `base: '/app'`.
 
-**Dark mode** (`LotusTerminalTheme`):
+<details><summary><b>PGP Public Key to verify tarball</b></summary>
-- CRT terminal aesthetic: scanline overlay, vignette, phosphor glow
-- Palette: bg `#030508`, orange `#FF6B00`, cyan `#00D4FF`, green `#00FF88`, text `#c4d9ee`
-- Monospace font stack, terminal-style scrollbars
-- Custom hex-grid and circuit-board CSS background patterns
-- Matrix-style boot messages on the welcome page (press Escape to skip)
-- CSS variables: `--lt-*` family covering colors, glow effects, borders, animations
 
-**Light mode** (`LotusTerminalLightTheme`):
+```
-- Full light palette: bg `#edf0f5`, orange `#c44e00`, cyan `#0062b8`, green `#006d35`, text `#111827`
+-----BEGIN PGP PUBLIC KEY BLOCK-----
-- No CRT effects (scanlines, vignette disabled)
-- Light-mode scrollbars, adjusted code block colors, semantic color overrides
-- Scoped to `html[data-theme="light"] body.lotusTerminalBodyClass`
-- `ThemeManager.tsx` sets `data-theme` attribute based on active theme kind
 
-**Chat Backgrounds** (20+ custom patterns, all TDS-aware):
+mQGNBGJw/g0BDAC8qQeLqDMzYzfPyOmRlHVEoguVTo+eo1aVdQH2X7OELdjjBlyj
-- Blueprint grid, carbon fiber, starfield, topographic contours, herringbone, crosshatch
+6d6c1adv/uF2g83NNMoQY7GEeHjRnXE4m8kYSaarb840pxrYUagDc0dAbJOGaCBY
-- Chevron, polka dots, triangles, plaid
+FKTo7U1Kvg0vdiaRuus0pvc1NVdXSxRNQbFXBSwduD+zn66TI3HfcEHNN62FG1cE
-- All patterns use CSS custom properties — adapt to both TDS dark and light themes
+K1jWDwLAU0P3kKmj8+CAc3h9ZklPu0k/+t5bf/LJkvdBJAUzGZpehbPL5f3u3BZ0
-- Settings toggle for showing per-message sender profiles
+leZLIrR8uV7PiV5jKFahxlKR5KQHld8qQm+qVhYbUzpuMBGmh419I6UvTzxuRcvU
+Frn9ttCEzV55Y+so4X2e4ZnB+5gOnNw+ecifGVdj/+UyWnqvqqDvLrEjjK890nLb
+Pil4siecNMEpiwAN6WSmKpWaCwQAHEGDVeZCc/kT0iYfj5FBcsTVqWiO6eaxkUlm
+jnulqWqRrlB8CJQQvih/g//uSEBdzIibo+ro+3Jpe120U/XVUH62i9HoRQEm6ADG
+4zS5hIq4xyA8fL8AEQEAAbQdQ2lubnlBcHAgPGNpbm55YXBwQGdtYWlsLmNvbT6J
+AdQEEwEIAD4CGwMFCwkIBwIGFQoJCAsCBBYCAwECHgECF4AWIQSRri2MHidaaZv+
+vvuUMwx6UK/M8wUCZqEDwAUJFvwIswAKCRCUMwx6UK/M877qC/4lxXOQIoWnLLkK
+YiRCTkGsH6NdxgeYr6wpXT4xuQ45ZxCytwHpOGQmO/5up5961TxWW8D1frRIJHjj
+AZGoRCL3EKEuY8nt3D99fpf3DvZrs1uoVAhiyn737hRlZAg+QsJheeGCmdSJ0hX5
+Yud8SE+9zxLS1+CEjMrsUd/RGre/phme+wNXfaHfREAC9ewolgVChPIbMxG2f+vs
+K8Xv52BFng7ta9fgsl1XuOjpuaSbQv6g+4ONk/lxKF0SmnhEGM3dmIYPONxW47Yf
+atnIjRra/YhPTNwrNBGMmG4IFKaOsMbjW/eakjWTWOVKKJNBMoDdRcYYWIMCpLy8
+AQUrMtQEsHSnqCwrw818S5A6rrhcfVGk36RGm0nOy6LS5g5jmqaYsvbCcBGY9B2c
+SUAVNm17oo7TtEajk8hcSXoZod1t++pyjcVKEmSn3nFK7v5m3V+cPhNTxZMK459P
+3x1Ucqj/kTqrxKw6s2Uknuk0ajmw0ljV+BQwgL6maguo9BKgCNW5AY0EYnD+DQEM
+ANOu/d6ZMF8bW+Df9RDCUQKytbaZfa+ZbIHBus7whCD/SQMOhPKntv3HX7SmMCs+
+5i27kJMu4YN623JCS7hdCoXVO1R5kXCEcneW/rPBMDutaM472YvIWMIqK9Wwl5+0
+Piu2N+uTkKhe9uS2u7eN+Khef3d7xfjGRxoppM+xI9dZO+jhYiy8LuC0oBohTjJq
+QPqfGDpowBwRkkOsGz/XVcesJ1Pzg4bKivTS9kZjZSyT9RRSY8As0sVUN57AwYul
+s1+eh00n/tVpi2Jj9pCm7S0csSXvXj8v2OTdK1jt4YjpzR0/rwh4+/xlOjDjZEqH
+vMPhpzpbgnwkxZ3X8BFne9dJ3maC5zQ3LAeCP5m1W0hXzagYhfyjo74slJgD1O8c
+LDf2Oxc5MyM8Y/UK497zfqSPfgT3NhQmhHzk83DjXw3I6Z3A3U+Jp61w0eBRI1nx
+H1UIG+gldcAKUTcfwL0lghoT3nmi9JAbvek0Smhz00Bbo8/dx8vwQRxDUxlt7Exx
+NwARAQABiQG8BBgBCAAmAhsMFiEEka4tjB4nWmmb/r77lDMMelCvzPMFAmahA9IF
+CRb8CMUACgkQlDMMelCvzPPQgQv/d5/z+fxgKqgfhQX+V49X4WgTVxZ/CzztDoJ1
+XAq1dzTNEy8AFguXIo6eVXPSpMxec7ZreN3+UPQBnCf3eR5YxWNYOYKmk0G4E8D2
+KGUJept7TSA42/8N2ov6tToXFg4CgzKZj0fYLwgutly7K8eiWmSU6ptaO8aEQBHB
+gTGIOO3h6vJMGVycmoeRnHjv4wV84YWSVFSoJ7cY0he4Z9UznJBbE/KHZjrkXsPo
+N+Gg5lDuOP5xjKzM5SogV9lhxBAhMWAg3URUF15yruZBiA8uV1FOK8sal/9C1G7V
+M6ygA6uOZqXlZtcdA94RoSsW2pZ9eLVPsxz2B3Zko7tu11MpNP/wYmfGTI3KxZBj
+n/eodvwjJSgHpGOFSmbNzvPJo3to5nNlp7wH1KxIMc6Uuu9hgfDfwkFZgV2bnFIa
+Q6gyF548Ub48z7Dz83+WwLgbX19ve4oZx+dqSdczP6ILHRQomtrzrkkP2LU52oI5
+mxFo+ioe/ABCufSmyqFye0psX3Sp
+=WtqZ
+-----END PGP PUBLIC KEY BLOCK-----
+```
+</details>
 
-### Voice / Video Call Improvements
+## Local development
+> [!TIP]
+> We recommend using a version manager as versions change very quickly. You will likely need to switch between multiple Node.js versions based on the needs of different projects you're working on. [NVM on windows](https://github.com/coreybutler/nvm-windows#installation--upgrades) on Windows and [nvm](https://github.com/nvm-sh/nvm) on Linux/macOS are pretty good choices. Recommended nodejs version is Iron LTS (v20).
 
-- **Element Call 0.19.3**: Upgraded from 0.16.3. Dist copied to `public/element-call/` by vite at build time.
+Execute the following commands to start a development server:
-- **Camera default OFF**: Camera no longer persists across sessions via localStorage. Always starts disabled. Optional `cameraOnJoin` setting for explicit opt-in.
+```sh
-- **Deafen button**: Tooltip corrected to "Deafen" / "Undeafen" (was "Turn Off Sound" / "Turn On Sound")
+npm ci # Installs all dependencies
-- **Screenshare confirmation**: A confirm dialog appears before screenshare is broadcast to call participants
+npm start # Serve a development version
-- **Auto-revert spotlight on screenshare**: When someone starts screensharing, EC normally forces all participants into spotlight view. Patched in `CallControl.ts` `onControlMutation()` — detects the screenshare button going `primary` and clicks `gridButton` after 600ms to revert to grid layout. Participants choose to watch screenshare manually.
-- **Push to Talk (PTT)**:
-  - Configurable keybind (default: Space) via Settings > General > Calls
-  - Mic activates on keydown, deactivates on keyup; mic muted on tab blur/focus to prevent stuck-on mic
-  - Visual indicator: plain folds `Chip` by default; when LotusGuild TDS is active: orange `PTT — Hold SPACE` / green `● LIVE` in JetBrains Mono
-  - Listens on both main window and EC iframe `contentWindow` for reliable key capture
-  - Implemented via `CallControl.setMicrophone()` public method on the widget bridge
-  - **Mic state preservation**: when enabling PTT mode mid-call, the user's previous mic state is saved and restored when PTT is disabled — prevents unwanted unmute if the user had manually muted before switching to PTT.
-- **Noise suppression toggle**: Settings > General > Calls — passes `noiseSuppression` URL parameter to the embedded Element Call widget
-- **Call button scoping**: The upstream Cinny 4.12.1 call button (voice + video dropdown) is restricted to DMs and private group chats only. Specifically: direct messages, or invite-only rooms that have no `m.space.parent` state event (i.e. not a space/guild text channel). Public rooms and space channels are excluded to prevent accidental mass-notifications. `Room.tsx` switches to CallView layout when a call embed is active in the current room.
-- **Poll display**: `m.poll.start` events (both stable Matrix 1.7 `m.poll` content key and MSC3381 unstable `org.matrix.msc3381.poll.start`) render as read-only poll cards inside the standard message bubble — question and answer options shown. Registered as top-level event renderers AND inside the `EncryptedContent` callback so encrypted polls also display after decryption. "Open in Element to vote" note displayed. Implemented in `PollContent.tsx`.
-- **Deleted message placeholder**: Redacted `m.room.message`, `m.room.encrypted`, and `m.sticker` events no longer disappear from the timeline. Instead they reach the existing `RedactedContent` component (trash icon + italic "This message has been deleted" with reason if provided), matching Element, FluffyChat, Commet, and Nheko behaviour. One-line change in the `eventRenderer` filter in `RoomTimeline.tsx`.
-- **Picture-in-picture (PiP)**: When navigating away from a call room while in an active call, the call embed shrinks to a 280x158px floating window in the bottom-right corner. The PiP window is **draggable** — drag it anywhere on screen to move it out of the way. Clicking (without dragging) navigates back to the call room. Drag vs click distinguished by a 5px movement threshold; touch drag supported. Imperative style overrides on `callEmbedRef.current` via `useEffect` — a wrapper div cannot be used because `useCallEmbedPlacementSync` writes `top/left/width/height` directly onto that element.
-
-### Messaging Enhancements
-
-- **GIF picker**: Giphy-powered GIF search and send. Button appears in the message composer only when `gifApiKey` is set in `config.json`. Sends GIF as `m.image` — fetches blob, uploads via `mx.uploadContent`, sends with `mx.sendMessage`. `FocusTrap` handles click-outside / Escape to close. When TDS is active: dark navy background (`#060c14`), orange dim border, `// GIF_SEARCH` header, CSS overrides for Giphy SDK search bar (dark bg, orange border/focus ring, JetBrains Mono), custom orange scrollbar. All TDS styles live in `lotus-terminal.css.ts` — no runtime `<style>` injection, eliminating flash of unstyled content.
-- **Message forwarding**: Forward any message to any room from the message context menu.
-- **Image/video captions**: Caption text field on image and video upload — sent as a single event with the media.
-- **Location sharing**: Map embed view for incoming location events + static share button. Renders `m.location` events inline with a map tile.
-- **Deleted message placeholders**: Redacted `m.room.message`, `m.room.encrypted`, and `m.sticker` events render as "This message has been deleted" with reason (if provided) rather than disappearing. One-line change in the `eventRenderer` filter in `RoomTimeline.tsx`.
-
-### Per-Message Read Receipts
-
-Full per-message read receipt system — shows who has read each message directly in the timeline.
-
-**Architecture:**
-- `useRoomReadPositions(room)` hook — computes a `Map<eventId, userId[]>` from all joined members' `room.getEventReadUpTo()` positions. Subscribes to `RoomEvent.Receipt` for live updates (debounced at 150ms to batch burst updates from mass-read events).
-- `nearestRenderableId(liveEvents, evtId)` — receipts can land on reaction/edit events that `RoomTimeline` skips (renders `null`). This walks backwards from the receipt event through the live timeline until it finds a non-reaction/non-edit event to attach to.
-- `ReadPositionsContext` — React context providing the positions map from `RoomTimeline` down to all `Message` instances without prop drilling.
-- `ReadReceiptAvatars` component — renders a pill-shaped row of overlapping `StackedAvatar` circles (24px, `SurfaceVariant` outline) below messages with readers. Pill uses `color.SurfaceVariant.Container` background for visibility on any wallpaper. Max 5 avatars shown + `+N` overflow count. Avatar fallback uses `colorMXID(userId)` for distinctive per-user color.
-- Clicking the pill opens the **"Seen by" modal** (`EventReaders`) listing all readers with their avatar, display name, and a formatted read timestamp ("Today at 3:42 PM", "Yesterday at 10:15 AM", "May 14 at 9:00 AM"). Timestamps use `room.getReadReceiptForUserId(userId)?.data.ts` and respect the user's 24-hour clock setting.
-- Authenticated media (`mxcUrlToHttp` utility) used for all avatar loads, matching the correct Lotus utility signature.
-
-### Delivery Status Indicators
-
-Own messages display a small status marker below the message content (when no read receipts are visible yet):
-- `⟳` — message is being sent / encrypting
-- `✓` — message confirmed sent (local echo)
-- `✕` — message failed to send (shown in red; orange glow in TDS mode)
-- Status hidden once the server confirms receipt (`status === null`) — read receipts take over at that point
-
-### URL Preview Cards (TDS)
-
-URL preview cards (`UrlPreviewCard`) styled for terminal mode:
-- Dark transparent background with cyan border-left accent (Anduril Orange)
-- Link text in cyan, hover switches to orange with glow
-- Light TDS variant: off-white background with blue accent
-
-### Reaction Chips (TDS)
-
-Emoji reaction buttons styled for terminal mode via `button[data-reaction-key]` selector:
-- Unselected: `rgba(0,212,255,0.06)` background, cyan border
-- Hover: brighter background + box-shadow glow
-- Own reaction (aria-pressed=true): orange tint `rgba(255,107,0,0.12)`, orange border
-- Light TDS: equivalent blue/orange variants
-
-### DM Call Improvements
-
-
-- **Incoming call ring**: DM calls trigger a ring tone with Answer/Decline UI. 30-second auto-dismiss if unanswered. Implemented in `Room.tsx` and `RoomViewHeader.tsx`.
-
-### Infrastructure
-
-- **Authenticated media**: All avatar/media loads use `mxcUrlToHttp(mx, mxcUrl, useAuthentication, w, h, 'crop')` from `../../utils/matrix` — the Lotus utility that handles MSC3916 authenticated media. (Upstream Cinny uses the SDK method with incorrect argument order for authenticated endpoints.)
-- **Upstream tracking**: `git remote add upstream https://github.com/cinnyapp/cinny.git`. Merge strategy: `git fetch upstream && git merge upstream/main`. Daily check via `cinny-upstream-check.sh` on LXC 106 — notifies Matrix on new upstream commits.
-
----
-
-## Build
-
-```bash
-npm ci
-npm run build   # outputs to dist/
 ```
 
-Vite's render-chunks phase requires ~6 GB Node heap. If OOM killed, set:
+To build the app:
-```bash
+```sh
-NODE_OPTIONS=--max_old_space_size=6144 npm run build
+npm run build # Compiles the app into the dist/ directory
 ```
 
-## Deployment
+### Running with Docker
-
+This repository includes a Dockerfile, which builds the application from source and serves it with Nginx on port 80. To
-Built files are served from `/var/www/html/` on LXC 106 (nginx). Config lives at `/opt/lotus-cinny/config.json` (vite copies it to `dist/`):
+use this locally, you can build the container like so:
-
+```
-```json
+docker build -t cinny:latest .
-{
-  "defaultHomeserver": 0,
-  "homeserverList": ["matrix.lotusguild.org"],
-  "allowCustomHomeservers": false,
-  "gifApiKey": "<giphy_key>"
-}
 ```
 
-## Key Custom Files
+You can then run the container you've built with a command similar to this:
+```
+docker run -p 8080:80 cinny:latest
+```
 
-| File | Purpose |
+This will forward your `localhost` port 8080 to the container's port 80. You can visit the app in your browser by navigating to `http://localhost:8080`.
-|------|---------|
-| `src/lotus-terminal.css.ts` | All TDS CSS tokens, global styles, light/dark variants |
-| `src/lotus-boot.ts` | Boot sequence animation (runs once per session) |
-| `src/app/hooks/useRoomReadPositions.ts` | Per-message read receipt position map |
-| `src/app/features/room/ReadPositionsContext.ts` | React context for read positions |
-| `src/app/components/read-receipt-avatars/` | Read receipt avatar pill component |
-| `src/app/components/event-readers/EventReaders.tsx` | "Seen by" modal with timestamps |
-| `src/app/components/GifPicker.tsx` | GIF search + send |
-| `src/app/features/call/CallControls.tsx` | PTT badge + keybind logic |
-| `src/app/plugins/call/CallControl.ts` | EC widget bridge (screenshare revert, PTT mic) |
-| `src/app/components/CallEmbedProvider.tsx` | PiP + draggable call embed |

config.json

@@ -1,18 +1,38 @@
 {
-  "defaultHomeserver": 0,
+  "defaultHomeserver": 2,
   "homeserverList": [
-    "matrix.lotusguild.org"
+    "converser.eu",
+    "envs.net",
+    "matrix.org",
+    "monero.social",
+    "mozilla.org",
+    "xmr.se"
   ],
-  "allowCustomHomeservers": false,
+  "allowCustomHomeservers": true,
+
   "featuredCommunities": {
     "openAsDefault": false,
-    "spaces": [],
+    "spaces": [
-    "rooms": [],
+      "#cinny-space:matrix.org",
-    "servers": []
+      "#community:matrix.org",
+      "#space:envs.net",
+      "#science-space:matrix.org",
+      "#libregaming-games:tchncs.de",
+      "#mathematics-on:matrix.org"
+    ],
+    "rooms": [
+      "#cinny:matrix.org",
+      "#freesoftware:matrix.org",
+      "#pcapdroid:matrix.org",
+      "#gentoo:matrix.org",
+      "#PrivSec.dev:arcticfoxes.net",
+      "#disroot:aria-net.org"
+    ],
+    "servers": ["envs.net", "matrix.org", "monero.social", "mozilla.org"]
   },
+
   "hashRouter": {
     "enabled": false,
     "basename": "/"
-  },
+  }
-  "gifApiKey": "AqqDuQwZNjYttz7Mn6ME4JH1bJIuZ5CO"
 }

index.html

@@ -3,39 +3,34 @@
   <head>
     <meta charset="UTF-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
-    <title>Lotus Chat</title>
+    <title>Cinny</title>
-    <meta name="name" content="Lotus Chat" />
+    <meta name="name" content="Cinny" />
-    <meta name="author" content="Lotus Guild" />
+    <meta name="author" content="Ajay Bura" />
     <meta
       name="description"
-      content="Lotus Chat — the Lotus Guild Matrix client. Secure, fast, and built for our community."
+      content="A Matrix client where you can enjoy the conversation using simple, elegant and secure interface protected by e2ee with the power of open source."
     />
     <meta
       name="keywords"
-      content="lotus chat, lotus guild, matrix, matrix client"
+      content="cinny, cinnyapp, cinnychat, matrix, matrix client, matrix.org, element"
     />
 
-    <meta property="og:type" content="website" />
+    <meta property="og:title" content="Cinny" />
-    <meta property="og:title" content="Lotus Chat" />
+    <meta property="og:url" content="https://cinny.in" />
-    <meta property="og:url" content="https://chat.lotusguild.org" />
+    <meta property="og:image" content="https://cinny.in/assets/favicon-48x48.png" />
-    <meta property="og:image" content="https://chat.lotusguild.org/public/res/android/android-chrome-192x192.png" />
     <meta
       property="og:description"
-      content="Lotus Chat — the Lotus Guild Matrix client. Secure, fast, and built for our community."
+      content="A Matrix client where you can enjoy the conversation using simple, elegant and secure interface protected by e2ee with the power of open source."
     />
     <meta name="theme-color" content="#000000" />
-    <meta name="color-scheme" content="dark light" />
 
-    <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,600;0,700;1,400&family=VT323&display=swap" rel="stylesheet">
     <link id="favicon" rel="shortcut icon" href="./public/favicon.ico" />
 
     <link rel="manifest" href="/manifest.json" />
     <meta name="mobile-web-app-capable" content="yes" />
-    <meta name="application-name" content="Lotus Chat" />
+    <meta name="application-name" content="Cinny" />
-    <meta name="apple-mobile-web-app-title" content="Lotus Chat" />
+    <meta name="apple-mobile-web-app-title" content="Cinny" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
 

package.json

@@ -1,7 +1,7 @@
 {
-  "name": "lotus-chat",
+  "name": "cinny",
-  "version": "4.12.1-lotus",
+  "version": "4.10.0",
-  "description": "Lotus Chat — Matrix client for Lotus Guild",
+  "description": "Yet another matrix client",
   "main": "index.js",
   "type": "module",
   "engines": {
@@ -10,54 +10,11 @@
   "scripts": {
     "start": "vite",
     "build": "vite build",
-    "preview": "vite preview",
+    "lint": "yarn check:eslint && yarn check:prettier",
-    "lint": "npm run check:eslint && npm run check:prettier",
     "check:eslint": "eslint src/*",
     "check:prettier": "prettier --check .",
     "fix:prettier": "prettier --write .",
-    "typecheck": "tsc --noEmit",
+    "typecheck": "tsc --noEmit"
-    "prepare": "husky install",
-    "commit": "git-cz",
-    "semantic-release": "semantic-release",
-    "postinstall": "node scripts/patch-folds.mjs"
-  },
-  "lint-staged": {
-    "*.{ts,tsx,js,jsx}": "eslint",
-    "*": "prettier --ignore-unknown --write"
-  },
-  "config": {
-    "commitizen": {
-      "path": "./node_modules/cz-conventional-changelog"
-    }
-  },
-  "release": {
-    "branches": [
-      "dev"
-    ],
-    "plugins": [
-      "@semantic-release/commit-analyzer",
-      "@semantic-release/release-notes-generator",
-      [
-        "@semantic-release/exec",
-        {
-          "prepareCmd": "node scripts/update-version.js ${nextRelease.version}"
-        }
-      ],
-      [
-        "@semantic-release/git",
-        {
-          "assets": [
-            "package.json",
-            "package-lock.json",
-            "src/app/features/settings/about/About.tsx",
-            "src/app/pages/auth/AuthFooter.tsx",
-            "src/app/pages/client/WelcomePage.tsx"
-          ],
-          "message": "chore(release): ${nextRelease.version} [skip ci]"
-        }
-      ],
-      "@semantic-release/github"
-    ]
   },
   "keywords": [],
   "author": "Ajay Bura",
@@ -67,10 +24,6 @@
     "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "1.3.0",
     "@atlaskit/pragmatic-drag-and-drop-hitbox": "1.0.3",
     "@fontsource/inter": "4.5.14",
-    "@giphy/js-fetch-api": "5.8.0",
-    "@giphy/js-types": "5.1.0",
-    "@giphy/react-components": "10.1.2",
-    "@sentry/react": "10.53.1",
     "@tanstack/react-query": "5.24.1",
     "@tanstack/react-query-devtools": "5.24.1",
     "@tanstack/react-virtual": "3.2.0",
@@ -90,19 +43,18 @@
     "emojibase-data": "15.3.2",
     "file-saver": "2.0.5",
     "focus-trap-react": "10.0.2",
-    "folds": "2.6.2",
+    "folds": "2.5.0",
     "html-dom-parser": "4.0.0",
     "html-react-parser": "4.2.0",
     "i18next": "23.12.2",
     "i18next-browser-languagedetector": "8.0.0",
-    "i18next-http-backend": "3.0.6",
+    "i18next-http-backend": "2.5.2",
     "immer": "9.0.16",
     "is-hotkey": "0.2.0",
     "jotai": "2.6.0",
-    "linkify-react": "4.3.2",
+    "linkify-react": "4.1.3",
-    "linkifyjs": "4.3.2",
+    "linkifyjs": "4.1.3",
     "matrix-js-sdk": "38.2.0",
-    "matrix-widget-api": "1.16.1",
     "millify": "6.1.0",
     "pdfjs-dist": "4.2.67",
     "prismjs": "1.30.0",
@@ -115,22 +67,18 @@
     "react-google-recaptcha": "2.1.0",
     "react-i18next": "15.0.0",
     "react-range": "1.8.14",
-    "react-router-dom": "6.30.3",
+    "react-router-dom": "6.20.0",
-    "sanitize-html": "2.17.4",
+    "sanitize-html": "2.12.1",
-    "slate": "0.123.0",
+    "slate": "0.112.0",
-    "slate-dom": "0.123.0",
+    "slate-dom": "0.112.2",
-    "slate-history": "0.113.1",
+    "slate-history": "0.110.3",
-    "slate-react": "0.123.0",
+    "slate-react": "0.112.1",
-    "styled-components": "6.4.1",
     "ua-parser-js": "1.0.35"
   },
   "devDependencies": {
-    "@element-hq/element-call-embedded": "0.19.3",
     "@esbuild-plugins/node-globals-polyfill": "0.2.3",
     "@rollup/plugin-inject": "5.0.3",
     "@rollup/plugin-wasm": "6.1.1",
-    "@semantic-release/exec": "7.1.0",
-    "@semantic-release/git": "10.0.1",
     "@types/chroma-js": "3.1.1",
     "@types/file-saver": "2.0.5",
     "@types/is-hotkey": "0.1.10",
@@ -139,13 +87,12 @@
     "@types/react": "18.2.39",
     "@types/react-dom": "18.2.17",
     "@types/react-google-recaptcha": "2.1.8",
-    "@types/sanitize-html": "2.16.1",
+    "@types/sanitize-html": "2.9.0",
     "@types/ua-parser-js": "0.7.36",
     "@typescript-eslint/eslint-plugin": "5.46.1",
     "@typescript-eslint/parser": "5.46.1",
     "@vitejs/plugin-react": "4.2.0",
     "buffer": "6.0.3",
-    "cz-conventional-changelog": "3.3.0",
     "eslint": "8.29.0",
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-prettier": "8.5.0",
@@ -153,10 +100,7 @@
     "eslint-plugin-jsx-a11y": "6.6.1",
     "eslint-plugin-react": "7.31.11",
     "eslint-plugin-react-hooks": "4.6.0",
-    "husky": "9.1.7",
-    "lint-staged": "16.3.2",
     "prettier": "2.8.1",
-    "semantic-release": "25.0.3",
     "typescript": "4.9.4",
     "vite": "5.4.19",
     "vite-plugin-pwa": "0.20.5",

public/config.json

@@ -1,18 +0,0 @@
-{
-  "defaultHomeserver": 0,
-  "homeserverList": [
-    "matrix.lotusguild.org"
-  ],
-  "allowCustomHomeservers": false,
-  "featuredCommunities": {
-    "openAsDefault": false,
-    "spaces": [],
-    "rooms": [],
-    "servers": []
-  },
-  "hashRouter": {
-    "enabled": false,
-    "basename": "/"
-  },
-  "gifApiKey": "AqqDuQwZNjYttz7Mn6ME4JH1bJIuZ5CO"
-}

public/manifest.json

@@ -1,14 +1,14 @@
 {
-  "name": "Lotus Chat",
+  "name": "Cinny",
-  "short_name": "Lotus Chat",
+  "short_name": "Cinny",
-  "description": "Lotus Chat \u2014 the Lotus Guild Matrix client",
+  "description": "Yet another matrix client",
   "dir": "auto",
   "lang": "en-US",
   "display": "standalone",
   "orientation": "portrait",
   "start_url": "./",
-  "background_color": "#0a0a0a",
+  "background_color": "#fff",
-  "theme_color": "#980000",
+  "theme_color": "#fff",
   "icons": [
     {
       "src": "./public/android/android-chrome-36x36.png",
@@ -55,24 +55,5 @@
       "sizes": "512x512",
       "type": "image/png"
     }
-  ],
-  "categories": [
-    "social",
-    "communication",
-    "productivity"
-  ],
-  "shortcuts": [
-    {
-      "name": "New Message",
-      "short_name": "DM",
-      "description": "Open a new direct message",
-      "url": "/",
-      "icons": [
-        {
-          "src": "res/android/android-chrome-96x96.png",
-          "sizes": "96x96"
-        }
-      ]
-    }
   ]
 }

public/res/svg/cinny-highlight.svg

@@ -1,14 +1,13 @@
-<svg viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <g fill="#980000" fill-opacity="0.88">
+<g clip-path="url(#clip0_2707_1961)">
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(0,9,9)"/>
+<path d="M10.5867 17.3522C10.0727 17.4492 9.54226 17.5 9 17.5C4.30558 17.5 0.5 13.6944 0.5 9C0.5 4.30558 4.30558 0.5 9 0.5C13.6944 0.5 17.5 4.30558 17.5 9C17.5 9.54226 17.4492 10.0727 17.3522 10.5867C16.6511 10.2123 15.8503 10 15 10C12.2386 10 10 12.2386 10 15C10 15.8503 10.2123 16.6511 10.5867 17.3522Z" fill="white"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(45,9,9)"/>
+<path d="M10 6.39999C10 6.67614 9.77614 6.89999 9.5 6.89999C9.22386 6.89999 9 6.67614 9 6.39999C9 6.12385 9.22386 5.89999 9.5 5.89999C9.77614 5.89999 10 6.12385 10 6.39999Z" fill="black"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(90,9,9)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9 0C4 0 0 4 0 9C0 14 4 18 9 18C9.63967 18 10.263 17.9345 10.8636 17.8099C10.3186 17.0091 10 16.0417 10 15C10 12.2386 12.2386 10 15 10C16.0417 10 17.0091 10.3186 17.8099 10.8636C17.9345 10.263 18 9.63967 18 9C18 4 14 0 9 0ZM1.2 10.8L4.7 8.5V8.2C4.7 6.4 6 5 7.8 4.8H8.2C9.4 4.8 10.5 5.4 11.1 6.4C11.4 6.3 11.7 6.3 12 6.3C12.4 6.3 12.8 6.3 13.2 6.4C13.9 6.6 14.6 6.9 15.2 7.3C14.6 7.1 14 7 13.3 7C12.1 7 11.1 7.4 10.4 8.4C9.7 9.3 9.3 10.4 9.3 11.6C9.3 13.1 8.9 14.5 8 15.8C7.93744 15.8834 7.87923 15.9625 7.82356 16.0381C7.6123 16.325 7.43739 16.5626 7.2 16.8C4.2 16.1 1.9 13.8 1.2 10.8Z" fill="black"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(135,9,9)"/>
+<path d="M18 15C18 16.6569 16.6569 18 15 18C13.3431 18 12 16.6569 12 15C12 13.3431 13.3431 12 15 12C16.6569 12 18 13.3431 18 15Z" fill="#45B83B"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(180,9,9)"/>
+</g>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(225,9,9)"/>
+<defs>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(270,9,9)"/>
+<clipPath id="clip0_2707_1961">
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(315,9,9)"/>
+<rect width="18" height="18" fill="white"/>
-  </g>
+</clipPath>
-  <circle cx="9" cy="9" r="2.2" fill="#cc2000"/>
+</defs>
-  <circle cx="14.5" cy="14.5" r="3" fill="#45B83B"/>
+</svg>
-</svg>

public/res/svg/cinny-unread.svg

@@ -1,14 +1,13 @@
-<svg viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <g fill="#980000" fill-opacity="0.88">
+<g clip-path="url(#clip0_2707_2015)">
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(0,9,9)"/>
+<path d="M10.5867 17.3522C10.0727 17.4492 9.54226 17.5 9 17.5C4.30558 17.5 0.5 13.6944 0.5 9C0.5 4.30558 4.30558 0.5 9 0.5C13.6944 0.5 17.5 4.30558 17.5 9C17.5 9.54226 17.4492 10.0727 17.3522 10.5867C16.6511 10.2123 15.8503 10 15 10C12.2386 10 10 12.2386 10 15C10 15.8503 10.2123 16.6511 10.5867 17.3522Z" fill="white"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(45,9,9)"/>
+<path d="M10 6.39999C10 6.67614 9.77614 6.89999 9.5 6.89999C9.22386 6.89999 9 6.67614 9 6.39999C9 6.12385 9.22386 5.89999 9.5 5.89999C9.77614 5.89999 10 6.12385 10 6.39999Z" fill="black"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(90,9,9)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9 0C4 0 0 4 0 9C0 14 4 18 9 18C9.63967 18 10.263 17.9345 10.8636 17.8099C10.3186 17.0091 10 16.0417 10 15C10 12.2386 12.2386 10 15 10C16.0417 10 17.0091 10.3186 17.8099 10.8636C17.9345 10.263 18 9.63967 18 9C18 4 14 0 9 0ZM1.2 10.8L4.7 8.5V8.2C4.7 6.4 6 5 7.8 4.8H8.2C9.4 4.8 10.5 5.4 11.1 6.4C11.4 6.3 11.7 6.3 12 6.3C12.4 6.3 12.8 6.3 13.2 6.4C13.9 6.6 14.6 6.9 15.2 7.3C14.6 7.1 14 7 13.3 7C12.1 7 11.1 7.4 10.4 8.4C9.7 9.3 9.3 10.4 9.3 11.6C9.3 13.1 8.9 14.5 8 15.8C7.93744 15.8834 7.87923 15.9625 7.82356 16.0381C7.6123 16.325 7.43739 16.5626 7.2 16.8C4.2 16.1 1.9 13.8 1.2 10.8Z" fill="black"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(135,9,9)"/>
+<path d="M18 15C18 16.6569 16.6569 18 15 18C13.3431 18 12 16.6569 12 15C12 13.3431 13.3431 12 15 12C16.6569 12 18 13.3431 18 15Z" fill="#989898"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(180,9,9)"/>
+</g>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(225,9,9)"/>
+<defs>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(270,9,9)"/>
+<clipPath id="clip0_2707_2015">
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(315,9,9)"/>
+<rect width="18" height="18" fill="white"/>
-  </g>
+</clipPath>
-  <circle cx="9" cy="9" r="2.2" fill="#cc2000"/>
+</defs>
-  <circle cx="14.5" cy="14.5" r="3" fill="#989898"/>
+</svg>
-</svg>

public/res/svg/cinny.svg

@@ -1,13 +1,19 @@
-<svg viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In  -->
-  <g fill="#980000" fill-opacity="0.88">
+<svg version="1.1"
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(0,9,9)"/>
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(45,9,9)"/>
+	 x="0px" y="0px" width="18px" height="18px" viewBox="0 0 18 18" enable-background="new 0 0 18 18" xml:space="preserve">
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(90,9,9)"/>
+<defs>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(135,9,9)"/>
+</defs>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(180,9,9)"/>
+<g>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(225,9,9)"/>
+	<g>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(270,9,9)"/>
+		<circle fill="#FFFFFF" cx="9" cy="9" r="8.5"/>
-  <path d="M9,9 Q6.4,4.8 9,1.2 Q11.6,4.8 9,9Z" transform="rotate(315,9,9)"/>
+	</g>
-  </g>
+	<g>
-  <circle cx="9" cy="9" r="2.2" fill="#cc2000"/>
+		<path d="M9,0C4,0,0,4,0,9c0,5,4,9,9,9c5,0,9-4,9-9C18,4,14,0,9,0z M1.2,10.8l3.5-2.3c0-0.1,0-0.2,0-0.3c0-1.8,1.3-3.2,3.1-3.4
+			c0.1,0,0.2,0,0.4,0c1.2,0,2.3,0.6,2.9,1.6c0.3-0.1,0.6-0.1,0.9-0.1c0.4,0,0.8,0,1.2,0.1c0.7,0.2,1.4,0.5,2,0.9
+			C14.6,7.1,14,7,13.3,7c-1.2,0-2.2,0.4-2.9,1.4c-0.7,0.9-1.1,2-1.1,3.2c0,1.5-0.4,2.9-1.3,4.2c-0.3,0.4-0.5,0.7-0.8,1
+			C4.2,16.1,1.9,13.8,1.2,10.8z"/>
+		<circle cx="9.5" cy="6.4" r="0.5"/>
+	</g>
+</g>
 </svg>

scripts/patch-folds.mjs

@@ -1,26 +0,0 @@
-import { readFileSync, writeFileSync } from 'fs';
-import { fileURLToPath } from 'url';
-import { join, dirname } from 'path';
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-const foldsPath = join(__dirname, '../node_modules/folds/dist/index.js');
-
-try {
-  let content = readFileSync(foldsPath, 'utf8');
-  
-  // Defensive guard: if src is not a function, render null instead of crashing
-  const original = 'children: src(filled)';
-  const patched = 'children: typeof src === "function" ? src(filled) : null';
-  
-  if (content.includes(patched)) {
-    console.log('folds patch already applied.');
-  } else if (content.includes(original)) {
-    content = content.replace(original, patched);
-    writeFileSync(foldsPath, content, 'utf8');
-    console.log('Applied defensive Icon src guard to folds.');
-  } else {
-    console.warn('Warning: folds Icon patch target not found - may need updating.');
-  }
-} catch (e) {
-  console.warn('Warning: Could not patch folds:', e.message);
-}

scripts/update-version.js

@@ -1,48 +0,0 @@
-import fs from "fs";
-import path from "path";
-import { execSync } from "child_process";
-import { fileURLToPath } from "url";
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-
-const version = process.argv[2];
-
-if (!version) {
-  console.error("Version argument missing");
-  process.exit(1);
-}
-
-const root = path.resolve(__dirname, "..");
-const newVersionTag = `v${version}`;
-
-// Update package.json + package-lock.json safely
-execSync(`npm version ${version} --no-git-tag-version`, {
-  cwd: root,
-  stdio: "inherit",
-});
-
-console.log(`Updated package.json and package-lock.json → ${version}`);
-
-// Update UI version references
-const files = [
-  "src/app/features/settings/about/About.tsx",
-  "src/app/pages/auth/AuthFooter.tsx",
-  "src/app/pages/client/WelcomePage.tsx",
-];
-
-files.forEach((filePath) => {
-  const absPath = path.join(root, filePath);
-
-  if (!fs.existsSync(absPath)) {
-    console.warn(`File not found: ${filePath}`);
-    return;
-  }
-
-  const content = fs.readFileSync(absPath, "utf8");
-  const updated = content.replace(/v\d+\.\d+\.\d+/g, newVersionTag);
-
-  fs.writeFileSync(absPath, updated);
-
-  console.log(`Updated ${filePath} → ${newVersionTag}`);
-});

src/app/components/AccountDataEditor.tsx

@@ -127,7 +127,6 @@ function AccountDataEdit({
             <Input
               variant={type.length > 0 || submitting ? 'SurfaceVariant' : 'Background'}
               name="typeInput"
-              aria-label="Account data type"
               size="400"
               radii="300"
               readOnly={type.length > 0 || submitting}
@@ -171,7 +170,6 @@ function AccountDataEdit({
         <TextAreaComponent
           ref={textAreaRef}
           name="contentTextArea"
-          aria-label="JSON content"
           style={{
             fontFamily: 'monospace',
           }}
@@ -296,7 +294,7 @@ export function AccountDataEditor({
             </Chip>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
+            <IconButton onClick={requestClose} variant="Surface">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/components/AuthFlowsLoader.tsx

@@ -49,7 +49,7 @@ export function AuthFlowsLoader({ fallback, error, children }: AuthFlowsLoaderPr
   );
 
   useEffect(() => {
-    load().catch(() => {});
+    load();
   }, [load]);
 
   if (state.status === AsyncStatus.Idle || state.status === AsyncStatus.Loading) {

src/app/components/BackRouteHandler.tsx

@@ -51,12 +51,8 @@ export function BackRouteHandler({ children }: BackRouteHandlerProps) {
       },
       location.pathname
     );
-    const encodedSpaceIdOrAlias = spaceMatch?.params.spaceIdOrAlias;
+    if (spaceMatch?.params.spaceIdOrAlias) {
-    const decodedSpaceIdOrAlias =
+      navigate(getSpacePath(spaceMatch.params.spaceIdOrAlias));
-      encodedSpaceIdOrAlias && decodeURIComponent(encodedSpaceIdOrAlias);
-
-    if (decodedSpaceIdOrAlias) {
-      navigate(getSpacePath(decodedSpaceIdOrAlias));
       return;
     }
     if (

src/app/components/BackupRestore.tsx

@@ -178,7 +178,6 @@ export function BackupRestoreTile({ crypto }: BackupRestoreTileProps) {
           )}
           <IconButton
             aria-pressed={!!menuCords}
-            aria-label="Backup options"
             size="300"
             variant="Surface"
             radii="300"

src/app/components/CallEmbedProvider.tsx

@@ -1,578 +0,0 @@
-/* eslint-disable jsx-a11y/media-has-caption */
-import React, { ReactNode, useCallback, useEffect, useRef, useState } from 'react';
-import { useAtomValue, useSetAtom } from 'jotai';
-import { MatrixRTCSession } from 'matrix-js-sdk/lib/matrixrtc/MatrixRTCSession';
-import FocusTrap from 'focus-trap-react';
-import {
-  Avatar,
-  Box,
-  Button,
-  color,
-  config,
-  Dialog,
-  Icon,
-  Icons,
-  Overlay,
-  OverlayBackdrop,
-  OverlayCenter,
-  Text,
-  toRem,
-} from 'folds';
-import {
-  EventTimelineSetHandlerMap,
-  EventType,
-  RelationType,
-  Room,
-  RoomEvent,
-} from 'matrix-js-sdk';
-import { IRTCNotificationContent, RTCNotificationType } from 'matrix-js-sdk/lib/matrixrtc/types';
-import { CryptoBackend } from 'matrix-js-sdk/lib/common-crypto/CryptoBackend';
-import {
-  CallEmbedContextProvider,
-  CallEmbedRefContextProvider,
-  useCallHangupEvent,
-  useCallJoined,
-  useCallThemeSync,
-  useCallMemberSoundSync,
-  useCallStart,
-} from '../hooks/useCallEmbed';
-import { callChatAtom, callEmbedAtom } from '../state/callEmbed';
-import { CallEmbed } from '../plugins/call';
-import { useSelectedRoom } from '../hooks/router/useSelectedRoom';
-import { ScreenSize, useScreenSizeContext } from '../hooks/useScreenSize';
-import { useMatrixClient } from '../hooks/useMatrixClient';
-import CallSound from '../../../public/sound/call.ogg';
-import { useCallMembersChange, useCallSession } from '../hooks/useCall';
-import { useRoomAvatar, useRoomName } from '../hooks/useRoomMeta';
-import { mDirectAtom } from '../state/mDirectList';
-import { useMediaAuthentication } from '../hooks/useMediaAuthentication';
-import { mxcUrlToHttp } from '../utils/matrix';
-import { RoomAvatar, RoomIcon } from './room-avatar';
-import { useRoomNavigate } from '../hooks/useRoomNavigate';
-import { getStateEvent, getMemberDisplayName } from '../utils/room';
-import { getMxIdLocalPart } from '../utils/matrix';
-import { StateEvent } from '../../types/matrix/room';
-import { getPowersLevelFromMatrixEvent } from '../hooks/usePowerLevels';
-import { getRoomCreatorsForRoomId } from '../hooks/useRoomCreators';
-import { getRoomPermissionsAPI } from '../hooks/useRoomPermissions';
-import { useLivekitSupport } from '../hooks/useLivekitSupport';
-import { CallAvatarAnimation } from '../styles/Animations.css';
-import { webRTCSupported } from '../utils/rtc';
-
-const PIP_MIN_W = 200;
-const PIP_MIN_H = 112;
-
-type Corner = 'se' | 'sw' | 'ne' | 'nw';
-
-/** Normalise the element to top/left positioning so resize math is uniform. */
-function normaliseToTopLeft(el: HTMLElement) {
-  const rect = el.getBoundingClientRect();
-  el.style.left = `${rect.left}px`;
-  el.style.top = `${rect.top}px`;
-  el.style.width = `${rect.width}px`;
-  el.style.height = `${rect.height}px`;
-  el.style.right = 'auto';
-  el.style.bottom = 'auto';
-}
-
-type IncomingCallInfo = {
-  room: Room;
-  sender: string;
-  senderTs: number;
-  lifetime: number;
-  intent?: string;
-  notificationType: RTCNotificationType;
-  refEventId: string;
-};
-type IncomingCallProps = {
-  dm: boolean;
-  info: IncomingCallInfo;
-  onIgnore: () => void;
-  onAnswer: (room: Room, video: boolean) => void;
-  onReject: (room: Room, eventId: string) => void;
-};
-function IncomingCall({ dm, info, onIgnore, onAnswer, onReject }: IncomingCallProps) {
-  const mx = useMatrixClient();
-  const useAuthentication = useMediaAuthentication();
-  const livekitSupported = useLivekitSupport();
-  const rtcSupported = webRTCSupported();
-  const canAnswer = livekitSupported && rtcSupported;
-  const { room } = info;
-
-  const audioRef = useRef<HTMLAudioElement>(null);
-
-  const roomName = useRoomName(room);
-  const roomAvatar = useRoomAvatar(room, dm);
-  const avatarUrl = roomAvatar
-    ? mxcUrlToHttp(mx, roomAvatar, useAuthentication, 96, 96, 'crop') ?? undefined
-    : undefined;
-
-  const session = useCallSession(room);
-  useCallMembersChange(
-    session,
-    useCallback(() => {
-      const members = MatrixRTCSession.sessionMembershipsForRoom(room, session.sessionDescription);
-      if (members.length === 0) {
-        onIgnore();
-      }
-    }, [room, session, onIgnore])
-  );
-
-  const playSound = useCallback(() => {
-    const audioElement = audioRef.current;
-    audioElement?.play().catch(() => undefined);
-  }, []);
-
-  useEffect(() => {
-    if (info.notificationType === 'ring') {
-      playSound();
-    }
-    return () => {
-      if (audioRef.current) {
-        audioRef.current.pause();
-        audioRef.current.currentTime = 0;
-      }
-    };
-  }, [playSound, info.notificationType]);
-
-  useEffect(() => {
-    const remaining = info.senderTs + info.lifetime - Date.now();
-    if (remaining <= 0) { onIgnore(); return; }
-    const id = setTimeout(onIgnore, remaining);
-    return () => clearTimeout(id);
-  }, [info.senderTs, info.lifetime, onIgnore]);
-
-  return (
-    <>
-      <Overlay open backdrop={<OverlayBackdrop />}>
-        <OverlayCenter>
-          <FocusTrap
-            focusTrapOptions={{
-              initialFocus: false,
-              onDeactivate: () => onIgnore(),
-              clickOutsideDeactivates: false,
-              escapeDeactivates: false,
-            }}
-          >
-            <Dialog style={{ maxWidth: toRem(324) }}>
-              <Box style={{ padding: config.space.S400 }} direction="Column" gap="700">
-                <Text size="T200" align="Center">
-                  {getMemberDisplayName(info.room, info.sender) ?? getMxIdLocalPart(info.sender) ?? info.sender}
-                </Text>
-                <Box direction="Column" gap="500" alignItems="Center">
-                  <Box shrink="No">
-                    <Avatar size="500" className={CallAvatarAnimation}>
-                      <RoomAvatar
-                        roomId={room.roomId}
-                        src={avatarUrl}
-                        alt={roomName}
-                        renderFallback={() => (
-                          <RoomIcon
-                            roomType={room.getType()}
-                            size="400"
-                            joinRule={room.getJoinRule()}
-                            filled
-                          />
-                        )}
-                      />
-                    </Avatar>
-                  </Box>
-                  <Box grow="Yes" direction="Column" gap="100">
-                    <Text size="H3" align="Center" truncate>
-                      {roomName}
-                    </Text>
-                    <Text size="T300">Incoming Call</Text>
-                  </Box>
-                </Box>
-                {!livekitSupported && (
-                  <Text
-                    style={{ margin: 'auto', color: color.Critical.Main }}
-                    size="L400"
-                    align="Center"
-                  >
-                    Your homeserver does not support calling.
-                  </Text>
-                )}
-                {!webRTCSupported() && (
-                  <Text
-                    style={{ margin: 'auto', color: color.Critical.Main }}
-                    size="L400"
-                    align="Center"
-                  >
-                    Your browser does not support WebRTC, which is required for calling.
-                  </Text>
-                )}
-                <Box direction="Column" gap="300">
-                  <Button
-                    style={{ flexGrow: 1 }}
-                    variant="Success"
-                    size="400"
-                    radii="400"
-                    onClick={() => onAnswer(room, info.intent === 'video')}
-                    before={
-                      <Icon
-                        size="200"
-                        src={info.intent === 'video' ? Icons.VideoCamera : Icons.Phone}
-                        filled
-                      />
-                    }
-                    disabled={!canAnswer}
-                  >
-                    <Text as="span" size="B400">
-                      Answer
-                    </Text>
-                  </Button>
-                  <Button
-                    style={{ flexGrow: 1 }}
-                    variant="Success"
-                    fill="Soft"
-                    size="400"
-                    radii="400"
-                    onClick={() => (dm ? onReject(room, info.refEventId) : onIgnore())}
-                    before={<Icon size="200" src={Icons.Cross} filled />}
-                  >
-                    <Text as="span" size="B400">
-                      {dm ? 'Reject' : 'Ignore'}
-                    </Text>
-                  </Button>
-                </Box>
-              </Box>
-            </Dialog>
-          </FocusTrap>
-        </OverlayCenter>
-      </Overlay>
-      <audio ref={audioRef} loop style={{ display: 'none' }}>
-        <source src={CallSound} type="audio/ogg" />
-      </audio>
-    </>
-  );
-}
-
-type IncomingCallListenerProps = {
-  callEmbed?: CallEmbed;
-  joined?: boolean;
-};
-function IncomingCallListener({ callEmbed, joined }: IncomingCallListenerProps) {
-  const mx = useMatrixClient();
-  const directs = useAtomValue(mDirectAtom);
-  const { navigateRoom } = useRoomNavigate();
-
-  const [callInfo, setCallInfo] = useState<IncomingCallInfo>();
-  const dm = callInfo ? directs.has(callInfo.room.roomId) : false;
-  const startCall = useCallStart(dm);
-
-  const handleTimelineEvent: EventTimelineSetHandlerMap[RoomEvent.Timeline] = useCallback(
-    async (event, room, toStartOfTimeline, removed, data) => {
-      // only process rtc notification reference events.
-      // we do not want to wait to decrypt all events.
-      if (event.getRelation()?.rel_type !== RelationType.Reference) return;
-
-      if (event.isEncrypted()) {
-        if (!event.isBeingDecrypted()) {
-          await event.attemptDecryption(mx.getCrypto() as CryptoBackend);
-        }
-        await event.getDecryptionPromise();
-      }
-
-      if (
-        !room ||
-        event.getType() !== EventType.RTCNotification ||
-        event.getSender() === mx.getSafeUserId() ||
-        !data.liveEvent
-      ) {
-        return;
-      }
-
-      const sender = event.getSender();
-      const content = event.getContent<IRTCNotificationContent>();
-      const senderTs =
-        content.sender_ts - event.getTs() > 20000 ? event.getTs() : content.sender_ts;
-      const lifetime = Math.min(content.lifetime, 120000);
-      const notificationType = content.notification_type;
-      const relation =
-        event.getRelation()?.rel_type === RelationType.Reference ? event.getRelation() : undefined;
-      const refEventId = relation?.event_id;
-
-      const mention =
-        content['m.mentions']?.room || content['m.mentions']?.user_ids?.includes(mx.getSafeUserId());
-      if (!sender || !refEventId || !mention || Date.now() >= senderTs + lifetime) {
-        return;
-      }
-
-      const powerLevelsEvent = getStateEvent(room, StateEvent.RoomPowerLevels);
-      const powerLevels = getPowersLevelFromMatrixEvent(powerLevelsEvent);
-      const creators = getRoomCreatorsForRoomId(mx, room.roomId);
-      const permissions = getRoomPermissionsAPI(creators, powerLevels);
-
-      const hasCallPermission = permissions.stateEvent(
-        StateEvent.GroupCallMemberPrefix,
-        mx.getSafeUserId()
-      );
-      if (!hasCallPermission) return;
-
-      const info: IncomingCallInfo = {
-        room,
-        sender,
-        senderTs,
-        lifetime,
-        intent:
-          'm.call.intent' in content && typeof content['m.call.intent'] === 'string'
-            ? content['m.call.intent']
-            : undefined,
-        notificationType,
-        refEventId,
-      };
-
-      setCallInfo(info);
-    },
-    [mx]
-  );
-
-  useEffect(() => {
-    mx.on(RoomEvent.Timeline, handleTimelineEvent);
-    return () => {
-      mx.removeListener(RoomEvent.Timeline, handleTimelineEvent);
-    };
-  }, [mx, handleTimelineEvent]);
-
-  const handleIgnore = useCallback(() => {
-    setCallInfo(undefined);
-  }, []);
-
-  const handleReject = useCallback(
-    (room: Room, eventId: string) => {
-      mx.sendEvent(room.roomId, EventType.RTCDecline, {
-        'm.relates_to': {
-          rel_type: RelationType.Reference,
-          event_id: eventId,
-        },
-      });
-      setCallInfo(undefined);
-    },
-    [mx]
-  );
-
-  const handleAnswer = useCallback(
-    (room: Room, video: boolean) => {
-      startCall(room, { microphone: true, video, sound: true });
-      setCallInfo(undefined);
-      navigateRoom(room.roomId);
-    },
-    [startCall, navigateRoom]
-  );
-
-  if (callInfo && callEmbed?.roomId === callInfo.room.roomId) {
-    return null;
-  }
-  return !joined && callInfo ? (
-    <IncomingCall
-      dm={dm}
-      info={callInfo}
-      onIgnore={handleIgnore}
-      onAnswer={handleAnswer}
-      onReject={handleReject}
-    />
-  ) : null;
-}
-
-function CallUtils({ embed }: { embed: CallEmbed }) {
-  const setCallEmbed = useSetAtom(callEmbedAtom);
-
-  useCallMemberSoundSync(embed);
-  useCallThemeSync(embed);
-  useCallHangupEvent(
-    embed,
-    useCallback(() => {
-      setCallEmbed(undefined);
-    }, [setCallEmbed])
-  );
-
-  return null;
-}
-
-type CallEmbedProviderProps = {
-  children?: ReactNode;
-};
-export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
-  const callEmbed = useAtomValue(callEmbedAtom);
-  const callEmbedRef = useRef<HTMLDivElement>(null);
-  const joined = useCallJoined(callEmbed);
-
-  const selectedRoom = useSelectedRoom();
-  const chat = useAtomValue(callChatAtom);
-  const screenSize = useScreenSizeContext();
-
-  const chatOnlyView = chat && screenSize !== ScreenSize.Desktop;
-  const inCallRoom = callEmbed && selectedRoom === callEmbed.roomId;
-  const callActive = callEmbed && joined;
-  const callVisible = inCallRoom && callActive && !chatOnlyView;
-  const pipMode = callActive && !inCallRoom;
-  const { navigateRoom } = useRoomNavigate();
-
-  const pipDragRef = React.useRef<{
-    startX: number; startY: number; origLeft: number; origTop: number; dragged: boolean;
-  } | null>(null);
-  const activeDragCleanupRef = React.useRef<(() => void) | null>(null);
-  React.useEffect(() => () => { activeDragCleanupRef.current?.(); }, []);
-
-  // Track previous pipMode to only reset position when first entering pip (not on callVisible changes)
-  const prevPipModeRef = React.useRef(false);
-  React.useEffect(() => {
-    const el = callEmbedRef.current;
-    if (!el) return;
-    if (pipMode) {
-      if (!prevPipModeRef.current) {
-        el.style.top = 'auto'; el.style.left = 'auto';
-        el.style.bottom = '72px'; el.style.right = '16px';
-        el.style.width = '280px'; el.style.height = '158px';
-        el.style.borderRadius = '12px'; el.style.overflow = 'hidden';
-        el.style.zIndex = '99'; el.style.boxShadow = '0 8px 32px rgba(0,0,0,0.55)';
-        el.style.border = '1px solid rgba(255,255,255,0.1)';
-      }
-      el.style.visibility = 'visible';
-    } else {
-      ['top','left','bottom','right','width','height','borderRadius','overflow','zIndex','boxShadow','border'].forEach(p => { (el.style as any)[p] = ''; });
-      el.style.visibility = callVisible ? '' : 'hidden';
-    }
-    prevPipModeRef.current = pipMode;
-  }, [pipMode, callVisible]);
-
-  React.useEffect(() => {
-    if (!pipMode) return;
-    const onPipWindowResize = (): void => {
-      const el = callEmbedRef.current;
-      if (!el) return;
-      const l = parseFloat(el.style.left);
-      const t = parseFloat(el.style.top);
-      if (!isNaN(l)) el.style.left = `${Math.max(0, Math.min(l, window.innerWidth - el.offsetWidth))}px`;
-      if (!isNaN(t)) el.style.top = `${Math.max(0, Math.min(t, window.innerHeight - el.offsetHeight))}px`;
-    };
-    window.addEventListener('resize', onPipWindowResize);
-    return () => window.removeEventListener('resize', onPipWindowResize);
-  }, [pipMode, callEmbedRef]);
-
-  const handlePipMouseDown = (e: React.MouseEvent) => {
-    const el = callEmbedRef.current; if (!el) return;
-    const rect = el.getBoundingClientRect();
-    pipDragRef.current = { startX: e.clientX, startY: e.clientY, origLeft: rect.left, origTop: rect.top, dragged: false };
-    const onMove = (ev: MouseEvent) => {
-      if (!pipDragRef.current || !el) return;
-      const dx = ev.clientX - pipDragRef.current.startX, dy = ev.clientY - pipDragRef.current.startY;
-      if (!pipDragRef.current.dragged && Math.abs(dx)+Math.abs(dy) > 5) { pipDragRef.current.dragged = true; document.body.style.cursor = 'grabbing'; document.body.style.userSelect = 'none'; }
-      if (pipDragRef.current.dragged) {
-        el.style.left = `${Math.max(0, Math.min(window.innerWidth-el.offsetWidth, pipDragRef.current.origLeft+dx))}px`;
-        el.style.top = `${Math.max(0, Math.min(window.innerHeight-el.offsetHeight, pipDragRef.current.origTop+dy))}px`;
-        el.style.right = 'auto'; el.style.bottom = 'auto';
-      }
-    };
-    const onUp = () => { document.removeEventListener('mousemove', onMove); document.removeEventListener('mouseup', onUp); document.body.style.cursor = ''; document.body.style.userSelect = ''; activeDragCleanupRef.current = null; setTimeout(() => { if (pipDragRef.current) pipDragRef.current.dragged = false; }, 0); };
-    activeDragCleanupRef.current = () => { document.removeEventListener('mousemove', onMove); document.removeEventListener('mouseup', onUp); document.body.style.cursor = ''; document.body.style.userSelect = ''; };
-    document.addEventListener('mousemove', onMove); document.addEventListener('mouseup', onUp);
-  };
-
-  const handlePipTouchStart = (e: React.TouchEvent) => {
-    const el = callEmbedRef.current;
-    if (!el || e.touches.length !== 1) return;
-    const touch = e.touches[0];
-    const rect = el.getBoundingClientRect();
-    pipDragRef.current = { startX: touch.clientX, startY: touch.clientY, origLeft: rect.left, origTop: rect.top, dragged: false };
-    const onTouchMove = (ev: TouchEvent) => {
-      if (!pipDragRef.current || !el || ev.touches.length !== 1) return;
-      ev.preventDefault();
-      const t = ev.touches[0];
-      const dx = t.clientX - pipDragRef.current.startX;
-      const dy = t.clientY - pipDragRef.current.startY;
-      if (!pipDragRef.current.dragged && Math.abs(dx) + Math.abs(dy) > 5) pipDragRef.current.dragged = true;
-      if (pipDragRef.current.dragged) {
-        el.style.left = `${Math.max(0, Math.min(window.innerWidth - el.offsetWidth, pipDragRef.current.origLeft + dx))}px`;
-        el.style.top = `${Math.max(0, Math.min(window.innerHeight - el.offsetHeight, pipDragRef.current.origTop + dy))}px`;
-        el.style.right = 'auto'; el.style.bottom = 'auto';
-      }
-    };
-    const onTouchEnd = () => {
-      document.removeEventListener('touchmove', onTouchMove);
-      document.removeEventListener('touchend', onTouchEnd);
-      activeDragCleanupRef.current = null;
-      setTimeout(() => { if (pipDragRef.current) pipDragRef.current.dragged = false; }, 0);
-    };
-    activeDragCleanupRef.current = () => { document.removeEventListener('touchmove', onTouchMove); document.removeEventListener('touchend', onTouchEnd); };
-    document.addEventListener('touchmove', onTouchMove, { passive: false });
-    document.addEventListener('touchend', onTouchEnd);
-  };
-
-  const handleResizeMouseDown = (e: React.MouseEvent, corner: Corner) => {
-    e.stopPropagation(); e.preventDefault();
-    const el = callEmbedRef.current; if (!el) return;
-    normaliseToTopLeft(el);
-    const sx = e.clientX, sy = e.clientY, sw = el.offsetWidth, sh = el.offsetHeight;
-    const sl = parseFloat(el.style.left), st = parseFloat(el.style.top);
-    document.body.style.cursor = `${corner}-resize`; document.body.style.userSelect = 'none';
-    const onMove = (ev: MouseEvent) => {
-      const dx = ev.clientX-sx, dy = ev.clientY-sy;
-      let w = sw, h = sh, l = sl, t = st;
-      if (corner==='se'){w=sw+dx;h=sh+dy;} if (corner==='sw'){w=sw-dx;h=sh+dy;l=sl+sw-Math.max(PIP_MIN_W,w);}
-      if (corner==='ne'){w=sw+dx;h=sh-dy;t=st+sh-Math.max(PIP_MIN_H,h);} if (corner==='nw'){w=sw-dx;h=sh-dy;l=sl+sw-Math.max(PIP_MIN_W,w);t=st+sh-Math.max(PIP_MIN_H,h);}
-      w=Math.max(PIP_MIN_W,Math.min(w,window.innerWidth)); h=Math.max(PIP_MIN_H,Math.min(h,window.innerHeight));
-      l=Math.max(0,Math.min(l,window.innerWidth-PIP_MIN_W)); t=Math.max(0,Math.min(t,window.innerHeight-PIP_MIN_H));
-      el.style.width=`${w}px`; el.style.height=`${h}px`; el.style.left=`${l}px`; el.style.top=`${t}px`;
-    };
-    const onUp = () => { document.removeEventListener('mousemove', onMove); document.removeEventListener('mouseup', onUp); document.body.style.cursor=''; document.body.style.userSelect=''; activeDragCleanupRef.current = null; };
-    activeDragCleanupRef.current = () => { document.removeEventListener('mousemove', onMove); document.removeEventListener('mouseup', onUp); document.body.style.cursor=''; document.body.style.userSelect=''; };
-    document.addEventListener('mousemove', onMove); document.addEventListener('mouseup', onUp);
-  };
-
-  return (
-    <CallEmbedContextProvider value={callEmbed}>
-      {callEmbed && <CallUtils embed={callEmbed} />}
-      <CallEmbedRefContextProvider value={callEmbedRef}>
-        <IncomingCallListener callEmbed={callEmbed} joined={joined} />
-        {children}
-      </CallEmbedRefContextProvider>
-      <div
-        data-call-embed-container
-        style={{
-          visibility: callVisible ? undefined : 'hidden',
-          position: 'fixed',
-          top: 0,
-          left: 0,
-          width: '100%',
-          height: '50%',
-        }}
-        ref={callEmbedRef}
-      >
-        {pipMode && callEmbed && (
-          <>
-            <div
-              role="button"
-              tabIndex={0}
-              aria-label="Return to call"
-              onMouseDown={handlePipMouseDown}
-              onTouchStart={handlePipTouchStart}
-              onClick={() => { if (!pipDragRef.current?.dragged) navigateRoom(callEmbed.roomId); }}
-              onKeyDown={(e) => e.key === 'Enter' && navigateRoom(callEmbed.roomId)}
-              style={{ position:'absolute', inset:0, zIndex:1, background:'transparent', cursor:'grab', display:'flex', alignItems:'flex-start', justifyContent:'flex-end', padding:'6px' }}
-            >
-              <div style={{ background:'rgba(0,0,0,0.65)', backdropFilter:'blur(4px)', borderRadius:'6px', padding:'3px 8px', color:'#fff', fontSize:'11px', fontWeight:600, pointerEvents:'none' }}>
-                ↗ Return to call
-              </div>
-            </div>
-            {(['se','sw','ne','nw'] as Corner[]).map((corner) => {
-              const s = corner.includes('s'); const e2 = corner.includes('e');
-              const dots = [[2,2],[2,7],[7,2]].map(([a,b]) => ({
-                position:'absolute' as const, width:4, height:4, borderRadius:'50%',
-                background:'rgba(255,255,255,0.45)',
-                [s?'bottom':'top']:a, [e2?'right':'left']:b,
-              }));
-              return (
-                <div key={corner} onMouseDown={(ev) => handleResizeMouseDown(ev, corner)} onClick={(ev) => ev.stopPropagation()}
-                  style={{ position:'absolute', width:'18px', height:'18px', [s?'bottom':'top']:0, [e2?'right':'left']:0, cursor:`${corner}-resize`, zIndex:2 }}>
-                  {dots.map((style, i) => <div key={i} style={style} />)}
-                </div>
-              );
-            })}
-          </>
-        )}
-      </div>
-    </CallEmbedContextProvider>
-  );
-}

src/app/components/CapabilitiesLoader.tsx

@@ -12,7 +12,7 @@ export function CapabilitiesLoader({ children }: CapabilitiesLoaderProps) {
   const [state, load] = useAsyncCallback(useCallback(() => mx.getCapabilities(), [mx]));
 
   useEffect(() => {
-    load().catch(() => {});
+    load();
   }, [load]);
 
   return children(state.status === AsyncStatus.Success ? state.data : undefined);

src/app/components/DeviceVerification.tsx

@@ -259,9 +259,9 @@ export function DeviceVerification({ request, onExit }: DeviceVerificationProps)
           <Dialog variant="Surface">
             <Header style={DialogHeaderStyles} variant="Surface" size="500">
               <Box grow="Yes">
-                <Text as="h2" size="H4">Device Verification</Text>
+                <Text size="H4">Device Verification</Text>
               </Box>
-              <IconButton size="300" radii="300" onClick={handleCancel} aria-label="Cancel verification">
+              <IconButton size="300" radii="300" onClick={handleCancel}>
                 <Icon src={Icons.Cross} />
               </IconButton>
             </Header>

src/app/components/DeviceVerificationSetup.tsx

@@ -299,9 +299,9 @@ export const DeviceVerificationSetup = forwardRef<HTMLDivElement, DeviceVerifica
           size="500"
         >
           <Box grow="Yes">
-            <Text as="h2" size="H4">Setup Device Verification</Text>
+            <Text size="H4">Setup Device Verification</Text>
           </Box>
-          <IconButton size="300" radii="300" onClick={onCancel} aria-label="Cancel">
+          <IconButton size="300" radii="300" onClick={onCancel}>
             <Icon src={Icons.Cross} />
           </IconButton>
         </Header>
@@ -334,9 +334,9 @@ export const DeviceVerificationReset = forwardRef<HTMLDivElement, DeviceVerifica
           size="500"
         >
           <Box grow="Yes">
-            <Text as="h2" size="H4">Reset Device Verification</Text>
+            <Text size="H4">Reset Device Verification</Text>
           </Box>
-          <IconButton size="300" radii="300" onClick={onCancel} aria-label="Cancel">
+          <IconButton size="300" radii="300" onClick={onCancel}>
             <Icon src={Icons.Cross} />
           </IconButton>
         </Header>

src/app/components/GifPicker.tsx

@@ -1,116 +0,0 @@
-import React, { useCallback } from 'react';
-import FocusTrap from 'focus-trap-react';
-import { Grid, SearchBar, SearchContext, SearchContextManager } from '@giphy/react-components';
-import { IGif } from '@giphy/js-types';
-import { Box } from 'folds';
-import { useSetting } from '../state/hooks/settings';
-import { settingsAtom } from '../state/settings';
-
-const PICKER_WIDTH = 312;
-
-
-type GifPickerInnerProps = {
-  onSelect: (url: string, width: number, height: number) => void;
-  requestClose: () => void;
-  lotusTerminal: boolean;
-};
-
-function GifPickerInner({ onSelect, requestClose, lotusTerminal }: GifPickerInnerProps) {
-  const { fetchGifs, searchKey } = React.useContext(SearchContext);
-
-  const handleClick = useCallback(
-    (gif: IGif, e: React.SyntheticEvent) => {
-      e.preventDefault();
-      const r = gif.images.downsized ?? gif.images.original;
-      const url = r.url;
-      const width = Number(r.width) || 200;
-      const height = Number(r.height) || 200;
-      onSelect(url, width, height);
-      requestClose();
-    },
-    [onSelect, requestClose]
-  );
-
-  return (
-    <Box direction="Column" style={{ width: `${PICKER_WIDTH}px` }}>
-      {lotusTerminal && (
-        <div style={{
-          padding: '5px 10px 4px',
-          borderBottom: '1px solid rgba(255,107,0,0.2)',
-          fontFamily: "'JetBrains Mono', 'Cascadia Code', monospace",
-          fontSize: '10px',
-          fontWeight: 700,
-          letterSpacing: '0.1em',
-          color: '#FF6B00',
-          userSelect: 'none',
-        }}>
-          // GIF_SEARCH
-        </div>
-      )}
-      <Box style={{ padding: '8px 8px 4px' }}>
-        <SearchBar style={{ width: '100%', borderRadius: lotusTerminal ? '4px' : '8px' }} />
-      </Box>
-      <div style={{ overflowY: 'auto', overflowX: 'hidden', maxHeight: '340px', padding: '0 8px 8px' }}>
-        <Grid
-          key={searchKey}
-          fetchGifs={fetchGifs}
-          width={PICKER_WIDTH - 16}
-          columns={2}
-          gutter={4}
-          onGifClick={handleClick}
-          hideAttribution={false}
-          noLink
-        />
-      </div>
-    </Box>
-  );
-}
-
-type GifPickerProps = {
-  apiKey: string;
-  onSelect: (url: string, width: number, height: number) => void;
-  requestClose: () => void;
-};
-
-export function GifPicker({ apiKey, onSelect, requestClose }: GifPickerProps) {
-  const [lotusTerminal] = useSetting(settingsAtom, 'lotusTerminal');
-
-  const containerStyle = lotusTerminal
-    ? {
-        background: '#060c14',
-        border: '1px solid rgba(255,107,0,0.35)',
-        borderRadius: '4px',
-        overflow: 'hidden',
-        boxShadow: '0 4px 24px rgba(255,107,0,0.10), 0 0 0 1px rgba(255,107,0,0.08)',
-        width: `${PICKER_WIDTH}px`,
-      }
-    : {
-        background: 'var(--bg-surface)',
-        border: '1px solid rgba(255,255,255,0.08)',
-        borderRadius: '12px',
-        overflow: 'hidden',
-        boxShadow: '0 8px 32px rgba(0,0,0,0.4)',
-        width: `${PICKER_WIDTH}px`,
-      };
-
-  return (
-    <FocusTrap
-      focusTrapOptions={{
-        initialFocus: false,
-        onDeactivate: requestClose,
-        clickOutsideDeactivates: true,
-        allowOutsideClick: true,
-      }}
-    >
-      <Box
-        direction="Column"
-        data-gif-terminal={lotusTerminal ? '' : undefined}
-        style={containerStyle}
-      >
-        <SearchContextManager apiKey={apiKey} initialTerm="">
-          <GifPickerInner onSelect={onSelect} requestClose={requestClose} lotusTerminal={!!lotusTerminal} />
-        </SearchContextManager>
-      </Box>
-    </FocusTrap>
-  );
-}

src/app/components/ImageOverlay.tsx

@@ -1,45 +0,0 @@
-import FocusTrap from 'focus-trap-react';
-import { as, Modal, Overlay, OverlayBackdrop, OverlayCenter } from 'folds';
-import React, { ReactNode } from 'react';
-import { ModalWide } from '../styles/Modal.css';
-import { stopPropagation } from '../utils/keyboard';
-
-export type RenderViewerProps = {
-  src: string;
-  alt: string;
-  requestClose: () => void;
-};
-
-type ImageOverlayProps = RenderViewerProps & {
-  viewer: boolean;
-  renderViewer: (props: RenderViewerProps) => ReactNode;
-};
-
-export const ImageOverlay = as<'div', ImageOverlayProps>(
-  ({ src, alt, viewer, requestClose, renderViewer, ...props }, ref) => (
-    <Overlay {...props} ref={ref} open={viewer} backdrop={<OverlayBackdrop />}>
-      <OverlayCenter>
-        <FocusTrap
-          focusTrapOptions={{
-            initialFocus: false,
-            onDeactivate: () => requestClose(),
-            clickOutsideDeactivates: true,
-            escapeDeactivates: stopPropagation,
-          }}
-        >
-          <Modal
-            className={ModalWide}
-            size="500"
-            onContextMenu={(evt: any) => evt.stopPropagation()}
-          >
-            {renderViewer({
-              src,
-              alt,
-              requestClose,
-            })}
-          </Modal>
-        </FocusTrap>
-      </OverlayCenter>
-    </Overlay>
-  )
-);

src/app/components/JoinRulesSwitcher.tsx

@@ -16,24 +16,34 @@ import {
 import { JoinRule } from 'matrix-js-sdk';
 import FocusTrap from 'focus-trap-react';
 import { stopPropagation } from '../utils/keyboard';
-import { getRoomIconSrc } from '../utils/room';
 
 export type ExtraJoinRules = 'knock_restricted';
 export type ExtendedJoinRules = JoinRule | ExtraJoinRules;
 
 type JoinRuleIcons = Record<ExtendedJoinRules, IconSrc>;
-
+export const useRoomJoinRuleIcon = (): JoinRuleIcons =>
-export const useJoinRuleIcons = (roomType?: string): JoinRuleIcons =>
   useMemo(
     () => ({
-      [JoinRule.Invite]: getRoomIconSrc(Icons, roomType, JoinRule.Invite),
+      [JoinRule.Invite]: Icons.HashLock,
-      [JoinRule.Knock]: getRoomIconSrc(Icons, roomType, JoinRule.Knock),
+      [JoinRule.Knock]: Icons.HashLock,
-      knock_restricted: getRoomIconSrc(Icons, roomType, JoinRule.Restricted),
+      knock_restricted: Icons.Hash,
-      [JoinRule.Restricted]: getRoomIconSrc(Icons, roomType, JoinRule.Restricted),
+      [JoinRule.Restricted]: Icons.Hash,
-      [JoinRule.Public]: getRoomIconSrc(Icons, roomType, JoinRule.Public),
+      [JoinRule.Public]: Icons.HashGlobe,
-      [JoinRule.Private]: getRoomIconSrc(Icons, roomType, JoinRule.Private),
+      [JoinRule.Private]: Icons.HashLock,
     }),
-    [roomType]
+    []
+  );
+export const useSpaceJoinRuleIcon = (): JoinRuleIcons =>
+  useMemo(
+    () => ({
+      [JoinRule.Invite]: Icons.SpaceLock,
+      [JoinRule.Knock]: Icons.SpaceLock,
+      knock_restricted: Icons.Space,
+      [JoinRule.Restricted]: Icons.Space,
+      [JoinRule.Public]: Icons.SpaceGlobe,
+      [JoinRule.Private]: Icons.SpaceLock,
+    }),
+    []
   );
 
 type JoinRuleLabels = Record<ExtendedJoinRules, string>;

src/app/components/LogoutDialog.tsx

@@ -43,7 +43,7 @@ export const LogoutDialog = forwardRef<HTMLDivElement, LogoutDialogProps>(
           size="500"
         >
           <Box grow="Yes">
-            <Text as="h2" size="H4">Logout</Text>
+            <Text size="H4">Logout</Text>
           </Box>
         </Header>
         <Box style={{ padding: config.space.S400 }} direction="Column" gap="400">

src/app/components/MediaConfigLoader.tsx

@@ -12,7 +12,7 @@ export function MediaConfigLoader({ children }: MediaConfigLoaderProps) {
   const [state, load] = useAsyncCallback(useCallback(() => mx.getMediaConfig(), [mx]));
 
   useEffect(() => {
-    load().catch(() => {});
+    load();
   }, [load]);
 
   return children(state.status === AsyncStatus.Success ? state.data : undefined);

src/app/components/Pdf-viewer/PdfViewer.tsx

@@ -108,7 +108,7 @@ export const PdfViewer = as<'div', PdfViewerProps>(
       <Box className={classNames(css.PdfViewer, className)} direction="Column" {...props} ref={ref}>
         <Header className={css.PdfViewerHeader} size="400">
           <Box grow="Yes" alignItems="Center" gap="200">
-            <IconButton size="300" radii="300" onClick={requestClose} aria-label="Close">
+            <IconButton size="300" radii="300" onClick={requestClose}>
               <Icon size="50" src={Icons.ArrowLeft} />
             </IconButton>
             <Text size="T300" truncate>

src/app/components/SecretStorage.tsx

@@ -80,7 +80,6 @@ export function SecretStorageRecoveryPassphrase({
           <Text size="L400">Recovery Passphrase</Text>
           <PasswordInput
             name="recoveryPassphraseInput"
-            aria-label="Recovery passphrase"
             size="400"
             variant="Secondary"
             radii="300"
@@ -171,7 +170,6 @@ export function SecretStorageRecoveryKey({
           <Text size="L400">Recovery Key</Text>
           <PasswordInput
             name="recoveryKeyInput"
-            aria-label="Recovery key"
             size="400"
             variant="Secondary"
             radii="300"

src/app/components/SpecVersionsLoader.tsx

@@ -22,7 +22,7 @@ export function SpecVersionsLoader({
   const ignoreCallback = useCallback(() => setIgnoreError(true), []);
 
   useEffect(() => {
-    load().catch(() => {});
+    load();
   }, [load]);
 
   if (state.status === AsyncStatus.Idle || state.status === AsyncStatus.Loading) {

src/app/components/UIAFlowOverlay.tsx

@@ -55,7 +55,6 @@ export function UIAFlowOverlay({
                 <IconButton
                   ref={anchorRef}
                   variant="Critical"
-                  aria-label="Cancel authentication"
                   size="300"
                   onClick={onCancel}
                   radii="Pill"

src/app/components/create-room/CreateRoomKindSelector.tsx

@@ -2,39 +2,43 @@ import React from 'react';
 import { Box, Text, Icon, Icons, config, IconSrc } from 'folds';
 import { SequenceCard } from '../sequence-card';
 import { SettingTile } from '../setting-tile';
-import { CreateRoomAccess } from './types';
 
-type CreateRoomAccessSelectorProps = {
+export enum CreateRoomKind {
-  value?: CreateRoomAccess;
+  Private = 'private',
-  onSelect: (value: CreateRoomAccess) => void;
+  Restricted = 'restricted',
+  Public = 'public',
+}
+type CreateRoomKindSelectorProps = {
+  value?: CreateRoomKind;
+  onSelect: (value: CreateRoomKind) => void;
   canRestrict?: boolean;
   disabled?: boolean;
-  getIcon: (access: CreateRoomAccess) => IconSrc;
+  getIcon: (kind: CreateRoomKind) => IconSrc;
 };
-export function CreateRoomAccessSelector({
+export function CreateRoomKindSelector({
   value,
   onSelect,
   canRestrict,
   disabled,
   getIcon,
-}: CreateRoomAccessSelectorProps) {
+}: CreateRoomKindSelectorProps) {
   return (
     <Box shrink="No" direction="Column" gap="100">
       {canRestrict && (
         <SequenceCard
           style={{ padding: config.space.S300 }}
-          variant={value === CreateRoomAccess.Restricted ? 'Primary' : 'SurfaceVariant'}
+          variant={value === CreateRoomKind.Restricted ? 'Primary' : 'SurfaceVariant'}
           direction="Column"
           gap="100"
           as="button"
           type="button"
-          aria-pressed={value === CreateRoomAccess.Restricted}
+          aria-pressed={value === CreateRoomKind.Restricted}
-          onClick={() => onSelect(CreateRoomAccess.Restricted)}
+          onClick={() => onSelect(CreateRoomKind.Restricted)}
           disabled={disabled}
         >
           <SettingTile
-            before={<Icon size="400" src={getIcon(CreateRoomAccess.Restricted)} />}
+            before={<Icon size="400" src={getIcon(CreateRoomKind.Restricted)} />}
-            after={value === CreateRoomAccess.Restricted && <Icon src={Icons.Check} />}
+            after={value === CreateRoomKind.Restricted && <Icon src={Icons.Check} />}
           >
             <Text size="H6">Restricted</Text>
             <Text size="T300" priority="300">
@@ -45,18 +49,18 @@ export function CreateRoomAccessSelector({
       )}
       <SequenceCard
         style={{ padding: config.space.S300 }}
-        variant={value === CreateRoomAccess.Private ? 'Primary' : 'SurfaceVariant'}
+        variant={value === CreateRoomKind.Private ? 'Primary' : 'SurfaceVariant'}
         direction="Column"
         gap="100"
         as="button"
         type="button"
-        aria-pressed={value === CreateRoomAccess.Private}
+        aria-pressed={value === CreateRoomKind.Private}
-        onClick={() => onSelect(CreateRoomAccess.Private)}
+        onClick={() => onSelect(CreateRoomKind.Private)}
         disabled={disabled}
       >
         <SettingTile
-          before={<Icon size="400" src={getIcon(CreateRoomAccess.Private)} />}
+          before={<Icon size="400" src={getIcon(CreateRoomKind.Private)} />}
-          after={value === CreateRoomAccess.Private && <Icon src={Icons.Check} />}
+          after={value === CreateRoomKind.Private && <Icon src={Icons.Check} />}
         >
           <Text size="H6">Private</Text>
           <Text size="T300" priority="300">
@@ -66,18 +70,18 @@ export function CreateRoomAccessSelector({
       </SequenceCard>
       <SequenceCard
         style={{ padding: config.space.S300 }}
-        variant={value === CreateRoomAccess.Public ? 'Primary' : 'SurfaceVariant'}
+        variant={value === CreateRoomKind.Public ? 'Primary' : 'SurfaceVariant'}
         direction="Column"
         gap="100"
         as="button"
         type="button"
-        aria-pressed={value === CreateRoomAccess.Public}
+        aria-pressed={value === CreateRoomKind.Public}
-        onClick={() => onSelect(CreateRoomAccess.Public)}
+        onClick={() => onSelect(CreateRoomKind.Public)}
         disabled={disabled}
       >
         <SettingTile
-          before={<Icon size="400" src={getIcon(CreateRoomAccess.Public)} />}
+          before={<Icon size="400" src={getIcon(CreateRoomKind.Public)} />}
-          after={value === CreateRoomAccess.Public && <Icon src={Icons.Check} />}
+          after={value === CreateRoomKind.Public && <Icon src={Icons.Check} />}
         >
           <Text size="H6">Public</Text>
           <Text size="T300" priority="300">

src/app/components/create-room/CreateRoomTypeSelector.tsx

@@ -1,75 +0,0 @@
-import React from 'react';
-import { Box, Text, Icon, Icons, config, IconSrc } from 'folds';
-import { SequenceCard } from '../sequence-card';
-import { SettingTile } from '../setting-tile';
-import { CreateRoomType } from './types';
-import { BetaNoticeBadge } from '../BetaNoticeBadge';
-
-type CreateRoomTypeSelectorProps = {
-  value?: CreateRoomType;
-  onSelect: (value: CreateRoomType) => void;
-  disabled?: boolean;
-  getIcon: (type: CreateRoomType) => IconSrc;
-};
-export function CreateRoomTypeSelector({
-  value,
-  onSelect,
-  disabled,
-  getIcon,
-}: CreateRoomTypeSelectorProps) {
-  return (
-    <Box shrink="No" direction="Column" gap="100">
-      <SequenceCard
-        style={{ padding: config.space.S300 }}
-        variant={value === CreateRoomType.TextRoom ? 'Primary' : 'SurfaceVariant'}
-        direction="Column"
-        gap="100"
-        as="button"
-        type="button"
-        aria-pressed={value === CreateRoomType.TextRoom}
-        onClick={() => onSelect(CreateRoomType.TextRoom)}
-        disabled={disabled}
-      >
-        <SettingTile
-          before={<Icon size="400" src={getIcon(CreateRoomType.TextRoom)} />}
-          after={value === CreateRoomType.TextRoom && <Icon src={Icons.Check} />}
-        >
-          <Box gap="200" alignItems="Baseline">
-            <Text size="H6" style={{ flexShrink: 0 }}>
-              Chat Room
-            </Text>
-            <Text size="T300" priority="300" truncate>
-              - Messages, photos, and videos.
-            </Text>
-          </Box>
-        </SettingTile>
-      </SequenceCard>
-      <SequenceCard
-        style={{ padding: config.space.S300 }}
-        variant={value === CreateRoomType.VoiceRoom ? 'Primary' : 'SurfaceVariant'}
-        direction="Column"
-        gap="100"
-        as="button"
-        type="button"
-        aria-pressed={value === CreateRoomType.VoiceRoom}
-        onClick={() => onSelect(CreateRoomType.VoiceRoom)}
-        disabled={disabled}
-      >
-        <SettingTile
-          before={<Icon size="400" src={getIcon(CreateRoomType.VoiceRoom)} />}
-          after={value === CreateRoomType.VoiceRoom && <Icon src={Icons.Check} />}
-        >
-          <Box gap="200" alignItems="Baseline">
-            <Text size="H6" style={{ flexShrink: 0 }}>
-              Voice Room
-            </Text>
-            <Text size="T300" priority="300" truncate>
-              - Live audio and video conversations.
-            </Text>
-            <BetaNoticeBadge />
-          </Box>
-        </SettingTile>
-      </SequenceCard>
-    </Box>
-  );
-}

src/app/components/create-room/index.ts

@@ -1,6 +1,5 @@
-export * from './CreateRoomAccessSelector';
+export * from './CreateRoomKindSelector';
 export * from './CreateRoomAliasInput';
 export * from './RoomVersionSelector';
 export * from './utils';
 export * from './AdditionalCreatorInput';
-export * from './types';

src/app/components/create-room/types.ts

@@ -1,10 +0,0 @@
-export enum CreateRoomType {
-  TextRoom = 'text',
-  VoiceRoom = 'voice',
-}
-
-export enum CreateRoomAccess {
-  Private = 'private',
-  Restricted = 'restricted',
-  Public = 'public',
-}

src/app/components/create-room/utils.ts

@@ -7,10 +7,10 @@ import {
   Room,
 } from 'matrix-js-sdk';
 import { RoomJoinRulesEventContent } from 'matrix-js-sdk/lib/types';
+import { CreateRoomKind } from './CreateRoomKindSelector';
 import { RoomType, StateEvent } from '../../../types/matrix/room';
 import { getViaServers } from '../../plugins/via-servers';
 import { getMxIdServer } from '../../utils/matrix';
-import { CreateRoomAccess } from './types';
 
 export const createRoomCreationContent = (
   type: RoomType | undefined,
@@ -32,7 +32,7 @@ export const createRoomCreationContent = (
 };
 
 export const createRoomJoinRulesState = (
-  access: CreateRoomAccess,
+  kind: CreateRoomKind,
   parent: Room | undefined,
   knock: boolean
 ) => {
@@ -40,13 +40,13 @@ export const createRoomJoinRulesState = (
     join_rule: knock ? JoinRule.Knock : JoinRule.Invite,
   };
 
-  if (access === CreateRoomAccess.Public) {
+  if (kind === CreateRoomKind.Public) {
     content = {
       join_rule: JoinRule.Public,
     };
   }
 
-  if (access === CreateRoomAccess.Restricted && parent) {
+  if (kind === CreateRoomKind.Restricted && parent) {
     content = {
       join_rule: knock ? ('knock_restricted' as JoinRule) : JoinRule.Restricted,
       allow: [
@@ -74,10 +74,6 @@ export const createRoomParentState = (parent: Room) => ({
   },
 });
 
-const createSpacePowerLevelsOverride = () => ({
-  events_default: 50,
-});
-
 export const createRoomEncryptionState = () => ({
   type: 'm.room.encryption',
   state_key: '',
@@ -86,23 +82,11 @@ export const createRoomEncryptionState = () => ({
   },
 });
 
-export const createRoomCallState = () => ({
-  type: 'org.matrix.msc3401.call',
-  state_key: '',
-  content: {},
-});
-
-export const createVoiceRoomPowerLevelsOverride = () => ({
-  events: {
-    [StateEvent.GroupCallMemberPrefix]: 0,
-  },
-});
-
 export type CreateRoomData = {
   version: string;
   type?: RoomType;
   parent?: Room;
-  access: CreateRoomAccess;
+  kind: CreateRoomKind;
   name: string;
   topic?: string;
   aliasLocalPart?: string;
@@ -122,11 +106,7 @@ export const createRoom = async (mx: MatrixClient, data: CreateRoomData): Promis
     initialState.push(createRoomParentState(data.parent));
   }
 
-  if (data.type === RoomType.Call) {
+  initialState.push(createRoomJoinRulesState(data.kind, data.parent, data.knock));
-    initialState.push(createRoomCallState());
-  }
-
-  initialState.push(createRoomJoinRulesState(data.access, data.parent, data.knock));
 
   const options: ICreateRoomOpts = {
     room_version: data.version,
@@ -138,15 +118,9 @@ export const createRoom = async (mx: MatrixClient, data: CreateRoomData): Promis
       data.allowFederation,
       data.additionalCreators
     ),
-    power_level_content_override:
-      data.type === RoomType.Call ? createVoiceRoomPowerLevelsOverride() : undefined,
     initial_state: initialState,
   };
 
-  if (data.type === RoomType.Space) {
-    options.power_level_content_override = createSpacePowerLevelsOverride();
-  }
-
   const result = await mx.createRoom(options);
 
   if (data.parent) {

src/app/components/editor/Editor.preview.tsx

@@ -23,7 +23,7 @@ export function EditorPreview() {
 
   return (
     <>
-      <IconButton variant="SurfaceVariant" aria-label="Open editor preview" onClick={() => setOpen(!open)}>
+      <IconButton variant="SurfaceVariant" onClick={() => setOpen(!open)}>
         <Icon src={Icons.BlockQuote} />
       </IconButton>
       <Overlay open={open} backdrop={<OverlayBackdrop />}>
@@ -42,7 +42,7 @@ export function EditorPreview() {
                   editor={editor}
                   placeholder="Send a message..."
                   before={
-                    <IconButton variant="SurfaceVariant" size="300" radii="300" aria-label="Attach">
+                    <IconButton variant="SurfaceVariant" size="300" radii="300">
                       <Icon src={Icons.PlusCircle} />
                     </IconButton>
                   }
@@ -53,15 +53,14 @@ export function EditorPreview() {
                         size="300"
                         radii="300"
                         onClick={() => setToolbar(!toolbar)}
-                        aria-label={toolbar ? 'Hide formatting toolbar' : 'Show formatting toolbar'}
                         aria-pressed={toolbar}
                       >
                         <Icon src={toolbar ? Icons.AlphabetUnderline : Icons.Alphabet} />
                       </IconButton>
-                      <IconButton variant="SurfaceVariant" size="300" radii="300" aria-label="Insert emoji">
+                      <IconButton variant="SurfaceVariant" size="300" radii="300">
                         <Icon src={Icons.Smile} />
                       </IconButton>
-                      <IconButton variant="SurfaceVariant" size="300" radii="300" aria-label="Send">
+                      <IconButton variant="SurfaceVariant" size="300" radii="300">
                         <Icon src={Icons.Send} />
                       </IconButton>
                     </>

src/app/components/editor/Editor.tsx

@@ -140,8 +140,6 @@ export const CustomEditor = forwardRef<HTMLDivElement, CustomEditorProps>(
                 data-editable-name={editableName}
                 className={css.EditorTextarea}
                 placeholder={placeholder}
-                aria-label={placeholder ?? 'Message input'}
-                aria-multiline="true"
                 renderPlaceholder={renderPlaceholder}
                 renderElement={renderElement}
                 renderLeaf={renderLeaf}

src/app/components/editor/Toolbar.tsx

@@ -54,8 +54,8 @@ function BtnTooltip({ text, shortCode }: { text: string; shortCode?: string }) {
   );
 }
 
-type MarkButtonProps = { format: MarkType; icon: IconSrc; tooltip: ReactNode; label?: string };
+type MarkButtonProps = { format: MarkType; icon: IconSrc; tooltip: ReactNode };
-export function MarkButton({ format, icon, tooltip, label }: MarkButtonProps) {
+export function MarkButton({ format, icon, tooltip }: MarkButtonProps) {
   const editor = useSlate();
   const disableInline = isBlockActive(editor, BlockType.CodeBlock);
 
@@ -76,7 +76,6 @@ export function MarkButton({ format, icon, tooltip, label }: MarkButtonProps) {
           variant="SurfaceVariant"
           onClick={handleClick}
           aria-pressed={isMarkActive(editor, format)}
-          aria-label={label}
           size="400"
           radii="300"
           disabled={disableInline}
@@ -92,9 +91,8 @@ type BlockButtonProps = {
   format: BlockType;
   icon: IconSrc;
   tooltip: ReactNode;
-  label?: string;
 };
-export function BlockButton({ format, icon, tooltip, label }: BlockButtonProps) {
+export function BlockButton({ format, icon, tooltip }: BlockButtonProps) {
   const editor = useSlate();
 
   const handleClick = () => {
@@ -110,7 +108,6 @@ export function BlockButton({ format, icon, tooltip, label }: BlockButtonProps)
           variant="SurfaceVariant"
           onClick={handleClick}
           aria-pressed={isBlockActive(editor, format)}
-          aria-label={label}
           size="400"
           radii="300"
         >
@@ -168,7 +165,6 @@ export function HeadingBlockButton() {
                   <IconButton
                     ref={triggerRef}
                     onClick={() => handleMenuSelect(1)}
-                    aria-label="Heading 1"
                     size="400"
                     radii="300"
                   >
@@ -184,7 +180,6 @@ export function HeadingBlockButton() {
                   <IconButton
                     ref={triggerRef}
                     onClick={() => handleMenuSelect(2)}
-                    aria-label="Heading 2"
                     size="400"
                     radii="300"
                   >
@@ -200,7 +195,6 @@ export function HeadingBlockButton() {
                   <IconButton
                     ref={triggerRef}
                     onClick={() => handleMenuSelect(3)}
-                    aria-label="Heading 3"
                     size="400"
                     radii="300"
                   >
@@ -217,9 +211,7 @@ export function HeadingBlockButton() {
         style={{ width: 'unset' }}
         variant="SurfaceVariant"
         onClick={handleMenuOpen}
-        aria-label={level ? `Heading ${level}` : 'Heading'}
+        aria-pressed={isActive}
-        aria-expanded={isActive}
-        aria-haspopup="menu"
         size="400"
         radii="300"
       >
@@ -279,44 +271,32 @@ export function Toolbar() {
               <MarkButton
                 format={MarkType.Bold}
                 icon={Icons.Bold}
-                tooltip={<BtnTooltip text="Bold" shortCode={`${modKey} + B`}
+                tooltip={<BtnTooltip text="Bold" shortCode={`${modKey} + B`} />}
-                label="Bold"
-              />}
               />
               <MarkButton
                 format={MarkType.Italic}
                 icon={Icons.Italic}
-                tooltip={<BtnTooltip text="Italic" shortCode={`${modKey} + I`}
+                tooltip={<BtnTooltip text="Italic" shortCode={`${modKey} + I`} />}
-                label="Italic"
-              />}
               />
               <MarkButton
                 format={MarkType.Underline}
                 icon={Icons.Underline}
-                tooltip={<BtnTooltip text="Underline" shortCode={`${modKey} + U`}
+                tooltip={<BtnTooltip text="Underline" shortCode={`${modKey} + U`} />}
-                label="Underline"
-              />}
               />
               <MarkButton
                 format={MarkType.StrikeThrough}
                 icon={Icons.Strike}
-                tooltip={<BtnTooltip text="Strike Through" shortCode={`${modKey} + S`}
+                tooltip={<BtnTooltip text="Strike Through" shortCode={`${modKey} + S`} />}
-                label="Strikethrough"
-              />}
               />
               <MarkButton
                 format={MarkType.Code}
                 icon={Icons.Code}
-                tooltip={<BtnTooltip text="Inline Code" shortCode={`${modKey} + [`}
+                tooltip={<BtnTooltip text="Inline Code" shortCode={`${modKey} + [`} />}
-                label="Inline code"
-              />}
               />
               <MarkButton
                 format={MarkType.Spoiler}
                 icon={Icons.EyeBlind}
-                tooltip={<BtnTooltip text="Spoiler" shortCode={`${modKey} + H`}
+                tooltip={<BtnTooltip text="Spoiler" shortCode={`${modKey} + H`} />}
-                label="Spoiler"
-              />}
               />
             </Box>
             <Line variant="SurfaceVariant" direction="Vertical" style={{ height: toRem(12) }} />
@@ -325,30 +305,22 @@ export function Toolbar() {
             <BlockButton
               format={BlockType.BlockQuote}
               icon={Icons.BlockQuote}
-              tooltip={<BtnTooltip text="Block Quote" shortCode={`${modKey} + '`}
+              tooltip={<BtnTooltip text="Block Quote" shortCode={`${modKey} + '`} />}
-              label="Block quote"
-            />}
             />
             <BlockButton
               format={BlockType.CodeBlock}
               icon={Icons.BlockCode}
-              tooltip={<BtnTooltip text="Block Code" shortCode={`${modKey} + ;`}
+              tooltip={<BtnTooltip text="Block Code" shortCode={`${modKey} + ;`} />}
-              label="Code block"
-            />}
             />
             <BlockButton
               format={BlockType.OrderedList}
               icon={Icons.OrderList}
-              tooltip={<BtnTooltip text="Ordered List" shortCode={`${modKey} + 7`}
+              tooltip={<BtnTooltip text="Ordered List" shortCode={`${modKey} + 7`} />}
-              label="Ordered list"
-            />}
             />
             <BlockButton
               format={BlockType.UnorderedList}
               icon={Icons.UnorderList}
-              tooltip={<BtnTooltip text="Unordered List" shortCode={`${modKey} + 8`}
+              tooltip={<BtnTooltip text="Unordered List" shortCode={`${modKey} + 8`} />}
-              label="Unordered list"
-            />}
             />
             <HeadingBlockButton />
           </Box>
@@ -375,7 +347,6 @@ export function Toolbar() {
                   ref={triggerRef}
                   variant="SurfaceVariant"
                   onClick={() => setIsMarkdown(!isMarkdown)}
-                  aria-label={isMarkdown ? 'Disable Markdown' : 'Enable Markdown'}
                   aria-pressed={isMarkdown}
                   size="300"
                   radii="300"

src/app/components/editor/autocomplete/EmoticonAutocomplete.tsx

@@ -88,8 +88,6 @@ export function EmoticonAutocomplete({
       {autoCompleteEmoticon.map((emoticon) => {
         const isCustomEmoji = 'url' in emoticon;
         const key = isCustomEmoji ? emoticon.url : emoticon.unicode;
-        const customEmojiUrl = mxcUrlToHttp(mx, key, useAuthentication);
-
         return (
           <MenuItem
             key={emoticon.shortcode + key}
@@ -100,11 +98,11 @@ export function EmoticonAutocomplete({
             }
             onClick={() => handleAutocomplete(key, emoticon.shortcode)}
             before={
-              isCustomEmoji && customEmojiUrl ? (
+              isCustomEmoji ? (
                 <Box
                   shrink="No"
                   as="img"
-                  src={customEmojiUrl}
+                  src={mxcUrlToHttp(mx, key, useAuthentication) || key}
                   alt={emoticon.shortcode}
                   style={{ width: toRem(24), height: toRem(24), objectFit: 'contain' }}
                 />

src/app/components/editor/autocomplete/RoomMentionAutocomplete.tsx

@@ -169,13 +169,12 @@ export function RoomMentionAutocomplete({
                         <RoomIcon
                           size="50"
                           joinRule={room.getJoinRule() ?? JoinRule.Restricted}
-                          roomType={room.getType()}
                           filled
                         />
                       )}
                     />
                   ) : (
-                    <RoomIcon size="100" joinRule={room.getJoinRule()} roomType={room.getType()} />
+                    <RoomIcon size="100" joinRule={room.getJoinRule()} space={room.isSpaceRoom()} />
                   )}
                 </Avatar>
               }

src/app/components/editor/input.ts

@@ -157,12 +157,10 @@ const getInlineElement = (node: ChildNode, processText: ProcessTextCallback): In
       return children;
     }
 
-    const children = node.childNodes.flatMap((child) => getInlineElement(child, processText));
+    return node.childNodes.flatMap((child) => getInlineElement(child, processText));
-    if (children.length === 0) return [{ text: '' }];
-    return children;
   }
 
-  return [{ text: '' }];
+  return [];
 };
 
 const parseBlockquoteNode = (
@@ -193,7 +191,7 @@ const parseBlockquoteNode = (
 
       if (child.name === 'p') {
         appendLine();
-        quoteLines.push(getInlineElement(child, processText));
+        quoteLines.push(child.children.flatMap((c) => getInlineElement(c, processText)));
         return;
       }
 
@@ -230,13 +228,9 @@ const parseCodeBlockNode = (node: Element): CodeBlockElement[] | ParagraphElemen
       children: [{ text }],
     }));
     const childCode = node.children[0];
-    const attribs =
+    const className =
-      isTag(childCode) && childCode.tagName === 'code' ? childCode.attribs : undefined;
+      isTag(childCode) && childCode.tagName === 'code' ? childCode.attribs.class ?? '' : '';
-    const languageClass = attribs?.class;
+    const prefix = { text: `${mdSequence}${className.replace('language-', '')}` };
-    const customLabel = attribs?.['data-label'];
-    const prefix = {
-      text: `${mdSequence}${customLabel ?? languageClass?.replace('language-', '') ?? ''}`,
-    };
     const suffix = { text: mdSequence };
     return [
       { type: BlockType.Paragraph, children: [prefix] },
@@ -255,67 +249,10 @@ const parseCodeBlockNode = (node: Element): CodeBlockElement[] | ParagraphElemen
     },
   ];
 };
-
+const parseListNode = (
-const parseListMarkdown = (
   node: Element,
-  processText: ProcessTextCallback,
+  processText: ProcessTextCallback
-  depth = 0
+): OrderedListElement[] | UnorderedListElement[] | ParagraphElement[] => {
-): ParagraphElement[] => {
-  const md = isTag(node) && node.name === 'ul' ? '*' : '-';
-  const prefix = node.attribs['data-md'] ?? md;
-  const [starOrHyphen] = prefix.match(/^\*|-$/) ?? [];
-  const [digitOrChar] = prefix.match(/^[\da-zA-Z]/) ?? [];
-
-  const digit = digitOrChar ? parseInt(digitOrChar, 10) : undefined;
-
-  const lines: ParagraphElement[] = [];
-  let lineNo = digit === undefined || Number.isNaN(digit) ? digitOrChar ?? 1 : digit;
-  const pushLine = (line: InlineElement[]) => {
-    lines.push({
-      type: BlockType.Paragraph,
-      children: [
-        {
-          text: `${Array(depth + 1).join(' ')}${starOrHyphen ? `${starOrHyphen} ` : `${lineNo}. `}`,
-        },
-        ...line,
-      ],
-    });
-    if (typeof lineNo === 'string') {
-      lineNo = String.fromCharCode(lineNo.charCodeAt(0) + 1);
-    } else {
-      lineNo += 1;
-    }
-  };
-
-  node.children.forEach((child) => {
-    if (isText(child)) {
-      pushLine([{ text: processText(child.data) }]);
-      return;
-    }
-
-    if (isTag(child)) {
-      if (child.name === 'ul' || child.name === 'ol') {
-        lines.push(...parseListMarkdown(child, processText, depth + 1));
-        return;
-      }
-      if (child.name === 'li') {
-        child.children.forEach((c) => {
-          if (isTag(c) && (c.name === 'ul' || c.name === 'ol')) {
-            lines.push(...parseListMarkdown(c, processText, depth + 1));
-            return;
-          }
-          pushLine(getInlineElement(c, processText));
-        });
-        return;
-      }
-    }
-
-    pushLine(getInlineElement(child, processText));
-  });
-
-  return lines;
-};
-const parseListLines = (children: ChildNode[], processText: ProcessTextCallback) => {
   const listLines: Array<InlineElement[]> = [];
   let lineHolder: InlineElement[] = [];
 
@@ -326,7 +263,7 @@ const parseListLines = (children: ChildNode[], processText: ProcessTextCallback)
     lineHolder = [];
   };
 
-  children.forEach((child) => {
+  node.children.forEach((child) => {
     if (isText(child)) {
       lineHolder.push({ text: processText(child.data) });
       return;
@@ -340,7 +277,7 @@ const parseListLines = (children: ChildNode[], processText: ProcessTextCallback)
 
       if (child.name === 'li') {
         appendLine();
-        listLines.push(getInlineElement(child, processText));
+        listLines.push(child.children.flatMap((c) => getInlineElement(c, processText)));
         return;
       }
 
@@ -349,23 +286,24 @@ const parseListLines = (children: ChildNode[], processText: ProcessTextCallback)
   });
   appendLine();
 
-  return listLines;
+  const mdSequence = node.attribs['data-md'];
-};
+  if (mdSequence !== undefined) {
-const parseListNode = (
+    const prefix = mdSequence || '-';
-  node: Element,
+    const [starOrHyphen] = prefix.match(/^\*|-$/) ?? [];
-  processText: ProcessTextCallback
+    return listLines.map((lineChildren) => ({
-): OrderedListElement[] | UnorderedListElement[] | ParagraphElement[] => {
+      type: BlockType.Paragraph,
-  if (node.attribs['data-md'] !== undefined) {
+      children: [
-    return parseListMarkdown(node, processText);
+        { text: `${starOrHyphen ? `${starOrHyphen} ` : `${prefix}. `} ` },
+        ...lineChildren,
+      ],
+    }));
   }
 
-  const lines = parseListLines(node.childNodes, processText);
-
   if (node.name === 'ol') {
     return [
       {
         type: BlockType.OrderedList,
-        children: lines.map((lineChildren) => ({
+        children: listLines.map((lineChildren) => ({
           type: BlockType.ListItem,
           children: lineChildren,
         })),
@@ -376,7 +314,7 @@ const parseListNode = (
   return [
     {
       type: BlockType.UnorderedList,
-      children: lines.map((lineChildren) => ({
+      children: listLines.map((lineChildren) => ({
         type: BlockType.ListItem,
         children: lineChildren,
       })),
@@ -387,7 +325,7 @@ const parseHeadingNode = (
   node: Element,
   processText: ProcessTextCallback
 ): HeadingElement | ParagraphElement => {
-  const children = getInlineElement(node, processText);
+  const children = node.children.flatMap((child) => getInlineElement(child, processText));
 
   const headingMatch = node.name.match(/^h([123456])$/);
   const [, g1AsLevel] = headingMatch ?? ['h3', '3'];
@@ -450,7 +388,7 @@ export const domToEditorInput = (
         appendLine();
         children.push({
           type: BlockType.Paragraph,
-          children: getInlineElement(node, processText),
+          children: node.children.flatMap((child) => getInlineElement(child, processText)),
         });
         return;
       }

src/app/components/editor/output.ts

@@ -11,7 +11,7 @@ import {
 } from '../../plugins/markdown';
 import { findAndReplace } from '../../utils/findAndReplace';
 import { sanitizeForRegex } from '../../utils/regex';
-import { isUserId } from '../../utils/matrix';
+import { getCanonicalAliasOrRoomId, isUserId } from '../../utils/matrix';
 
 export type OutputOptions = {
   allowTextFormatting?: boolean;
@@ -212,10 +212,9 @@ export const getMentions = (mx: MatrixClient, roomId: string, editor: Editor): M
     if (node.type === BlockType.CodeBlock) return;
 
     if (node.type === BlockType.Mention) {
-      if (node.name === '@room') {
+      if (node.id === getCanonicalAliasOrRoomId(mx, roomId)) {
         mentionData.room = true;
       }
-
       if (isUserId(node.id) && node.id !== mx.getUserId()) {
         mentionData.users.add(node.id);
       }

src/app/components/emoji-board/EmojiBoard.tsx

@@ -52,8 +52,6 @@ import {
 } from './components';
 import { EmojiBoardTab, EmojiType } from './types';
 import { VirtualTile } from '../virtualizer';
-import { useSetting } from '../../state/hooks/settings';
-import { settingsAtom } from '../../state/settings';
 
 const RECENT_GROUP_ID = 'recent_group';
 const SEARCH_GROUP_ID = 'search_group';
@@ -204,7 +202,8 @@ function EmojiSidebar({ activeGroupAtom, packs, onScrollToGroup }: EmojiSidebarP
             if (!label) label = isUserId(pack.id) ? 'Personal Pack' : mx.getRoom(pack.id)?.name;
 
             const url =
-              mxcUrlToHttp(mx, pack.getAvatarUrl(usage) ?? '', useAuthentication) ?? undefined;
+              mxcUrlToHttp(mx, pack.getAvatarUrl(usage) ?? '', useAuthentication) ||
+              pack.meta.avatar;
 
             return (
               <ImageGroupIcon
@@ -267,7 +266,7 @@ function StickerSidebar({ activeGroupAtom, packs, onScrollToGroup }: StickerSide
           if (!label) label = isUserId(pack.id) ? 'Personal Pack' : mx.getRoom(pack.id)?.name;
 
           const url =
-            mxcUrlToHttp(mx, pack.getAvatarUrl(usage) ?? '', useAuthentication) ?? undefined;
+            mxcUrlToHttp(mx, pack.getAvatarUrl(usage) ?? '', useAuthentication) || pack.meta.avatar;
 
           return (
             <ImageGroupIcon
@@ -505,7 +504,6 @@ export function EmojiBoard({
       }}
     >
       <EmojiBoardLayout
-        data-emoji-board=""
         header={
           <Box direction="Column" gap="200">
             {onTabChange && <EmojiBoardTabs tab={tab} onTabChange={onTabChange} />}

src/app/components/emoji-board/components/Item.tsx

@@ -68,7 +68,7 @@ export function CustomEmojiItem({ mx, useAuthentication, image }: CustomEmojiIte
         loading="lazy"
         className={css.CustomEmojiImg}
         alt={image.body || image.shortcode}
-        src={mxcUrlToHttp(mx, image.url, useAuthentication) ?? ''}
+        src={mxcUrlToHttp(mx, image.url, useAuthentication) ?? image.url}
       />
     </Box>
   );
@@ -98,7 +98,7 @@ export function StickerItem({ mx, useAuthentication, image }: StickerItemProps)
         loading="lazy"
         className={css.StickerImg}
         alt={image.body || image.shortcode}
-        src={mxcUrlToHttp(mx, image.url, useAuthentication) ?? ''}
+        src={mxcUrlToHttp(mx, image.url, useAuthentication) ?? image.url}
       />
     </Box>
   );

src/app/components/emoji-board/components/Sidebar.tsx

@@ -61,7 +61,7 @@ function SidebarBtn<T extends string>({
       delay={500}
       position="Left"
       tooltip={
-        <Tooltip>
+        <Tooltip id={`SidebarStackItem-${id}-label`}>
           <Text size="T300">{label}</Text>
         </Tooltip>
       }
@@ -69,7 +69,7 @@ function SidebarBtn<T extends string>({
       {(ref) => (
         <IconButton
           aria-pressed={active}
-          aria-label={label}
+          aria-labelledby={`SidebarStackItem-${id}-label`}
           ref={ref}
           onClick={() => onClick(id)}
           size="400"

src/app/components/event-readers/EventReaders.tsx

@@ -16,7 +16,7 @@ import {
 import { Room } from 'matrix-js-sdk';
 import { useRoomEventReaders } from '../../hooks/useRoomEventReaders';
 import { getMemberDisplayName } from '../../utils/room';
-import { getMxIdLocalPart, mxcUrlToHttp } from '../../utils/matrix';
+import { getMxIdLocalPart } from '../../utils/matrix';
 import * as css from './EventReaders.css';
 import { useMatrixClient } from '../../hooks/useMatrixClient';
 import { UserAvatar } from '../user-avatar';
@@ -24,19 +24,6 @@ import { useMediaAuthentication } from '../../hooks/useMediaAuthentication';
 import { useOpenUserRoomProfile } from '../../state/hooks/userRoomProfile';
 import { useSpaceOptionally } from '../../hooks/useSpace';
 import { getMouseEventCords } from '../../utils/dom';
-import { useSetting } from '../../state/hooks/settings';
-import { settingsAtom } from '../../state/settings';
-import { today, yesterday, timeHourMinute, timeMon, timeDay, timeYear } from '../../utils/time';
-
-function formatReadTs(ts: number, hour24Clock: boolean): string {
-  const timeStr = timeHourMinute(ts, hour24Clock);
-  if (today(ts)) return `Today at ${timeStr}`;
-  if (yesterday(ts)) return `Yesterday at ${timeStr}`;
-  const sameYear = timeYear(ts) === timeYear(Date.now());
-  return sameYear
-    ? `${timeMon(ts)} ${timeDay(ts)} at ${timeStr}`
-    : `${timeMon(ts)} ${timeDay(ts)} ${timeYear(ts)} at ${timeStr}`;
-}
 
 export type EventReadersProps = {
   room: Room;
@@ -47,12 +34,9 @@ export const EventReaders = as<'div', EventReadersProps>(
   ({ className, room, eventId, requestClose, ...props }, ref) => {
     const mx = useMatrixClient();
     const useAuthentication = useMediaAuthentication();
-    const myUserId = mx.getUserId();
+    const latestEventReaders = useRoomEventReaders(room, eventId);
-    const latestEventReaders = useRoomEventReaders(room, eventId).filter((id) => id !== myUserId);
     const openProfile = useOpenUserRoomProfile();
     const space = useSpaceOptionally();
-    const [hour24Clock] = useSetting(settingsAtom, 'hour24Clock');
-    const [lotusTerminal] = useSetting(settingsAtom, 'lotusTerminal');
 
     const getName = (userId: string) =>
       getMemberDisplayName(room, userId) ?? getMxIdLocalPart(userId) ?? userId;
@@ -64,16 +48,11 @@ export const EventReaders = as<'div', EventReadersProps>(
         {...props}
         ref={ref}
       >
-        <Header
+        <Header className={css.Header} variant="Surface" size="600">
-          className={css.Header}
-          variant="Surface"
-          size="600"
-          style={lotusTerminal ? { borderBottom: '1px solid rgba(0,212,255,0.30)', boxShadow: '0 2px 12px rgba(0,212,255,0.08)' } : undefined}
-        >
           <Box grow="Yes">
-            <Text size="H3" style={lotusTerminal ? { color: '#00D4FF', textShadow: '0 0 6px rgba(0,212,255,0.45)', letterSpacing: '0.05em' } : undefined}>Seen by</Text>
+            <Text size="H3">Seen by</Text>
           </Box>
-          <IconButton size="300" onClick={requestClose} aria-label="Close">
+          <IconButton size="300" onClick={requestClose}>
             <Icon src={Icons.Cross} />
           </IconButton>
         </Header>
@@ -84,9 +63,16 @@ export const EventReaders = as<'div', EventReadersProps>(
                 const name = getName(readerId);
                 const avatarMxcUrl = room.getMember(readerId)?.getMxcAvatarUrl();
                 const avatarUrl = avatarMxcUrl
-                  ? mxcUrlToHttp(mx, avatarMxcUrl, useAuthentication, 100, 100, 'crop') ?? undefined
+                  ? mx.mxcUrlToHttp(
+                      avatarMxcUrl,
+                      100,
+                      100,
+                      'crop',
+                      undefined,
+                      false,
+                      useAuthentication
+                    )
                   : undefined;
-                const receiptTs = room.getReadReceiptForUserId(readerId)?.data.ts;
 
                 return (
                   <MenuItem
@@ -106,28 +92,16 @@ export const EventReaders = as<'div', EventReadersProps>(
                       <Avatar size="200">
                         <UserAvatar
                           userId={readerId}
-                          src={avatarUrl}
+                          src={avatarUrl ?? undefined}
                           alt={name}
                           renderFallback={() => <Icon size="50" src={Icons.User} filled />}
                         />
                       </Avatar>
                     }
                   >
-                    <Box direction="Column" grow="Yes">
+                    <Text size="T400" truncate>
-                      <Text size="T400" truncate>
+                      {name}
-                        {name}
+                    </Text>
-                      </Text>
-                      {receiptTs !== undefined && (
-                        <Text
-                          size="T200"
-                          style={lotusTerminal
-                            ? { color: '#FFB300', textShadow: '0 0 6px #FFB300, 0 0 14px rgba(255,179,0,0.40)', fontSize: '0.72rem' }
-                            : { opacity: 0.6 }}
-                        >
-                          {formatReadTs(receiptTs, hour24Clock)}
-                        </Text>
-                      )}
-                    </Box>
                   </MenuItem>
                 );
               })}

src/app/components/image-editor/ImageEditor.tsx

@@ -24,7 +24,7 @@ export const ImageEditor = as<'div', ImageEditorProps>(
       >
         <Header className={css.ImageEditorHeader} size="400">
           <Box grow="Yes" alignItems="Center" gap="200">
-            <IconButton size="300" radii="300" onClick={requestClose} aria-label="Close">
+            <IconButton size="300" radii="300" onClick={requestClose}>
               <Icon size="50" src={Icons.ArrowLeft} />
             </IconButton>
             <Text size="T300" truncate>

src/app/components/image-pack-view/ImagePackView.tsx

@@ -29,7 +29,7 @@ export function ImagePackView({ address, requestClose }: ImagePackViewProps) {
             </Chip>
           </Box>
           <Box shrink="No">
-            <IconButton onClick={requestClose} variant="Surface" aria-label="Close">
+            <IconButton onClick={requestClose} variant="Surface">
               <Icon src={Icons.Cross} />
             </IconButton>
           </Box>

src/app/components/image-viewer/ImageViewer.tsx

@@ -33,7 +33,7 @@ export const ImageViewer = as<'div', ImageViewerProps>(
       >
         <Header className={css.ImageViewerHeader} size="400">
           <Box grow="Yes" alignItems="Center" gap="200">
-            <IconButton size="300" radii="300" onClick={requestClose} aria-label="Close">
+            <IconButton size="300" radii="300" onClick={requestClose}>
               <Icon size="50" src={Icons.ArrowLeft} />
             </IconButton>
             <Text size="T300" truncate>

src/app/components/invite-user-prompt/InviteUserPrompt.tsx

@@ -173,7 +173,7 @@ export function InviteUserPrompt({ room, requestClose }: InviteUserProps) {
                   </Text>
                 </Box>
                 <Box shrink="No">
-                  <IconButton size="300" radii="300" onClick={requestClose} aria-label="Close">
+                  <IconButton size="300" radii="300" onClick={requestClose}>
                     <Icon src={Icons.Cross} />
                   </IconButton>
                 </Box>

src/app/components/join-address-prompt/JoinAddressPrompt.tsx

@@ -80,9 +80,9 @@ export function JoinAddressPrompt({ onOpen, onCancel }: JoinAddressProps) {
               size="500"
             >
               <Box grow="Yes">
-                <Text as="h2" size="H4">Join with Address</Text>
+                <Text size="H4">Join with Address</Text>
               </Box>
-              <IconButton size="300" onClick={onCancel} radii="300" aria-label="Cancel">
+              <IconButton size="300" onClick={onCancel} radii="300">
                 <Icon src={Icons.Cross} />
               </IconButton>
             </Header>

src/app/components/leave-room-prompt/LeaveRoomPrompt.tsx

@@ -56,7 +56,7 @@ export function LeaveRoomPrompt({ roomId, onDone, onCancel }: LeaveRoomPromptPro
             escapeDeactivates: stopPropagation,
           }}
         >
-          <Dialog variant="Surface" aria-labelledby="leave-room-dialog-title">
+          <Dialog variant="Surface">
             <Header
               style={{
                 padding: `0 ${config.space.S200} 0 ${config.space.S400}`,
@@ -66,9 +66,9 @@ export function LeaveRoomPrompt({ roomId, onDone, onCancel }: LeaveRoomPromptPro
               size="500"
             >
               <Box grow="Yes">
-                <Text as="h2" size="H4" id="leave-room-dialog-title">Leave Room</Text>
+                <Text size="H4">Leave Room</Text>
               </Box>
-              <IconButton size="300" onClick={onCancel} radii="300" aria-label="Cancel">
+              <IconButton size="300" onClick={onCancel} radii="300">
                 <Icon src={Icons.Cross} />
               </IconButton>
             </Header>

src/app/components/leave-space-prompt/LeaveSpacePrompt.tsx

@@ -66,9 +66,9 @@ export function LeaveSpacePrompt({ roomId, onDone, onCancel }: LeaveSpacePromptP
               size="500"
             >
               <Box grow="Yes">
-                <Text as="h2" size="H4">Leave Space</Text>
+                <Text size="H4">Leave Space</Text>
               </Box>
-              <IconButton size="300" onClick={onCancel} radii="300" aria-label="Cancel">
+              <IconButton size="300" onClick={onCancel} radii="300">
                 <Icon src={Icons.Cross} />
               </IconButton>
             </Header>