byGalax da85f0ba54 feat: call UX overhaul — deafen sync, share dialog, fullscreen redesign
Speaking ring:
- Switch useActiveSpeakers from LiveKit's smoothed isSpeaking / server-
  batched ActiveSpeakersChanged to Web Audio API AnalyserNode on each
  participant's raw audio MediaStreamTrack. Poll 50ms, RMS threshold 0.03,
  250ms hold. Feels real-time vs the old ~500ms lag
- Defensive syncProbe on every tick so probes catch up if TrackPublished
  missed (local mic publish race on join)
- Universal speaking overlay on tile (3px emerald border + inset glow,
  z-10) so video mode shows the ring too, not just audio mode

Screen sharing:
- Separate "screen" tile per sharer so the sharer's avatar tile stays
  intact with its speaking ring. Tile.id is kind-prefixed (user:xxx /
  screen:xxx) so focus tracking distinguishes them
- New ScreenShareDialog (quality preset + fps override + displaySurface
  hint) opens on the share button. startScreenShare / stopScreenShare
  actions in CallContext replace the one-shot toggle
- ScreenShareViewer: plain CSS-only fullscreen overlay (Tauri WKWebView
  doesn't implement requestFullscreen), always `h-full w-full
  object-contain`, Esc exits

Camera:
- toggleCamera action in CallContext tracks isCameraEnabled
- VideoStub renders real <video> srcObject for the participant's camera
  MediaStreamTrack; local preview is mirrored
- Tile video track resolves to Track.Source.Camera publications of the
  LocalParticipant / each RemoteParticipant
- Room listens for TrackMuted / TrackUnmuted and re-publishes remote
  state so peers switch to avatar placeholder when a camera is disabled

Deafen:
- New isDeafened state + toggleDeafen action. Sets `muted = true` on all
  attached `<audio[data-livekit-track]>` plus mutes fresh ones on attach
  via module-level flag
- Broadcast state over the LiveKit data channel
  ({type:'presence', deafened}) so peers can render the headphones-off
  badge. Attributes API not used because the self-hosted server may run
  older LiveKit versions
- remoteDeafen: Record<identity, bool> exposed via context, bumped on
  DataReceived and re-broadcast on ParticipantConnected

Incoming video call:
- acceptIncoming takes an optional CallKind override so the receiver can
  answer a video invite with audio only or promote an audio invite to
  video on accept
- IncomingCallPanel shows two accept buttons (audio + video) when the
  invite is a video call

Audio devices:
- audioSettings adds inputDeviceId + outputDeviceId, persisted
- CallContext uses them on setMicrophoneEnabled, plus new
  setAudioInputDevice / setAudioOutputDevice hot-swap actions.
  Output swap applies setSinkId to every attached remote-audio element
  since LiveKit's own switchActiveDevice only tracks elements it
  attached itself
- SettingsPage "Mikrofon" + "Ausgabegerät" selects with devicechange
  listener and a permission-probe button

Fullscreen mode:
- Replaced absolute-positioned speaker + floating thumbnails with a real
  flex layout. Default = even grid of all tiles. Clicking a tile flips
  to big-speaker + horizontal thumbnail strip. Click focused tile =
  back to grid
- Controls overlay pinned bottom; content wrapper has pb-24 so tiles
  never sit behind the toolbar
- Grid now uses explicit grid-rows-* so cells get a defined 1fr height
  (without it, video intrinsic dimensions blew tiles past the container
  bounds on Windows)

UI chips:
- Mic-off badge combines isMuted flag AND
  localParticipant.isMicrophoneEnabled, so a user with no mic / denied
  permission sees the badge + the toolbar button red even though they
  never pressed mute
- Deafen badge on tile chips for local + remote (remote driven by the
  data-channel broadcast)
2026-04-21 00:02:43 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00
2026-04-18 23:11:35 +02:00

chat-app

Private, end-to-end encrypted chat app for a small circle. Self-hosted Supabase backend, clients on iOS, Android, macOS, Windows, and Linux.

Server is zero-knowledge: it only stores ciphertexts and metadata needed to route them.

Milestone Roadmap

  1. Milestone 1 — Text Chat (current): auth, identity keys, 1:1 encrypted messaging, local history, push.
  2. Milestone 2 — Voice Calls: libsodium-secured WebRTC signaling via Supabase Realtime.
  3. Milestone 3 — Video Calls: same stack, add video tracks + bandwidth handling.
  4. Milestone 4 — Desktop Polish: feature parity with mobile, tray, notifications.
  5. Milestone 5 — Groups & Channels: Discord-like group channels with shared ratchet keys.

Repository Layout

apps/
  mobile/      Expo + React Native (iOS / Android)
  desktop/     Tauri v2 + React + Vite + Tailwind (macOS / Windows / Linux)
packages/
  shared/      Business logic: Supabase client, libsodium crypto, auth, chat
  db-types/    Generated Supabase database types
  ui-web/      React web components shared by desktop (not by React Native)
infra/
  supabase/    Self-hosting docs, client env, SQL migrations
.github/workflows/  CI + build placeholders

Tech Stack

  • Mobile: Expo SDK 52, Expo Router, expo-secure-store, expo-sqlite, expo-notifications, react-native-libsodium.
  • Desktop: Tauri v2, React 18, Vite, Tailwind, tauri-plugin-stronghold, tauri-plugin-sql, tauri-plugin-notification, Zustand.
  • Backend: Supabase self-hosted (Postgres + GoTrue + PostgREST + Realtime + Storage + Edge Functions) on Hetzner, Caddy reverse proxy.
  • Crypto: X25519 identity keys, XChaCha20-Poly1305 envelopes (libsodium / NaCl).
  • Auth: email magic-link, invite-only.

Prerequisites

  • Node 22+ (see .nvmrc)
  • pnpm 9+
  • Rust + Cargo (Tauri): https://rustup.rs
  • Docker + Docker Compose (for running Supabase locally or on the VPS)
  • Platform toolchain per target:
    • iOS: Xcode
    • Android: Android Studio + SDK
    • macOS/Linux/Windows Tauri: see apps/desktop/README.md

Setup

# 1. Node + pnpm (macOS)
brew install pnpm
corepack enable

# 2. Clone + install
git clone <this repo>
cd chat-app
pnpm install

# 3. Env
cp infra/supabase/.env.example apps/mobile/.env
cp infra/supabase/.env.example apps/desktop/.env
# Fill in SUPABASE_URL and SUPABASE_ANON_KEY from your self-hosted stack.

See infra/supabase/README.md for spinning up the backend.

Common Scripts (run from repo root)

Script Purpose
pnpm dev Start every workspace's dev task (Turborepo).
pnpm build Build every workspace.
pnpm lint ESLint across workspaces.
pnpm typecheck TypeScript project-wide type check.
pnpm test Vitest across workspaces.
pnpm format Prettier write.
pnpm format:check Prettier check.
pnpm mobile:dev expo start for the mobile app.
pnpm mobile:ios Native iOS run.
pnpm mobile:android Native Android run.
pnpm desktop:dev tauri dev for the desktop app.
pnpm desktop:build Platform-specific Tauri bundle.
pnpm db:types Regenerate @chat-app/db-types from the running Supabase.

Architecture Overview

  • Shared-first: Anything that can run in both React Native and the Tauri WebView lives in packages/shared and is imported via @chat-app/shared/*. Both hosts pass in adapters for platform-only concerns (secure storage, SQLite, libsodium backend).
  • Zero-knowledge server: Messages are encrypted client-side before insert. The server sees ciphertexts, a conversation id, a sender id, and a timestamp — nothing else.
  • Key custody: X25519 private keys live in platform secure stores only (Keychain/Keystore on mobile, Stronghold on desktop). Public keys live in the profiles table.
  • Realtime: Supabase Realtime delivers new ciphertext rows to subscribed clients. Push notifications are silent (data-only) — the client decrypts and composes the visible notification locally.

Security Checklist

  • RLS enabled on every user-facing table
  • Invite-only enforced in SQL (invites table + policy)
  • No plaintext in push payloads
  • Service role key never shipped to a client
  • JWT secret rotated on first boot
  • TLS via Caddy at the edge
S
Description
No description provided
Readme 64 MiB
Languages
TypeScript 76.3%
Makefile 9.5%
JavaScript 4.3%
PLpgSQL 4%
CSS 3.3%
Other 2.6%