Bump version

Co-authored-by: Jon Staab <shtaab@gmail.com>

.ackrc

@@ -3,6 +3,7 @@
 --ignore-dir=build
 --ignore-dir=ios/DerivedData
 --ignore-dir=ios/App/App/public
+--ignore-dir=ios/App/Pods
 --ignore-file=match:.svg
 --ignore-file=match:package-lock.json
 

.env.template

@@ -1,18 +1,22 @@
 VITE_DEFAULT_PUBKEYS=06639a386c9c1014217622ccbcf40908c4f1a0c33e23f8d6d68f4abf655f8f71,266815e0c9210dfa324c6cba3573b14bee49da4209a9456f9484e5106cd408a5,391819e2f2f13b90cac7209419eb574ef7c0d1f4e81867fc24c47a3ce5e8a248,3bf0c63fcb93463407af97a5e5ee64fa883d107ef9e558472c4eb9aaaefa459d,3f770d65d3a764a9c5cb503ae123e62ec7598ad035d836e2a810f3877a745b24,55f04590674f3648f4cdc9dc8ce32da2a282074cd0b020596ee033d12d385185,58c741aa630c2da35a56a77c1d05381908bd10504fdd2d8b43f725efa6d23196,61066504617ee79387021e18c89fb79d1ddbc3e7bff19cf2298f40466f8715e9,6389be6491e7b693e9f368ece88fcd145f07c068d2c1bbae4247b9b5ef439d32,63fe6318dc58583cfe16810f86dd09e18bfd76aabc24a0081ce2856f330504ed,6e75f7972397ca3295e0f4ca0fbc6eb9cc79be85bafdd56bd378220ca8eee74e,76c71aae3a491f1d9eec47cba17e229cda4113a0bbb6e6ae1776d7643e29cafa,7fa56f5d6962ab1e3cd424e758c3002b8665f7b0d8dcee9fe9e288d7751ac194,82341f882b6eabcd2ba7f1ef90aad961cf074af15b9ef44a09f9d2a8fbfbe6a2,84dee6e676e5bb67b4ad4e042cf70cbd8681155db535942fcc6a0533858a7240,97c70a44366a6535c145b333f973ea86dfdc2d7a99da618c40c64705ad98e322,b676ded7c768d66a757aa3967b1243d90bf57afb09d1044d3219d8d424e4aea0,dace63b00c42e6e017d00dd190a9328386002ff597b841eb5ef91de4f1ce8491,eeb11961b25442b16389fe6c7ebea9adf0ac36dd596816ea7119e521b8821b9e,fe7f6bc6f7338b76bbf80db402ade65953e20b2f23e66e898204b63cc42539a3
-VITE_BURROW_URL=
-VITE_PLATFORM_URL=https://flotilla.social
+VITE_DEFAULT_BLOSSOM_SERVERS=https://blossom.primal.net/
+VITE_POMADE_SIGNERS=
+VITE_PLATFORM_URL=https://app.flotilla.social
 VITE_PLATFORM_TERMS=https://flotilla.social/terms
 VITE_PLATFORM_PRIVACY=https://flotilla.social/privacy
 VITE_PLATFORM_NAME=Flotilla
-VITE_PLATFORM_LOGO=static/flotilla.png
+VITE_PLATFORM_LOGO=static/logo.png
 VITE_PLATFORM_RELAYS=
 VITE_PLATFORM_ACCENT="#7161FF"
 VITE_PLATFORM_SECONDARY="#EB5E28"
 VITE_PLATFORM_DESCRIPTION="Flotilla is nostr — for communities."
-VITE_INDEXER_RELAYS=wss://purplepag.es/,wss://relay.damus.io/,wss://relay.nostr.band/,wss://indexer.coracle.social/
-VITE_SIGNER_RELAYS=wss://relay.nsec.app/,wss://bucket.coracle.social/
-VITE_NOTIFIER_PUBKEY=27b7c2ed89ef78322114225ea3ebf5f72c7767c2528d4d0c1854d039c00085df
-VITE_NOTIFIER_RELAY=wss://anchor.coracle.social/
+VITE_PUSH_SERVER=https://nps.flotilla.social/
+VITE_PUSH_BRIDGE=wss://npb.coracle.social/
+VITE_BLOCKED_RELAYS=brb.io,relay.nostr.band,nostr.mutinywallet.com,feeds.nostr.band,nostr.zbd.gg,wot.utxo.one,blastr.f7z.xyz,relay.current.fyi
+VITE_INDEXER_RELAYS=purplepag.es,relay.damus.io,indexer.coracle.social
+VITE_DEFAULT_RELAYS=relay.damus.io,relay.primal.net,nostr.mom
+VITE_DEFAULT_MESSAGING_RELAYS=auth.nostr1.com
+VITE_SIGNER_RELAYS=relay.nsec.app,ephemeral.snowflare.cc,bucket.coracle.social
 VITE_VAPID_PUBLIC_KEY=BIt2D4BdgdbCowD_0d3Np6GbrIGHxd7aIEUeZNe3hQuRlHz02OhzvDaai0XSFoJYVzSzdMjdyW-QhvW9_yq8j4Y
 VITE_GLITCHTIP_API_KEY=
 GLITCHTIP_AUTH_TOKEN=

.prettierrc

@@ -5,6 +5,6 @@
   "svelteSortOrder": "options-styles-scripts-markup",
   "arrowParens": "avoid",
   "bracketSpacing": false,
-  "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
+  "plugins": ["prettier-plugin-tailwindcss", "prettier-plugin-svelte"],
   "overrides": [{"files": "*.svelte", "options": {"parser": "svelte"}}]
 }

AGENTS.md

@@ -0,0 +1,257 @@
+## Project Overview
+
+Flotilla is a Nostr "relays as groups" community chat client. It implements NIP-29 (relay-based groups) to create Discord-like spaces (servers) and rooms (channels).
+
+**Tech Stack:**
+
+- SvelteKit 5.48+ with TypeScript 5.9+
+- Capacitor for cross-platform (Web/PWA, Android, iOS)
+- TailwindCSS + DaisyUI for styling
+- Welshman library suite for Nostr protocol
+- IndexedDB for local storage
+- Vite for building
+
+**Key Concepts:**
+
+- **Spaces** - Relays used as community groups (like Discord servers)
+- **Rooms** - NIP-29 groups within spaces (like Discord channels), identified by `h`
+- **Chats** - Direct message conversations (NIP-04/NIP-44 encrypted)
+
+## Architecture & Dependency Graph
+
+The project follows a **strict acyclic dependency hierarchy**:
+
+```
+routes/                    (top layer - can depend on anything)
+  ↓
+app/components/            (can depend on app/* and lib/*)
+  ↓
+app/core/ & app/util/      (can only depend on lib/*)
+  ↓
+lib/                       (can only depend on external libraries)
+  ↓
+external libraries         (bottom layer)
+```
+
+**Import Ordering Convention (CRITICAL):**
+Always sort imports by dependency level:
+
+1. Third-party libraries first
+2. Then `lib/` imports
+3. Then `app/` imports
+
+Example:
+
+```typescript
+import {derived} from "svelte/store"
+import {throttle} from "throttle-debounce"
+import {Dialog} from "$lib/components"
+import {repository} from "$app/core/state"
+```
+
+## File Structure
+
+```
+src/
+├── lib/                          # Generic reusable code
+│   ├── components/               # 38 UI components (Button, Dialog, etc.)
+│   ├── html.ts                   # DOM utilities
+│   ├── indexeddb.ts              # IndexedDB helpers
+│   └── util.ts                   # Generic utilities
+│
+├── app/
+│   ├── core/
+│   │   ├── state.ts              # State management, stores, constants (687 lines)
+│   │   ├── commands.ts           # Publishing events and other write operations (440+ lines)
+│   │   ├── requests.ts           # Loading data from network (191 lines)
+│   │   ├── sync.ts               # Data synchronization (296 lines)
+│   │   └── storage.ts            # IndexedDB setup
+│   │
+│   ├── util/
+│   │   ├── notifications.ts      # Push notifications (731 lines)
+│   │   ├── policies.ts           # Relay policies
+│   │   ├── routes.ts             # Routing helpers
+│   │   ├── modal.ts              # Modal management
+│   │   ├── toast.ts              # Toast notifications
+│   │   ├── theme.ts              # Theme switching
+│   │   └── keyboard.ts           # Keyboard handling
+│   │
+│   ├── editor/                   # Rich text editor config
+│   │   ├── index.ts              # TipTap setup with Nostr integration
+│   │   ├── EditorContent.svelte
+│   │   └── MentionNodeView.ts
+│   │
+│   └── components/               # 188 app-specific components
+│       ├── Space*.svelte         # Space/relay management
+│       ├── Room*.svelte          # Room/channel management
+│       ├── Chat*.svelte          # Direct messaging
+│       ├── Profile*.svelte       # User profiles
+│       ├── Thread*.svelte        # Threaded posts
+│       └── ...
+│
+├── routes/                       # SvelteKit file-based routing
+│   ├── +layout.svelte            # Root layout (sync logic here)
+│   ├── spaces/                   # Space management
+│   │   └── [relay]/              # Specific space
+│   │       ├── chat/             # Space chat
+│   │       ├── threads/          # Thread posts
+│   │       ├── calendar/         # Events
+│   │       └── [h]/              # Specific room (h = room id)
+│   ├── chat/                     # Direct messages
+│   ├── settings/                 # User settings
+│   └── [bech32]/                 # Bech32 entity viewer
+│
+├── assets/icons/                 # ~1,277 SVG icons
+├── app.html                      # HTML template
+├── app.css                       # Global styles
+└── types.d.ts                    # Type definitions
+```
+
+## State Management
+
+**Core Principles:**
+
+- Use Svelte 4 **stores** for all state (NOT runes outside UI components)
+- Most global state flows through Welshman's `repository` (unidirectional)
+- Query state using `deriveEventsMapped` or `deriveProfile` etc
+- Update state by publishing events via `publishThunk`
+
+**Thunks:**
+
+- Reduce UI latency by handling signatures and sending in background
+- Return status that should be displayed to user
+- Allow cancellation and error handling
+- Immediately publish to local repository for optimistic updates
+
+## Nostr Integration
+
+**Welshman Library Suite:**
+
+- `@welshman/app` - High-level state (pubkey, signer, repository, tracker)
+- `@welshman/net` - Network layer (Pool, Socket, load, pull, request)
+- `@welshman/store` - Svelte integration (deriveEventsMapped, etc.)
+- `@welshman/util` - Event utilities (kinds, tags, validation)
+- `@welshman/signer` - Signing abstraction (NIP-01, NIP-07, NIP-46)
+- `@welshman/router` - Relay routing (inbox/outbox model)
+- `@welshman/editor` - Rich text editor with Nostr
+- `@welshman/content` - Content parsing
+- `@welshman/feeds` - Feed management
+
+**Key NIPs Implemented:**
+
+- NIP-01: Basic protocol
+- NIP-44/59/17: Encrypted DMs
+- NIP-07: Browser extension signing
+- NIP-19: Bech32 encoding
+- NIP-29: Relay-based Groups
+- NIP-42: Relay authentication
+- NIP-43: Relay membership
+- NIP-46: Nostr Connect (remote signing)
+- NIP-57: Lightning Zaps
+
+## Development Conventions
+
+**Component Parameterization:**
+
+- Only pass entity identifiers (`url` for spaces, `h` for rooms)
+- Derive all other data inside the component from identifiers
+- Example: Don't pass `members` prop, derive it from `h` inside component
+
+**Code Style:**
+
+- **No `null`** - only use `undefined`
+- Svelte 5 runes (`$state`, `$derived`, `$effect`) only in UI components
+- TailwindCSS and DaisyUI styling
+- Only add comments for really weird stuff
+- Do not call functions in components unless a parameter is reactive. Instead, use a svelte store or rune to make it reactive.
+- Do not use `any`. If there are type errors related to `unknown`, they are likely because the upstream definition of the data is incorrect.
+- When dynamically building classes, use `cx` from `classnames` rather than embedded ternaries or svelte 4's old `class:` syntax.
+- When creating forms, use `FieldInline` or `Field` instead of custom elements/tailwindcss
+- Do not define svelte event handlers inline, instead name them and put them in the script section of templates
+
+## Common Tasks
+
+### Adding a New Component
+
+1. Determine if it's generic (`lib/components/`) or app-specific (`app/components/`)
+2. Follow naming convention: `PascalCase.svelte`
+3. Import in dependency order (3rd party → lib → app)
+4. Use stores for state, runes only for UI reactivity
+
+### Creating a New Route
+
+1. Add to `src/routes/` following SvelteKit conventions
+2. Use `+page.svelte` for page component
+3. Use `+layout.svelte` for shared layouts
+4. Top-level sync logic goes in root `+layout.svelte`
+
+### Loading Data from Network
+
+1. Use utilities from `app/core/requests.ts`
+2. Or create derived stores in `app/core/state.ts`
+3. Use `load`, `pull`, or `request` from `@welshman/net`
+
+### Publishing Events
+
+1. Create `make*` function to build event template
+2. Create `publish*` function using `publishThunk`
+3. Display thunk status to user (for cancel/error handling)
+4. These go in in `app/core/commands.ts`
+
+### Managing Modals/Toasts
+
+- Import from `app/util/modal.ts` or `app/util/toast.ts`
+- Pass component objects with parameters
+- Use `$state.snapshot` if calling component might unmount
+
+## Development Workflow
+
+Agents should not run the dev server or build the app. Instead, use the following commands:
+
+```bash
+pnpm run format           # Format changed files
+pnpm run lint             # Check formatting and linting
+pnpm run check            # Type check
+```
+
+**Welshman Development:**
+
+- Clone welshman to parent directory
+- Use `./link_deps` script to link local welshman packages
+- Avoid committing `pnpm.overrides` changes
+
+**Git Workflow:**
+
+- `master` branch auto-deploys to production
+- Work on feature branches based on `dev` branch
+- Pre-commit hooks run lint/typecheck automatically
+
+## Environment Variables
+
+See `.env.template` for all options.
+
+## Important Files to Reference
+
+- **src/app/core/state.ts** - All stores and constants
+- **src/app/core/sync.ts** - Data synchronization
+- **src/app/core/requests.ts** - Utilities for requesting data
+- **src/app/core/commands.ts** - Publishing patterns
+- **src/app/util/notifications.ts** - Notification badges and push notifications
+- **src/routes/+layout.svelte** - Top-level sync logic
+
+## Mobile Development
+
+**Capacitor Integration:**
+
+- Android: Full support, APK builds via `pnpm run release:android`
+- iOS: Full support (zaps disabled due to App Store policy)
+- PWA: Progressive Web App with service worker
+
+**Native Features:**
+
+- Push notifications (FCM/APNs)
+- Deep linking (nostr: and https: URLs)
+- Native signing plugin
+- Keyboard management
+- Safe area handling
+- Badge management

CHANGELOG.md

@@ -1,5 +1,183 @@
 # Changelog
 
+# 1.6.4
+
+* Clean up modal design
+* Fix overflowing popovers
+* Use space urls for relay hints
+* Re-work notification badges
+* Add push notification support via NIP 9a
+* Optimistically load messaging relays to avoid unnecessary warning
+* Recover from indexeddb not being available
+* Fix safe area inset support
+* Show space URL in top bar on mobile
+* Fix calendar detail page
+* Improve relay synchronization, especially for pyramid and relay29
+* Improve invite code error handling
+* Add wallet receive flow
+* Fix safari image uploads
+* Re-work recent activity page
+* Add classified listing content type
+* Use address for page param for replaceable events
+* Refine discover page to avoid slowness
+* Upgrade som dependencies
+* Tag event author when tagging parent event
+* Disable macos build
+* Add room muting
+
+# 1.6.3
+
+* Fix scroll down button z index
+* Hide tooltips on mobile
+* Sort comments ascending
+* Make video embeds rounded
+* Fix ProfileMultiSelect styling
+* Accept hex pubkeys/npubs/nprofiles in ProfileMultiSelect
+* Tweak room edit form design
+* Report pending signer to user
+* Update default relays
+* Fix chat list responsiveness
+* Fix memory leak, notification badge not showing
+* Improve space join flow
+* Fix opening images in fullscreen dialog
+* Add support for blocked relays
+* Add authentication policy setting
+* Add login with key if no signer is detected
+* Publish default relay selections on signup
+
+# 1.6.2
+
+* Fix modal scrolling and style
+
+# 1.6.1
+
+* Fix skinny profile images
+* Custom handler for relay urls
+* Improve time based chat partitioning
+* Improve authenticated image access interop
+* Fix image detail dialog
+* Fix zapper loading
+* Fix recent events missing in feeds
+
+# 1.6.0
+
+* Switch back to indexeddb to fix memory and performance
+* Add pay invoice functionality
+* Add space membership management and bans
+* Add event info to profile dialog
+* Add better room membership management
+* Refactor stores for performance
+* Hide nav when keyboard is open
+* Handle flotilla links in-app
+* Fix new messages indicator z-index
+* Fix some display bugs
+* Add date to chat items
+* Refine data synchronization
+* Hide nav when keyboard is open on mobile
+
+# 1.5.3
+
+* Add space edit form
+* Improve room syncing
+* Return better blossom errors
+* Fix access restricted bugs
+* Add room detail dialog
+* Fix broken link to self hosting
+* Tweak shadows
+* Always join spaces when visiting them
+
+# 1.5.2
+
+* Fix negentropy room syncing
+
+# 1.5.1
+
+* Fix chat path link
+
+# 1.5.0
+
+* Restyle mobile dialogs
+* Add room membership lists
+* Add space membership lists
+* Add edit room form
+* Support closed/private/restricted/hidden rooms
+* Add hosting services page
+* Improve performance and UI
+* Fix push notifications
+* Improve error detection and handling
+* Support invite links on discover page
+* Add link to landlubber if user is admin
+* Clear reply/share/edit on escape
+
+# 1.4.1
+
+* Improve data synchronization
+* Fix app url on capacitor deployments
+
+# 1.4.0
+
+* Allow "editing" chat messages
+* Check for room create permission
+* Re-work space navigation
+* Show all messages in non-nip29 chat
+* Improve synchronization logic
+* Add connection status to space menu
+* Add icon picker to room create component
+* Improve mention suggestions
+* Improve storage adapter and relay list performance
+* Fix modals
+* Add room deletion
+* Fix zapper loading
+* Add support for relay/group member lists and join/leave events
+
+# 1.3.1
+
+* Fix memory leak in storage adapter
+* Show fewer annoying toast messages
+
+# 1.3.0
+
+* Add optional badge and sound for notifications
+* Improve link rendering
+* Remove imgproxy
+* Bring back blossom feature detection for spaces
+* Improve light theme
+* Add more info to signer status
+* Simplify navigation for adding a space
+* Add ability to scan QR code for invite links
+* Streamline wallet setup and move receive address setting
+* Remove indexeddb on mobile, use capacitor file storage API
+* Fix duplicate DMs showing up
+
+# 1.2.5
+
+* Fix icons in build
+
+# 1.2.4
+
+* Add direct message alerts
+* Add alert settings page
+* Add instructions to key download
+* Add option that allows relays to strip signatures
+* Detect relays that mostly refuse to serve requests
+* Compress and upload profile images
+* Use system theme by default
+* Switch icon set, refactor how they're included
+* Use capacitor's preferences for storage instead of localStorage
+
+# 1.2.3
+
+* Add `created_at` to event info dialog
+* Add signer status to profile page
+* Re-work bunker login flow
+* Add in-app onboarding flow
+* Only protect events if relay authenticates
+* Filter out non-global chats from global chat
+* Improve publish status indicator
+* Fix encrypted upload content type
+* Add relays to event details dialog
+* Add universal link handler for apps
+
 # 1.2.2
 
 * Fix phantom chat notifications

CLAUDE.md

@@ -1,26 +0,0 @@
-## Project Overview
-
-Flotilla is a Discord-like Nostr client that operates on the concept of "relays as groups/spaces." Built with SvelteKit 2.5 and Svelte 5, it provides messaging, threads, calendar events, and social features across Nostr relays.
-
-## Important Patterns
-
-### Finding Code
-- Prefer navigating from one file to the next following imports when possible
-- If search is necessary, use `ack`, not `grep` or `rg`.
-
-### Nostr Event Handling
-- Prefer seconds to milliseconds when handling nostr events.
-
-### Styling Conventions
-- When styling html, prefer flex/gap classes over margin or space-y classes.
-
-### Room/space memberships
-
-Memberships are surfaced as "bookmarks" to the user.
-
-```typescript
-import {membershipsByPubkey, getMembershipUrls} from '@app/state'
-
-const spaces = getMembershipUrls($membershipsByPubkey.get(pubkey))
-const rooms = getMembershipRooms($membershipsByPubkey.get(pubkey))
-```

README.md

@@ -8,21 +8,19 @@ If you would like to be interoperable with Flotilla, please check out this guide
 
 You can also optionally create an `.env` file and populate it with the following environment variables (see `.env` for examples):
 
-- `VITE_DEFAULT_PUBKEYS` - A comma-separated list of hex pubkeys for bootstrapping web of trust.
-- `VITE_PLATFORM_URL` - The url where the app will be hosted. This is only used for build-time population of meta tags.
+- `VITE_DEFAULT_PUBKEYS` - A comma-separated list of hex pubkeys for bootstrapping web of trust
+- `VITE_PLATFORM_URL` - The url where the app will be hosted
 - `VITE_PLATFORM_NAME` - The name of the app
 - `VITE_PLATFORM_LOGO` - A logo url for the app
 - `VITE_PLATFORM_RELAYS` - A list of comma-separated relay urls that will make flotilla operate in "platform mode". Disables all space browse/add/select functionality and makes the first platform relay the home page.
 - `VITE_PLATFORM_ACCENT` - A hex color for the app's accent color
 - `VITE_PLATFORM_DESCRIPTION` - A description of the app
-- `VITE_GLITCHTIP_API_KEY` - A Sentry DSN for use with glitchtip (error reporting)
-- `GLITCHTIP_AUTH_TOKEN` - A glitchtip auth token for error reporting
 
 If you're deploying a custom version of flotilla, be sure to remove the `plausible.coracle.social` script from `app.html`. This sends analytics to a server hosted by the developer.
 
 ## Development
 
-Run `pnpm run dev` to get a dev server, and `pnpm run check:watch` to watch for typescript errors. When you're ready to commit, a pre-commit hook will run to lint and typecheck your work.
+See [./CONTRIBUTING.md](CONTRIBUTING.md).
 
 ## Deployment
 

android/app/build.gradle

@@ -1,19 +1,19 @@
 apply plugin: 'com.android.application'
 
 android {
-    namespace "social.flotilla"
-    compileSdk rootProject.ext.compileSdkVersion
+    namespace = "social.flotilla"
+    compileSdk = rootProject.ext.compileSdkVersion
     defaultConfig {
         applicationId "social.flotilla"
         minSdk rootProject.ext.minSdkVersion
         targetSdk rootProject.ext.targetSdkVersion
-        versionCode 23
-        versionName "1.2.2"
+        versionCode 40
+        versionName "1.6.4"
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         aaptOptions {
              // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.
              // Default: https://android.googlesource.com/platform/frameworks/base/+/282e181b58cf72b6ca770dc7ca5f91f135444502/tools/aapt/AaptAssets.cpp#61
-            ignoreAssetsPattern '!.svn:!.git:!.ds_store:!*.scc:.*:!CVS:!thumbs.db:!picasa.ini:!*~'
+            ignoreAssetsPattern = '!.svn:!.git:!.ds_store:!*.scc:.*:!CVS:!thumbs.db:!picasa.ini:!*~'
         }
     }
     buildTypes {

android/app/capacitor.build.gradle

@@ -11,8 +11,11 @@ apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
 dependencies {
     implementation project(':capacitor-community-safe-area')
     implementation project(':capacitor-app')
+    implementation project(':capacitor-filesystem')
     implementation project(':capacitor-keyboard')
+    implementation project(':capacitor-preferences')
     implementation project(':capacitor-push-notifications')
+    implementation project(':capawesome-capacitor-android-dark-mode-support')
     implementation project(':capawesome-capacitor-badge')
     implementation project(':nostr-signer-capacitor-plugin')
 

android/app/src/main/AndroidManifest.xml

@@ -9,7 +9,7 @@
         android:theme="@style/AppTheme"
         android:usesCleartextTraffic="true">
         <activity
-            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode|navigation"
+            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode|navigation|density"
             android:name=".MainActivity"
             android:label="@string/title_activity_main"
             android:theme="@style/AppTheme.NoActionBarLaunch"
@@ -20,6 +20,13 @@
                 <action android:name="android.intent.action.MAIN" />
                 <category android:name="android.intent.category.LAUNCHER" />
             </intent-filter>
+
+            <intent-filter android:autoVerify="true">
+                <action android:name="android.intent.action.VIEW" />
+                <category android:name="android.intent.category.DEFAULT" />
+                <category android:name="android.intent.category.BROWSABLE" />
+                <data android:scheme="https" android:host="app.flotilla.social" />
+            </intent-filter>
         </activity>
 
         <provider

android/app/src/main/res/values/styles.xml

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
-<resources>
+<resources xmlns:tools="http://schemas.android.com/tools">
 
     <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
         <item name="colorPrimary">@color/colorPrimary</item>
@@ -11,6 +11,7 @@
         <item name="windowActionBar">false</item>
         <item name="windowNoTitle">true</item>
         <item name="android:background">@null</item>
+        <item name="android:windowOptOutEdgeToEdgeEnforcement" tools:ignore="NewApi">true</item>
     </style>
 
 

android/build.gradle

@@ -7,8 +7,8 @@ buildscript {
         mavenCentral()
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:8.8.0'
-        classpath 'com.google.gms:google-services:4.4.2'
+        classpath 'com.android.tools.build:gradle:8.13.2'
+        classpath 'com.google.gms:google-services:4.4.4'
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

android/capacitor.settings.gradle

@@ -1,21 +1,30 @@
 // DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN
 include ':capacitor-android'
-project(':capacitor-android').projectDir = new File('../node_modules/.pnpm/@capacitor+android@7.2.0_@capacitor+core@7.2.0/node_modules/@capacitor/android/capacitor')
+project(':capacitor-android').projectDir = new File('../node_modules/.pnpm/@capacitor+android@8.0.1_@capacitor+core@8.0.1/node_modules/@capacitor/android/capacitor')
 
 include ':capacitor-community-safe-area'
-project(':capacitor-community-safe-area').projectDir = new File('../node_modules/.pnpm/@capacitor-community+safe-area@7.0.0-alpha.1_@capacitor+core@7.2.0/node_modules/@capacitor-community/safe-area/android')
+project(':capacitor-community-safe-area').projectDir = new File('../node_modules/.pnpm/@capacitor-community+safe-area@8.0.1_@capacitor+core@8.0.1/node_modules/@capacitor-community/safe-area/android')
 
 include ':capacitor-app'
-project(':capacitor-app').projectDir = new File('../node_modules/.pnpm/@capacitor+app@7.0.1_@capacitor+core@7.2.0/node_modules/@capacitor/app/android')
+project(':capacitor-app').projectDir = new File('../node_modules/.pnpm/@capacitor+app@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/app/android')
+
+include ':capacitor-filesystem'
+project(':capacitor-filesystem').projectDir = new File('../node_modules/.pnpm/@capacitor+filesystem@8.1.0_@capacitor+core@8.0.1/node_modules/@capacitor/filesystem/android')
 
 include ':capacitor-keyboard'
-project(':capacitor-keyboard').projectDir = new File('../node_modules/.pnpm/@capacitor+keyboard@7.0.1_@capacitor+core@7.2.0/node_modules/@capacitor/keyboard/android')
+project(':capacitor-keyboard').projectDir = new File('../node_modules/.pnpm/@capacitor+keyboard@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/keyboard/android')
+
+include ':capacitor-preferences'
+project(':capacitor-preferences').projectDir = new File('../node_modules/.pnpm/@capacitor+preferences@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/preferences/android')
 
 include ':capacitor-push-notifications'
-project(':capacitor-push-notifications').projectDir = new File('../node_modules/.pnpm/@capacitor+push-notifications@7.0.1_@capacitor+core@7.2.0/node_modules/@capacitor/push-notifications/android')
+project(':capacitor-push-notifications').projectDir = new File('../node_modules/.pnpm/@capacitor+push-notifications@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/push-notifications/android')
+
+include ':capawesome-capacitor-android-dark-mode-support'
+project(':capawesome-capacitor-android-dark-mode-support').projectDir = new File('../node_modules/.pnpm/@capawesome+capacitor-android-dark-mode-support@8.0.0_@capacitor+core@8.0.1/node_modules/@capawesome/capacitor-android-dark-mode-support/android')
 
 include ':capawesome-capacitor-badge'
-project(':capawesome-capacitor-badge').projectDir = new File('../node_modules/.pnpm/@capawesome+capacitor-badge@7.0.1_@capacitor+core@7.2.0/node_modules/@capawesome/capacitor-badge/android')
+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@0.0.4_@capacitor+core@7.2.0/node_modules/nostr-signer-capacitor-plugin/android')
+project(':nostr-signer-capacitor-plugin').projectDir = new File('../node_modules/.pnpm/nostr-signer-capacitor-plugin@0.0.4_@capacitor+core@8.0.1/node_modules/nostr-signer-capacitor-plugin/android')

android/gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-8.11.1-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.14.3-all.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME

android/gradlew

@@ -86,8 +86,7 @@ done
 # shellcheck disable=SC2034
 APP_BASE_NAME=${0##*/}
 # Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
-APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s
-' "$PWD" ) || exit
+APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s\n' "$PWD" ) || exit
 
 # Use the maximum available, or set MAX_FD != -1 to use that value.
 MAX_FD=maximum
@@ -115,7 +114,7 @@ case "$( uname )" in                #(
   NONSTOP* )        nonstop=true ;;
 esac
 
-CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
+CLASSPATH="\\\"\\\""
 
 
 # Determine the Java command to use to start the JVM.
@@ -206,7 +205,7 @@ fi
 DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
 
 # Collect all arguments for the java command:
-#   * DEFAULT_JVM_OPTS, JAVA_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
+#   * DEFAULT_JVM_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
 #     and any embedded shellness will be escaped.
 #   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
 #     treated as '${Hostname}' itself on the command line.
@@ -214,7 +213,7 @@ DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
 set -- \
         "-Dorg.gradle.appname=$APP_BASE_NAME" \
         -classpath "$CLASSPATH" \
-        org.gradle.wrapper.GradleWrapperMain \
+        -jar "$APP_HOME/gradle/wrapper/gradle-wrapper.jar" \
         "$@"
 
 # Stop when "xargs" is not available.

android/gradlew.bat

@@ -70,11 +70,11 @@ goto fail
 :execute
 @rem Setup the command line
 
-set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
+set CLASSPATH=
 
 
 @rem Execute Gradle
-"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" -jar "%APP_HOME%\gradle\wrapper\gradle-wrapper.jar" %*
 
 :end
 @rem End local scope for the variables with windows NT shell

android/variables.gradle

@@ -1,18 +1,18 @@
 ext {
-    minSdkVersion = 23
-    compileSdkVersion = 35
-    targetSdkVersion = 35
-    androidxActivityVersion = '1.9.2'
+    minSdkVersion = 24
+    compileSdkVersion = 36
+    targetSdkVersion = 36
+    androidxActivityVersion = '1.11.0'
     //https://github.com/ionic-team/capacitor/issues/7866
-    // androidxAppCompatVersion = '1.7.0'
-    androidxAppCompatVersion = '1.6.1'
-    androidxCoordinatorLayoutVersion = '1.2.0'
-    androidxCoreVersion = '1.15.0'
-    androidxFragmentVersion = '1.8.4'
-    coreSplashScreenVersion = '1.0.1'
-    androidxWebkitVersion = '1.12.1'
+    // androidxAppCompatVersion = '1.7.1'
+    androidxAppCompatVersion = '1.7.1'
+    androidxCoordinatorLayoutVersion = '1.3.0'
+    androidxCoreVersion = '1.17.0'
+    androidxFragmentVersion = '1.8.9'
+    coreSplashScreenVersion = '1.2.0'
+    androidxWebkitVersion = '1.14.0'
     junitVersion = '4.13.2'
-    androidxJunitVersion = '1.2.1'
-    androidxEspressoCoreVersion = '3.6.1'
-    cordovaAndroidVersion = '10.1.1'
+    androidxJunitVersion = '1.3.0'
+    androidxEspressoCoreVersion = '3.7.0'
+    cordovaAndroidVersion = '14.0.1'
 }

build.sh

@@ -6,10 +6,6 @@ if [ -f .env.template ]; then
   source .env.template
 fi
 
-if [ -f .env ]; then
-  source .env
-fi
-
 # Avoid overwriting env vars provided directly
 # https://stackoverflow.com/a/69127685/1467342
 eval "$temp_env"

capacitor.config.ts

@@ -1,15 +1,21 @@
-import type { CapacitorConfig } from '@capacitor/cli';
+import type {CapacitorConfig} from "@capacitor/cli"
 
 const config: CapacitorConfig = {
-  appId: 'social.flotilla',
-  appName: 'Flotilla',
-  webDir: 'build'
-  server: {
-    androidScheme: "https"
+  appId: "social.flotilla",
+  appName: "Flotilla",
+  webDir: "build",
+  android: {
+    adjustMarginsForEdgeToEdge: true,
   },
   plugins: {
+    CapacitorHttp: {
+      enabled: true,
+    },
+    SystemBars: {
+      insetsHandling: "enable",
+    },
     SplashScreen: {
-      androidSplashResourceName: "splash"
+      androidSplashResourceName: "splash",
     },
     Keyboard: {
       style: "DARK",
@@ -17,14 +23,14 @@ const config: CapacitorConfig = {
     },
     Badge: {
       persist: true,
-      autoClear: true
+      autoClear: true,
     },
   },
-  // Use this for live reload https://capacitorjs.com/docs/guides/live-reload
-  // server: {
-  //   url: "http://192.168.1.115:1847",
-  //   cleartext: true
-  // },
-};
+  server: {
+    // Use this for live reload https://capacitorjs.com/docs/guides/live-reload
+    // url: "http://192.168.1.17:1847",
+    // cleartext: true,
+  },
+}
 
-export default config;
+export default config

ios/App/App.xcodeproj/project.pbxproj

@@ -8,6 +8,7 @@
 
 /* Begin PBXBuildFile section */
 		2FAD9763203C412B000D30F8 /* config.xml in Resources */ = {isa = PBXBuildFile; fileRef = 2FAD9762203C412B000D30F8 /* config.xml */; };
+		3478F0332E846FEB002431E0 /* PrivacyInfo.xcprivacy in Resources */ = {isa = PBXBuildFile; fileRef = 3478F0322E846FEB002431E0 /* PrivacyInfo.xcprivacy */; };
 		50379B232058CBB4000EE86E /* capacitor.config.json in Resources */ = {isa = PBXBuildFile; fileRef = 50379B222058CBB4000EE86E /* capacitor.config.json */; };
 		504EC3081FED79650016851F /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 504EC3071FED79650016851F /* AppDelegate.swift */; };
 		504EC30D1FED79650016851F /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 504EC30B1FED79650016851F /* Main.storyboard */; };
@@ -21,6 +22,7 @@
 		051414282E0CC28400BE0BC8 /* Flotilla Chat.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = "Flotilla Chat.entitlements"; sourceTree = "<group>"; };
 		1F53EE54954731A2328CBC4B /* Pods-Flotilla Chat.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-Flotilla Chat.release.xcconfig"; path = "Pods/Target Support Files/Pods-Flotilla Chat/Pods-Flotilla Chat.release.xcconfig"; sourceTree = "<group>"; };
 		2FAD9762203C412B000D30F8 /* config.xml */ = {isa = PBXFileReference; lastKnownFileType = text.xml; path = config.xml; sourceTree = "<group>"; };
+		3478F0322E846FEB002431E0 /* PrivacyInfo.xcprivacy */ = {isa = PBXFileReference; lastKnownFileType = text.xml; path = PrivacyInfo.xcprivacy; sourceTree = "<group>"; };
 		50379B222058CBB4000EE86E /* capacitor.config.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = capacitor.config.json; sourceTree = "<group>"; };
 		504EC3041FED79650016851F /* Flotilla Chat.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "Flotilla Chat.app"; sourceTree = BUILT_PRODUCTS_DIR; };
 		504EC3071FED79650016851F /* AppDelegate.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
@@ -58,6 +60,7 @@
 		504EC2FB1FED79650016851F = {
 			isa = PBXGroup;
 			children = (
+				3478F0322E846FEB002431E0 /* PrivacyInfo.xcprivacy */,
 				051414282E0CC28400BE0BC8 /* Flotilla Chat.entitlements */,
 				504EC3061FED79650016851F /* App */,
 				504EC3051FED79650016851F /* Products */,
@@ -162,6 +165,7 @@
 			buildActionMask = 2147483647;
 			files = (
 				504EC3121FED79650016851F /* LaunchScreen.storyboard in Resources */,
+				3478F0332E846FEB002431E0 /* PrivacyInfo.xcprivacy in Resources */,
 				50B271D11FEDC1A000F3C39B /* public in Resources */,
 				504EC30F1FED79650016851F /* Assets.xcassets in Resources */,
 				50379B232058CBB4000EE86E /* capacitor.config.json in Resources */,
@@ -287,7 +291,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 14.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
 				MTL_ENABLE_DEBUG_INFO = YES;
 				ONLY_ACTIVE_ARCH = YES;
 				SDKROOT = iphoneos;
@@ -338,7 +342,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 14.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
 				MTL_ENABLE_DEBUG_INFO = NO;
 				SDKROOT = iphoneos;
 				SWIFT_OPTIMIZATION_LEVEL = "-Owholemodule";
@@ -354,18 +358,19 @@
 				CODE_SIGN_ENTITLEMENTS = "Flotilla Chat.entitlements";
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 16;
+				CURRENT_PROJECT_VERSION = 30;
 				DEVELOPMENT_TEAM = S26U9DYW3A;
 				INFOPLIST_FILE = App/Info.plist;
 				INFOPLIST_KEY_CFBundleDisplayName = "Flotilla Chat";
 				INFOPLIST_KEY_LSApplicationCategoryType = "public.app-category.social-networking";
-				IPHONEOS_DEPLOYMENT_TARGET = 14.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.2.2;
+				MARKETING_VERSION = 1.6.4;
 				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
 				PRODUCT_BUNDLE_IDENTIFIER = social.flotilla;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
+				SUPPORTS_MAC_DESIGNED_FOR_IPHONE_IPAD = NO;
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = DEBUG;
 				SWIFT_VERSION = 5.0;
 				TARGETED_DEVICE_FAMILY = "1,2";
@@ -380,17 +385,18 @@
 				CODE_SIGN_ENTITLEMENTS = "Flotilla Chat.entitlements";
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 16;
+				CURRENT_PROJECT_VERSION = 30;
 				DEVELOPMENT_TEAM = S26U9DYW3A;
 				INFOPLIST_FILE = App/Info.plist;
 				INFOPLIST_KEY_CFBundleDisplayName = "Flotilla Chat";
 				INFOPLIST_KEY_LSApplicationCategoryType = "public.app-category.social-networking";
-				IPHONEOS_DEPLOYMENT_TARGET = 14.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 15.0;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.2.2;
+				MARKETING_VERSION = 1.6.4;
 				PRODUCT_BUNDLE_IDENTIFIER = social.flotilla;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
+				SUPPORTS_MAC_DESIGNED_FOR_IPHONE_IPAD = NO;
 				SWIFT_ACTIVE_COMPILATION_CONDITIONS = "";
 				SWIFT_VERSION = 5.0;
 				TARGETED_DEVICE_FAMILY = "1,2";

ios/App/Flotilla Chat.entitlements

@@ -4,5 +4,9 @@
 <dict>
 	<key>aps-environment</key>
 	<string>development</string>
+	<key>com.apple.developer.associated-domains</key>
+	<array>
+		<string>applinks:app.flotilla.social</string>
+	</array>
 </dict>
 </plist>

ios/App/Podfile

@@ -1,6 +1,6 @@
-require_relative '../../node_modules/.pnpm/@capacitor+ios@7.2.0_@capacitor+core@7.2.0/node_modules/@capacitor/ios/scripts/pods_helpers'
+require_relative '../../node_modules/.pnpm/@capacitor+ios@8.0.1_@capacitor+core@8.0.1/node_modules/@capacitor/ios/scripts/pods_helpers'
 
-platform :ios, '14.0'
+platform :ios, '15.0'
 use_frameworks!
 
 # workaround to avoid Xcode caching of Pods that requires
@@ -9,14 +9,16 @@ use_frameworks!
 install! 'cocoapods', :disable_input_output_paths => true
 
 def capacitor_pods
-  pod 'Capacitor', :path => '../../node_modules/.pnpm/@capacitor+ios@7.2.0_@capacitor+core@7.2.0/node_modules/@capacitor/ios'
-  pod 'CapacitorCordova', :path => '../../node_modules/.pnpm/@capacitor+ios@7.2.0_@capacitor+core@7.2.0/node_modules/@capacitor/ios'
-  pod 'CapacitorCommunitySafeArea', :path => '../../node_modules/.pnpm/@capacitor-community+safe-area@7.0.0-alpha.1_@capacitor+core@7.2.0/node_modules/@capacitor-community/safe-area'
-  pod 'CapacitorApp', :path => '../../node_modules/.pnpm/@capacitor+app@7.0.1_@capacitor+core@7.2.0/node_modules/@capacitor/app'
-  pod 'CapacitorKeyboard', :path => '../../node_modules/.pnpm/@capacitor+keyboard@7.0.1_@capacitor+core@7.2.0/node_modules/@capacitor/keyboard'
-  pod 'CapacitorPushNotifications', :path => '../../node_modules/.pnpm/@capacitor+push-notifications@7.0.1_@capacitor+core@7.2.0/node_modules/@capacitor/push-notifications'
-  pod 'CapawesomeCapacitorBadge', :path => '../../node_modules/.pnpm/@capawesome+capacitor-badge@7.0.1_@capacitor+core@7.2.0/node_modules/@capawesome/capacitor-badge'
-  pod 'NostrSignerCapacitorPlugin', :path => '../../node_modules/.pnpm/nostr-signer-capacitor-plugin@0.0.4_@capacitor+core@7.2.0/node_modules/nostr-signer-capacitor-plugin'
+  pod 'Capacitor', :path => '../../node_modules/.pnpm/@capacitor+ios@8.0.1_@capacitor+core@8.0.1/node_modules/@capacitor/ios'
+  pod 'CapacitorCordova', :path => '../../node_modules/.pnpm/@capacitor+ios@8.0.1_@capacitor+core@8.0.1/node_modules/@capacitor/ios'
+  pod 'CapacitorCommunitySafeArea', :path => '../../node_modules/.pnpm/@capacitor-community+safe-area@8.0.1_@capacitor+core@8.0.1/node_modules/@capacitor-community/safe-area'
+  pod 'CapacitorApp', :path => '../../node_modules/.pnpm/@capacitor+app@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/app'
+  pod 'CapacitorFilesystem', :path => '../../node_modules/.pnpm/@capacitor+filesystem@8.1.0_@capacitor+core@8.0.1/node_modules/@capacitor/filesystem'
+  pod 'CapacitorKeyboard', :path => '../../node_modules/.pnpm/@capacitor+keyboard@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/keyboard'
+  pod 'CapacitorPreferences', :path => '../../node_modules/.pnpm/@capacitor+preferences@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/preferences'
+  pod 'CapacitorPushNotifications', :path => '../../node_modules/.pnpm/@capacitor+push-notifications@8.0.0_@capacitor+core@8.0.1/node_modules/@capacitor/push-notifications'
+  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@0.0.4_@capacitor+core@8.0.1/node_modules/nostr-signer-capacitor-plugin'
 end
 
 target 'Flotilla Chat' do

ios/App/PrivacyInfo.xcprivacy

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>NSPrivacyAccessedAPITypes</key>
+	<array>
+		<dict>
+			<key>NSPrivacyAccessedAPIType</key>
+			<string>NSPrivacyAccessedAPICategoryFileTimestamp</string>
+			<key>NSPrivacyAccessedAPITypeReasons</key>
+			<array>
+				<string>C617.1</string>
+			</array>
+		</dict>
+	</array>
+</dict>
+</plist>

link_deps

@@ -0,0 +1,32 @@
+#!/usr/bin/env node
+
+import fs from 'fs'
+import path from 'path'
+import { execSync } from 'child_process'
+
+if (execSync('git status --porcelain', { encoding: 'utf8' }).trim()) {
+  console.error('Error: Git working tree is dirty. Please commit or stash your changes first.')
+  process.exit(1)
+}
+
+const pkg = JSON.parse(fs.readFileSync('./package.json', 'utf8'))
+
+pkg.pnpm.overrides = pkg.pnpm.overrides || {}
+pkg.pnpm.overrides["@welshman/app"] = "link:../welshman/packages/app"
+pkg.pnpm.overrides["@welshman/content"] = "link:../welshman/packages/content"
+pkg.pnpm.overrides["@welshman/editor"] = "link:../welshman/packages/editor"
+pkg.pnpm.overrides["@welshman/feeds"] = "link:../welshman/packages/feeds"
+pkg.pnpm.overrides["@welshman/lib"] = "link:../welshman/packages/lib"
+pkg.pnpm.overrides["@welshman/net"] = "link:../welshman/packages/net"
+pkg.pnpm.overrides["@welshman/router"] = "link:../welshman/packages/router"
+pkg.pnpm.overrides["@welshman/signer"] = "link:../welshman/packages/signer"
+pkg.pnpm.overrides["@welshman/store"] = "link:../welshman/packages/store"
+pkg.pnpm.overrides["@welshman/util"] = "link:../welshman/packages/util"
+// pkg.pnpm.overrides["@pomade/core"] = "link:../pomade/packages/core"
+
+fs.writeFileSync('./package.json', JSON.stringify(pkg, null, 2) + '\n')
+
+execSync('pnpm i', { stdio: 'inherit' })
+
+execSync('git checkout -f pnpm-lock.yaml', { stdio: 'inherit' })
+execSync('git checkout -f package.json', { stdio: 'inherit' })

package.json

@@ -1,83 +1,86 @@
 {
   "name": "flotilla",
-  "version": "1.2.2",
+  "version": "1.6.4",
   "private": true,
   "scripts": {
     "dev": "vite dev",
     "build": "./build.sh",
-    "sourcemaps": "./build.sh && ./sourcemaps.sh",
     "release:android": "./build.sh && cap build android --androidreleasetype APK --signing-type apksigner",
     "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",
-    "format": "prettier --write src",
+    "format": "git diff head --name-only --diff-filter d | grep -E '(js|ts|svelte|css)$' | xargs -r prettier --write",
+    "format:all": "prettier --write src",
     "prepare": "husky"
   },
   "devDependencies": {
     "@capacitor/assets": "^3.0.5",
-    "@eslint/js": "^9.26.0",
-    "@sentry/cli": "^2.40.0",
-    "@sveltejs/kit": "^2.5.27",
-    "@sveltejs/vite-plugin-svelte": "^4.0.0",
-    "@types/eslint": "^9.6.0",
-    "autoprefixer": "^10.4.19",
+    "@eslint/js": "^9.39.2",
+    "@sveltejs/kit": "^2.50.1",
+    "@sveltejs/vite-plugin-svelte": "^4.0.4",
+    "@types/eslint": "^9.6.1",
+    "autoprefixer": "^10.4.23",
     "classnames": "^2.5.1",
-    "eslint": "^9.0.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-svelte": "^2.45.1",
-    "globals": "^15.0.0",
-    "postcss": "^8.4.40",
-    "prettier": "^3.1.1",
-    "prettier-plugin-svelte": "^3.2.6",
-    "svelte": "^5.0.0",
-    "svelte-check": "^4.0.0",
-    "tailwindcss": "^3.4.7",
-    "typescript": "^5.5.0",
-    "typescript-eslint": "^8.0.0",
-    "vite": "^5.4.4"
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^9.1.2",
+    "eslint-plugin-svelte": "^2.46.1",
+    "globals": "^15.15.0",
+    "postcss": "^8.5.6",
+    "prettier": "^3.8.1",
+    "prettier-plugin-svelte": "^3.4.1",
+    "svelte": "^5.48.0",
+    "svelte-check": "^4.3.5",
+    "tailwindcss": "^3.4.19",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.53.1",
+    "vite": "^5.4.21"
   },
   "type": "module",
   "dependencies": {
-    "@capacitor-community/safe-area": "7.0.0-alpha.1",
-    "@capacitor/android": "^7.0.0",
-    "@capacitor/app": "^7.0.0",
-    "@capacitor/cli": "^7.0.0",
-    "@capacitor/core": "^7.0.1",
-    "@capacitor/ios": "^7.0.0",
-    "@capacitor/keyboard": "^7.0.0",
-    "@capacitor/push-notifications": "^7.0.1",
-    "@capawesome/capacitor-badge": "^7.0.1",
-    "@getalby/sdk": "^5.1.0",
+    "@capacitor-community/safe-area": "^8.0.1",
+    "@capacitor/android": "^8.0.1",
+    "@capacitor/app": "^8.0.0",
+    "@capacitor/cli": "^8.0.1",
+    "@capacitor/core": "^8.0.1",
+    "@capacitor/filesystem": "^8.1.0",
+    "@capacitor/ios": "^8.0.1",
+    "@capacitor/keyboard": "^8.0.0",
+    "@capacitor/preferences": "^8.0.0",
+    "@capacitor/push-notifications": "^8.0.0",
+    "@capawesome/capacitor-android-dark-mode-support": "^8.0.0",
+    "@capawesome/capacitor-badge": "^8.0.0",
+    "@getalby/lightning-tools": "^6.1.0",
+    "@getalby/sdk": "^5.1.2",
+    "@noble/curves": "^1.9.7",
+    "@pomade/core": "^0.0.12",
     "@poppanator/sveltekit-svg": "^4.2.1",
-    "@sentry/browser": "^8.35.0",
-    "@sveltejs/adapter-static": "^3.0.4",
-    "@tiptap/core": "^2.12.0",
-    "@types/qrcode": "^1.5.5",
+    "@sveltejs/adapter-static": "^3.0.10",
+    "@tiptap/core": "^2.27.2",
+    "@types/qrcode": "^1.5.6",
     "@types/throttle-debounce": "^5.0.2",
     "@vite-pwa/assets-generator": "^0.2.6",
-    "@vite-pwa/sveltekit": "^0.6.6",
-    "@welshman/app": "^0.4.0",
-    "@welshman/content": "^0.4.0",
-    "@welshman/editor": "^0.4.0",
-    "@welshman/feeds": "^0.4.0",
-    "@welshman/lib": "^0.4.0",
-    "@welshman/net": "^0.4.0",
-    "@welshman/relay": "^0.4.0",
-    "@welshman/router": "^0.4.0",
-    "@welshman/signer": "^0.4.0",
-    "@welshman/store": "^0.4.0",
-    "@welshman/util": "^0.4.0",
+    "@vite-pwa/sveltekit": "^0.6.8",
+    "@welshman/app": "^0.8.4",
+    "@welshman/content": "^0.8.4",
+    "@welshman/editor": "^0.8.4",
+    "@welshman/feeds": "^0.8.4",
+    "@welshman/lib": "^0.8.4",
+    "@welshman/net": "^0.8.4",
+    "@welshman/router": "^0.8.4",
+    "@welshman/signer": "^0.8.4",
+    "@welshman/store": "^0.8.4",
+    "@welshman/util": "^0.8.4",
     "compressorjs": "^1.2.1",
-    "daisyui": "^4.12.10",
-    "date-picker-svelte": "^2.13.0",
-    "dotenv": "^16.4.5",
-    "emoji-picker-element": "^1.22.8",
-    "fuse.js": "^7.0.0",
-    "husky": "^9.1.6",
-    "idb": "^8.0.0",
+    "daisyui": "^4.12.24",
+    "date-picker-svelte": "^2.17.0",
+    "dotenv": "^16.6.1",
+    "emoji-picker-element": "^1.28.1",
+    "fuse.js": "^7.1.0",
+    "husky": "^9.1.7",
+    "idb": "^8.0.3",
     "nostr-signer-capacitor-plugin": "^0.0.4",
-    "nostr-tools": "^2.14.2",
-    "prettier-plugin-tailwindcss": "^0.6.5",
+    "nostr-tools": "^2.19.4",
+    "prettier-plugin-tailwindcss": "^0.6.14",
     "qr-scanner": "^1.4.2",
     "qrcode": "^1.5.4",
     "throttle-debounce": "^5.0.2",
@@ -85,11 +88,13 @@
   },
   "pnpm": {
     "ignoredBuiltDependencies": [
-      "@sentry/cli",
       "esbuild"
     ],
     "onlyBuiltDependencies": [
       "sharp"
-    ]
+    ],
+    "overrides": {
+      "sharp": "0.35.0-rc.0"
+    }
   }
 }

sourcemaps.sh

@@ -1,15 +0,0 @@
-#!/bin/bash
-
-hash=$(find build -type f -print0 | sort -z | xargs -0 sha1sum | sha1sum | awk '{print $1}')
-
-sentry-cli \
-  --url https://glitchtip.coracle.social \
-  --auth-token $GLITCHTIP_AUTH_TOKEN \
-  --api-key $VITE_GLITCHTIP_API_KEY \
-  sourcemaps \
-  --org coracle \
-  --project flotilla \
-  --release $hash \
-  upload \
-  --url-prefix /_app/immutable/ \
-  build/_app/immutable

src/app.css

@@ -46,10 +46,10 @@
 
 :root {
   font-family: Lato;
-  --sait: env(safe-area-inset-top);
-  --saib: env(safe-area-inset-bottom);
-  --sail: env(safe-area-inset-left);
-  --sair: env(safe-area-inset-right);
+  --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));
+  --sair: var(--safe-area-inset-right, env(safe-area-inset-right));
 }
 
 [data-theme] {
@@ -62,6 +62,12 @@
   --primary-content: oklch(var(--pc));
   --secondary: oklch(var(--s));
   --secondary-content: oklch(var(--sc));
+  --neutral: oklch(var(--n));
+  --neutral-content: oklch(var(--nc));
+}
+
+.mobile [data-tip]::before {
+  display: none !important;
 }
 
 /* safe area insets */
@@ -96,19 +102,19 @@
   }
 
   .mt-sai {
-    padding-top: var(--sait);
+    margin-top: var(--sait);
   }
 
   .mr-sai {
-    padding-right: var(--sair);
+    margin-right: var(--sair);
   }
 
   .mb-sai {
-    padding-bottom: var(--saib);
+    margin-bottom: var(--saib);
   }
 
   .ml-sai {
-    padding-left: var(--sail);
+    margin-left: var(--sail);
   }
 
   .mx-sai {
@@ -160,11 +166,11 @@
 }
 
 .card2 {
-  @apply rounded-box p-6 text-base-content;
+  @apply rounded-box p-4 text-base-content sm:p-6;
 }
 
 .card2.card2-sm {
-  @apply p-4 text-base-content;
+  @apply p-2 text-base-content sm:p-4;
 }
 
 .column {
@@ -215,12 +221,6 @@
   @apply ellipsize;
 }
 
-@media (max-width: 639px) {
-  [data-tip]::before {
-    display: none;
-  }
-}
-
 .content-padding-x {
   @apply px-4 sm:px-8 md:px-12;
 }
@@ -274,12 +274,12 @@
 .input-editor,
 .chat-editor,
 .note-editor {
-  @apply -m-1 min-h-12 p-1;
+  @apply -m-1 min-h-12 p-1 text-sm;
 }
 
 .tiptap {
-  --tiptap-object-bg: var(--base-100);
-  --tiptap-object-fg: var(--base-content);
+  --tiptap-object-bg: var(--neutral);
+  --tiptap-object-fg: var(--neutral-content);
   --tiptap-active-bg: var(--primary);
   --tiptap-active-fg: var(--primary-content);
 }
@@ -362,6 +362,12 @@
   @apply !h-full !w-full !rounded-lg !border-none !bg-inherit !px-4 !text-inherit;
 }
 
+/* tippy popover */
+
+.tippy-box {
+  @apply rounded-box shadow-xl;
+}
+
 /* emoji picker */
 
 emoji-picker {
@@ -396,12 +402,22 @@ progress[value]::-webkit-progress-value {
   @apply md:bottom-sai bottom-[calc(var(--saib)+3.5rem)];
 }
 
+/* Keyboard open state adjustments */
+
+body.keyboard-open .cb {
+  @apply bottom-sai;
+}
+
+body.keyboard-open .hide-on-keyboard {
+  display: none;
+}
+
 /* chat view */
 
 .chat__compose {
-  @apply cb cw fixed;
+  @apply cb cw fixed z-compose;
 }
 
 .chat__scroll-down {
-  @apply fixed bottom-28 right-4 md:bottom-16;
+  @apply fixed bottom-28 right-4 z-feature md:bottom-16;
 }

src/app.html

@@ -26,7 +26,7 @@
     <link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon-180x180.png" />
     %sveltekit.head%
   </head>
-  <body data-sveltekit-preload-data="hover">
+  <body data-sveltekit-preload-data="hover" data-sveltekit-preload-code="eager">
     <div style="display: contents">%sveltekit.body%</div>
     <script
       defer

src/app/commands.ts

@@ -1,464 +0,0 @@
-import {nwc} from "@getalby/sdk"
-import * as nip19 from "nostr-tools/nip19"
-import {get} from "svelte/store"
-import {randomId, flatten, poll, uniq, equals, TIMEZONE, LOCALE} from "@welshman/lib"
-import type {Feed} from "@welshman/feeds"
-import type {TrustedEvent, EventContent} from "@welshman/util"
-import {
-  DELETE,
-  REPORT,
-  PROFILE,
-  INBOX_RELAYS,
-  RELAYS,
-  FOLLOWS,
-  REACTION,
-  AUTH_JOIN,
-  ROOMS,
-  COMMENT,
-  ALERT_EMAIL,
-  ALERT_WEB,
-  ALERT_IOS,
-  ALERT_ANDROID,
-  isSignedEvent,
-  makeEvent,
-  displayProfile,
-  normalizeRelayUrl,
-  makeList,
-  addToListPublicly,
-  removeFromListByPredicate,
-  getTag,
-  getListTags,
-  getRelayTags,
-  getRelayTagValues,
-  toNostrURI,
-  getRelaysFromList,
-  RelayMode,
-} from "@welshman/util"
-import {Pool, AuthStatus, SocketStatus} from "@welshman/net"
-import {Router} from "@welshman/router"
-import {
-  pubkey,
-  signer,
-  repository,
-  publishThunk,
-  profilesByPubkey,
-  relaySelectionsByPubkey,
-  tagEvent,
-  tagEventForReaction,
-  userRelaySelections,
-  userInboxRelaySelections,
-  nip44EncryptToSelf,
-  loadRelay,
-  clearStorage,
-  dropSession,
-  tagEventForComment,
-  tagEventForQuote,
-  getThunkError,
-} from "@welshman/app"
-import {
-  wallet,
-  getWebLn,
-  PROTECTED,
-  userMembership,
-  INDEXER_RELAYS,
-  NOTIFIER_PUBKEY,
-  NOTIFIER_RELAY,
-  userRoomsByUrl,
-} from "@app/state"
-
-// Utils
-
-export const getPubkeyHints = (pubkey: string) => {
-  const selections = relaySelectionsByPubkey.get().get(pubkey)
-  const relays = selections ? getRelaysFromList(selections, RelayMode.Write) : []
-  const hints = relays.length ? relays : INDEXER_RELAYS
-
-  return hints
-}
-
-export const getPubkeyPetname = (pubkey: string) => {
-  const profile = profilesByPubkey.get().get(pubkey)
-  const display = displayProfile(profile)
-
-  return display
-}
-
-export const prependParent = (parent: TrustedEvent | undefined, {content, tags}: EventContent) => {
-  if (parent) {
-    const nevent = nip19.neventEncode({
-      id: parent.id,
-      kind: parent.kind,
-      author: parent.pubkey,
-      relays: Router.get().Event(parent).limit(3).getUrls(),
-    })
-
-    tags = [...tags, tagEventForQuote(parent)]
-    content = toNostrURI(nevent) + "\n\n" + content
-  }
-
-  return {content, tags}
-}
-
-// Log out
-
-export const logout = async () => {
-  const $pubkey = pubkey.get()
-
-  if ($pubkey) {
-    dropSession($pubkey)
-  }
-
-  await clearStorage()
-
-  localStorage.clear()
-}
-
-// Synchronization
-
-export const broadcastUserData = async (relays: string[]) => {
-  const authors = [pubkey.get()!]
-  const kinds = [RELAYS, INBOX_RELAYS, FOLLOWS, PROFILE]
-  const events = repository.query([{kinds, authors}])
-
-  for (const event of events) {
-    if (isSignedEvent(event)) {
-      await publishThunk({event, relays}).result
-    }
-  }
-}
-
-// List updates
-
-export const addSpaceMembership = async (url: string) => {
-  const list = get(userMembership) || makeList({kind: ROOMS})
-  const event = await addToListPublicly(list, ["r", url]).reconcile(nip44EncryptToSelf)
-  const relays = uniq([...Router.get().FromUser().getUrls(), ...getRelayTagValues(event.tags)])
-
-  return publishThunk({event, relays})
-}
-
-export const removeSpaceMembership = async (url: string) => {
-  const list = get(userMembership) || makeList({kind: ROOMS})
-  const pred = (t: string[]) => t[t[0] === "r" ? 1 : 2] === url
-  const event = await removeFromListByPredicate(list, pred).reconcile(nip44EncryptToSelf)
-  const relays = uniq([url, ...Router.get().FromUser().getUrls(), ...getRelayTagValues(event.tags)])
-
-  return publishThunk({event, relays})
-}
-
-export const addRoomMembership = async (url: string, room: string) => {
-  const list = get(userMembership) || makeList({kind: ROOMS})
-  const newTags = [
-    ["r", url],
-    ["group", room, url],
-  ]
-  const event = await addToListPublicly(list, ...newTags).reconcile(nip44EncryptToSelf)
-  const relays = uniq([...Router.get().FromUser().getUrls(), ...getRelayTagValues(event.tags)])
-
-  return publishThunk({event, relays})
-}
-
-export const removeRoomMembership = async (url: string, room: string) => {
-  const list = get(userMembership) || makeList({kind: ROOMS})
-  const pred = (t: string[]) => equals(["group", room, url], t.slice(0, 3))
-  const event = await removeFromListByPredicate(list, pred).reconcile(nip44EncryptToSelf)
-  const relays = uniq([url, ...Router.get().FromUser().getUrls(), ...getRelayTagValues(event.tags)])
-
-  return publishThunk({event, relays})
-}
-
-export const setRelayPolicy = (url: string, read: boolean, write: boolean) => {
-  const list = get(userRelaySelections) || makeList({kind: RELAYS})
-  const tags = getRelayTags(getListTags(list)).filter(t => normalizeRelayUrl(t[1]) !== url)
-
-  if (read && write) {
-    tags.push(["r", url])
-  } else if (read) {
-    tags.push(["r", url, "read"])
-  } else if (write) {
-    tags.push(["r", url, "write"])
-  }
-
-  return publishThunk({
-    event: makeEvent(list.kind, {tags}),
-    relays: [
-      url,
-      ...INDEXER_RELAYS,
-      ...Router.get().FromUser().getUrls(),
-      ...userRoomsByUrl.get().keys(),
-    ],
-  })
-}
-
-export const setInboxRelayPolicy = (url: string, enabled: boolean) => {
-  const list = get(userInboxRelaySelections) || makeList({kind: INBOX_RELAYS})
-
-  // Only update inbox policies if they already exist or we're adding them
-  if (enabled || getRelaysFromList(list).includes(url)) {
-    const tags = getRelayTags(getListTags(list)).filter(t => normalizeRelayUrl(t[1]) !== url)
-
-    if (enabled) {
-      tags.push(["relay", url])
-    }
-
-    return publishThunk({
-      event: makeEvent(list.kind, {tags}),
-      relays: [
-        ...INDEXER_RELAYS,
-        ...Router.get().FromUser().getUrls(),
-        ...userRoomsByUrl.get().keys(),
-      ],
-    })
-  }
-}
-
-// Relay access
-
-export const attemptAuth = (url: string) =>
-  Pool.get()
-    .get(url)
-    .auth.attemptAuth(e => signer.get()?.sign(e))
-
-export const checkRelayAccess = async (url: string, claim = "") => {
-  const socket = Pool.get().get(url)
-
-  await attemptAuth(url)
-
-  const thunk = publishThunk({
-    event: makeEvent(AUTH_JOIN, {tags: [["claim", claim]]}),
-    relays: [url],
-  })
-
-  const error = await getThunkError(thunk)
-
-  if (error) {
-    const message =
-      socket.auth.details?.replace(/^\w+: /, "") ||
-      error?.replace(/^\w+: /, "") ||
-      "join request rejected"
-
-    // If it's a strict NIP 29 relay don't worry about requesting access
-    // TODO: remove this if relay29 ever gets less strict
-    if (message === "missing group (`h`) tag") return
-
-    // Ignore messages about the relay ignoring ours
-    if (error?.startsWith("mute: ")) return
-
-    // Ignore rejected empty claims
-    if (!claim && error?.includes("invite code")) return
-
-    return message
-  }
-}
-
-export const checkRelayProfile = async (url: string) => {
-  const relay = await loadRelay(url)
-
-  if (!relay?.profile) {
-    return "Sorry, we weren't able to find that relay."
-  }
-}
-
-export const checkRelayConnection = async (url: string) => {
-  const socket = Pool.get().get(url)
-
-  socket.attemptToOpen()
-
-  await poll({
-    signal: AbortSignal.timeout(3000),
-    condition: () => socket.status === SocketStatus.Open,
-  })
-
-  if (socket.status !== SocketStatus.Open) {
-    return `Failed to connect`
-  }
-}
-
-export const checkRelayAuth = async (url: string, timeout = 3000) => {
-  const socket = Pool.get().get(url)
-  const okStatuses = [AuthStatus.None, AuthStatus.Ok]
-
-  await attemptAuth(url)
-
-  // Only raise an error if it's not a timeout.
-  // If it is, odds are the problem is with our signer, not the relay
-  if (!okStatuses.includes(socket.auth.status) && socket.auth.details) {
-    return `Failed to authenticate (${socket.auth.details})`
-  }
-}
-
-export const attemptRelayAccess = async (url: string, claim = "") => {
-  const checks = [
-    () => checkRelayConnection(url),
-    () => checkRelayAccess(url, claim),
-    () => checkRelayAuth(url),
-  ]
-
-  for (const check of checks) {
-    const error = await check()
-
-    if (error) {
-      return error
-    }
-  }
-}
-
-// Actions
-
-export const makeDelete = ({event, tags = []}: {event: TrustedEvent; tags?: string[][]}) => {
-  const thisTags = [["k", String(event.kind)], ...tagEvent(event), ...tags]
-  const groupTag = getTag("h", event.tags)
-
-  if (groupTag) {
-    thisTags.push(PROTECTED, groupTag)
-  }
-
-  return makeEvent(DELETE, {tags: thisTags})
-}
-
-export const publishDelete = ({
-  relays,
-  event,
-  tags = [],
-}: {
-  relays: string[]
-  event: TrustedEvent
-  tags?: string[][]
-}) => publishThunk({event: makeDelete({event, tags}), relays})
-
-export type ReportParams = {
-  event: TrustedEvent
-  content: string
-  reason: string
-}
-
-export const makeReport = ({event, reason, content}: ReportParams) => {
-  const tags = [
-    ["p", event.pubkey],
-    ["e", event.id, reason],
-  ]
-
-  return makeEvent(REPORT, {content, tags})
-}
-
-export const publishReport = ({
-  relays,
-  event,
-  reason,
-  content,
-}: ReportParams & {relays: string[]}) =>
-  publishThunk({event: makeReport({event, reason, content}), relays})
-
-export type ReactionParams = {
-  event: TrustedEvent
-  content: string
-  tags?: string[][]
-}
-
-export const makeReaction = ({content, event, tags: paramTags = []}: ReactionParams) => {
-  const tags = [...paramTags, ...tagEventForReaction(event)]
-
-  const groupTag = getTag("h", event.tags)
-
-  if (groupTag) {
-    tags.push(PROTECTED)
-    tags.push(groupTag)
-  }
-
-  return makeEvent(REACTION, {content, tags})
-}
-
-export const publishReaction = ({relays, ...params}: ReactionParams & {relays: string[]}) =>
-  publishThunk({event: makeReaction(params), relays})
-
-export type CommentParams = {
-  event: TrustedEvent
-  content: string
-  tags?: string[][]
-}
-
-export const makeComment = ({event, content, tags = []}: CommentParams) =>
-  makeEvent(COMMENT, {content, tags: [...tags, ...tagEventForComment(event)]})
-
-export const publishComment = ({relays, ...params}: CommentParams & {relays: string[]}) =>
-  publishThunk({event: makeComment(params), relays})
-
-export type AlertParams = {
-  feed: Feed
-  description: string
-  claims: Record<string, string>
-  email?: {
-    cron: string
-    email: string
-    handler: string[]
-  }
-  web?: {
-    endpoint: string
-    p256dh: string
-    auth: string
-  }
-  ios?: {
-    device_token: string
-    bundle_identifier: string
-  }
-  android?: {
-    device_token: string
-  }
-}
-
-export const makeAlert = async (params: AlertParams) => {
-  const tags = [
-    ["feed", JSON.stringify(params.feed)],
-    ["locale", LOCALE],
-    ["timezone", TIMEZONE],
-    ["description", params.description],
-  ]
-
-  for (const [relay, claim] of Object.entries(params.claims)) {
-    tags.push(["claim", relay, claim])
-  }
-
-  let kind: number
-  if (params.email) {
-    kind = ALERT_EMAIL
-    tags.push(...Object.entries(params.email).map(flatten))
-  } else if (params.web) {
-    kind = ALERT_WEB
-    tags.push(...Object.entries(params.web).map(flatten))
-  } else if (params.ios) {
-    kind = ALERT_IOS
-    tags.push(...Object.entries(params.ios).map(flatten))
-  } else if (params.android) {
-    kind = ALERT_ANDROID
-    tags.push(...Object.entries(params.android).map(flatten))
-  } else {
-    throw new Error("Alert has invalid params")
-  }
-
-  return makeEvent(kind, {
-    content: await signer.get().nip44.encrypt(NOTIFIER_PUBKEY, JSON.stringify(tags)),
-    tags: [
-      ["d", randomId()],
-      ["p", NOTIFIER_PUBKEY],
-    ],
-  })
-}
-
-export const publishAlert = async (params: AlertParams) =>
-  publishThunk({event: await makeAlert(params), relays: [NOTIFIER_RELAY]})
-
-export const payInvoice = async (invoice: string) => {
-  const $wallet = get(wallet)
-
-  if (!$wallet) {
-    throw new Error("No wallet is connected")
-  }
-
-  if ($wallet.type === "nwc") {
-    return new nwc.NWCClient($wallet.info).payInvoice({invoice})
-  } else if ($wallet.type === "webln") {
-    return getWebLn()
-      .enable()
-      .then(() => getWebLn().sendPayment(invoice))
-  }
-}

src/app/components/AlertAdd.svelte

@@ -1,297 +0,0 @@
-<script lang="ts">
-  import {onMount} from "svelte"
-  import {preventDefault} from "@lib/html"
-  import {decrypt} from "@welshman/signer"
-  import {randomInt, parseJson, fromPairs, displayList, TIMEZONE, identity} from "@welshman/lib"
-  import {
-    displayRelayUrl,
-    getTagValue,
-    getAddress,
-    THREAD,
-    MESSAGE,
-    EVENT_TIME,
-    COMMENT,
-  } from "@welshman/util"
-  import type {Filter} from "@welshman/util"
-  import {makeIntersectionFeed, makeRelayFeed, feedFromFilters} from "@welshman/feeds"
-  import {pubkey, signer, getThunkError} from "@welshman/app"
-  import Icon from "@lib/components/Icon.svelte"
-  import Button from "@lib/components/Button.svelte"
-  import FieldInline from "@lib/components/FieldInline.svelte"
-  import Spinner from "@lib/components/Spinner.svelte"
-  import ModalHeader from "@lib/components/ModalHeader.svelte"
-  import ModalFooter from "@lib/components/ModalFooter.svelte"
-  import {
-    alerts,
-    getMembershipUrls,
-    userMembership,
-    NOTIFIER_PUBKEY,
-    NOTIFIER_RELAY,
-  } from "@app/state"
-  import {loadAlertStatuses, requestRelayClaim} from "@app/requests"
-  import {publishAlert, attemptAuth} from "@app/commands"
-  import type {AlertParams} from "@app/commands"
-  import {platform, platformName, canSendPushNotifications, getPushInfo} from "@app/push"
-  import {pushToast} from "@app/toast"
-
-  type Props = {
-    url?: string
-    channel?: string
-    notifyChat?: boolean
-    notifyThreads?: boolean
-    notifyCalendar?: boolean
-    hideSpaceField?: boolean
-  }
-
-  let {
-    url = "",
-    channel = "email",
-    notifyChat = true,
-    notifyThreads = true,
-    notifyCalendar = true,
-    hideSpaceField = false,
-  }: Props = $props()
-
-  const timezoneOffset = parseInt(TIMEZONE.slice(3)) / 100
-  const minute = randomInt(0, 59)
-  const hour = (17 - timezoneOffset) % 24
-  const WEEKLY = `0 ${minute} ${hour} * * 1`
-  const DAILY = `0 ${minute} ${hour} * * *`
-
-  let loading = $state(false)
-  let cron = $state(WEEKLY)
-  let claim = $state("")
-  let email = $state($alerts.map(a => getTagValue("email", a.tags)).filter(identity)[0] || "")
-
-  const back = () => history.back()
-
-  const submit = async () => {
-    if (channel === "email" && !email.includes("@")) {
-      return pushToast({
-        theme: "error",
-        message: "Please provide an email address",
-      })
-    }
-
-    if (!url) {
-      return pushToast({
-        theme: "error",
-        message: "Please select a space",
-      })
-    }
-
-    if (!notifyThreads && !notifyCalendar && !notifyChat) {
-      return pushToast({
-        theme: "error",
-        message: "Please select something to be notified about",
-      })
-    }
-
-    const filters: Filter[] = []
-    const display: string[] = []
-
-    if (notifyThreads) {
-      display.push("threads")
-      filters.push({kinds: [THREAD]})
-      filters.push({kinds: [COMMENT], "#k": [String(THREAD)]})
-    }
-
-    if (notifyCalendar) {
-      display.push("calendar events")
-      filters.push({kinds: [EVENT_TIME]})
-      filters.push({kinds: [COMMENT], "#k": [String(EVENT_TIME)]})
-    }
-
-    if (notifyChat) {
-      display.push("chat")
-      filters.push({kinds: [MESSAGE]})
-    }
-
-    loading = true
-
-    try {
-      const claims = claim ? {[url]: claim} : {}
-      const feed = makeIntersectionFeed(feedFromFilters(filters), makeRelayFeed(url))
-      const description = `for ${displayList(display)} on ${displayRelayUrl(url)}`
-      const params: AlertParams = {feed, claims, description}
-
-      if (channel === "email") {
-        const cadence = cron?.endsWith("1") ? "Weekly" : "Daily"
-
-        params.description = `${cadence} alert ${description}, sent via email.`
-        params.email = {
-          cron,
-          email,
-          handler: [
-            "31990:97c70a44366a6535c145b333f973ea86dfdc2d7a99da618c40c64705ad98e322:1737058597050",
-            "wss://relay.nostr.band/",
-            "web",
-          ],
-        }
-      } else {
-        try {
-          // @ts-ignore
-          params[platform] = await getPushInfo()
-          params.description = `${platformName} push notification ${description}.`
-        } catch (e: any) {
-          return pushToast({
-            theme: "error",
-            message: String(e),
-          })
-        }
-      }
-
-      // If we don't do this we'll get an event rejection
-      await attemptAuth(NOTIFIER_RELAY)
-
-      const thunk = await publishAlert(params)
-      const error = await getThunkError(thunk)
-
-      if (error) {
-        return pushToast({
-          theme: "error",
-          message: `Failed to send your alert to the notification server (${error}).`,
-        })
-      }
-
-      // Fetch our new status to make sure it's active
-      const address = getAddress(thunk.event)
-      const statusEvents = await loadAlertStatuses($pubkey!)
-      const statusEvent = statusEvents.find(event => getTagValue("d", event.tags) === address)
-      const statusTags = statusEvent
-        ? parseJson(await decrypt(signer.get(), NOTIFIER_PUBKEY, statusEvent.content))
-        : []
-      const {status = "error", message = "Your alert was not activated"}: Record<string, string> =
-        fromPairs(statusTags)
-
-      if (status === "error") {
-        return pushToast({theme: "error", message})
-      }
-
-      pushToast({message: "Your alert has been successfully created!"})
-      back()
-    } finally {
-      loading = false
-    }
-  }
-
-  onMount(() => {
-    if (!canSendPushNotifications()) {
-      channel = "email"
-    }
-
-    if (url) {
-      requestRelayClaim(url).then(code => {
-        if (code) {
-          claim = code
-        }
-      })
-    }
-  })
-</script>
-
-<form class="column gap-4" onsubmit={preventDefault(submit)}>
-  <ModalHeader>
-    {#snippet title()}
-      Add an Alert
-    {/snippet}
-  </ModalHeader>
-  {#if canSendPushNotifications()}
-    <FieldInline>
-      {#snippet label()}
-        <p>Alert Type*</p>
-      {/snippet}
-      {#snippet input()}
-        <select bind:value={channel} class="select select-bordered">
-          <option value="email">Email Digest</option>
-          <option value="push">Push Notification</option>
-        </select>
-      {/snippet}
-    </FieldInline>
-  {/if}
-  {#if channel === "email"}
-    <FieldInline>
-      {#snippet label()}
-        <p>Email Address*</p>
-      {/snippet}
-      {#snippet input()}
-        <label class="input input-bordered flex w-full items-center gap-2">
-          <input placeholder="email@example.com" bind:value={email} />
-        </label>
-      {/snippet}
-    </FieldInline>
-    <FieldInline>
-      {#snippet label()}
-        <p>Frequency*</p>
-      {/snippet}
-      {#snippet input()}
-        <select bind:value={cron} class="select select-bordered">
-          <option value={WEEKLY}>Weekly</option>
-          <option value={DAILY}>Daily</option>
-        </select>
-      {/snippet}
-    </FieldInline>
-  {/if}
-  {#if !hideSpaceField}
-    <FieldInline>
-      {#snippet label()}
-        <p>Space*</p>
-      {/snippet}
-      {#snippet input()}
-        <select bind:value={url} class="select select-bordered">
-          <option value="" disabled selected>Choose a space URL</option>
-          {#each getMembershipUrls($userMembership) as url (url)}
-            <option value={url}>{displayRelayUrl(url)}</option>
-          {/each}
-        </select>
-      {/snippet}
-    </FieldInline>
-  {/if}
-  <FieldInline>
-    {#snippet label()}
-      <p>Notifications*</p>
-    {/snippet}
-    {#snippet input()}
-      <div class="flex items-center justify-end gap-4">
-        <span class="flex gap-3">
-          <input type="checkbox" class="checkbox" bind:checked={notifyThreads} />
-          Threads
-        </span>
-        <span class="flex gap-3">
-          <input type="checkbox" class="checkbox" bind:checked={notifyCalendar} />
-          Calendar
-        </span>
-        <span class="flex gap-3">
-          <input type="checkbox" class="checkbox" bind:checked={notifyChat} />
-          Chat
-        </span>
-      </div>
-    {/snippet}
-  </FieldInline>
-  <FieldInline>
-    {#snippet label()}
-      <p>Invite Code</p>
-    {/snippet}
-    {#snippet input()}
-      <label class="input input-bordered flex w-full items-center gap-2">
-        <input bind:value={claim} />
-      </label>
-    {/snippet}
-    {#snippet info()}
-      <p>
-        To get notifications from private spaces, please provide an invite code which grants access
-        to the space.
-      </p>
-    {/snippet}
-  </FieldInline>
-  <ModalFooter>
-    <Button class="btn btn-link" onclick={back}>
-      <Icon icon="alt-arrow-left" />
-      Go back
-    </Button>
-    <Button type="submit" class="btn btn-primary" disabled={loading}>
-      <Spinner {loading}>Confirm</Spinner>
-      <Icon icon="alt-arrow-right" />
-    </Button>
-  </ModalFooter>
-</form>

src/app/components/AlertDelete.svelte

@@ -1,21 +0,0 @@
-<script lang="ts">
-  import Confirm from "@lib/components/Confirm.svelte"
-  import type {Alert} from "@app/state"
-  import {NOTIFIER_RELAY, NOTIFIER_PUBKEY} from "@app/state"
-  import {publishDelete} from "@app/commands"
-  import {pushToast} from "@app/toast"
-
-  type Props = {
-    alert: Alert
-  }
-
-  const {alert}: Props = $props()
-
-  const confirm = () => {
-    publishDelete({event: alert.event, relays: [NOTIFIER_RELAY], tags: [["p", NOTIFIER_PUBKEY]]})
-    pushToast({message: "Your alert has been deleted!"})
-    history.back()
-  }
-</script>
-
-<Confirm {confirm} message="You'll no longer receive messages for this alert." />

src/app/components/AlertItem.svelte

@@ -1,69 +0,0 @@
-<script lang="ts">
-  import {parseJson} from "@welshman/lib"
-  import {displayFeeds} from "@welshman/feeds"
-  import {getAddress, getTagValue, getTagValues} from "@welshman/util"
-  import Icon from "@lib/components/Icon.svelte"
-  import Button from "@lib/components/Button.svelte"
-  import AlertDelete from "@app/components/AlertDelete.svelte"
-  import type {Alert} from "@app/state"
-  import {deriveAlertStatus} from "@app/state"
-  import {pushModal} from "@app/modal"
-
-  type Props = {
-    alert: Alert
-  }
-
-  const {alert}: Props = $props()
-
-  const status = deriveAlertStatus(getAddress(alert.event))
-  const cron = $derived(getTagValue("cron", alert.tags))
-  const channel = $derived(getTagValue("channel", alert.tags))
-  const feeds = $derived(getTagValues("feed", alert.tags))
-  const description = $derived(
-    getTagValue("description", alert.tags) ||
-      [
-        `${cron?.endsWith("1") ? "Weekly" : "Daily"} alert for events`,
-        displayFeeds(feeds.map(parseJson)),
-        `sent via ${channel}.`,
-      ].join(" "),
-  )
-
-  const startDelete = () => pushModal(AlertDelete, {alert})
-</script>
-
-<div class="flex items-start justify-between gap-4">
-  <div class="flex items-start gap-4">
-    <Button class="py-1" onclick={startDelete}>
-      <Icon icon="trash-bin-2" />
-    </Button>
-    <div class="flex-inline gap-1">{description}</div>
-  </div>
-  {#if $status}
-    {@const statusText = getTagValue("status", $status.tags) || "error"}
-    {#if statusText === "ok"}
-      <span
-        class="tooltip tooltip-left cursor-pointer rounded-full border border-solid border-base-content px-3 py-1 text-sm"
-        data-tip={getTagValue("message", $status.tags)}>
-        Active
-      </span>
-    {:else if statusText === "pending"}
-      <span
-        class="tooltip tooltip-left cursor-pointer rounded-full border border-solid border-base-content border-yellow-500 px-3 py-1 text-sm text-yellow-500"
-        data-tip={getTagValue("message", $status.tags)}>
-        Pending
-      </span>
-    {:else}
-      <span
-        class="tooltip tooltip-left cursor-pointer rounded-full border border-solid border-error px-3 py-1 text-sm text-error"
-        data-tip={getTagValue("message", $status.tags)}>
-        {statusText.replace("-", " ").replace(/^(.)/, x => x.toUpperCase())}
-      </span>
-    {/if}
-  {:else}
-    <span
-      class="tooltip tooltip-left cursor-pointer rounded-full border border-solid border-error px-3 py-1 text-sm text-error"
-      data-tip="The notification server did not respond to your request.">
-      Inactive
-    </span>
-  {/if}
-</div>

src/app/components/Alerts.svelte

@@ -1,43 +0,0 @@
-<script lang="ts">
-  import {getTagValue} from "@welshman/util"
-  import Icon from "@lib/components/Icon.svelte"
-  import Button from "@lib/components/Button.svelte"
-  import AlertAdd from "@app/components/AlertAdd.svelte"
-  import AlertItem from "@app/components/AlertItem.svelte"
-  import {pushModal} from "@app/modal"
-  import {alerts} from "@app/state"
-
-  type Props = {
-    url?: string
-    channel?: string
-    hideSpaceField?: boolean
-  }
-
-  const {url = "", channel = "push", hideSpaceField = false}: Props = $props()
-
-  const startAlert = () => pushModal(AlertAdd, {url, channel, hideSpaceField})
-
-  const filteredAlerts = $derived(
-    url ? $alerts.filter(a => getTagValue("feed", a.tags)?.includes(url)) : $alerts,
-  )
-</script>
-
-<div class="card2 bg-alt flex flex-col gap-6 shadow-xl">
-  <div class="flex items-center justify-between">
-    <strong class="flex items-center gap-3">
-      <Icon icon="inbox" />
-      Alerts
-    </strong>
-    <Button class="btn btn-primary btn-sm" onclick={startAlert}>
-      <Icon icon="add-circle" />
-      Add Alert
-    </Button>
-  </div>
-  <div class="col-4">
-    {#each filteredAlerts as alert (alert.event.id)}
-      <AlertItem {alert} />
-    {:else}
-      <p class="text-center opacity-75 py-12">Nothing here yet!</p>
-    {/each}
-  </div>
-</div>

src/app/components/AppContainer.svelte

@@ -2,35 +2,17 @@
   import type {Snippet} from "svelte"
   import {page} from "$app/stores"
   import {pubkey} from "@welshman/app"
+  import Dialog from "@lib/components/Dialog.svelte"
   import Landing from "@app/components/Landing.svelte"
   import Toast from "@app/components/Toast.svelte"
   import PrimaryNav from "@app/components/PrimaryNav.svelte"
-  import EmailConfirm from "@app/components/EmailConfirm.svelte"
-  import PasswordReset from "@app/components/PasswordReset.svelte"
-  import {BURROW_URL} from "@app/state"
-  import {modals, pushModal} from "@app/modal"
+  import {modals} from "@app/util/modal"
 
   interface Props {
     children: Snippet
   }
 
   const {children}: Props = $props()
-
-  if (BURROW_URL && !$pubkey) {
-    if ($page.url.pathname === "/confirm-email") {
-      pushModal(EmailConfirm, {
-        email: $page.url.searchParams.get("email"),
-        confirm_token: $page.url.searchParams.get("confirm_token"),
-      })
-    }
-
-    if ($page.url.pathname === "/reset-password") {
-      pushModal(PasswordReset, {
-        email: $page.url.searchParams.get("email"),
-        reset_token: $page.url.searchParams.get("reset_token"),
-      })
-    }
-  }
 </script>
 
 <div class="flex h-screen overflow-hidden">
@@ -39,7 +21,7 @@
       {@render children?.()}
     </PrimaryNav>
   {:else if !$modals[$page.url.hash.slice(1)]}
-    <Landing />
+    <Dialog children={{component: Landing, props: {}}} />
   {/if}
 </div>
 <Toast />

src/app/components/BunkerConnect.svelte

@@ -1,79 +1,25 @@
-<script module lang="ts">
-  import type {Nip46ResponseWithResult} from "@welshman/signer"
-  import {Nip46Broker, makeSecret} from "@welshman/signer"
-  import {NIP46_PERMS, PLATFORM_URL, PLATFORM_NAME, PLATFORM_LOGO, SIGNER_RELAYS} from "@app/state"
-
-  export class BunkerConnectController {
-    url = $state("")
-    bunker = $state("")
-    loading = $state(false)
-    clientSecret = makeSecret()
-    abortController = new AbortController()
-    broker = new Nip46Broker({clientSecret: this.clientSecret, relays: SIGNER_RELAYS})
-    onNostrConnect: (response: Nip46ResponseWithResult) => void
-
-    constructor({onNostrConnect}: {onNostrConnect: (response: Nip46ResponseWithResult) => void}) {
-      this.onNostrConnect = onNostrConnect
-    }
-
-    async start() {
-      this.url = await this.broker.makeNostrconnectUrl({
-        perms: NIP46_PERMS,
-        url: PLATFORM_URL,
-        name: PLATFORM_NAME,
-        image: PLATFORM_LOGO,
-      })
-
-      let response
-      try {
-        response = await this.broker.waitForNostrconnect(this.url, this.abortController.signal)
-      } catch (errorResponse: any) {
-        if (errorResponse?.error) {
-          pushToast({
-            theme: "error",
-            message: `Received error from signer: ${errorResponse.error}`,
-          })
-        } else if (errorResponse) {
-          console.error(errorResponse)
-        }
-      }
-
-      if (response) {
-        this.loading = true
-        this.onNostrConnect(response)
-      }
-    }
-
-    stop() {
-      this.broker.cleanup()
-      this.abortController.abort()
-    }
-  }
-</script>
-
 <script lang="ts">
-  import {onMount, onDestroy} from "svelte"
-  import {slideAndFade} from "@lib/transition"
+  import Spinner from "@lib/components/Spinner.svelte"
   import QRCode from "@app/components/QRCode.svelte"
-  import {pushToast} from "@app/toast"
+  import type {Nip46Controller} from "@app/util/nip46"
 
   type Props = {
-    controller: BunkerConnectController
+    controller: Nip46Controller
   }
 
   const {controller}: Props = $props()
-
-  onMount(() => {
-    controller.start()
-  })
-
-  onDestroy(() => {
-    controller.stop()
-  })
+  const {url, loading} = controller
 </script>
 
-{#if controller.url}
-  <div class="flex justify-center" out:slideAndFade>
-    <QRCode code={controller.url} />
-  </div>
+{#if $url}
+  {#if $loading}
+    <div class="flex justify-center">
+      <Spinner loading>Establishing connection...</Spinner>
+    </div>
+  {:else}
+    <div class="flex flex-col items-center gap-2">
+      <QRCode code={$url} />
+      <p class="text-sm opacity-75">Scan with your signer to log in, or click to copy.</p>
+    </div>
+  {/if}
 {/if}

src/app/components/BunkerUrl.svelte

@@ -1,16 +1,32 @@
 <script lang="ts">
-  import {pushModal} from "@app/modal"
-  import InfoBunker from "@app/components/InfoBunker.svelte"
+  import {debounce} from "throttle-debounce"
+  import Scanner from "@lib/components/Scanner.svelte"
   import Button from "@lib/components/Button.svelte"
   import Field from "@lib/components/Field.svelte"
+  import CpuBolt from "@assets/icons/cpu-bolt.svg?dataurl"
+  import QrCode from "@assets/icons/qr-code.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
+  import InfoBunker from "@app/components/InfoBunker.svelte"
+  import type {Nip46Controller} from "@app/util/nip46"
+  import {pushModal} from "@app/util/modal"
 
   type Props = {
-    bunker: string
-    loading: boolean
+    controller: Nip46Controller
   }
 
-  let {loading, bunker = $bindable("")}: Props = $props()
+  const {controller}: Props = $props()
+  const {loading, bunker} = controller
+
+  const toggleScanner = () => {
+    showScanner = !showScanner
+  }
+
+  const onScan = debounce(1000, async (data: string) => {
+    showScanner = false
+    $bunker = data
+  })
+
+  let showScanner = $state(false)
 </script>
 
 <Field>
@@ -19,8 +35,11 @@
   {/snippet}
   {#snippet input()}
     <label class="input input-bordered flex w-full items-center gap-2">
-      <Icon icon="cpu" />
-      <input disabled={loading} bind:value={bunker} class="grow" placeholder="bunker://" />
+      <Icon icon={CpuBolt} />
+      <input disabled={$loading} bind:value={$bunker} class="grow" placeholder="bunker://" />
+      <Button onclick={toggleScanner}>
+        <Icon icon={QrCode} />
+      </Button>
     </label>
   {/snippet}
   {#snippet info()}
@@ -30,3 +49,6 @@
     </p>
   {/snippet}
 </Field>
+{#if showScanner}
+  <Scanner onscan={onScan} />
+{/if}

src/app/components/CalendarEventActions.svelte

@@ -1,55 +1,64 @@
 <script lang="ts">
   import type {TrustedEvent, EventContent} from "@welshman/util"
+  import {getTagValue, getAddress} from "@welshman/util"
   import {pubkey} from "@welshman/app"
+  import Pen2 from "@assets/icons/pen-2.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
+  import Link from "@lib/components/Link.svelte"
+  import RoomName from "@app/components/RoomName.svelte"
   import ReactionSummary from "@app/components/ReactionSummary.svelte"
   import ThunkStatusOrDeleted from "@app/components/ThunkStatusOrDeleted.svelte"
   import EventActivity from "@app/components/EventActivity.svelte"
   import EventActions from "@app/components/EventActions.svelte"
   import CalendarEventEdit from "@app/components/CalendarEventEdit.svelte"
-  import {publishDelete, publishReaction} from "@app/commands"
-  import {makeCalendarPath} from "@app/routes"
-  import {pushModal} from "@app/modal"
+  import {publishDelete, publishReaction, canEnforceNip70} from "@app/core/commands"
+  import {makeCalendarPath, makeSpacePath} from "@app/util/routes"
+  import {pushModal} from "@app/util/modal"
 
-  const {
-    url,
-    event,
-    showActivity = false,
-  }: {
+  type Props = {
     url: string
     event: TrustedEvent
+    showRoom?: boolean
     showActivity?: boolean
-  } = $props()
+  }
 
-  const path = makeCalendarPath(url, event.id)
+  const {url, event, showRoom, showActivity}: Props = $props()
+
+  const h = getTagValue("h", event.tags)
+  const path = makeCalendarPath(url, getAddress(event))
+  const shouldProtect = canEnforceNip70(url)
 
   const editEvent = () => pushModal(CalendarEventEdit, {url, event})
 
-  const deleteReaction = (event: TrustedEvent) => publishDelete({relays: [url], event})
+  const deleteReaction = async (event: TrustedEvent) =>
+    publishDelete({relays: [url], event, protect: await shouldProtect})
 
-  const createReaction = (template: EventContent) =>
-    publishReaction({...template, event, relays: [url]})
+  const createReaction = async (template: EventContent) =>
+    publishReaction({...template, event, relays: [url], protect: await shouldProtect})
 </script>
 
-<div class="flex flex-wrap items-center justify-between gap-2">
-  <div class="flex flex-grow flex-wrap justify-end gap-2">
-    <ReactionSummary {url} {event} {deleteReaction} {createReaction} reactionClass="tooltip-left" />
-    <ThunkStatusOrDeleted {event} />
-    {#if showActivity}
-      <EventActivity {url} {path} {event} />
-    {/if}
-    <EventActions {url} {event} noun="Event">
-      {#snippet customActions()}
-        {#if event.pubkey === $pubkey}
-          <li>
-            <Button onclick={editEvent}>
-              <Icon size={4} icon="pen" />
-              Edit Event
-            </Button>
-          </li>
-        {/if}
-      {/snippet}
-    </EventActions>
-  </div>
+<div class="flex flex-grow flex-wrap justify-end gap-2">
+  {#if h && showRoom}
+    <Link href={makeSpacePath(url, h)} class="btn btn-neutral btn-xs rounded-full">
+      Posted in #<RoomName {h} {url} />
+    </Link>
+  {/if}
+  <ReactionSummary {url} {event} {deleteReaction} {createReaction} reactionClass="tooltip-left" />
+  <ThunkStatusOrDeleted {event} />
+  {#if showActivity}
+    <EventActivity {url} {path} {event} />
+  {/if}
+  <EventActions {url} {event} noun="Event">
+    {#snippet customActions()}
+      {#if event.pubkey === $pubkey}
+        <li>
+          <Button onclick={editEvent}>
+            <Icon size={4} icon={Pen2} />
+            Edit Event
+          </Button>
+        </li>
+      {/if}
+    {/snippet}
+  </EventActions>
 </div>

src/app/components/CalendarEventCreate.svelte

@@ -1,23 +1,22 @@
 <script lang="ts">
   import ModalHeader from "@lib/components/ModalHeader.svelte"
+  import ModalTitle from "@lib/components/ModalTitle.svelte"
+  import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
   import CalendarEventForm from "@app/components/CalendarEventForm.svelte"
 
   type Props = {
     url: string
+    h?: string
   }
 
-  const {url}: Props = $props()
+  const {url, h}: Props = $props()
 </script>
 
-<CalendarEventForm {url}>
+<CalendarEventForm {url} {h}>
   {#snippet header()}
     <ModalHeader>
-      {#snippet title()}
-        <div>Create an Event</div>
-      {/snippet}
-      {#snippet info()}
-        <div>Invite other group members to events online or in real life.</div>
-      {/snippet}
+      <ModalTitle>Create an Event</ModalTitle>
+      <ModalSubtitle>Invite other group members to events online or in real life.</ModalSubtitle>
     </ModalHeader>
   {/snippet}
 </CalendarEventForm>

src/app/components/CalendarEventDate.svelte

@@ -8,13 +8,16 @@
 
   const {event}: Props = $props()
   const meta = $derived(fromPairs(event.tags) as Record<string, string>)
-  const startDate = $derived(secondsToDate(parseInt(meta.start)))
+  const start = $derived(parseInt(meta.start))
 </script>
 
-<div
-  class="hidden h-32 w-32 min-w-32 flex-col items-center justify-center gap-1 rounded-box bg-base-300 p-2 sm:flex">
-  <strong>{Intl.DateTimeFormat(LOCALE, {month: "short"}).format(startDate)}</strong>
-  <span class="text-4xl">{Intl.DateTimeFormat(LOCALE, {day: "numeric"}).format(startDate)}</span>
-  <span class="text-xs opacity-75"
-    >{Intl.DateTimeFormat(LOCALE, {weekday: "long"}).format(startDate)}</span>
-</div>
+{#if !isNaN(start)}
+  {@const startDate = secondsToDate(start)}
+  <div
+    class="hidden h-32 w-32 min-w-32 flex-col items-center justify-center gap-1 rounded-box bg-base-300 p-2 sm:flex">
+    <strong>{Intl.DateTimeFormat(LOCALE, {month: "short"}).format(startDate)}</strong>
+    <span class="text-4xl">{Intl.DateTimeFormat(LOCALE, {day: "numeric"}).format(startDate)}</span>
+    <span class="text-xs opacity-75"
+      >{Intl.DateTimeFormat(LOCALE, {weekday: "long"}).format(startDate)}</span>
+  </div>
+{/if}

src/app/components/CalendarEventEdit.svelte

@@ -2,6 +2,8 @@
   import type {TrustedEvent} from "@welshman/util"
   import {getTagValue} from "@welshman/util"
   import ModalHeader from "@lib/components/ModalHeader.svelte"
+  import ModalTitle from "@lib/components/ModalTitle.svelte"
+  import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
   import CalendarEventForm from "@app/components/CalendarEventForm.svelte"
 
   type Props = {
@@ -24,12 +26,8 @@
 <CalendarEventForm {url} {initialValues}>
   {#snippet header()}
     <ModalHeader>
-      {#snippet title()}
-        <div>Edit this Event</div>
-      {/snippet}
-      {#snippet info()}
-        <div>Invite other group members to events online or in real life.</div>
-      {/snippet}
+      <ModalTitle>Edit this Event</ModalTitle>
+      <ModalSubtitle>Invite other group members to events online or in real life.</ModalSubtitle>
     </ModalHeader>
   {/snippet}
 </CalendarEventForm>

src/app/components/CalendarEventForm.svelte

@@ -6,19 +6,26 @@
   import {publishThunk} from "@welshman/app"
   import {preventDefault} from "@lib/html"
   import {daysBetween} from "@lib/util"
+  import GallerySend from "@assets/icons/gallery-send.svg?dataurl"
+  import MapPoint from "@assets/icons/map-point.svg?dataurl"
+  import AltArrowLeft from "@assets/icons/alt-arrow-left.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Field from "@lib/components/Field.svelte"
   import Button from "@lib/components/Button.svelte"
   import Spinner from "@lib/components/Spinner.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
+  import Modal from "@lib/components/Modal.svelte"
+  import ModalBody from "@lib/components/ModalBody.svelte"
   import DateTimeInput from "@lib/components/DateTimeInput.svelte"
   import EditorContent from "@app/editor/EditorContent.svelte"
-  import {PROTECTED} from "@app/state"
+  import {PROTECTED} from "@app/core/state"
   import {makeEditor} from "@app/editor"
-  import {pushToast} from "@app/toast"
+  import {pushToast} from "@app/util/toast"
+  import {canEnforceNip70} from "@app/core/commands"
 
   type Props = {
     url: string
+    h?: string
     header: Snippet
     initialValues?: {
       d: string
@@ -30,7 +37,9 @@
     }
   }
 
-  const {url, header, initialValues}: Props = $props()
+  const {url, h, header, initialValues}: Props = $props()
+
+  const shouldProtect = canEnforceNip70(url)
 
   const uploading = writable(false)
 
@@ -63,19 +72,26 @@
     }
 
     const ed = await editor
-    const event = makeEvent(EVENT_TIME, {
-      content: ed.getText({blockSeparator: "\n"}).trim(),
-      tags: [
-        ["d", initialValues?.d || randomId()],
-        ["title", title],
-        ["location", location || ""],
-        ["start", start.toString()],
-        ["end", end.toString()],
-        ...daysBetween(start, end).map(D => ["D", D.toString()]),
-        ...ed.storage.nostr.getEditorTags(),
-        PROTECTED,
-      ],
-    })
+    const content = ed.getText({blockSeparator: "\n"}).trim()
+    const tags = [
+      ["d", initialValues?.d || randomId()],
+      ["title", title],
+      ["location", location || ""],
+      ["start", start.toString()],
+      ["end", end.toString()],
+      ...daysBetween(start, end).map(D => ["D", D.toString()]),
+      ...ed.storage.nostr.getEditorTags(),
+    ]
+
+    if (await shouldProtect) {
+      tags.push(PROTECTED)
+    }
+
+    if (h) {
+      tags.push(["h", h])
+    }
+
+    const event = makeEvent(EVENT_TIME, {content, tags})
 
     pushToast({message: "Your event has been saved!"})
     publishThunk({event, relays: [url]})
@@ -100,71 +116,74 @@
   })
 </script>
 
-<form novalidate class="column gap-4" onsubmit={preventDefault(submit)}>
-  {@render header()}
-  <Field>
-    {#snippet label()}
-      <p>Title*</p>
-    {/snippet}
-    {#snippet input()}
-      <label class="input input-bordered flex w-full items-center gap-2">
-        <input bind:value={title} class="grow" type="text" />
-      </label>
-    {/snippet}
-  </Field>
-  <Field>
-    {#snippet label()}
-      <p>Summary</p>
-    {/snippet}
-    {#snippet input()}
-      <div class="relative z-feature flex gap-2 border-t border-solid border-base-100 bg-base-100">
-        <div class="input-editor flex-grow overflow-hidden">
-          <EditorContent {editor} />
+<Modal tag="form" novalidate onsubmit={preventDefault(submit)}>
+  <ModalBody>
+    {@render header()}
+    <Field>
+      {#snippet label()}
+        <p>Title*</p>
+      {/snippet}
+      {#snippet input()}
+        <label class="input input-bordered flex w-full items-center gap-2">
+          <input bind:value={title} class="grow" type="text" />
+        </label>
+      {/snippet}
+    </Field>
+    <Field>
+      {#snippet label()}
+        <p>Summary</p>
+      {/snippet}
+      {#snippet input()}
+        <div
+          class="relative z-feature flex gap-2 border-t border-solid border-base-100 bg-base-100">
+          <div class="input-editor flex-grow overflow-hidden">
+            <EditorContent {editor} />
+          </div>
+          <Button data-tip="Add an image" class="center btn tooltip" onclick={selectFiles}>
+            {#if $uploading}
+              <span class="loading loading-spinner loading-xs"></span>
+            {:else}
+              <Icon icon={GallerySend} />
+            {/if}
+          </Button>
         </div>
-        <Button data-tip="Add an image" class="center btn tooltip" onclick={selectFiles}>
-          {#if $uploading}
-            <span class="loading loading-spinner loading-xs"></span>
-          {:else}
-            <Icon icon="gallery-send" />
-          {/if}
-        </Button>
-      </div>
-    {/snippet}
-  </Field>
-  <Field>
-    {#snippet label()}
-      Start*
-    {/snippet}
-    {#snippet input()}
-      <DateTimeInput bind:value={start} />
-    {/snippet}
-  </Field>
-  <Field>
-    {#snippet label()}
-      End*
-    {/snippet}
-    {#snippet input()}
-      <DateTimeInput bind:value={end} />
-    {/snippet}
-  </Field>
-  <Field>
-    {#snippet label()}
-      <p>Location (optional)</p>
-    {/snippet}
-    {#snippet input()}
-      <label class="input input-bordered flex w-full items-center gap-2">
-        <Icon icon="map-point" />
-        <input bind:value={location} class="grow" type="text" />
-      </label>
-    {/snippet}
-  </Field>
+      {/snippet}
+    </Field>
+    <Field>
+      {#snippet label()}
+        Start*
+      {/snippet}
+      {#snippet input()}
+        <DateTimeInput bind:value={start} />
+      {/snippet}
+    </Field>
+    <Field>
+      {#snippet label()}
+        End*
+      {/snippet}
+      {#snippet input()}
+        <DateTimeInput bind:value={end} />
+      {/snippet}
+    </Field>
+    <Field>
+      {#snippet label()}
+        <p>Location (optional)</p>
+      {/snippet}
+      {#snippet input()}
+        <label class="input input-bordered flex w-full items-center gap-2">
+          <Icon icon={MapPoint} />
+          <input bind:value={location} class="grow" type="text" />
+        </label>
+      {/snippet}
+    </Field>
+  </ModalBody>
   <ModalFooter>
     <Button class="btn btn-link" onclick={back}>
-      <Icon icon="alt-arrow-left" />
+      <Icon icon={AltArrowLeft} />
       Go back
     </Button>
     <Button type="submit" class="btn btn-primary" disabled={$uploading}>
       <Spinner loading={$uploading}>Save Event</Spinner>
     </Button>
   </ModalFooter>
-</form>
+</Modal>

src/app/components/CalendarEventHeader.svelte

@@ -6,6 +6,7 @@
     formatTimestampAsTime,
   } from "@welshman/lib"
   import type {TrustedEvent} from "@welshman/util"
+  import ClockCircle from "@assets/icons/clock-circle.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
 
   type Props = {
@@ -16,18 +17,20 @@
   const meta = $derived(fromPairs(event.tags) as Record<string, string>)
   const start = $derived(parseInt(meta.start))
   const end = $derived(parseInt(meta.end))
-  const startDateDisplay = $derived(formatTimestampAsDate(start))
-  const endDateDisplay = $derived(formatTimestampAsDate(end))
-  const isSingleDay = $derived(startDateDisplay === endDateDisplay)
 </script>
 
 <div class="flex flex-grow flex-wrap justify-between gap-2">
   <p class="text-xl">{meta.title || meta.name}</p>
-  <div class="flex items-center gap-2 text-sm">
-    <Icon icon="clock-circle" size={4} />
-    <span class="sm:hidden">{formatTimestampAsDate(start)}</span>
-    {formatTimestampAsTime(start)} — {isSingleDay
-      ? formatTimestampAsTime(end)
-      : formatTimestamp(end)}
-  </div>
+  {#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">
+      <Icon icon={ClockCircle} size={4} />
+      <span class="hidden sm:block">{formatTimestampAsDate(start)}</span>
+      {formatTimestampAsTime(start)} — {isSingleDay
+        ? formatTimestampAsTime(end)
+        : formatTimestamp(end)}
+    </div>
+  {/if}
 </div>

src/app/components/CalendarEventItem.svelte

@@ -1,10 +1,12 @@
 <script lang="ts">
   import type {TrustedEvent} from "@welshman/util"
+  import {getTagValue, getAddress} from "@welshman/util"
   import Link from "@lib/components/Link.svelte"
   import CalendarEventActions from "@app/components/CalendarEventActions.svelte"
   import CalendarEventHeader from "@app/components/CalendarEventHeader.svelte"
   import ProfileLink from "@app/components/ProfileLink.svelte"
-  import {makeCalendarPath} from "@app/routes"
+  import RoomLink from "@app/components/RoomLink.svelte"
+  import {makeCalendarPath} from "@app/util/routes"
 
   type Props = {
     url: string
@@ -12,13 +14,20 @@
   }
 
   const {url, event}: Props = $props()
+
+  const h = getTagValue("h", event.tags)
 </script>
 
-<Link class="col-3 card2 bg-alt w-full cursor-pointer" href={makeCalendarPath(url, event.id)}>
+<Link
+  class="col-3 card2 bg-alt w-full cursor-pointer shadow-md"
+  href={makeCalendarPath(url, getAddress(event))}>
   <CalendarEventHeader {event} />
   <div class="flex w-full flex-col items-end justify-between gap-2 sm:flex-row">
     <span class="whitespace-nowrap py-1 text-sm opacity-75">
       Posted by <ProfileLink pubkey={event.pubkey} {url} />
+      {#if h}
+        in <RoomLink {url} {h} />
+      {/if}
     </span>
     <CalendarEventActions showActivity {url} {event} />
   </div>

src/app/components/CalendarEventMeta.svelte

@@ -1,6 +1,8 @@
 <script lang="ts">
   import {fromPairs} from "@welshman/lib"
   import type {TrustedEvent} from "@welshman/util"
+  import UserCircle from "@assets/icons/user-circle.svg?dataurl"
+  import MapPoint from "@assets/icons/map-point.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import ProfileLink from "@app/components/ProfileLink.svelte"
 
@@ -15,12 +17,12 @@
 
 <div class="flex min-w-0 flex-col gap-1 text-sm opacity-75">
   <span class="flex items-center gap-1">
-    <Icon icon="user-circle" size={4} />
+    <Icon icon={UserCircle} size={4} />
     Posted by <ProfileLink pubkey={event.pubkey} {url} />
   </span>
   {#if meta.location}
     <span class="flex items-start gap-1">
-      <Icon icon="map-point" class="mt-[2px]" size={4} />
+      <Icon icon={MapPoint} class="mt-[2px]" size={4} />
       <span class="break-words">{meta.location}</span>
     </span>
   {/if}

src/app/components/ChannelCompose.svelte

@@ -1,64 +0,0 @@
-<script lang="ts">
-  import {writable} from "svelte/store"
-  import type {EventContent} from "@welshman/util"
-  import {isMobile, preventDefault} from "@lib/html"
-  import Icon from "@lib/components/Icon.svelte"
-  import Button from "@lib/components/Button.svelte"
-  import EditorContent from "@app/editor/EditorContent.svelte"
-  import {makeEditor} from "@app/editor"
-
-  type Props = {
-    url?: string
-    onSubmit: (event: EventContent) => void
-  }
-
-  const {onSubmit, url}: Props = $props()
-
-  const autofocus = !isMobile
-
-  const uploading = writable(false)
-
-  export const focus = () => editor.then(ed => ed.chain().focus().run())
-
-  const uploadFiles = () => editor.then(ed => ed.chain().selectFiles().run())
-
-  const submit = async () => {
-    if ($uploading) return
-
-    const ed = await editor
-    const content = ed.getText({blockSeparator: "\n"}).trim()
-    const tags = ed.storage.nostr.getEditorTags()
-
-    if (!content) return
-
-    onSubmit({content, tags})
-
-    ed.chain().clearContent().run()
-  }
-
-  const editor = makeEditor({url, autofocus, submit, uploading, aggressive: true})
-</script>
-
-<form class="relative z-feature flex gap-2 p-2" onsubmit={preventDefault(submit)}>
-  <Button
-    data-tip="Add an image"
-    class="center tooltip tooltip-right h-10 w-10 min-w-10 rounded-box bg-base-300 transition-colors hover:bg-base-200"
-    disabled={$uploading}
-    onclick={uploadFiles}>
-    {#if $uploading}
-      <span class="loading loading-spinner loading-xs"></span>
-    {:else}
-      <Icon icon="gallery-send" />
-    {/if}
-  </Button>
-  <div class="chat-editor flex-grow overflow-hidden">
-    <EditorContent {editor} />
-  </div>
-  <Button
-    data-tip="{window.navigator.platform.includes('Mac') ? 'cmd' : 'ctrl'}+enter to send"
-    class="center tooltip tooltip-left absolute right-4 h-10 w-10 min-w-10 rounded-full"
-    disabled={$uploading}
-    onclick={submit}>
-    <Icon icon="plain" />
-  </Button>
-</form>

src/app/components/ChannelMessage.svelte

@@ -1,110 +0,0 @@
-<script lang="ts">
-  import {hash, now, formatTimestampAsTime, formatTimestampAsDate} from "@welshman/lib"
-  import type {TrustedEvent, EventContent} from "@welshman/util"
-  import {thunks, deriveProfile, deriveProfileDisplay} from "@welshman/app"
-  import {isMobile} from "@lib/html"
-  import TapTarget from "@lib/components/TapTarget.svelte"
-  import Avatar from "@lib/components/Avatar.svelte"
-  import Icon from "@lib/components/Icon.svelte"
-  import Button from "@lib/components/Button.svelte"
-  import Content from "@app/components/Content.svelte"
-  import ThunkStatus from "@app/components/ThunkStatus.svelte"
-  import ProfileDetail from "@app/components/ProfileDetail.svelte"
-  import ReactionSummary from "@app/components/ReactionSummary.svelte"
-  import ChannelMessageZapButton from "@app/components/ChannelMessageZapButton.svelte"
-  import ChannelMessageEmojiButton from "@app/components/ChannelMessageEmojiButton.svelte"
-  import ChannelMessageMenuButton from "@app/components/ChannelMessageMenuButton.svelte"
-  import ChannelMessageMenuMobile from "@app/components/ChannelMessageMenuMobile.svelte"
-  import {colors, ENABLE_ZAPS} from "@app/state"
-  import {publishDelete, publishReaction} from "@app/commands"
-  import {pushModal} from "@app/modal"
-
-  interface Props {
-    url: string
-    event: TrustedEvent
-    replyTo?: (event: TrustedEvent) => void
-    showPubkey?: boolean
-    inert?: boolean
-  }
-
-  const {url, event, replyTo = undefined, showPubkey = false, inert = false}: Props = $props()
-
-  const thunk = $thunks[event.id]
-  const today = formatTimestampAsDate(now())
-  const profile = deriveProfile(event.pubkey, [url])
-  const profileDisplay = deriveProfileDisplay(event.pubkey, [url])
-  const [_, colorValue] = colors[parseInt(hash(event.pubkey)) % colors.length]
-
-  const reply = () => replyTo!(event)
-
-  const onTap = () => pushModal(ChannelMessageMenuMobile, {url, event, reply})
-
-  const openProfile = () => pushModal(ProfileDetail, {pubkey: event.pubkey, url})
-
-  const deleteReaction = (event: TrustedEvent) => publishDelete({relays: [url], event})
-
-  const createReaction = (template: EventContent) =>
-    publishReaction({...template, event, relays: [url]})
-</script>
-
-<TapTarget
-  data-event={event.id}
-  onTap={inert ? null : onTap}
-  class="group relative flex w-full cursor-default flex-col p-2 pb-3 text-left">
-  <div class="flex w-full gap-3 overflow-auto">
-    {#if showPubkey}
-      <Button onclick={openProfile} class="flex items-start">
-        <Avatar src={$profile?.picture} class="border border-solid border-base-content" size={8} />
-      </Button>
-    {:else}
-      <div class="w-8 min-w-8 max-w-8"></div>
-    {/if}
-    <div class="min-w-0 flex-grow pr-1">
-      {#if showPubkey}
-        <div class="flex items-center gap-2">
-          <Button onclick={openProfile} class="text-sm font-bold" style="color: {colorValue}">
-            {$profileDisplay}
-          </Button>
-          <span class="text-xs opacity-50">
-            {#if formatTimestampAsDate(event.created_at) === today}
-              Today
-            {:else}
-              {formatTimestampAsDate(event.created_at)}
-            {/if}
-            at {formatTimestampAsTime(event.created_at)}
-          </span>
-        </div>
-      {/if}
-      <div class="text-sm">
-        <Content minimalQuote {event} {url} />
-        {#if thunk}
-          <ThunkStatus {thunk} class="mt-2" />
-        {/if}
-      </div>
-    </div>
-  </div>
-  <div class="row-2 ml-10 mt-1">
-    <ReactionSummary
-      {url}
-      {event}
-      {deleteReaction}
-      {createReaction}
-      reactionClass="tooltip-right" />
-  </div>
-  {#if !isMobile}
-    <button
-      class="join absolute right-1 top-1 border border-solid border-neutral text-xs opacity-0 transition-all"
-      class:group-hover:opacity-100={!isMobile}>
-      {#if ENABLE_ZAPS}
-        <ChannelMessageZapButton {url} {event} />
-      {/if}
-      <ChannelMessageEmojiButton {url} {event} />
-      {#if replyTo}
-        <Button class="btn join-item btn-xs" onclick={reply}>
-          <Icon icon="reply" size={4} />
-        </Button>
-      {/if}
-      <ChannelMessageMenuButton {url} {event} />
-    </button>
-  {/if}
-</TapTarget>

src/app/components/ChannelMessageEmojiButton.svelte

@@ -1,15 +0,0 @@
-<script lang="ts">
-  import type {NativeEmoji} from "emoji-picker-element/shared"
-  import EmojiButton from "@lib/components/EmojiButton.svelte"
-  import Icon from "@lib/components/Icon.svelte"
-  import {publishReaction} from "@app/commands"
-
-  const {url, event} = $props()
-
-  const onEmoji = (emoji: NativeEmoji) =>
-    publishReaction({event, relays: [url], content: emoji.unicode})
-</script>
-
-<EmojiButton {onEmoji} class="btn join-item btn-xs">
-  <Icon icon="smile-circle" size={4} />
-</EmojiButton>

src/app/components/ChannelMessageMenu.svelte

@@ -1,50 +0,0 @@
-<script lang="ts">
-  import {pubkey} from "@welshman/app"
-  import Button from "@lib/components/Button.svelte"
-  import Icon from "@lib/components/Icon.svelte"
-  import EventInfo from "@app/components/EventInfo.svelte"
-  import EventReport from "@app/components/EventReport.svelte"
-  import EventDeleteConfirm from "@app/components/EventDeleteConfirm.svelte"
-  import {pushModal} from "@app/modal"
-
-  const {url, event, onClick} = $props()
-
-  const report = () => {
-    onClick()
-    pushModal(EventReport, {url, event})
-  }
-
-  const showInfo = () => {
-    onClick()
-    pushModal(EventInfo, {url, event})
-  }
-
-  const showDelete = () => {
-    onClick()
-    pushModal(EventDeleteConfirm, {url, event})
-  }
-</script>
-
-<ul class="menu whitespace-nowrap rounded-box bg-base-100 p-2 shadow-xl">
-  <li>
-    <Button onclick={showInfo}>
-      <Icon size={4} icon="code-2" />
-      Message Details
-    </Button>
-  </li>
-  {#if event.pubkey === $pubkey}
-    <li>
-      <Button onclick={showDelete} class="text-error">
-        <Icon size={4} icon="trash-bin-2" />
-        Delete Message
-      </Button>
-    </li>
-  {:else}
-    <li>
-      <Button class="text-error" onclick={report}>
-        <Icon size={4} icon="danger" />
-        Report Content
-      </Button>
-    </li>
-  {/if}
-</ul>

src/app/components/ChannelMessageMenuMobile.svelte

@@ -1,65 +0,0 @@
-<script lang="ts">
-  import type {NativeEmoji} from "emoji-picker-element/shared"
-  import type {TrustedEvent} from "@welshman/util"
-  import {pubkey} from "@welshman/app"
-  import Button from "@lib/components/Button.svelte"
-  import Icon from "@lib/components/Icon.svelte"
-  import EmojiPicker from "@lib/components/EmojiPicker.svelte"
-  import ZapButton from "@app/components/ZapButton.svelte"
-  import EventInfo from "@app/components/EventInfo.svelte"
-  import EventDeleteConfirm from "@app/components/EventDeleteConfirm.svelte"
-  import {ENABLE_ZAPS} from "@app/state"
-  import {publishReaction} from "@app/commands"
-  import {pushModal} from "@app/modal"
-
-  type Props = {
-    url: string
-    event: TrustedEvent
-    reply: () => void
-  }
-
-  const {url, event, reply}: Props = $props()
-
-  const onEmoji = ((event: TrustedEvent, url: string, emoji: NativeEmoji) => {
-    history.back()
-    publishReaction({event, relays: [url], content: emoji.unicode})
-  }).bind(undefined, event, url)
-
-  const showEmojiPicker = () => pushModal(EmojiPicker, {onClick: onEmoji}, {replaceState: true})
-
-  const sendReply = () => {
-    history.back()
-    reply()
-  }
-
-  const showInfo = () => pushModal(EventInfo, {url, event}, {replaceState: true})
-
-  const showDelete = () => pushModal(EventDeleteConfirm, {url, event})
-</script>
-
-<div class="col-2">
-  <Button class="btn btn-primary w-full" onclick={showEmojiPicker}>
-    <Icon size={4} icon="smile-circle" />
-    Send Reaction
-  </Button>
-  {#if ENABLE_ZAPS}
-    <ZapButton replaceState {url} {event} class="btn btn-secondary w-full">
-      <Icon size={4} icon="bolt" />
-      Send Zap
-    </ZapButton>
-  {/if}
-  <Button class="btn btn-neutral w-full" onclick={sendReply}>
-    <Icon size={4} icon="reply" />
-    Send Reply
-  </Button>
-  <Button class="btn btn-neutral" onclick={showInfo}>
-    <Icon size={4} icon="code-2" />
-    Message Details
-  </Button>
-  {#if event.pubkey === $pubkey}
-    <Button class="btn btn-neutral text-error" onclick={showDelete}>
-      <Icon size={4} icon="trash-bin-2" />
-      Delete Message
-    </Button>
-  {/if}
-</div>

src/app/components/ChannelName.svelte

@@ -1,7 +0,0 @@
-<script lang="ts">
-  import {channelsById, makeChannelId} from "@app/state"
-
-  const {url, room} = $props()
-</script>
-
-{$channelsById.get(makeChannelId(url, room))?.name || room}

src/app/components/Chat.svelte

@@ -11,6 +11,7 @@
     MINUTE,
     sortBy,
     remove,
+    enumerate,
     formatTimestampAsDate,
   } from "@welshman/lib"
   import type {TrustedEvent, EventTemplate, EventContent} from "@welshman/util"
@@ -21,15 +22,16 @@
     getTags,
     DIRECT_MESSAGE,
     DIRECT_MESSAGE_FILE,
-    INBOX_RELAYS,
   } from "@welshman/util"
   import {
     pubkey,
     tagPubkey,
     sendWrapped,
-    loadUsingOutbox,
-    inboxRelaySelectionsByPubkey,
+    mergeThunks,
+    loadMessagingRelayList,
+    messagingRelayListsByPubkey,
   } from "@welshman/app"
+  import Danger from "@assets/icons/danger-triangle.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Link from "@lib/components/Link.svelte"
   import Spinner from "@lib/components/Spinner.svelte"
@@ -41,34 +43,31 @@
   import ProfileCircle from "@app/components/ProfileCircle.svelte"
   import ProfileCircles from "@app/components/ProfileCircles.svelte"
   import ProfileDetail from "@app/components/ProfileDetail.svelte"
-  import ProfileList from "@app/components/ProfileList.svelte"
+  import ChatMembers from "@app/components/ChatMembers.svelte"
   import ChatMessage from "@app/components/ChatMessage.svelte"
   import ChatCompose from "@app/components/ChatCompose.svelte"
   import ChatComposeParent from "@app/components/ChatComposeParent.svelte"
-  import {
-    INDEXER_RELAYS,
-    userSettingValues,
-    deriveChat,
-    splitChatId,
-    PLATFORM_NAME,
-  } from "@app/state"
-  import {pushModal} from "@app/modal"
-  import {prependParent} from "@app/commands"
+  import ThunkToast from "@app/components/ThunkToast.svelte"
+  import {userSettingsValues, PLATFORM_NAME, deriveChat} from "@app/core/state"
+  import {pushModal} from "@app/util/modal"
+  import {prependParent} from "@app/core/commands"
+  import {pushToast} from "@app/util/toast"
 
   type Props = {
-    id: string
+    pubkeys: string[]
     info?: Snippet
   }
 
-  const {id, info}: Props = $props()
+  const {pubkeys, info}: Props = $props()
 
-  const chat = deriveChat(id)
-  const pubkeys = splitChatId(id)
+  const chat = deriveChat(pubkeys)
   const others = remove($pubkey!, pubkeys)
-  const missingInboxes = $derived(pubkeys.filter(pk => !$inboxRelaySelectionsByPubkey.has(pk)))
+  const missingRelayLists = $derived(pubkeys.filter(pk => !$messagingRelayListsByPubkey.has(pk)))
 
   const showMembers = () =>
-    pushModal(ProfileList, {pubkeys: others, title: `People in this conversation`})
+    others.length === 1
+      ? pushModal(ProfileDetail, {pubkey: others[0]})
+      : pushModal(ChatMembers, {pubkeys: others})
 
   const replyTo = (event: TrustedEvent) => {
     parent = event
@@ -122,11 +121,23 @@
 
     // Split the message into multiple pieces so that we can use kind 15 to send images per nip 17
     // Sleep 1 second between each one to make sure timestamps are distinct
-    for (let i = 0; i < templates.length; i++) {
-      const template = templates[i]
+    const thunks = await Promise.all(
+      Array.from(enumerate(templates)).map(([i, event]) =>
+        sendWrapped({
+          event,
+          recipients: pubkeys,
+          delay: $userSettingsValues.send_delay + ms(i),
+        }),
+      ),
+    )
 
-      await sendWrapped({pubkeys, template, delay: $userSettingValues.send_delay + ms(i)})
-    }
+    pushToast({
+      timeout: 30_000,
+      children: {
+        component: ThunkToast,
+        props: {thunk: mergeThunks(thunks)},
+      },
+    })
 
     clearParent()
   }
@@ -156,7 +167,7 @@
         id,
         type: "note",
         value: event,
-        showPubkey: created_at - previousCreatedAt > int(15, MINUTE) || previousPubkey !== pubkey,
+        showPubkey: created_at - previousCreatedAt > int(2, MINUTE) || previousPubkey !== pubkey,
       })
 
       previousDate = date
@@ -168,13 +179,8 @@
   })
 
   onMount(() => {
-    // Don't use loadInboxRelaySelection because we want to force reload
     for (const pubkey of others) {
-      loadUsingOutbox({
-        pubkey,
-        kind: INBOX_RELAYS,
-        relays: INDEXER_RELAYS,
-      })
+      loadMessagingRelayList(pubkey)
     }
 
     const observer = new ResizeObserver(() => {
@@ -199,19 +205,17 @@
 
 <PageBar>
   {#snippet title()}
-    <div class="flex flex-col gap-1 sm:flex-row sm:gap-2">
+    <Button class="flex flex-col gap-1 sm:flex-row sm:gap-2" onclick={showMembers}>
       {#if others.length === 0}
         <div class="row-2">
           <ProfileCircle pubkey={$pubkey!} size={5} />
           <ProfileName pubkey={$pubkey!} />
         </div>
       {:else if others.length === 1}
-        {@const pubkey = others[0]}
-        {@const onClick = () => pushModal(ProfileDetail, {pubkey})}
-        <Button onclick={onClick} class="row-2">
-          <ProfileCircle {pubkey} size={5} />
-          <ProfileName {pubkey} />
-        </Button>
+        <div class="row-2">
+          <ProfileCircle pubkey={others[0]} size={5} />
+          <ProfileName pubkey={others[0]} />
+        </div>
       {:else}
         <div class="flex items-center gap-2">
           <ProfileCircles pubkeys={others} size={5} />
@@ -226,55 +230,49 @@
             {/if}
           </p>
         </div>
-        {#if others.length > 2}
-          <Button onclick={showMembers} class="btn btn-link hidden sm:block"
-            >Show all members</Button>
-        {/if}
       {/if}
-    </div>
+    </Button>
   {/snippet}
   {#snippet action()}
-    <div>
-      {#if remove($pubkey, missingInboxes).length > 0}
-        {@const count = remove($pubkey, missingInboxes).length}
-        {@const label = count > 1 ? "inboxes are" : "inbox is"}
-        <div
-          class="row-2 badge badge-error badge-lg tooltip tooltip-left cursor-pointer"
-          data-tip="{count} {label} not configured.">
-          <Icon icon="danger" />
-          {count}
-        </div>
-      {/if}
-    </div>
+    {#if remove($pubkey, missingRelayLists).length > 0}
+      {@const count = remove($pubkey, missingRelayLists).length}
+      {@const label = count > 1 ? "lists are" : "list is"}
+      <div
+        class="row-2 badge badge-error badge-lg tooltip tooltip-left cursor-pointer"
+        data-tip="{count} messaging {label} not configured.">
+        <Icon icon={Danger} />
+        {count}
+      </div>
+    {/if}
   {/snippet}
 </PageBar>
 
 <PageContent class="flex flex-col-reverse gap-2 pt-4">
   <div bind:this={dynamicPadding}></div>
-  {#if missingInboxes.includes($pubkey!)}
+  {#if missingRelayLists.includes($pubkey!)}
     <div class="py-12">
       <div class="card2 col-2 m-auto max-w-md items-center text-center">
         <p class="row-2 text-lg text-error">
-          <Icon icon="danger" />
-          Your inbox is not configured.
+          <Icon icon={Danger} />
+          Your messaging relays are not configured.
         </p>
         <p>
           In order to deliver messages, {PLATFORM_NAME} needs to know where to send them. Please visit
-          your <Link class="link" href="/settings/relays">relay settings page</Link> to set up your inbox.
+          your <Link class="link" href="/settings/relays">relay settings page</Link> to receive messages.
         </p>
       </div>
     </div>
-  {:else if missingInboxes.length > 0}
+  {:else if missingRelayLists.length > 0}
     <div class="py-12">
       <div class="card2 col-2 m-auto max-w-md items-center text-center">
         <p class="row-2 text-lg text-error">
-          <Icon icon="danger" />
-          {missingInboxes.length}
-          {missingInboxes.length > 1 ? "inboxes are" : "inbox is"} not configured.
+          <Icon icon={Danger} />
+          {missingRelayLists.length} messaging
+          {missingRelayLists.length > 1 ? "lists are" : "list is"} not configured.
         </p>
         <p>
           In order to deliver messages, {PLATFORM_NAME} needs to know where to send them. Please make
-          sure everyone in this conversation has set up their inbox relays.
+          sure everyone in this conversation has set up their messaging relays.
         </p>
       </div>
     </div>

src/app/components/ChatCompose.svelte

@@ -2,17 +2,18 @@
   import {writable} from "svelte/store"
   import type {EventContent} from "@welshman/util"
   import {isMobile, preventDefault} from "@lib/html"
+  import GallerySend from "@assets/icons/gallery-send.svg?dataurl"
+  import Plane from "@assets/icons/plane-2.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
   import EditorContent from "@app/editor/EditorContent.svelte"
   import {makeEditor} from "@app/editor"
 
   type Props = {
-    url?: string
     onSubmit: (event: EventContent) => void
   }
 
-  const {onSubmit, url}: Props = $props()
+  const {onSubmit}: Props = $props()
 
   const autofocus = !isMobile
 
@@ -37,11 +38,11 @@
   }
 
   const editor = makeEditor({
-    url,
     autofocus,
     submit,
     uploading,
     aggressive: true,
+    encryptFiles: true,
   })
 </script>
 
@@ -54,7 +55,7 @@
     {#if $uploading}
       <span class="loading loading-spinner loading-xs"></span>
     {:else}
-      <Icon icon="gallery-send" />
+      <Icon icon={GallerySend} />
     {/if}
   </Button>
   <div class="chat-editor flex-grow overflow-hidden">
@@ -65,6 +66,6 @@
     class="center tooltip tooltip-left absolute right-4 h-10 w-10 min-w-10 rounded-full"
     disabled={$uploading}
     onclick={submit}>
-    <Icon icon="plain" />
+    <Icon icon={Plane} />
   </Button>
 </form>

src/app/components/ChatComposeParent.svelte

@@ -2,9 +2,10 @@
   import type {TrustedEvent} from "@welshman/util"
   import {displayProfileByPubkey} from "@welshman/app"
   import {slide} from "@lib/transition"
+  import CloseCircle from "@assets/icons/close-circle.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
-  import NoteContent from "@app/components/NoteContent.svelte"
+  import NoteContentMinimal from "@app/components/NoteContentMinimal.svelte"
 
   const {
     verb,
@@ -18,18 +19,13 @@
 </script>
 
 <div
-  class="relative border-l-2 border-solid border-primary bg-base-300 px-2 py-1 pr-8 text-xs"
+  class="relative border-l-2 border-solid border-primary bg-base-300 px-2 py-1 pr-8"
   transition:slide>
-  <p class="text-primary">{verb} @{displayProfileByPubkey(event.pubkey)}</p>
+  <p class="text-xs text-primary">{verb} @{displayProfileByPubkey(event.pubkey)}</p>
   {#key event.id}
-    <NoteContent
-      {event}
-      hideMediaAtDepth={0}
-      minLength={100}
-      maxLength={300}
-      expandMode="disabled" />
+    <NoteContentMinimal trimParent {event} />
   {/key}
   <Button class="absolute right-2 top-2 cursor-pointer" onclick={clear}>
-    <Icon icon="close-circle" />
+    <Icon icon={CloseCircle} />
   </Button>
 </div>

src/app/components/ChatEnable.svelte

@@ -1,15 +1,20 @@
 <script lang="ts">
   import {goto} from "$app/navigation"
-  import {WRAP} from "@welshman/util"
-  import {repository} from "@welshman/app"
   import {preventDefault} from "@lib/html"
+  import {shouldUnwrap} from "@welshman/app"
+  import AltArrowLeft from "@assets/icons/alt-arrow-left.svg?dataurl"
+  import AltArrowRight from "@assets/icons/alt-arrow-right.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
   import Spinner from "@lib/components/Spinner.svelte"
+  import Modal from "@lib/components/Modal.svelte"
+  import ModalBody from "@lib/components/ModalBody.svelte"
   import ModalHeader from "@lib/components/ModalHeader.svelte"
+  import ModalTitle from "@lib/components/ModalTitle.svelte"
+  import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
-  import {canDecrypt, PLATFORM_NAME, ensureUnwrapped} from "@app/state"
-  import {clearModals} from "@app/modal"
+  import {PLATFORM_NAME} from "@app/core/state"
+  import {clearModals} from "@app/util/modal"
 
   const {next} = $props()
 
@@ -17,22 +22,13 @@
 
   let loading = $state(false)
 
-  const enableChat = async () => {
-    canDecrypt.set(true)
-
-    for (const event of repository.query([{kinds: [WRAP]}])) {
-      ensureUnwrapped(event)
-    }
-
-    clearModals()
-    goto(nextUrl)
-  }
-
   const submit = async () => {
     loading = true
 
     try {
-      await enableChat()
+      shouldUnwrap.set(true)
+      clearModals()
+      goto(nextUrl)
     } finally {
       loading = false
     }
@@ -41,31 +37,29 @@
   const back = () => history.back()
 </script>
 
-<form class="column gap-4" onsubmit={preventDefault(submit)}>
-  <ModalHeader>
-    {#snippet title()}
-      <div>Enable Messages</div>
-    {/snippet}
-    {#snippet info()}
-      <div>Do you want to enable direct messages?</div>
-    {/snippet}
-  </ModalHeader>
-  <p>
-    By default, direct messages are disabled, since loading them requires
-    {PLATFORM_NAME} to download and decrypt a lot of data.
-  </p>
-  <p>
-    If you'd like to enable them, please make sure your signer is set up to to auto-approve requests
-    to decrypt data.
-  </p>
+<Modal tag="form" onsubmit={preventDefault(submit)}>
+  <ModalBody>
+    <ModalHeader>
+      <ModalTitle>Enable Messages</ModalTitle>
+      <ModalSubtitle>Do you want to enable direct messages?</ModalSubtitle>
+    </ModalHeader>
+    <p>
+      By default, direct messages are disabled, since loading them requires
+      {PLATFORM_NAME} to download and decrypt a lot of data.
+    </p>
+    <p>
+      If you'd like to enable them, please make sure your signer is set up to to auto-approve
+      requests to decrypt data.
+    </p>
+  </ModalBody>
   <ModalFooter>
     <Button class="btn btn-link" onclick={back}>
-      <Icon icon="alt-arrow-left" />
+      <Icon icon={AltArrowLeft} />
       Go back
     </Button>
     <Button type="submit" class="btn btn-primary" disabled={loading}>
       <Spinner {loading}>Enable Messages</Spinner>
-      <Icon icon="alt-arrow-right" />
+      <Icon icon={AltArrowRight} />
     </Button>
   </ModalFooter>
-</form>
+</Modal>

src/app/components/ChatItem.svelte

@@ -1,16 +1,16 @@
 <script lang="ts">
   import {onMount} from "svelte"
   import {page} from "$app/stores"
-  import {remove} from "@welshman/lib"
+  import {remove, uniq, formatTimestamp} from "@welshman/lib"
   import type {TrustedEvent} from "@welshman/util"
-  import {pubkey, loadInboxRelaySelections} from "@welshman/app"
+  import {pubkey, loadMessagingRelayList} from "@welshman/app"
   import {fade} from "@lib/transition"
   import Link from "@lib/components/Link.svelte"
   import ProfileName from "@app/components/ProfileName.svelte"
   import ProfileCircle from "@app/components/ProfileCircle.svelte"
   import ProfileCircles from "@app/components/ProfileCircles.svelte"
-  import {makeChatPath} from "@app/routes"
-  import {notifications} from "@app/notifications"
+  import {makeChatPath} from "@app/util/routes"
+  import {notifications} from "@app/util/notifications"
 
   interface Props {
     id: string
@@ -21,13 +21,13 @@
 
   const {...props}: Props = $props()
 
-  const others = remove($pubkey!, props.pubkeys)
+  const others = uniq(remove($pubkey!, props.pubkeys))
   const active = $derived($page.params.chat === props.id)
   const path = makeChatPath(props.pubkeys)
 
   onMount(() => {
     for (const pk of others) {
-      loadInboxRelaySelections(pk)
+      loadMessagingRelayList(pk)
     }
   })
 </script>
@@ -59,8 +59,16 @@
         {/if}
       </div>
       <p class="overflow-hidden text-ellipsis whitespace-nowrap text-sm">
+        <span class="opacity-70">
+          {#if props.messages[0].pubkey === $pubkey}
+            You:
+          {/if}
+        </span>
         {props.messages[0].content}
       </p>
+      <p class="text-xs opacity-70">
+        {formatTimestamp(props.messages[0].created_at)}
+      </p>
     </div>
   </div>
 </Link>

src/app/components/ChatMembers.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+  import Button from "@lib/components/Button.svelte"
+  import ModalHeader from "@lib/components/ModalHeader.svelte"
+  import ModalTitle from "@lib/components/ModalTitle.svelte"
+  import ModalFooter from "@lib/components/ModalFooter.svelte"
+  import Modal from "@lib/components/Modal.svelte"
+  import ModalBody from "@lib/components/ModalBody.svelte"
+  import Profile from "@app/components/Profile.svelte"
+
+  interface Props {
+    pubkeys: string[]
+  }
+
+  const {pubkeys}: Props = $props()
+</script>
+
+<Modal>
+  <ModalBody>
+    <ModalHeader>
+      <ModalTitle>People in this conversation</ModalTitle>
+    </ModalHeader>
+    <div class="flex flex-col gap-2">
+      {#each pubkeys as pubkey (pubkey)}
+        <div class="card2 bg-alt">
+          <Profile {pubkey} />
+        </div>
+      {/each}
+    </div>
+  </ModalBody>
+  <ModalFooter>
+    <Button class="btn btn-primary" onclick={() => history.back()}>Got it</Button>
+  </ModalFooter>
+</Modal>

src/app/components/ChatMenu.svelte

@@ -1,9 +1,17 @@
 <script lang="ts">
+  import {assoc} from "@welshman/lib"
+  import ChatSquare from "@assets/icons/chat-square.svg?dataurl"
+  import Check from "@assets/icons/check.svg?dataurl"
+  import Bell from "@assets/icons/bell.svg?dataurl"
+  import BellOff from "@assets/icons/bell-off.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
+  import Modal from "@lib/components/Modal.svelte"
+  import ModalBody from "@lib/components/ModalBody.svelte"
   import ChatStart from "@app/components/ChatStart.svelte"
-  import {setChecked} from "@app/notifications"
-  import {pushModal} from "@app/modal"
+  import {setChecked} from "@app/util/notifications"
+  import {pushModal} from "@app/util/modal"
+  import {notificationSettings} from "@app/core/state"
 
   const startChat = () => pushModal(ChatStart, {}, {replaceState: true})
 
@@ -11,15 +19,34 @@
     setChecked("/chat/*")
     history.back()
   }
+
+  const enableAlerts = () => notificationSettings.update(assoc("messages", true))
+
+  const disableAlerts = () => notificationSettings.update(assoc("messages", false))
 </script>
 
-<div class="col-2">
-  <Button class="btn btn-primary" onclick={startChat}>
-    <Icon size={4} icon="add-circle" />
-    Start chat
-  </Button>
-  <Button class="btn btn-neutral" onclick={markAsRead}>
-    <Icon size={4} icon="check-circle" />
-    Mark all read
-  </Button>
-</div>
+<Modal>
+  <ModalBody>
+    <div class="flex flex-col gap-2">
+      <Button class="btn btn-primary" onclick={startChat}>
+        <Icon size={5} icon={ChatSquare} />
+        Start chat
+      </Button>
+      <Button class="btn btn-neutral" onclick={markAsRead}>
+        <Icon size={5} icon={Check} />
+        Mark all read
+      </Button>
+      {#if $notificationSettings.messages}
+        <Button class="btn btn-neutral" onclick={disableAlerts}>
+          <Icon size={4} icon={BellOff} />
+          Disable alerts
+        </Button>
+      {:else}
+        <Button class="btn btn-neutral" onclick={enableAlerts}>
+          <Icon size={4} icon={Bell} />
+          Enable alerts
+        </Button>
+      {/if}
+    </div>
+  </ModalBody>
+</Modal>

src/app/components/ChatMessage.svelte

@@ -2,22 +2,23 @@
   import {type Instance} from "tippy.js"
   import {hash, formatTimestampAsTime} from "@welshman/lib"
   import type {TrustedEvent, EventContent} from "@welshman/util"
-  import {thunks, pubkey, deriveProfile, deriveProfileDisplay, sendWrapped} from "@welshman/app"
+  import {thunks, mergeThunks, pubkey, deriveProfileDisplay, sendWrapped} from "@welshman/app"
   import {isMobile} from "@lib/html"
+  import MenuDots from "@assets/icons/menu-dots.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
   import Tippy from "@lib/components/Tippy.svelte"
   import TapTarget from "@lib/components/TapTarget.svelte"
-  import Avatar from "@lib/components/Avatar.svelte"
+  import ProfileCircle from "@app/components/ProfileCircle.svelte"
   import Content from "@app/components/Content.svelte"
   import ReactionSummary from "@app/components/ReactionSummary.svelte"
-  import ThunkStatus from "@app/components/ThunkStatus.svelte"
+  import ThunkFailure from "@app/components/ThunkFailure.svelte"
   import ProfileDetail from "@app/components/ProfileDetail.svelte"
   import ChatMessageMenu from "@app/components/ChatMessageMenu.svelte"
   import ChatMessageMenuMobile from "@app/components/ChatMessageMenuMobile.svelte"
-  import {colors} from "@app/state"
-  import {makeDelete, makeReaction} from "@app/commands"
-  import {pushModal} from "@app/modal"
+  import {colors} from "@app/core/state"
+  import {makeDelete, makeReaction} from "@app/core/commands"
+  import {pushModal} from "@app/util/modal"
 
   interface Props {
     event: TrustedEvent
@@ -28,19 +29,18 @@
 
   const {event, replyTo, pubkeys, showPubkey = false}: Props = $props()
 
-  const thunk = $thunks[event.id]
   const isOwn = event.pubkey === $pubkey
-  const profile = deriveProfile(event.pubkey)
   const profileDisplay = deriveProfileDisplay(event.pubkey)
-  const [_, colorValue] = colors[parseInt(hash(event.pubkey)) % colors.length]
+  const thunk = mergeThunks($thunks.filter(t => t.event.id === event.id))
+  const [_, colorValue] = colors[hash(event.pubkey) % colors.length]
 
   const reply = () => replyTo(event)
 
   const deleteReaction = (event: TrustedEvent) =>
-    sendWrapped({template: makeDelete({event}), pubkeys})
+    sendWrapped({event: makeDelete({event, protect: false}), recipients: pubkeys})
 
   const createReaction = (template: EventContent) =>
-    sendWrapped({template: makeReaction({event, ...template}), pubkeys})
+    sendWrapped({event: makeReaction({event, protect: false, ...template}), recipients: pubkeys})
 
   const openProfile = () => pushModal(ProfileDetail, {pubkey: event.pubkey})
 
@@ -59,7 +59,7 @@
 </script>
 
 {#if thunk}
-  <ThunkStatus {thunk} class="mt-1" />
+  <ThunkFailure showToastOnRetry {thunk} class="mt-1" />
 {/if}
 <div
   data-event={event.id}
@@ -87,7 +87,7 @@
         class="opacity-0 transition-all"
         class:group-hover:opacity-100={!isMobile}
         onclick={togglePopover}>
-        <Icon icon="menu-dots" size={4} />
+        <Icon icon={MenuDots} size={4} />
       </button>
     </Tippy>
   {/if}
@@ -99,8 +99,8 @@
         <div class="flex items-center gap-2">
           {#if !isOwn}
             <Button onclick={openProfile} class="flex items-center gap-1">
-              <Avatar
-                src={$profile?.picture}
+              <ProfileCircle
+                pubkey={event.pubkey}
                 class="border border-solid border-base-content"
                 size={4} />
               <div class="flex items-center gap-2">

src/app/components/ChatMessageEmojiButton.svelte

@@ -2,9 +2,10 @@
   import type {NativeEmoji} from "emoji-picker-element/shared"
   import type {TrustedEvent} from "@welshman/util"
   import {sendWrapped} from "@welshman/app"
+  import SmileCircle from "@assets/icons/smile-circle.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import EmojiButton from "@lib/components/EmojiButton.svelte"
-  import {makeReaction} from "@app/commands"
+  import {makeReaction} from "@app/core/commands"
 
   interface Props {
     event: TrustedEvent
@@ -14,9 +15,12 @@
   const {event, pubkeys}: Props = $props()
 
   const onEmoji = (emoji: NativeEmoji) =>
-    sendWrapped({template: makeReaction({event, content: emoji.unicode}), pubkeys})
+    sendWrapped({
+      event: makeReaction({event, content: emoji.unicode, protect: false}),
+      recipients: pubkeys,
+    })
 </script>
 
 <EmojiButton {onEmoji} class="btn join-item btn-xs">
-  <Icon icon="smile-circle" size={4} />
+  <Icon icon={SmileCircle} size={4} />
 </EmojiButton>

src/app/components/ChatMessageMenu.svelte

@@ -3,7 +3,9 @@
   import Button from "@lib/components/Button.svelte"
   import ChatMessageEmojiButton from "@app/components/ChatMessageEmojiButton.svelte"
   import EventInfo from "@app/components/EventInfo.svelte"
-  import {pushModal} from "@app/modal"
+  import {pushModal} from "@app/util/modal"
+  import Reply from "@assets/icons/reply-2.svg?dataurl"
+  import Code2 from "@assets/icons/code-2.svg?dataurl"
 
   const {event, pubkeys, popover, replyTo} = $props()
 
@@ -19,10 +21,10 @@
   <ChatMessageEmojiButton {event} {pubkeys} />
   {#if replyTo}
     <Button class="btn join-item btn-xs" onclick={reply}>
-      <Icon size={4} icon="reply" />
+      <Icon size={4} icon={Reply} />
     </Button>
   {/if}
   <Button class="btn join-item btn-xs" onclick={showInfo}>
-    <Icon size={4} icon="code-2" />
+    <Icon size={4} icon={Code2} />
   </Button>
 </div>

src/app/components/ChatMessageMenuMobile.svelte

@@ -2,13 +2,19 @@
   import type {NativeEmoji} from "emoji-picker-element/shared"
   import type {TrustedEvent} from "@welshman/util"
   import {sendWrapped} from "@welshman/app"
+  import SmileCircle from "@assets/icons/smile-circle.svg?dataurl"
+  import Reply from "@assets/icons/reply-2.svg?dataurl"
+  import Copy from "@assets/icons/copy.svg?dataurl"
+  import Code2 from "@assets/icons/code-2.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
+  import Modal from "@lib/components/Modal.svelte"
+  import ModalBody from "@lib/components/ModalBody.svelte"
   import Button from "@lib/components/Button.svelte"
   import EmojiPicker from "@lib/components/EmojiPicker.svelte"
   import EventInfo from "@app/components/EventInfo.svelte"
-  import {makeReaction} from "@app/commands"
-  import {pushModal} from "@app/modal"
-  import {clip} from "@app/toast"
+  import {makeReaction} from "@app/core/commands"
+  import {pushModal} from "@app/util/modal"
+  import {clip} from "@app/util/toast"
 
   type Props = {
     pubkeys: string[]
@@ -20,7 +26,10 @@
 
   const onEmoji = ((event: TrustedEvent, pubkeys: string[], emoji: NativeEmoji) => {
     history.back()
-    sendWrapped({template: makeReaction({event, content: emoji.unicode}), pubkeys})
+    sendWrapped({
+      event: makeReaction({event, content: emoji.unicode, protect: false}),
+      recipients: pubkeys,
+    })
   }).bind(undefined, event, pubkeys)
 
   const showEmojiPicker = () => pushModal(EmojiPicker, {onClick: onEmoji}, {replaceState: true})
@@ -38,21 +47,25 @@
   const showInfo = () => pushModal(EventInfo, {event}, {replaceState: true})
 </script>
 
-<div class="col-2">
-  <Button class="btn btn-primary w-full" onclick={showEmojiPicker}>
-    <Icon size={4} icon="smile-circle" />
-    Send Reaction
-  </Button>
-  <Button class="btn btn-neutral w-full" onclick={sendReply}>
-    <Icon size={4} icon="reply" />
-    Send Reply
-  </Button>
-  <Button class="btn btn-neutral w-full" onclick={copyText}>
-    <Icon size={4} icon="copy" />
-    Copy Text
-  </Button>
-  <Button class="btn btn-neutral" onclick={showInfo}>
-    <Icon size={4} icon="code-2" />
-    Message Details
-  </Button>
-</div>
+<Modal>
+  <ModalBody>
+    <div class="flex flex-col gap-2">
+      <Button class="btn btn-neutral" onclick={showInfo}>
+        <Icon size={4} icon={Code2} />
+        Message Info
+      </Button>
+      <Button class="btn btn-neutral w-full" onclick={copyText}>
+        <Icon size={4} icon={Copy} />
+        Copy Text
+      </Button>
+      <Button class="btn btn-neutral w-full" onclick={sendReply}>
+        <Icon size={4} icon={Reply} />
+        Send Reply
+      </Button>
+      <Button class="btn btn-primary w-full" onclick={showEmojiPicker}>
+        <Icon size={4} icon={SmileCircle} />
+        Send Reaction
+      </Button>
+    </div>
+  </ModalBody>
+</Modal>

src/app/components/ChatStart.svelte

@@ -5,19 +5,25 @@
   import {goto} from "$app/navigation"
   import {tryCatch, uniq} from "@welshman/lib"
   import {fromNostrURI} from "@welshman/util"
-  import {pubkey} from "@welshman/app"
+  import {loadMessagingRelayList} from "@welshman/app"
   import {preventDefault} from "@lib/html"
   import Field from "@lib/components/Field.svelte"
   import Button from "@lib/components/Button.svelte"
+  import AltArrowLeft from "@assets/icons/alt-arrow-left.svg?dataurl"
+  import AltArrowRight from "@assets/icons/alt-arrow-right.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
+  import Modal from "@lib/components/Modal.svelte"
+  import ModalBody from "@lib/components/ModalBody.svelte"
   import ModalHeader from "@lib/components/ModalHeader.svelte"
+  import ModalTitle from "@lib/components/ModalTitle.svelte"
+  import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
   import ProfileMultiSelect from "@app/components/ProfileMultiSelect.svelte"
-  import {makeChatPath} from "@app/routes"
+  import {makeChatPath} from "@app/util/routes"
 
   const back = () => history.back()
 
-  const onSubmit = () => goto(makeChatPath([...pubkeys, $pubkey!]))
+  const onSubmit = () => goto(makeChatPath(pubkeys))
 
   const addPubkey = (pubkey: string) => {
     pubkeys = uniq([...pubkeys, pubkey])
@@ -28,6 +34,10 @@
 
   let pubkeys: string[] = $state([])
 
+  $effect(() => {
+    pubkeys.forEach(pubkey => loadMessagingRelayList(pubkey))
+  })
+
   onMount(() => {
     return term.subscribe(t => {
       if (t.match(/^[0-9a-f]{64}$/)) {
@@ -51,28 +61,26 @@
   })
 </script>
 
-<form class="column gap-4" onsubmit={preventDefault(onSubmit)}>
-  <ModalHeader>
-    {#snippet title()}
-      <div>Start a Chat</div>
-    {/snippet}
-    {#snippet info()}
-      <div>Create an encrypted chat room for private conversations.</div>
-    {/snippet}
-  </ModalHeader>
-  <Field>
-    {#snippet input()}
-      <ProfileMultiSelect autofocus bind:value={pubkeys} {term} />
-    {/snippet}
-  </Field>
+<Modal tag="form" onsubmit={preventDefault(onSubmit)}>
+  <ModalBody>
+    <ModalHeader>
+      <ModalTitle>Start a Chat</ModalTitle>
+      <ModalSubtitle>Create an encrypted chat room for private conversations.</ModalSubtitle>
+    </ModalHeader>
+    <Field>
+      {#snippet input()}
+        <ProfileMultiSelect autofocus bind:value={pubkeys} {term} />
+      {/snippet}
+    </Field>
+  </ModalBody>
   <ModalFooter>
     <Button class="btn btn-link" onclick={back}>
-      <Icon icon="alt-arrow-left" />
+      <Icon icon={AltArrowLeft} />
       Go back
     </Button>
     <Button type="submit" class="btn btn-primary" disabled={pubkeys.length === 0}>
       Create Chat
-      <Icon icon="alt-arrow-right" />
+      <Icon icon={AltArrowRight} />
     </Button>
   </ModalFooter>
-</form>
+</Modal>

src/app/components/ClassifiedActions.svelte

@@ -0,0 +1,67 @@
+<script lang="ts">
+  import type {TrustedEvent, EventContent} from "@welshman/util"
+  import {getTagValue, getAddress} from "@welshman/util"
+  import {pubkey} from "@welshman/app"
+  import Pen2 from "@assets/icons/pen-2.svg?dataurl"
+  import Link from "@lib/components/Link.svelte"
+  import Icon from "@lib/components/Icon.svelte"
+  import Button from "@lib/components/Button.svelte"
+  import RoomName from "@app/components/RoomName.svelte"
+  import ReactionSummary from "@app/components/ReactionSummary.svelte"
+  import ClassifiedStatus from "@app/components/ClassifiedStatus.svelte"
+  import ThunkStatusOrDeleted from "@app/components/ThunkStatusOrDeleted.svelte"
+  import EventActivity from "@app/components/EventActivity.svelte"
+  import EventActions from "@app/components/EventActions.svelte"
+  import ClassifiedEdit from "@app/components/ClassifiedEdit.svelte"
+  import {publishDelete, publishReaction, canEnforceNip70} from "@app/core/commands"
+  import {makeClassifiedPath, makeSpacePath} from "@app/util/routes"
+  import {pushModal} from "@app/util/modal"
+
+  interface Props {
+    url: string
+    event: TrustedEvent
+    showRoom?: boolean
+    showActivity?: boolean
+  }
+
+  const {url, event, showRoom, showActivity}: Props = $props()
+
+  const h = getTagValue("h", event.tags)
+  const path = makeClassifiedPath(url, getAddress(event))
+  const shouldProtect = canEnforceNip70(url)
+
+  const editClassified = () => pushModal(ClassifiedEdit, {url, event})
+
+  const deleteReaction = async (event: TrustedEvent) =>
+    publishDelete({relays: [url], event, protect: await shouldProtect})
+
+  const createReaction = async (template: EventContent) =>
+    publishReaction({...template, event, relays: [url], protect: await shouldProtect})
+</script>
+
+<div class="flex flex-grow flex-wrap justify-end gap-2">
+  {#if h && showRoom}
+    <Link href={makeSpacePath(url, h)} class="btn btn-neutral btn-xs rounded-full">
+      Posted in #<RoomName {h} {url} />
+    </Link>
+  {/if}
+  <ReactionSummary {url} {event} {deleteReaction} {createReaction} reactionClass="tooltip-left" />
+  <ThunkStatusOrDeleted {event}>
+    <ClassifiedStatus {event} />
+  </ThunkStatusOrDeleted>
+  {#if showActivity}
+    <EventActivity {url} {path} {event} />
+  {/if}
+  <EventActions {url} {event} noun="Listing">
+    {#snippet customActions()}
+      {#if event.pubkey === $pubkey}
+        <li>
+          <Button onclick={editClassified}>
+            <Icon size={4} icon={Pen2} />
+            Edit Listing
+          </Button>
+        </li>
+      {/if}
+    {/snippet}
+  </EventActions>
+</div>

src/app/components/ClassifiedCreate.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+  import ModalHeader from "@lib/components/ModalHeader.svelte"
+  import ModalTitle from "@lib/components/ModalTitle.svelte"
+  import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
+  import ClassifiedForm from "@app/components/ClassifiedForm.svelte"
+
+  type Props = {
+    url: string
+    h?: string
+  }
+
+  const {url, h}: Props = $props()
+</script>
+
+<ClassifiedForm {url} {h}>
+  {#snippet header()}
+    <ModalHeader>
+      <ModalTitle>Create a Classified Listing</ModalTitle>
+      <ModalSubtitle>Advertise a job, sale, or need.</ModalSubtitle>
+    </ModalHeader>
+  {/snippet}
+</ClassifiedForm>

src/app/components/ClassifiedEdit.svelte

@@ -0,0 +1,31 @@
+<script lang="ts">
+  import {fromPairs} from "@welshman/lib"
+  import type {TrustedEvent} from "@welshman/util"
+  import {getTag, getTagValues} from "@welshman/util"
+  import ModalHeader from "@lib/components/ModalHeader.svelte"
+  import ModalTitle from "@lib/components/ModalTitle.svelte"
+  import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
+  import ClassifiedForm from "@app/components/ClassifiedForm.svelte"
+
+  type Props = {
+    url: string
+    event: TrustedEvent
+  }
+
+  const {url, event}: Props = $props()
+
+  const {content} = event
+  const {d, title, status} = fromPairs(event.tags)
+  const [_, price = 0, currency = "SAT"] = getTag("price", event.tags) || []
+  const images = getTagValues("image", event.tags)
+  const initialValues = {d, title, status, content, price: Number(price), currency, images}
+</script>
+
+<ClassifiedForm {url} {initialValues}>
+  {#snippet header()}
+    <ModalHeader>
+      <ModalTitle>Edit this Listing</ModalTitle>
+      <ModalSubtitle>Advertise a job, sale, or need.</ModalSubtitle>
+    </ModalHeader>
+  {/snippet}
+</ClassifiedForm>