Bump pomade

Co-authored-by: userAdityaa <aditya.chaudhary1558@gmail.com>
Co-committed-by: userAdityaa <aditya.chaudhary1558@gmail.com>

.dockerignore

@@ -4,7 +4,6 @@ ios
 build
 
 # Git
-.git
 .gitignore
 
 # Env files (keep .env for build; exclude local overrides)

.gitea/workflows/container-publish.yml

@@ -1,12 +1,17 @@
-name: Docker
+name: Container Image Build and Publish
 
 on:
   push:
     branches: [master]
+  workflow_dispatch:
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
 
 env:
-  REGISTRY: ghcr.io
+  REGISTRY: gitea.coracle.social
-  IMAGE_NAME: coracle-social/flotilla
+  IMAGE_NAME: coracle/flotilla
 
 jobs:
   build-and-push-image:
@@ -23,8 +28,8 @@ jobs:
         uses: docker/login-action@v3
         with:
           registry: ${{ env.REGISTRY }}
-          username: ${{ secrets.REGISTRY_USERNAME }}
+          username: hodlbod
-          password: ${{ secrets.REGISTRY_PASSWORD }}
+          password: ${{ secrets.PACKAGE_TOKEN }}
 
       - name: Extract metadata (tags, labels) for Docker
         id: meta
@@ -32,6 +37,7 @@ jobs:
         with:
           images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
           tags: |
+            type=sha
             type=raw,value=latest,enable=${{ github.ref == 'refs/heads/master' }}
 
       - name: Set up Docker Buildx
@@ -45,6 +51,7 @@ jobs:
         with:
           context: .
           push: true
+          target: production
           platforms: linux/amd64,linux/arm64
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}

.gitignore

@@ -27,13 +27,10 @@ android/app/src/main/assets/public/
 node_modules/
 .pnpm-store/
 build/
+build-server/
 .svelte-kit/
 .next/
 
-# Rust/Tauri
-*target/
-src-tauri/binaries/
-
 # iOS
 ios/App/App/public
 ios/DerivedData

CHANGELOG.md

@@ -1,5 +1,31 @@
 # Changelog
 
+# 1.8.0
+
+* Fix relay badge overflow
+* Suppress programmatic scroll when user is scrolling
+* Fix vertical alignment of emoji and overflow buttons in shared event action row
+* Use type=email for signup/login email inputs, validate password
+* Improve toggle switch placement on settings screens
+* Fix relay auth privacy toggle
+* Improve field layout
+* Add progress bar to signup flow
+* Bundle emojis properly
+* Rework hosting page
+* Fix padding on pages on small screens
+* Add richer link preview support
+* Fix pasting into event summary
+* Publish fewer join/claim requests
+* Fix new messages not rendering in safari
+* Avoid capturing stale cleanup function in chat
+* Hide keyboard on app resume
+* Add email rendering support
+* Fix bunker login
+* Fix undefined chat draft key
+* Allow sharing to chat without a message
+* Make sure to show date on calendar events when embedded
+* Improve space search
+
 # 1.7.4
 
 * Fix safe area inset for FAB

Dockerfile

@@ -1,32 +1,31 @@
-# Stage 1: Build
+# Build and run the Flotilla web server.
-# Uses .env from build context for config (logo, branding, etc.)
+#
-# Optional: docker build --build-arg VITE_BUILD_HASH=$(git rev-parse --short HEAD) -t flotilla .
+#   docker build -t flotilla .
+#   docker run -p 3000:3000 flotilla
+#
+# Pass --build-arg VITE_BUILD_HASH=$(git rev-parse --short HEAD) to stamp the build.
+# A .env in the build context is picked up by build.sh for branding config.
 
-FROM node:20-bookworm AS builder
+# https://pnpm.io/docker#example-3-build-on-cicd
-
+FROM node:24-slim AS builder
-RUN apt-get update && apt-get install -y --no-install-recommends curl
+ENV PNPM_HOME="/pnpm"
-
+ENV PATH="$PNPM_HOME:$PATH"
-RUN npm install -g pnpm@latest
+RUN corepack enable
 
 WORKDIR /app
-
-COPY package.json pnpm-lock.yaml ./
-RUN pnpm i
-
-# Copy everything (including .env when present) - build.sh will source it
-COPY . .
-
-ARG VITE_BUILD_HASH
-ENV VITE_BUILD_HASH=${VITE_BUILD_HASH}
-
 ENV NODE_OPTIONS=--max_old_space_size=16384
+COPY package.json pnpm-lock.yaml ./
+RUN pnpm i --frozen-lockfile
+COPY . .
+ARG VITE_BUILD_HASH
 RUN pnpm run build
+RUN pnpm run build:server
 
-FROM node:20-alpine
+FROM node:24-slim AS production
-
+ENV NODE_ENV=production
 WORKDIR /app
-
+COPY --from=builder /app/build /app/build
-# Copy only the built output - no source, no .env, no dev deps
+COPY --from=builder /app/build-server/server.js /app/server.js
-COPY --from=builder /app/build ./build
+EXPOSE 3000
-
+USER node
-CMD ["npx", "serve", "-s", "build"]
+CMD ["node", "server.js"]

README.md

@@ -31,18 +31,18 @@ To run your own Flotilla, it's as simple as:
 ```sh
 pnpm install
 pnpm run build
-npx serve -s build
+pnpm run start
 ```
 
 Or, if you prefer to use a container:
 
 ```sh
-podman run -d -p 3000:3000 ghcr.io/coracle-social/flotilla:latest
+docker run -d -p 3000:3000 gitea.coracle.social/coracle/flotilla:latest
 ```
 
 Alternatively, you can copy the build files into a directory of your choice and serve it yourself:
 
 ```sh
 mkdir ./mount
-podman run -v ./mount:/app/mount ghcr.io/coracle-social/flotilla:latest bash -c 'cp -r build/* mount'
+docker run -v ./mount:/app/mount gitea.coracle.social/coracle/flotilla:latest bash -c 'cp -r build/* mount'
 ```

android/app/build.gradle

@@ -8,8 +8,8 @@ android {
         applicationId "social.flotilla"
         minSdk rootProject.ext.minSdkVersion
         targetSdk rootProject.ext.targetSdkVersion
-        versionCode 46
+        versionCode 47
-        versionName "1.7.4"
+        versionName "1.8.0"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.

android/capacitor.settings.gradle

@@ -36,4 +36,4 @@ include ':capawesome-capacitor-badge'
 project(':capawesome-capacitor-badge').projectDir = new File('../node_modules/.pnpm/@capawesome+capacitor-badge@8.0.0_@capacitor+core@8.0.1/node_modules/@capawesome/capacitor-badge/android')
 
 include ':nostr-signer-capacitor-plugin'
-project(':nostr-signer-capacitor-plugin').projectDir = new File('../node_modules/.pnpm/nostr-signer-capacitor-plugin@https+++codeload.github.com+coracle-social+nostr-signer-c_2704ecccfd05fcfb1ad8852744422b7c/node_modules/nostr-signer-capacitor-plugin/android')
+project(':nostr-signer-capacitor-plugin').projectDir = new File('../node_modules/.pnpm/nostr-signer-capacitor-plugin@https+++codeload.github.com+coracle-social+nostr-signer-c_a3c0fb15d5bfa83f24d0070ca2583fc9/node_modules/nostr-signer-capacitor-plugin/android')

ios/App/App.xcodeproj/project.pbxproj

@@ -3,7 +3,7 @@
 	archiveVersion = 1;
 	classes = {
 	};
-	objectVersion = 48;
+	objectVersion = 54;
 	objects = {
 
 /* Begin PBXBuildFile section */
@@ -131,8 +131,9 @@
 		504EC2FC1FED79650016851F /* Project object */ = {
 			isa = PBXProject;
 			attributes = {
+				BuildIndependentTargetsInParallel = YES;
 				LastSwiftUpdateCheck = 920;
-				LastUpgradeCheck = 920;
+				LastUpgradeCheck = 2630;
 				TargetAttributes = {
 					504EC3031FED79650016851F = {
 						CreatedOnToolsVersion = 9.2;
@@ -257,6 +258,7 @@
 				CLANG_WARN_BOOL_CONVERSION = YES;
 				CLANG_WARN_COMMA = YES;
 				CLANG_WARN_CONSTANT_CONVERSION = YES;
+				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
 				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
 				CLANG_WARN_DOCUMENTATION_COMMENTS = YES;
 				CLANG_WARN_EMPTY_BODY = YES;
@@ -264,8 +266,10 @@
 				CLANG_WARN_INFINITE_RECURSION = YES;
 				CLANG_WARN_INT_CONVERSION = YES;
 				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
+				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
 				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
 				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
+				CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
 				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
 				CLANG_WARN_STRICT_PROTOTYPES = YES;
 				CLANG_WARN_SUSPICIOUS_MOVE = YES;
@@ -275,8 +279,10 @@
 				CODE_SIGN_IDENTITY = "iPhone Developer";
 				COPY_PHASE_STRIP = NO;
 				DEBUG_INFORMATION_FORMAT = dwarf;
+				DEVELOPMENT_TEAM = S26U9DYW3A;
 				ENABLE_STRICT_OBJC_MSGSEND = YES;
 				ENABLE_TESTABILITY = YES;
+				ENABLE_USER_SCRIPT_SANDBOXING = NO;
 				GCC_C_LANGUAGE_STANDARD = gnu11;
 				GCC_DYNAMIC_NO_PIC = NO;
 				GCC_NO_COMMON_BLOCKS = YES;
@@ -295,6 +301,7 @@
 				MTL_ENABLE_DEBUG_INFO = YES;
 				ONLY_ACTIVE_ARCH = YES;
 				SDKROOT = iphoneos;
+				STRING_CATALOG_GENERATE_SYMBOLS = YES;
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
 				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
 			};
@@ -314,6 +321,7 @@
 				CLANG_WARN_BOOL_CONVERSION = YES;
 				CLANG_WARN_COMMA = YES;
 				CLANG_WARN_CONSTANT_CONVERSION = YES;
+				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
 				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
 				CLANG_WARN_DOCUMENTATION_COMMENTS = YES;
 				CLANG_WARN_EMPTY_BODY = YES;
@@ -321,8 +329,10 @@
 				CLANG_WARN_INFINITE_RECURSION = YES;
 				CLANG_WARN_INT_CONVERSION = YES;
 				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
+				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
 				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
 				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
+				CLANG_WARN_QUOTED_INCLUDE_IN_FRAMEWORK_HEADER = YES;
 				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
 				CLANG_WARN_STRICT_PROTOTYPES = YES;
 				CLANG_WARN_SUSPICIOUS_MOVE = YES;
@@ -332,8 +342,10 @@
 				CODE_SIGN_IDENTITY = "iPhone Developer";
 				COPY_PHASE_STRIP = NO;
 				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
+				DEVELOPMENT_TEAM = S26U9DYW3A;
 				ENABLE_NS_ASSERTIONS = NO;
 				ENABLE_STRICT_OBJC_MSGSEND = YES;
+				ENABLE_USER_SCRIPT_SANDBOXING = NO;
 				GCC_C_LANGUAGE_STANDARD = gnu11;
 				GCC_NO_COMMON_BLOCKS = YES;
 				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
@@ -345,7 +357,9 @@
 				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
 				MTL_ENABLE_DEBUG_INFO = NO;
 				SDKROOT = iphoneos;
-				SWIFT_OPTIMIZATION_LEVEL = "-Owholemodule";
+				STRING_CATALOG_GENERATE_SYMBOLS = YES;
+				SWIFT_COMPILATION_MODE = wholemodule;
+				SWIFT_OPTIMIZATION_LEVEL = "-O";
 				VALIDATE_PRODUCT = YES;
 			};
 			name = Release;
@@ -358,14 +372,16 @@
 				CODE_SIGN_ENTITLEMENTS = "Flotilla Chat.entitlements";
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 37;
+				CURRENT_PROJECT_VERSION = 38;
-				DEVELOPMENT_TEAM = S26U9DYW3A;
 				INFOPLIST_FILE = App/Info.plist;
 				INFOPLIST_KEY_CFBundleDisplayName = "Flotilla Chat";
 				INFOPLIST_KEY_LSApplicationCategoryType = "public.app-category.social-networking";
 				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				LD_RUNPATH_SEARCH_PATHS = (
-				MARKETING_VERSION = 1.7.4;
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
+				MARKETING_VERSION = 1.8.0;
 				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
 				PRODUCT_BUNDLE_IDENTIFIER = social.flotilla;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -385,14 +401,16 @@
 				CODE_SIGN_ENTITLEMENTS = "Flotilla Chat.entitlements";
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 37;
+				CURRENT_PROJECT_VERSION = 38;
-				DEVELOPMENT_TEAM = S26U9DYW3A;
 				INFOPLIST_FILE = App/Info.plist;
 				INFOPLIST_KEY_CFBundleDisplayName = "Flotilla Chat";
 				INFOPLIST_KEY_LSApplicationCategoryType = "public.app-category.social-networking";
 				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
-				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				LD_RUNPATH_SEARCH_PATHS = (
-				MARKETING_VERSION = 1.7.4;
+					"$(inherited)",
+					"@executable_path/Frameworks",
+				);
+				MARKETING_VERSION = 1.8.0;
 				PRODUCT_BUNDLE_IDENTIFIER = social.flotilla;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";

ios/App/Podfile

@@ -21,7 +21,7 @@ def capacitor_pods
   pod 'CapacitorPushNotifications', :path => '../../node_modules/.pnpm/@capacitor+push-notifications@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/push-notifications'
   pod 'CapacitorShare', :path => '../../node_modules/.pnpm/@capacitor+share@8.0.1_@capacitor+core@8.0.1/node_modules/@capacitor/share'
   pod 'CapawesomeCapacitorBadge', :path => '../../node_modules/.pnpm/@capawesome+capacitor-badge@8.0.0_@capacitor+core@8.0.1/node_modules/@capawesome/capacitor-badge'
-  pod 'NostrSignerCapacitorPlugin', :path => '../../node_modules/.pnpm/nostr-signer-capacitor-plugin@https+++codeload.github.com+coracle-social+nostr-signer-c_2704ecccfd05fcfb1ad8852744422b7c/node_modules/nostr-signer-capacitor-plugin'
+  pod 'NostrSignerCapacitorPlugin', :path => '../../node_modules/.pnpm/nostr-signer-capacitor-plugin@https+++codeload.github.com+coracle-social+nostr-signer-c_a3c0fb15d5bfa83f24d0070ca2583fc9/node_modules/nostr-signer-capacitor-plugin'
 end
 
 target 'Flotilla Chat' do

package.json

@@ -1,15 +1,13 @@
 {
   "name": "flotilla",
-  "version": "1.7.4",
+  "version": "1.8.0",
   "private": true,
   "scripts": {
     "dev": "vite dev",
     "build": "./build.sh",
+    "build:server": "vite build --config vite.config.server.ts",
+    "start": "node server.js",
     "release:android": "./build.sh && cap build android --androidreleasetype APK --signing-type apksigner",
-    "tauri:dev": "tauri dev",
-    "tauri:build": "tauri build",
-    "tauri:info": "tauri info",
-    "tauri:icons": "tauri icon assets/logo.png --output src-tauri/icons",
     "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
     "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
     "lint": "prettier --check src && eslint src",
@@ -20,26 +18,26 @@
   "devDependencies": {
     "@capacitor/assets": "^3.0.5",
     "@eslint/js": "^9.39.2",
-    "@sveltejs/kit": "^2.50.1",
+    "@sveltejs/kit": "^2.61.1",
-    "@sveltejs/vite-plugin-svelte": "^4.0.4",
+    "@sveltejs/vite-plugin-svelte": "^5.1.1",
     "@tailwindcss/postcss": "^4.2.2",
-    "@tauri-apps/cli": "^2.9.6",
     "@types/eslint": "^9.6.1",
+    "@types/node": "^25.9.1",
     "autoprefixer": "^10.4.23",
     "classnames": "^2.5.1",
     "eslint": "^9.39.2",
     "eslint-config-prettier": "^9.1.2",
     "eslint-plugin-svelte": "^2.46.1",
     "globals": "^15.15.0",
-    "postcss": "^8.5.6",
+    "postcss": "^8.5.15",
     "prettier": "^3.8.1",
     "prettier-plugin-svelte": "^3.4.1",
-    "svelte": "^5.48.0",
+    "svelte": "^5.55.9",
     "svelte-check": "^4.3.5",
     "tailwindcss": "^4.2.2",
     "typescript": "^5.9.3",
     "typescript-eslint": "^8.53.1",
-    "vite": "^5.4.21"
+    "vite": "^6.4.2"
   },
   "type": "module",
   "dependencies": {
@@ -60,26 +58,28 @@
     "@capawesome/capacitor-badge": "^8.0.0",
     "@getalby/lightning-tools": "^6.1.0",
     "@getalby/sdk": "^5.1.2",
+    "@hono/node-server": "^2.0.0",
     "@noble/curves": "^1.9.7",
-    "@pomade/core": "^0.2.3",
+    "@pomade/core": "^0.2.5",
-    "@poppanator/sveltekit-svg": "^4.2.1",
+    "@poppanator/sveltekit-svg": "^7.0.0",
     "@sveltejs/adapter-static": "^3.0.10",
     "@tiptap/core": "^2.27.2",
     "@tiptap/pm": "^2.27.2",
     "@types/qrcode": "^1.5.6",
     "@types/throttle-debounce": "^5.0.2",
-    "@vite-pwa/assets-generator": "^0.2.6",
+    "@vite-pwa/assets-generator": "^1.0.2",
-    "@vite-pwa/sveltekit": "^0.6.8",
+    "@vite-pwa/sveltekit": "^1.1.0",
-    "@welshman/app": "^0.8.13",
+    "@welshman/app": "^0.8.16",
-    "@welshman/content": "^0.8.13",
+    "@welshman/content": "^0.8.16",
-    "@welshman/editor": "^0.8.13",
+    "@welshman/editor": "^0.8.16",
-    "@welshman/feeds": "^0.8.13",
+    "@welshman/feeds": "^0.8.16",
-    "@welshman/lib": "^0.8.13",
+    "@welshman/lib": "^0.8.16",
-    "@welshman/net": "^0.8.13",
+    "@welshman/net": "^0.8.16",
-    "@welshman/router": "^0.8.13",
+    "@welshman/router": "^0.8.16",
-    "@welshman/signer": "^0.8.13",
+    "@welshman/signer": "^0.8.16",
-    "@welshman/store": "^0.8.13",
+    "@welshman/store": "^0.8.16",
-    "@welshman/util": "^0.8.13",
+    "@welshman/util": "^0.8.16",
+    "cheerio": "^1.2.0",
     "compressorjs-next": "^1.1.2",
     "daisyui": "^5.5.19",
     "date-picker-svelte": "^2.17.0",
@@ -87,6 +87,7 @@
     "emoji-picker-element": "^1.28.1",
     "emoji-picker-element-data": "^1.8.0",
     "fuse.js": "^7.1.0",
+    "hono": "^4.12.23",
     "husky": "^9.1.7",
     "idb": "^8.0.3",
     "livekit-client": "^2.17.2",
@@ -98,17 +99,5 @@
     "throttle-debounce": "^5.0.2",
     "tippy.js": "^6.3.7"
   },
-  "pnpm": {
+  "packageManager": "pnpm@11.4.0"
-    "ignoredBuiltDependencies": [
-      "esbuild"
-    ],
-    "onlyBuiltDependencies": [
-      "sharp",
-      "nostr-signer-capacitor-plugin"
-    ],
-    "overrides": {
-      "sharp": "0.35.0-rc.0"
-    }
-  },
-  "packageManager": "pnpm@10.33.0+sha512.10568bb4a6afb58c9eb3630da90cc9516417abebd3fabbe6739f0ae795728da1491e9db5a544c76ad8eb7570f5c4bb3d6c637b2cb41bfdcdb47fa823c8649319"
 }

pnpm-workspace.yaml

@@ -0,0 +1,19 @@
+allowBuilds:
+  nostr-signer-capacitor-plugin: true
+  cbor-extract: false
+  esbuild: false
+  sharp: true
+minimumReleaseAgeExclude:
+  - '@pomade/core'
+  - '@welshman/app'
+  - '@welshman/content'
+  - '@welshman/editor'
+  - '@welshman/feeds'
+  - '@welshman/lib'
+  - '@welshman/net'
+  - '@welshman/router'
+  - '@welshman/signer'
+  - '@welshman/store'
+  - '@welshman/util'
+overrides:
+  sharp: 0.35.0-rc.0

rust-toolchain.toml

@@ -1,2 +0,0 @@
-[toolchain]
-channel = "1.92.0"

server.js

@@ -0,0 +1,288 @@
+import path from "node:path"
+import {promises as fs} from "node:fs"
+import {fileURLToPath} from "node:url"
+
+import "dotenv/config"
+import {serve} from "@hono/node-server"
+import {serveStatic} from "@hono/node-server/serve-static"
+import {loadRelay} from "@welshman/app"
+import {displayRelayUrl, normalizeRelayUrl} from "@welshman/util"
+import {load} from "cheerio"
+import {Hono} from "hono"
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+
+const BUILD_DIR = path.join(__dirname, "build")
+const INDEX_PATH = path.join(BUILD_DIR, "index.html")
+
+const PORT = parseInt(process.env.PORT || "", 10) || 3000
+const HOST = process.env.HOST || "0.0.0.0"
+
+let TEMPLATE_HTML = ""
+try {
+  TEMPLATE_HTML = await fs.readFile(INDEX_PATH, "utf8")
+} catch (error) {
+  console.error(`Unable to read ${INDEX_PATH}. Run "pnpm run build" first.`)
+  process.exit(1)
+}
+
+const PLATFORM_NAME = process.env.VITE_PLATFORM_NAME
+const PLATFORM_DESCRIPTION = process.env.VITE_PLATFORM_DESCRIPTION
+
+// Match client-side decode logic
+const decodeRelay = url => {
+  try {
+    return normalizeRelayUrl(decodeURIComponent(url))
+  } catch {
+    return undefined
+  }
+}
+
+const requestUrlFromContext = context => {
+  const requestUrl = new URL(context.req.url)
+  const forwardedProto = context.req.header("x-forwarded-proto")?.split(",")[0]?.trim()
+  const forwardedHost = context.req.header("x-forwarded-host")?.split(",")[0]?.trim()
+
+  if (forwardedProto === "http" || forwardedProto === "https") {
+    requestUrl.protocol = `${forwardedProto}:`
+  }
+
+  if (forwardedHost) {
+    requestUrl.host = forwardedHost
+  }
+
+  return requestUrl
+}
+
+const fetchRelayMeta = async relayUrl => {
+  if (!relayUrl) return undefined
+  try {
+    return await loadRelay(normalizeRelayUrl(relayUrl))
+  } catch (err) {
+    console.error(`Failed to fetch relay metadata for ${relayUrl}:`, err)
+    return undefined
+  }
+}
+
+const buildDefaultImage = requestUrl => {
+  return new URL("/maskable-icon-512x512.png", requestUrl.origin).toString()
+}
+
+const getMetadataForInvite = async (url, match) => {
+  const relayParam = url.searchParams.get("r")
+  if (!relayParam) return undefined
+
+  const relayMetadata = await fetchRelayMeta(relayParam)
+  if (!relayMetadata) return undefined
+
+  const relayDisplay = displayRelayUrl(relayParam)
+  const spaceName = relayMetadata.name
+  const relayDescription = relayMetadata.description
+
+  const title = spaceName
+    ? `Invite to ${spaceName} on ${PLATFORM_NAME}`
+    : `Invite to a Space on ${PLATFORM_NAME}`
+
+  const parts = []
+  if (spaceName) {
+    parts.push(`You are invited to join ${spaceName} on ${PLATFORM_NAME}.`)
+  } else {
+    parts.push(`You are invited to join a space on ${PLATFORM_NAME}.`)
+  }
+
+  if (relayDisplay) parts.push(`Relay: ${relayDisplay}.`)
+  if (relayDescription) parts.push(relayDescription)
+  else parts.push(PLATFORM_DESCRIPTION)
+
+  const description = parts.join(" ")
+  const image =
+    relayMetadata.icon ||
+    relayMetadata.picture ||
+    relayMetadata.image ||
+    buildDefaultImage(url)
+
+  return {
+    title,
+    description,
+    image,
+    url: url.toString(),
+    site: url.origin,
+  }
+}
+
+const getMetadataForSpace = async (url, match) => {
+  const relayParam = decodeRelay(match[1])
+  if (!relayParam) return undefined
+
+  const relayMetadata = await fetchRelayMeta(relayParam)
+  if (!relayMetadata) return undefined
+
+  const spaceName = relayMetadata.name || displayRelayUrl(relayParam)
+
+  return {
+    title: `${spaceName} on ${PLATFORM_NAME}`,
+    description: relayMetadata.description || PLATFORM_DESCRIPTION,
+    image:
+      relayMetadata.icon ||
+      relayMetadata.picture ||
+      relayMetadata.image ||
+      buildDefaultImage(url),
+    url: url.toString(),
+    site: url.origin,
+  }
+}
+
+const getMetadataForSpaceSection = async (url, match) => {
+  const spaceMeta = await getMetadataForSpace(url, match)
+  if (!spaceMeta) return undefined
+
+  const section = match[2]
+  const sectionName = section.charAt(0).toUpperCase() + section.slice(1)
+  spaceMeta.title = `${sectionName} on ${spaceMeta.title}`
+  return spaceMeta
+}
+
+const getMetadataForSpaceItem = async (url, match) => {
+  const spaceMeta = await getMetadataForSpace(url, match)
+  if (!spaceMeta) return undefined
+
+  const section = match[2]
+  let itemType = "Item"
+  if (section === "calendar") itemType = "Event"
+  if (section === "threads") itemType = "Thread"
+  if (section === "polls") itemType = "Poll"
+  if (section === "goals") itemType = "Goal"
+  if (section === "classifieds") itemType = "Listing"
+
+  spaceMeta.title = `${itemType} on ${spaceMeta.title}`
+  return spaceMeta
+}
+
+const getMetadataForRoom = async (url, match) => {
+  const spaceMeta = await getMetadataForSpace(url, match)
+  if (!spaceMeta) return undefined
+
+  // Room metadata requires fetching from Nostr, which can be added later.
+  spaceMeta.title = `Room on ${spaceMeta.title}`
+  return spaceMeta
+}
+
+const routes = [
+  [/^\/join\/?$/, getMetadataForInvite],
+  [/^\/spaces\/([^/]+)\/(calendar|chat|threads|polls|goals|classifieds|recent)\/?$/, getMetadataForSpaceSection],
+  [/^\/spaces\/([^/]+)\/(calendar|threads|polls|goals|classifieds)\/([^/]+)\/?$/, getMetadataForSpaceItem],
+  [/^\/spaces\/([^/]+)\/([^/]+)\/?$/, getMetadataForRoom],
+  [/^\/spaces\/([^/]+)\/?$/, getMetadataForSpace],
+]
+
+const getMetadataForRoute = async url => {
+  for (const [regex, getMetadata] of routes) {
+    const match = url.pathname.match(regex)
+    if (match) {
+      try {
+        return await getMetadata(url, match)
+      } catch (err) {
+        console.error(`Error generating metadata for route ${url.pathname}:`, err)
+        return undefined
+      }
+    }
+  }
+  return undefined
+}
+
+const injectMeta = metadata => {
+  const $ = load(TEMPLATE_HTML)
+
+  if (metadata.title) {
+    $("title").text(metadata.title)
+    $('meta[property="og:title"]').attr("content", metadata.title)
+    $('meta[name="twitter:title"]').attr("content", metadata.title)
+  }
+
+  if (metadata.description) {
+    $('meta[name="description"]').attr("content", metadata.description)
+    $('meta[property="og:description"]').attr("content", metadata.description)
+    $('meta[name="twitter:description"]').attr("content", metadata.description)
+  }
+
+  if (metadata.image) {
+    $('meta[property="og:image"]').attr("content", metadata.image)
+    $('meta[name="twitter:image"]').attr("content", metadata.image)
+  }
+
+  if (metadata.url) {
+    $('meta[property="og:url"]').attr("content", metadata.url)
+    $('meta[name="twitter:site"]').attr("content", metadata.site)
+    $('meta[name="twitter:url"]').attr("content", metadata.url)
+    $('link[rel="canonical"]').attr("href", metadata.url)
+  }
+
+  return $.html()
+}
+
+const app = new Hono()
+
+// Only allow GET and HEAD requests
+app.use("*", async (context, next) => {
+  const method = context.req.method
+  if (method !== "GET" && method !== "HEAD") {
+    return context.text("Method Not Allowed", 405, {Allow: "GET, HEAD"})
+  }
+  await next()
+})
+
+// Serve static assets with appropriate caching
+app.use(
+  "*",
+  serveStatic({
+    root: BUILD_DIR,
+    onFound: (filePath, context) => {
+      const isImmutable = filePath.split(path.sep).join("/").includes("/_app/immutable/")
+      const cacheControl =
+        path.basename(filePath) === "index.html"
+          ? "no-cache"
+          : isImmutable
+            ? "public, max-age=31536000, immutable"
+            : "public, max-age=3600"
+
+      context.header("Cache-Control", cacheControl)
+
+      // Immutable assets are content-hashed by Vite, so the filename is itself a
+      // stable content identifier. Exposing it as an ETag lets clients that
+      // revalidate explicitly (e.g. emoji-picker-element checks its data source
+      // on every load) skip re-downloading large files when nothing changed.
+      if (isImmutable) {
+        context.header("ETag", `"${path.basename(filePath)}"`)
+      }
+    },
+  }),
+)
+
+// SPA fallback for routes that don't match static files
+app.get("*", async context => {
+  const requestUrl = requestUrlFromContext(context)
+
+  // If the path has an extension, it's likely a missing static asset, not an SPA route
+  if (path.extname(requestUrl.pathname)) {
+    return context.text("Not found", 404)
+  }
+
+  const metadata = await getMetadataForRoute(requestUrl)
+  const html = metadata ? injectMeta(metadata) : TEMPLATE_HTML
+
+  return context.html(html, 200, {
+    "Cache-Control": metadata ? "no-store" : "no-cache",
+  })
+})
+
+serve(
+  {
+    fetch: app.fetch,
+    hostname: HOST,
+    port: PORT,
+  },
+  () => {
+    console.log(`Flotilla server running on http://${HOST}:${PORT}`)
+  },
+)

src-tauri/Cargo.toml

@@ -1,18 +0,0 @@
-[package]
-name = "flotilla"
-version = "0.1.0"
-edition = "2021"
-
-[lib]
-name = "flotilla_lib"
-crate-type = ["staticlib", "cdylib", "rlib"]
-
-[build-dependencies]
-tauri-build = { version = "2.5.3", features = [] }
-
-[dependencies]
-tauri = { version = "2.9.5", features = [] }
-
-[features]
-default = ["custom-protocol"]
-custom-protocol = ["tauri/custom-protocol"]

src-tauri/build.rs

@@ -1,3 +0,0 @@
-fn main() {
-    tauri_build::build()
-}

src-tauri/capabilities/default.json

@@ -1,7 +0,0 @@
-{
-  "$schema": "../gen/schemas/desktop-schema.json",
-  "identifier": "default",
-  "description": "Default desktop capability for the main window",
-  "windows": ["main"],
-  "permissions": ["core:default"]
-}

src-tauri/icons/android/mipmap-anydpi-v26/ic_launcher.xml

@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
-  <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
-  <background android:drawable="@color/ic_launcher_background"/>
-</adaptive-icon>

src-tauri/icons/android/values/ic_launcher_background.xml

@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<resources>
-  <color name="ic_launcher_background">#fff</color>
-</resources>

src-tauri/rust-toolchain.toml

@@ -1,2 +0,0 @@
-[toolchain]
-channel = "1.92.0"

src-tauri/src/lib.rs

@@ -1,6 +0,0 @@
-#[cfg_attr(mobile, tauri::mobile_entry_point)]
-pub fn run() {
-    tauri::Builder::default()
-        .run(tauri::generate_context!())
-        .expect("error while running tauri application");
-}

src-tauri/src/main.rs

@@ -1,6 +0,0 @@
-// Prevents additional console window on Windows in release, DO NOT REMOVE!!
-#![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
-
-fn main() {
-    flotilla_lib::run();
-}

src-tauri/tauri.conf.json

@@ -1,37 +0,0 @@
-{
-  "$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
-  "productName": "Flotilla",
-  "mainBinaryName": "flotilla",
-  "identifier": "social.flotilla.app",
-  "build": {
-    "beforeDevCommand": "pnpm dev",
-    "beforeBuildCommand": "pnpm build",
-    "devUrl": "http://localhost:1847",
-    "frontendDist": "../build"
-  },
-  "app": {
-    "security": {
-      "capabilities": ["default"]
-    },
-    "windows": [
-      {
-        "label": "main",
-        "title": "Flotilla",
-        "width": 1240,
-        "height": 775,
-        "resizable": true
-      }
-    ]
-  },
-  "bundle": {
-    "active": false,
-    "targets": "all",
-    "icon": [
-      "icons/32x32.png",
-      "icons/128x128.png",
-      "icons/128x128@2x.png",
-      "icons/icon.icns",
-      "icons/icon.ico"
-    ]
-  }
-}

src/app.css

@@ -235,6 +235,7 @@
 
   :root {
     font-family: Lato;
+    text-size-adjust: 100%;
     --sait: var(--safe-area-inset-top, env(safe-area-inset-top));
     --saib: var(--safe-area-inset-bottom, env(safe-area-inset-bottom));
     --sail: var(--safe-area-inset-left, env(safe-area-inset-left));
@@ -332,7 +333,7 @@
 
 .input-editor .tiptap {
   --tiptap-object-bg: var(--color-base-200);
-  @apply input h-auto p-[.65rem];
+  @apply input block h-auto p-[.65rem];
 }
 
 /* link-content, based on tiptap */
@@ -416,12 +417,24 @@ progress[value]::-webkit-progress-value {
   @apply md:left-[calc(18.5rem+var(--sail))];
 }
 
+.left-content-full {
+  @apply md:left-[calc(3.5rem+var(--sail))];
+}
+
 /* Keyboard open state adjustments */
 
+body.keyboard-open {
+  --saib: 0px;
+}
+
 body.keyboard-open .hide-on-keyboard {
   display: none;
 }
 
+body.keyboard-open .chat__compose {
+  margin-bottom: 0;
+}
+
 /* chat view */
 
 .chat__compose {

src/app.html

@@ -2,15 +2,18 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
+    <title>{NAME}</title>
+    <link rel="canonical" href="{URL}" />
     <meta
       name="viewport"
       content="width=device-width, initial-scale=1.0, viewport-fit=cover, interactive-widget=resizes-content" />
     <meta name="theme-color" content="{ACCENT}" />
     <meta name="description" content="{DESCRIPTION}" />
-    <meta name="og:url" content="{URL}" />
+    <meta property="og:url" content="{URL}" />
-    <meta name="og:type" content="website" />
+    <meta property="og:type" content="website" />
-    <meta name="og:title" content="{NAME}" />
+    <meta property="og:title" content="{NAME}" />
-    <meta name="og:description" content="{DESCRIPTION}" />
+    <meta property="og:description" content="{DESCRIPTION}" />
+    <meta property="og:image" content="" />
     <meta name="twitter:card" content="summary" />
     <meta name="twitter:site" content="{URL}" />
     <meta name="twitter:title" content="{NAME}" />

src/app/call/stores.ts

@@ -6,11 +6,13 @@ export type VoiceSession = {
   url: string
   h: string
   room: LiveKitRoom
-  muted: boolean
   cameraOn: boolean
   screenShareOn: boolean
 }
 
+/** Mic mute state is separate so toggling it does not re-render video tiles. */
+export const voiceMicMuted = writable(true)
+
 export type Pubkey = string
 
 export type VoiceParticipant = {pubkey?: Pubkey; identity: string}
@@ -27,8 +29,6 @@ export const voiceState = writable<VoiceState>(VoiceState.Disconnected)
 
 export const currentVoiceRoom = writable<Room | undefined>(undefined)
 
-export const participantPubkeyMap = writable<Map<string, Pubkey>>(new Map())
-
 export const pubkeyFromLiveKitIdentity = (identity: string): string | undefined =>
   /^[a-f0-9]{64}$/.test(identity.slice(0, 64)) ? identity.slice(0, 64) : undefined
 
@@ -41,6 +41,21 @@ export const participantKey = (p: VoiceParticipant) => p.pubkey ?? p.identity
 
 export const speakingParticipants = writable<VoiceParticipant[]>([])
 
+export const participantMediaState = writable(
+  new Map<string, {muted: boolean; cameraOn: boolean}>(),
+)
+
+export const mediaStateByIdentity = derived(
+  [participantMediaState, currentVoiceSession, voiceMicMuted],
+  ([$media, $session, $micMuted]) =>
+    (identity: string) => {
+      if ($session?.room.localParticipant.identity === identity) {
+        return {muted: $micMuted, cameraOn: $session.cameraOn}
+      }
+      return $media.get(identity) ?? {muted: true, cameraOn: false}
+    },
+)
+
 export const isParticipantSpeaking = derived(
   speakingParticipants,
   $participants => (p: VoiceParticipant) =>

src/app/call/voice.ts

@@ -6,26 +6,28 @@ import {
   DisconnectReason,
   LocalParticipant,
   LocalTrackPublication,
+  Participant,
   Room as LiveKitRoom,
   RoomEvent,
   Track,
+  TrackPublication,
   supportsAudioOutputSelection,
   type AudioCaptureOptions,
 } from "livekit-client"
 import {derived, get} from "svelte/store"
-import {map, removeUndefined, uniqBy} from "@welshman/lib"
+import {map, not, nthEq, reject, removeUndefined, uniqBy} from "@welshman/lib"
 import type {TrustedEvent} from "@welshman/util"
 import {makeHttpAuth, makeHttpAuthHeader, getTags} from "@welshman/util"
 import {signer} from "@welshman/app"
 import {getLivekitEndpoint} from "$lib/livekit"
-import {AbortError, whenAborted, whenTimeout} from "$lib/util"
+import {AbortError, TimeoutError, whenAborted, whenTimeout} from "$lib/util"
 import {
   currentVoiceRoom,
   currentVoiceSession,
+  voiceMicMuted,
   participantFromLiveKitIdentity,
   participantKey,
-  participantPubkeyMap,
+  participantMediaState,
-  pubkeyFromLiveKitIdentity,
   speakingParticipants,
   VoiceState,
   type VoiceParticipant,
@@ -75,20 +77,23 @@ export const switchVoiceActiveDevice = async (
   }
 }
 
-const addParticipant = (identity: string) => {
+const deleteParticipant = (identity: string) => {
-  participantPubkeyMap.update(m => {
+  participantMediaState.update(m => new Map(reject(nthEq(0, identity), [...m])))
+}
+
+const syncParticipantMedia = (participant: Participant) => {
+  const state = {muted: !participant.isMicrophoneEnabled, cameraOn: participant.isCameraEnabled}
+  participantMediaState.update(m => {
+    const prev = m.get(participant.identity)
+    if (prev?.muted === state.muted && prev?.cameraOn === state.cameraOn) return m
     const next = new Map(m)
-    next.set(identity, pubkeyFromLiveKitIdentity(identity) ?? "")
+    next.set(participant.identity, state)
     return next
   })
 }
 
-const deleteParticipant = (identity: string) => {
+const onParticipantMediaChanged = (_publication: TrackPublication, participant: Participant) => {
-  participantPubkeyMap.update(m => {
+  syncParticipantMedia(participant)
-    const next = new Map(m)
-    next.delete(identity)
-    return next
-  })
 }
 
 const fetchLivekitToken = async (
@@ -124,15 +129,15 @@ export const deriveVoiceParticipants = (url: string, h: string) =>
   // We use the livekit identity list while in a call, and fall back to the list in kind 39004.
   derived(
     [
-      participantPubkeyMap,
+      participantMediaState,
       currentVoiceRoom,
       deriveLatestEventForUrl(url, [{kinds: [LIVEKIT_PARTICIPANTS], "#d": [h]}]),
     ],
-    ([$participantPubkeyMap, $currentVoiceRoom, $publishedParticipantList]) => {
+    ([$participantMediaState, $currentVoiceRoom, $publishedParticipantList]) => {
-      const inCall = $participantPubkeyMap.size > 0 && $currentVoiceRoom?.id === makeRoomId(url, h)
+      const inCall = $participantMediaState.size > 0 && $currentVoiceRoom?.id === makeRoomId(url, h)
 
       if (inCall) {
-        const participants = [...$participantPubkeyMap.keys()].map(participantFromLiveKitIdentity)
+        const participants = [...$participantMediaState.keys()].map(participantFromLiveKitIdentity)
         return uniqBy((p: VoiceParticipant) => participantKey(p), participants)
       } else {
         const latestEvent = $publishedParticipantList as TrustedEvent | undefined
@@ -152,6 +157,8 @@ const setUpMicrophone = async (
   startMuted: boolean,
   preferredMicId: string | undefined,
   participant: LocalParticipant,
+  signal?: AbortSignal,
+  settleSignal?: AbortSignal,
 ): Promise<boolean> => {
   if (startMuted) {
     return true
@@ -163,16 +170,36 @@ const setUpMicrophone = async (
     capture = {deviceId: preferredMicId}
   }
   try {
-    await participant.setMicrophoneEnabled(true, capture)
+    await Promise.race([
+      participant.setMicrophoneEnabled(true, capture),
+      whenTimeout(15_000, {message: "Microphone access timed out.", signal: settleSignal}),
+      whenAborted(signal),
+    ])
     muted = false
   } catch (e) {
+    // Timeout or microphone rejection: join muted, the call is still usable. A
+    // genuine abort is surfaced to the caller so it can tear down the room.
+    if (e instanceof AbortError) throw e
+    if (!(e instanceof TimeoutError)) {
       pushToast({theme: "error", message: "Could not access microphone"})
     }
+  }
   return muted
 }
 
-const onRoomDisconnected = (reason?: DisconnectReason) => {
+// The room whose events are allowed to mutate shared state. Abandoned rooms
+// (after switching calls or an engine reconnect give-up) must not clobber it.
+let activeRoom: LiveKitRoom | undefined
+
+const makeOnRoomDisconnected = (room: LiveKitRoom) => (reason?: DisconnectReason) => {
+  // Ignore disconnects from rooms that are no longer the active session.
+  if (room !== activeRoom) return
+
+  activeRoom = undefined
+  room.removeAllListeners()
+
   videoPrimaryTileKey.set(undefined)
+  voiceMicMuted.set(true)
   currentVoiceSession.set(undefined)
   resetVideoCallLayout()
   if (reason !== undefined && reason !== DisconnectReason.CLIENT_INITIATED) {
@@ -184,7 +211,7 @@ const onRoomDisconnected = (reason?: DisconnectReason) => {
     pushToast({theme: "error", message})
   }
   speakingParticipants.set([])
-  participantPubkeyMap.set(new Map())
+  participantMediaState.set(new Map())
 }
 
 const onTrackSubscribed = (track: Track) => {
@@ -214,8 +241,8 @@ const playJoinSound = () => {
   audio.play().catch(() => {})
 }
 
-const onParticipantConnected = (participant: {identity: string}) => {
+const onParticipantConnected = (participant: Participant) => {
-  addParticipant(participant.identity)
+  syncParticipantMedia(participant)
   playJoinSound()
 }
 
@@ -248,9 +275,6 @@ export const joinVoiceRoom = async (
 ): Promise<void> => {
   cancelJoinVoiceRoom()
 
-  const session = get(currentVoiceSession)
-  if (session) await leaveVoiceRoom()
-
   currentVoiceRoom.set(get(deriveRoom(url, h)))
   voiceState.set(VoiceState.Joining)
 
@@ -259,47 +283,101 @@ export const joinVoiceRoom = async (
   const signal = controller.signal
   const isActive = () => joinAbortController === controller
 
+  // Self-cleaning controller: aborted in finally so whenTimeout/whenAborted
+  // helpers clear their timers/listeners once the races below have settled.
+  const settle = new AbortController()
+
   try {
-    const {server_url, participant_token} = await fetchLivekitToken(url, h, signal)
+    // Tear down any existing session before joining. Bound it so a slow leave
+    // (camera/screenshare renegotiation can take ~15s) cannot block this join.
+    if (get(currentVoiceSession)) {
+      await Promise.race([
+        leaveVoiceRoom(),
+        whenTimeout(15_000, {message: "Leaving previous call timed out.", signal: settle.signal}),
+        whenAborted(signal),
+      ]).catch(e => {
+        if (e instanceof AbortError) throw e
+      })
+
+      // leaveVoiceRoom flips voiceState to Disconnected; re-assert Joining.
+      voiceState.set(VoiceState.Joining)
+    }
+
+    if (signal.aborted) throw new AbortError()
+
+    const {server_url, participant_token} = await Promise.race([
+      fetchLivekitToken(url, h, signal),
+      whenTimeout(15_000, {
+        message: "Connection timed out. Please check your network and try again.",
+        signal: settle.signal,
+      }),
+      whenAborted(signal),
+    ])
 
     if (signal.aborted) throw new AbortError()
 
     const liveKitRoom = new LiveKitRoom({adaptiveStream: true, dynacast: true})
+    activeRoom = liveKitRoom
 
-    liveKitRoom.on(RoomEvent.Disconnected, onRoomDisconnected)
+    liveKitRoom.on(RoomEvent.Disconnected, makeOnRoomDisconnected(liveKitRoom))
     liveKitRoom.on(RoomEvent.ParticipantConnected, onParticipantConnected)
     liveKitRoom.on(RoomEvent.ParticipantDisconnected, onParticipantDisconnected)
     liveKitRoom.on(RoomEvent.TrackSubscribed, onTrackSubscribed)
     liveKitRoom.on(RoomEvent.TrackUnsubscribed, onTrackUnsubscribed)
     liveKitRoom.on(RoomEvent.LocalTrackUnpublished, onLocalTrackUnpublished)
     liveKitRoom.on(RoomEvent.ActiveSpeakersChanged, onActiveSpeakersChanged)
+    liveKitRoom.on(RoomEvent.TrackMuted, onParticipantMediaChanged)
+    liveKitRoom.on(RoomEvent.TrackUnmuted, onParticipantMediaChanged)
+    liveKitRoom.on(RoomEvent.TrackPublished, onParticipantMediaChanged)
+    liveKitRoom.on(RoomEvent.TrackUnpublished, onParticipantMediaChanged)
+    liveKitRoom.on(RoomEvent.LocalTrackPublished, onParticipantMediaChanged)
 
     try {
       await Promise.race([
         liveKitRoom.connect(server_url, participant_token, {maxRetries: 0}),
         whenTimeout(15_000, {
           message: "Connection timed out. Please check your network and try again.",
+          signal: settle.signal,
         }),
         whenAborted(signal),
       ])
     } catch (e) {
+      if (activeRoom === liveKitRoom) activeRoom = undefined
+      liveKitRoom.removeAllListeners()
       liveKitRoom.disconnect()
       throw e
     }
 
-    participantPubkeyMap.set(new Map())
+    participantMediaState.set(new Map())
-    addParticipant(liveKitRoom.localParticipant.identity)
+    syncParticipantMedia(liveKitRoom.localParticipant)
     for (const p of liveKitRoom.remoteParticipants.values()) {
-      addParticipant(p.identity)
+      syncParticipantMedia(p)
     }
 
-    const muted = await setUpMicrophone(startMuted, preferredMicId, liveKitRoom.localParticipant)
+    // Bounded against timeout/abort inside setUpMicrophone: a stuck permission
+    // prompt resolves to muted rather than hanging the join forever.
+    const muted = await setUpMicrophone(
+      startMuted,
+      preferredMicId,
+      liveKitRoom.localParticipant,
+      signal,
+      settle.signal,
+    )
 
+    // A cancel during the mic step must tear down the connected room rather
+    // than leaking it.
+    if (signal.aborted) {
+      if (activeRoom === liveKitRoom) activeRoom = undefined
+      liveKitRoom.removeAllListeners()
+      liveKitRoom.disconnect()
+      throw new AbortError()
+    }
+
+    voiceMicMuted.set(muted)
     currentVoiceSession.set({
       url,
       h,
       room: liveKitRoom,
-      muted,
       cameraOn: false,
       screenShareOn: false,
     })
@@ -310,6 +388,7 @@ export const joinVoiceRoom = async (
     if (e instanceof AbortError) return
     throw e
   } finally {
+    settle.abort()
     if (isActive()) joinAbortController = undefined
   }
 }
@@ -337,13 +416,23 @@ export const leaveVoiceRoom = async () => {
     }
   }
 
+  // Always tear down this room's connection and listeners.
+  if (activeRoom === session.room) activeRoom = undefined
+  session.room.removeAllListeners()
+  session.room.disconnect()
+
+  // Only reset shared UI state if this session is still current. A slow leave
+  // that was superseded by a new join (bounded by a timeout in joinVoiceRoom)
+  // must not clobber the freshly-joined session when it finally completes.
+  if (get(currentVoiceSession) === session) {
     voiceState.set(VoiceState.Disconnected)
     videoPrimaryTileKey.set(undefined)
+    voiceMicMuted.set(true)
     currentVoiceSession.set(undefined)
     resetVideoCallLayout()
-  session.room.disconnect()
     speakingParticipants.set([])
-  participantPubkeyMap.set(new Map())
+    participantMediaState.set(new Map())
+  }
 }
 
 export const rejoinVoiceRoom = async (): Promise<void> => {
@@ -356,18 +445,17 @@ export const toggleMute = async () => {
   const session = get(currentVoiceSession)
   if (!session) return
 
-  const muted = !session.muted
+  voiceMicMuted.update(not)
-  if (muted) {
+  if (get(voiceMicMuted)) {
     // Disable and re-enable microphone to trigger permission prompt
     session.room.localParticipant.setMicrophoneEnabled(false)
-    currentVoiceSession.set({...session, muted})
     return
   }
 
   try {
     await session.room.localParticipant.setMicrophoneEnabled(true)
-    currentVoiceSession.set({...session, muted})
   } catch (e) {
+    voiceMicMuted.set(true)
     pushToast({theme: "error", message: "Could not access microphone"})
   }
 }

src/app/components/CalendarEventHeader.svelte

@@ -19,15 +19,17 @@
   const end = $derived(parseInt(meta.end))
 </script>
 
-<div class="flex grow flex-wrap justify-between gap-2">
+<div class="flex flex-col justify-between gap-1">
-  <p class="text-xl">{meta.title || meta.name}</p>
+  <p class="text-lg">{meta.title || meta.name}</p>
   {#if !isNaN(start) && !isNaN(end)}
     {@const startDateDisplay = formatTimestampAsDate(start)}
     {@const endDateDisplay = formatTimestampAsDate(end)}
     {@const isSingleDay = startDateDisplay === endDateDisplay}
-    <div class="flex items-center gap-2 text-sm">
+    <div class="flex flex-wrap gap-2 text-xs">
+      <div class="flex items-center gap-2">
         <Icon icon={ClockCircle} size={4} />
-      <span class="hidden sm:block">{formatTimestampAsDate(start)}</span>
+        {formatTimestampAsDate(start)}
+      </div>
       {formatTimestampAsTime(start)} — {isSingleDay
         ? formatTimestampAsTime(end)
         : formatTimestamp(end)}

src/app/components/Chat.svelte

@@ -53,7 +53,7 @@
   import ChatComposeEdit from "@app/components/ChatComposeEdit.svelte"
   import ChatComposeParent from "@app/components/ChatComposeParent.svelte"
   import ThunkToast from "@app/components/ThunkToast.svelte"
-  import {userSettingsValues, deriveChat} from "@app/core/state"
+  import {userSettingsValues, deriveChat, makeChatId} from "@app/core/state"
   import {pushModal} from "@app/util/modal"
   import {DraftKey} from "@app/util/drafts"
   import {makeDelete, prependParent} from "@app/core/commands"
@@ -66,8 +66,9 @@
 
   const {pubkeys, info}: Props = $props()
 
-  const chat = deriveChat(pubkeys)
+  const chatId = makeChatId(pubkeys)
-  const draftKey = new DraftKey<{content?: string | object}>(`dm:${$chat?.id}`)
+  const chat = deriveChat(chatId)
+  const draftKey = new DraftKey<{content?: string | object}>(`dm:${chatId}`)
   const others = remove($pubkey!, pubkeys)
   const missingRelayLists = $derived(others.filter(pk => !$messagingRelayListsByPubkey.has(pk)))
 

src/app/components/Content.svelte

@@ -6,6 +6,7 @@
     truncate,
     renderAsHtml,
     isText,
+    isEmail,
     isEmoji,
     isTopic,
     isCode,
@@ -26,6 +27,7 @@
   import Button from "@lib/components/Button.svelte"
   import ContentToken from "@app/components/ContentToken.svelte"
   import ContentEmoji from "@app/components/ContentEmoji.svelte"
+  import ContentEmail from "@app/components/ContentEmail.svelte"
   import ContentCode from "@app/components/ContentCode.svelte"
   import ContentLinkInline from "@app/components/ContentLinkInline.svelte"
   import ContentLinkBlock from "@app/components/ContentLinkBlock.svelte"
@@ -159,6 +161,8 @@
           <ContentTopic value={parsed.value} />
         {:else if isEmoji(parsed)}
           <ContentEmoji value={parsed.value} />
+        {:else if isEmail(parsed)}
+          <ContentEmail value={parsed.value} />
         {:else if isCode(parsed)}
           <ContentCode
             value={parsed.value}

src/app/components/ContentEmail.svelte

@@ -0,0 +1,12 @@
+<script lang="ts">
+  import LinkRound from "@assets/icons/link-round.svg?dataurl"
+  import Icon from "@lib/components/Icon.svelte"
+  import Link from "@lib/components/Link.svelte"
+
+  export let value: string
+</script>
+
+<Link external href="mailto:{value}">
+  <Icon icon={LinkRound} size={3} />
+  {value}
+</Link>

src/app/components/ContentMinimal.svelte

@@ -7,6 +7,7 @@
     renderAsHtml,
     isText,
     isEmoji,
+    isEmail,
     isTopic,
     isCode,
     isCashu,
@@ -24,6 +25,7 @@
   import Button from "@lib/components/Button.svelte"
   import ContentToken from "@app/components/ContentToken.svelte"
   import ContentEmoji from "@app/components/ContentEmoji.svelte"
+  import ContentEmail from "@app/components/ContentEmail.svelte"
   import ContentCode from "@app/components/ContentCode.svelte"
   import ContentLinkInline from "@app/components/ContentLinkInline.svelte"
   import ContentNewline from "@app/components/ContentNewline.svelte"
@@ -109,6 +111,8 @@
           <ContentTopic value={parsed.value} />
         {:else if isEmoji(parsed)}
           <ContentEmoji value={parsed.value} />
+        {:else if isEmail(parsed)}
+          <ContentEmail value={parsed.value} />
         {:else if isCode(parsed)}
           <ContentCode
             value={parsed.value}

src/app/components/PrimaryNavItemSpace.svelte

@@ -13,13 +13,16 @@
 
   const onClick = () => goToSpace(url)
 
+  const path = makeSpacePath(url)
+
   const display = $derived(deriveRelayDisplay(url))
 </script>
 
 <PrimaryNavItem
+  href={path}
   onclick={onClick}
   title={$display}
   class="tooltip-right"
-  notification={$notifications.has(makeSpacePath(url))}>
+  notification={$notifications.has(path)}>
   <RelayIcon {url} size={10} class="rounded-full" />
 </PrimaryNavItem>

src/app/components/RelaySummary.svelte

@@ -19,12 +19,12 @@
 
 <div class="col-4 text-left">
   <div class="col-2">
-    <div class="relative flex gap-4">
+    <div class="relative flex gap-2 sm:gap-4">
       <div class="relative">
         <div class="avatar relative">
           <div
             class="center flex! h-12 w-12 min-w-12 rounded-full border-2 border-solid border-base-300 bg-base-300">
-            <RelayIcon {url} />
+            <RelayIcon {url} size={10} />
           </div>
         </div>
         {#if $rooms.includes(url)}
@@ -36,13 +36,11 @@
         {/if}
       </div>
       <div class="min-w-0">
-        <h2 class="ellipsize whitespace-nowrap text-xl">
+        <RelayName {url} class="ellipsize whitespace-nowrap text-lg sm:text-xl" />
-          <RelayName {url} />
+        <p class="text-xs sm:text-sm opacity-75">{url}</p>
-        </h2>
-        <p class="text-sm opacity-75">{url}</p>
       </div>
     </div>
-    <RelayDescription {url} />
+    <RelayDescription {url} class="text-sm sm:text-md" />
   </div>
   {#if !hideFavorites && $favorited.size > 0}
     <div class="row-2 card2 card2-sm bg-alt">

src/app/components/RoomCompose.svelte

@@ -68,8 +68,6 @@
     const content = ed.getText({blockSeparator: "\n"}).trim()
     const tags = ed.storage.nostr.getEditorTags()
 
-    if (!content) return
-
     onSubmit({content, tags})
 
     draftKey?.clear()

src/app/components/RoomDetail.svelte

@@ -122,6 +122,7 @@
           repository.removeEvent(thunk.event.id)
           pushToast({theme: "error", message})
         } else {
+          await removeRoomMembership(url, h)
           goto(makeSpacePath(url))
         }
       },

src/app/components/SignUp.svelte

@@ -11,7 +11,6 @@
   import Modal from "@lib/components/Modal.svelte"
   import ModalBody from "@lib/components/ModalBody.svelte"
   import LogIn from "@app/components/LogIn.svelte"
-  import InfoNostr from "@app/components/InfoNostr.svelte"
   import SignUpKey from "@app/components/SignUpKey.svelte"
   import SignUpEmail from "@app/components/SignUpEmail.svelte"
   import SignUpProfile from "@app/components/SignUpProfile.svelte"
@@ -91,11 +90,9 @@
 
 <Modal>
   <ModalBody>
-    <h1 class="heading">Sign up with Nostr</h1>
+    <h1 class="heading">Join {PLATFORM_NAME}</h1>
     <p class="m-auto max-w-sm text-center">
-      {PLATFORM_NAME} is built using the
+      Censorship resistant digital spaces for communities. Meet new people, own your identity.
-      <Button class="link" onclick={() => pushModal(InfoNostr)}>nostr protocol</Button>, which gives
-      users control over their digital identity using <strong>cryptographic key pairs</strong>.
     </p>
     {#if hasPomade}
       <Button onclick={flows.email.start} class="btn btn-primary">

src/app/components/SpaceBar.svelte

@@ -7,17 +7,19 @@
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
   import PageBar from "@lib/components/PageBar.svelte"
+  import RelayIcon from "@app/components/RelayIcon.svelte"
   import {decodeRelay} from "@app/core/state"
   import {makeSpacePath} from "@app/util/routes"
 
   interface Props {
     back?: () => unknown
+    leading?: Snippet
     title?: Snippet
     action?: Snippet
     [key: string]: any
   }
 
-  const {back = () => goto(makeSpacePath(url)), title, action, ...props}: Props = $props()
+  const {back = () => goto(makeSpacePath(url)), leading, title, action, ...props}: Props = $props()
 
   const url = decodeRelay($page.params.relay!)
 </script>
@@ -30,6 +32,10 @@
     <div class="ellipsize whitespace-nowrap flex grow items-center justify-between gap-4">
       <div class="flex flex-col">
         <div class="flex gap-2 items-center">
+          <RelayIcon {url} size={5} class="rounded-full md:hidden" />
+          <div class="hidden md:contents">
+            {@render leading?.()}
+          </div>
           {@render title?.()}
         </div>
         <div class="text-xs text-primary md:hidden">

src/app/components/SpaceInviteAccept.svelte

@@ -23,8 +23,8 @@
   import SpaceJoinSettings from "@app/components/SpaceJoinSettings.svelte"
   import {pushToast} from "@app/util/toast"
   import {makeSpacePath} from "@app/util/routes"
-  import {Push} from "@app/util/notifications"
   import {relaysMostlyRestricted, notificationSettings, parseInviteLink} from "@app/core/state"
+  import {Push} from "@app/util/push"
   import {
     attemptRelayAccess,
     addSpaceMembership,

src/app/components/SpaceJoin.svelte

@@ -24,7 +24,7 @@
   import {pushModal} from "@app/util/modal"
   import {pushToast} from "@app/util/toast"
   import {makeSpacePath} from "@app/util/routes"
-  import {Push} from "@app/util/notifications"
+  import {Push} from "@app/util/push"
 
   type Props = {
     url: string

src/app/components/SpaceMenu.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import {derived} from "svelte/store"
   import {displayRelayUrl, EVENT_TIME, ZAP_GOAL, THREAD, CLASSIFIED, POLL} from "@welshman/util"
-  import {deriveRelay, deriveRelayDisplay, createSearch, pubkey} from "@welshman/app"
+  import {deriveRelay, createSearch, pubkey} from "@welshman/app"
   import {fly} from "@lib/transition"
   import Magnifier from "@assets/icons/magnifier.svg?dataurl"
   import AltArrowDown from "@assets/icons/alt-arrow-down.svg?dataurl"
@@ -65,7 +65,6 @@
   const {url} = $props()
 
   const relay = deriveRelay(url)
-  const display = deriveRelayDisplay(url)
   const chatPath = makeSpacePath(url, "chat")
   const goalsPath = makeSpacePath(url, "goals")
   const threadsPath = makeSpacePath(url, "threads")
@@ -144,9 +143,7 @@
         class="relative flex w-full flex-col rounded-xl p-3 transition-all hover:bg-base-100"
         onclick={openMenu}>
         <div class="flex items-center justify-between">
-          <strong
+          <strong class="flex items-center gap-1 relative">
-            class="flex items-center gap-1 relative tooltip tooltip-right"
-            data-tip={$display}>
             <RelayName {url} class="ellipsize" />
             <div
               class="absolute -right-3 top-0 h-2 w-2 rounded-full bg-primary transition-all opacity-0"

src/app/components/SpaceRelayStatus.svelte

@@ -26,22 +26,22 @@
     {@const {pubkey, software, version, supported_nips, limitation} = $relay}
     <div class="flex flex-wrap gap-1">
       {#if pubkey}
-        <div class="badge badge-neutral">
+        <div class="badge badge-neutral text-wrap h-auto">
           <span class="ellipsize">Administrator: <ProfileLink unstyled {pubkey} /></span>
         </div>
       {/if}
       {#if $relay?.contact}
-        <div class="badge badge-neutral">
+        <div class="badge badge-neutral text-wrap h-auto">
           <span class="ellipsize">Contact: {$relay.contact}</span>
         </div>
       {/if}
       {#if software}
-        <div class="badge badge-neutral">
+        <div class="badge badge-neutral text-wrap h-auto">
           <span class="ellipsize">Software: {software}</span>
         </div>
       {/if}
       {#if version}
-        <div class="badge badge-neutral">
+        <div class="badge badge-neutral text-wrap h-auto">
           <span class="ellipsize">Version: {version}</span>
         </div>
       {/if}
@@ -61,7 +61,7 @@
         </p>
       {/if}
       {#if limitation?.min_pow_difficulty}
-        <p class="badge badge-warning">
+        <p class="badge badge-warning text-wrap h-auto">
           <span class="ellipsize">Min PoW: {limitation?.min_pow_difficulty}</span>
         </p>
       {/if}

src/app/components/Toast.svelte

@@ -22,7 +22,7 @@
   $effect(() => {
     if (!containerEl) return
     containerEl.addEventListener("touchmove", onTouchMove, {passive: false})
-    return () => containerEl!.removeEventListener("touchmove", onTouchMove)
+    return () => containerEl?.removeEventListener("touchmove", onTouchMove)
   })
 
   const onActionClick = () => {
@@ -71,6 +71,7 @@
 
 {#if $toast}
   {@const theme = $toast.theme || "info"}
+  <!-- svelte-ignore a11y_no_static_element_interactions -->
   <div
     bind:this={containerEl}
     transition:fly={{y: -20}}

src/app/components/VideoCallContent.svelte

@@ -8,6 +8,7 @@
   import ProfileCircle from "@app/components/ProfileCircle.svelte"
   import VideoCallTile from "@app/components/VideoCallTile.svelte"
   import VoiceWidget from "@app/components/VoiceWidget.svelte"
+  import VoiceParticipantMediaBadges from "@app/components/VoiceParticipantMediaBadges.svelte"
   import {get} from "svelte/store"
   import {
     VideoCallLayout,
@@ -18,7 +19,12 @@
     ViewportSize,
     videoPrimaryTileKey,
   } from "@app/call/video"
-  import {currentVoiceSession, currentVoiceRoom, pubkeyFromLiveKitIdentity} from "@app/call/stores"
+  import {
+    currentVoiceSession,
+    currentVoiceRoom,
+    mediaStateByIdentity,
+    pubkeyFromLiveKitIdentity,
+  } from "@app/call/stores"
 
   type Props = {
     layout: VideoCallLayout
@@ -121,6 +127,25 @@
           source: Track.Source.ScreenShare,
         })
       }
+      if (!videoTiles.some(t => t.identity === rp.identity)) {
+        videoTiles.push({
+          identity: rp.identity,
+          isLocal: false,
+          trackSid: `avatar-${rp.identity}`,
+          track: undefined,
+          source: Track.Source.Camera,
+        })
+      }
+    }
+
+    if (!videoTiles.some(t => t.identity === user.identity)) {
+      videoTiles.push({
+        identity: user.identity,
+        isLocal: true,
+        trackSid: "local-avatar",
+        track: undefined,
+        source: Track.Source.Camera,
+      })
     }
 
     return videoTiles
@@ -144,6 +169,9 @@
 
   const useSpotlightLayout = $derived(primaryTile !== undefined)
   const useMultiGrid = $derived(!useSpotlightLayout && videoTiles.length > 2)
+  const multiGridClass = $derived(
+    layout === VideoCallLayout.Split ? "grid-cols-1" : "grid-cols-1 sm:grid-cols-2",
+  )
 
   $effect(() => {
     const k = $videoPrimaryTileKey
@@ -184,6 +212,7 @@
 </script>
 
 {#snippet videoTile(tile: VideoTileData, layout: TileLayout)}
+  {@const media = $mediaStateByIdentity(tile.identity)}
   <div
     class={cx(
       "relative isolate overflow-hidden rounded-box shadow-sm",
@@ -203,6 +232,15 @@
         <ProfileCircle pubkey={pubkeyFromLiveKitIdentity(tile.identity)} {url} size={14} />
       </div>
     {/if}
+    {#if tile.track}
+      <div class="pointer-events-none absolute left-1 top-1 z-10">
+        <VoiceParticipantMediaBadges
+          muted={media.muted}
+          cameraOn={media.cameraOn}
+          showCamera={tile.source === Track.Source.Camera}
+          size={3} />
+      </div>
+    {/if}
     <span
       class="pointer-events-none absolute bottom-1 left-1 max-w-[calc(100%-0.5rem)] truncate rounded bg-base-100/80 px-1.5 py-0.5 text-xs">
       {labelFor(tile.identity, tile.source)}{tile.isLocal ? " (you)" : ""}
@@ -213,8 +251,8 @@
         data-tip={pinned ? "Exit spotlight" : "Spotlight"}
         aria-pressed={pinned}
         class={cx(
-          "absolute right-1 top-1 z-20 btn btn-xs btn-square btn-ghost",
+          "absolute right-1 top-1 z-20 btn btn-xs btn-square",
-          pinned ? "btn-active bg-primary/25 text-primary" : "bg-base-100/70",
+          pinned ? "btn-primary" : "btn-ghost bg-base-100",
         )}
         onclick={spotlightHandlerFor(tileKey(tile))}>
         <Icon icon={Pin} size={3} />
@@ -238,8 +276,7 @@
         {/if}
       </div>
     {:else if useMultiGrid}
-      <div
+      <div class={cx("grid min-h-0 flex-1 content-start gap-2 overflow-y-auto", multiGridClass)}>
-        class="grid min-h-0 flex-1 grid-cols-1 content-start gap-2 overflow-y-auto sm:grid-cols-2">
         {#each videoTiles as tile (tileKey(tile))}
           {@render videoTile(tile, "default")}
         {/each}
@@ -254,8 +291,10 @@
   {:else}
     <div
       class="flex min-h-[12rem] flex-1 flex-col items-center justify-center gap-2 rounded-box bg-base-200/50 p-4 text-center text-sm opacity-80">
-      <p>No camera or screen share yet.</p>
+      <p>No one is sharing video yet.</p>
-      <p class="text-xs">Use the camera or screen share control to share video.</p>
+      <p class="text-xs">
+        Participants appear here when they turn on their camera or share their screen.
+      </p>
     </div>
   {/if}
 {/snippet}

src/app/components/VoiceParticipantMediaBadges.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+  import cx from "classnames"
+  import MicrophoneOff from "@assets/icons/microphone-off.svg?dataurl"
+  import VideocameraOff from "@assets/icons/videocamera-off.svg?dataurl"
+  import Icon from "@lib/components/Icon.svelte"
+
+  type Props = {
+    muted: boolean
+    cameraOn: boolean
+    showCamera?: boolean
+    size?: number
+    class?: string
+  }
+
+  const {muted, cameraOn, showCamera = true, size = 3, class: className = ""}: Props = $props()
+
+  const badgeClass =
+    "inline-flex size-4 shrink-0 items-center justify-center rounded bg-base-100/80 p-0.5 text-error"
+</script>
+
+{#if muted || (showCamera && !cameraOn)}
+  <div class={cx("flex items-center gap-1", className)}>
+    {#if muted}
+      <span class={badgeClass} aria-label="Muted">
+        <Icon icon={MicrophoneOff} {size} />
+      </span>
+    {/if}
+    {#if showCamera && !cameraOn}
+      <span class={badgeClass} aria-label="Camera off">
+        <Icon icon={VideocameraOff} {size} />
+      </span>
+    {/if}
+  </div>
+{/if}

src/app/components/VoiceRoomItem.svelte

@@ -9,11 +9,13 @@
   import {makeRoomPath} from "@app/util/routes"
   import {pushModal} from "@app/util/modal"
   import VoiceRoomJoinDialog from "@app/components/VoiceRoomJoinDialog.svelte"
+  import VoiceParticipantMediaBadges from "@app/components/VoiceParticipantMediaBadges.svelte"
   import {makeRoomId} from "@app/core/state"
   import {
     VoiceState,
     currentVoiceRoom,
     isParticipantSpeaking,
+    mediaStateByIdentity,
     participantKey,
     voiceState,
     type VoiceParticipant,
@@ -83,9 +85,17 @@
             )}>
             <ProfileCircle pubkey={p.pubkey} size={5} class="h-5 w-5" />
           </div>
-          <span class="ellipsize text-xs opacity-70">
+          <span class="ellipsize min-w-0 flex-1 text-xs opacity-70">
             {p.pubkey ? displayProfileByPubkey(p.pubkey) : "Unknown"}
           </span>
+          {#if isActive}
+            {@const media = $mediaStateByIdentity(p.identity)}
+            <VoiceParticipantMediaBadges
+              muted={media.muted}
+              cameraOn={media.cameraOn}
+              size={3}
+              class="shrink-0" />
+          {/if}
         </div>
       {/each}
     {/if}

src/app/components/VoiceWidget.svelte

@@ -6,7 +6,7 @@
   import cx from "classnames"
   import {displayRelayUrl} from "@welshman/util"
   import Microphone from "@assets/icons/microphone.svg?dataurl"
-  import Videocamera from "@assets/icons/videocamera.svg?dataurl"
+  import VideocameraOff from "@assets/icons/videocamera-off.svg?dataurl"
   import VideocameraRecord from "@assets/icons/videocamera-record.svg?dataurl"
   import Monitor from "@assets/icons/monitor.svg?dataurl"
   import PhoneRounded from "@assets/icons/phone-rounded.svg?dataurl"
@@ -41,8 +41,8 @@
     VoiceState,
     currentVoiceSession,
     currentVoiceRoom,
+    voiceMicMuted,
     voiceState,
-    isLocalSpeaking,
   } from "@app/call/stores"
   import {cancelJoinVoiceRoom, leaveVoiceRoom, toggleMute} from "@app/call/voice"
 
@@ -183,18 +183,16 @@
         </Button>
       {:else if $voiceState === VoiceState.Connected && $currentVoiceSession}
         <Button
-          data-tip={$currentVoiceSession.muted ? "Unmute" : "Mute"}
+          data-tip={$voiceMicMuted ? "Unmute" : "Mute"}
           class={cx(
             mediaToggleClass,
             "overflow-visible",
-            !$currentVoiceSession.muted && $isLocalSpeaking && "text-primary",
+            $voiceMicMuted && "text-error ring-1 ring-error/50 ring-offset-0 ring-offset-base-100",
-            $currentVoiceSession.muted &&
-              "text-error ring-1 ring-error/50 ring-offset-0 ring-offset-base-100",
           )}
           onclick={toggleMute}>
           <span class="relative inline-flex items-center justify-center overflow-visible">
             <Icon icon={Microphone} size={4} />
-            {#if $currentVoiceSession.muted}
+            {#if $voiceMicMuted}
               <span
                 class="pointer-events-none absolute inset-0 flex items-center justify-center overflow-visible"
                 aria-hidden="true">
@@ -207,9 +205,17 @@
         </Button>
         <Button
           data-tip={$currentVoiceSession.cameraOn ? "Turn off camera" : "Turn on camera"}
-          class={cx(mediaToggleClass, $currentVoiceSession.cameraOn && "text-primary")}
+          class={cx(
+            mediaToggleClass,
+            "overflow-visible",
+            $currentVoiceSession.cameraOn && "text-primary",
+            !$currentVoiceSession.cameraOn &&
+              "text-error ring-1 ring-error/50 ring-offset-0 ring-offset-base-100",
+          )}
           onclick={toggleCamera}>
-          <Icon icon={$currentVoiceSession.cameraOn ? VideocameraRecord : Videocamera} size={4} />
+          <Icon
+            icon={$currentVoiceSession.cameraOn ? VideocameraRecord : VideocameraOff}
+            size={4} />
         </Button>
         {#if !Capacitor.isNativePlatform()}
           <Button

src/app/core/commands.ts

@@ -73,7 +73,6 @@ import {
   waitForThunkError,
   getPubkeyRelays,
   userBlossomServerList,
-  getThunkError,
   addRoomMember,
   manageRelay,
   getRelay,
@@ -264,16 +263,12 @@ export const attemptRelayAccess = async (url: string, claim = "") => {
   return stripPrefix(error)
 }
 
-export const deriveRelayAuthError = (url: string, claim = "") => {
+export const deriveRelayAuthError = (url: string) => {
-  // Kick off the auth process
   Pool.get().get(url).auth.attemptAuth(sign)
 
-  // Attempt to join the relay
-  const thunk = publishJoinRequest({url, claim})
-
   return derived(
-    [thunk, relaysMostlyRestricted, deriveSocket(url)],
+    [relaysMostlyRestricted, deriveSocket(url)],
-    ([$thunk, $relaysMostlyRestricted, $socket]) => {
+    ([$relaysMostlyRestricted, $socket]) => {
       if ($socket.auth.status === AuthStatus.Forbidden && $socket.auth.details) {
         return stripPrefix($socket.auth.details)
       }
@@ -281,16 +276,6 @@ export const deriveRelayAuthError = (url: string, claim = "") => {
       if ($relaysMostlyRestricted[url]) {
         return stripPrefix($relaysMostlyRestricted[url])
       }
-
-      const error = getThunkError($thunk)
-
-      if (error) {
-        const isEmptyInvite = !claim && error.includes("invite code")
-
-        if (!shouldIgnoreError(error) && !isEmptyInvite) {
-          return stripPrefix(error) || "join request rejected"
-        }
-      }
     },
   )
 }