Bump welshman

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+# 1.0.2
+
+* Fix add relay button
+* Fix safe inset areas
+* Better rendering for errors from relays
+* Improve remote signer login
+
 # 1.0.1
 
 * Fix relay images in nav

android/app/build.gradle

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

capacitor.config.ts

@@ -18,7 +18,7 @@ const config: CapacitorConfig = {
   },
   // Use this for live reload https://capacitorjs.com/docs/guides/live-reload
   // server: {
-  //   url: "http://192.168.1.250:1847",
+  //   url: "http://192.168.1.115:1847",
   //   cleartext: true
   // },
 };

ios/App/App.xcodeproj/project.pbxproj

@@ -351,14 +351,14 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 9;
+				CURRENT_PROJECT_VERSION = 10;
 				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;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.0.1;
+				MARKETING_VERSION = 1.0.2;
 				OTHER_SWIFT_FLAGS = "$(inherited) \"-D\" \"COCOAPODS\" \"-DDEBUG\"";
 				PRODUCT_BUNDLE_IDENTIFIER = social.flotilla;
 				PRODUCT_NAME = "$(TARGET_NAME)";
@@ -376,14 +376,14 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 9;
+				CURRENT_PROJECT_VERSION = 10;
 				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;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
-				MARKETING_VERSION = 1.0.1;
+				MARKETING_VERSION = 1.0.2;
 				PRODUCT_BUNDLE_IDENTIFIER = social.flotilla;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";

package.json

@@ -1,6 +1,6 @@
 {
   "name": "flotilla",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "private": true,
   "scripts": {
     "dev": "vite dev",
@@ -51,16 +51,16 @@
     "@types/qrcode": "^1.5.5",
     "@vite-pwa/assets-generator": "^0.2.6",
     "@vite-pwa/sveltekit": "^0.6.6",
-    "@welshman/app": "^0.2.3",
-    "@welshman/content": "^0.2.0",
+    "@welshman/app": "^0.2.4",
+    "@welshman/content": "^0.2.1",
     "@welshman/dvm": "^0.2.0",
-    "@welshman/editor": "^0.2.0",
+    "@welshman/editor": "^0.2.1",
     "@welshman/feeds": "^0.2.2",
-    "@welshman/lib": "^0.2.1",
-    "@welshman/net": "^0.2.2",
+    "@welshman/lib": "^0.2.2",
+    "@welshman/net": "^0.2.3",
     "@welshman/relay": "^0.2.0",
     "@welshman/router": "^0.2.0",
-    "@welshman/signer": "^0.2.1",
+    "@welshman/signer": "^0.2.3",
     "@welshman/store": "^0.2.0",
     "@welshman/util": "^0.2.2",
     "daisyui": "^4.12.10",

src/app.css

@@ -54,6 +54,10 @@
   --primary-content: oklch(var(--pc));
   --secondary: oklch(var(--s));
   --secondary-content: oklch(var(--sc));
+  --sait: env(safe-area-inset-top);
+  --saib: env(safe-area-inset-bottom);
+  --sail: env(safe-area-inset-left);
+  --sair: env(safe-area-inset-right);
 }
 
 :root,
@@ -62,50 +66,80 @@ html {
   @apply bg-base-300;
 }
 
-/* ios */
+/* safe area insets */
 
-.sait {
-  padding-top: env(safe-area-inset-top);
-}
+@layer components {
+  .pt-sai {
+    padding-top: var(--sait);
+  }
 
-.sair {
-  padding-right: env(safe-area-inset-right);
-}
+  .pr-sai {
+    padding-right: var(--sair);
+  }
 
-.saib {
-  padding-bottom: env(safe-area-inset-bottom);
-}
+  .pb-sai {
+    padding-bottom: var(--saib);
+  }
 
-.sail {
-  padding-left: env(safe-area-inset-left);
-}
+  .pl-sai {
+    padding-left: var(--sail);
+  }
 
-.saix {
-  @apply sail sair;
-}
+  .px-sai {
+    @apply pl-sai pr-sai;
+  }
 
-.saiy {
-  @apply sait saib;
-}
+  .py-sai {
+    @apply pt-sai pb-sai;
+  }
 
-.sai {
-  @apply saiy saix;
-}
+  .p-sai {
+    @apply py-sai px-sai;
+  }
 
-.top-sai {
-  top: env(safe-area-inset-top);
-}
+  .mt-sai {
+    padding-top: var(--sait);
+  }
 
-.right-sai {
-  right: env(safe-area-inset-right);
-}
+  .mr-sai {
+    padding-right: var(--sair);
+  }
 
-.bottom-sai {
-  bottom: env(safe-area-inset-bottom);
-}
+  .mb-sai {
+    padding-bottom: var(--saib);
+  }
 
-.left-sai {
-  left: env(safe-area-inset-left);
+  .ml-sai {
+    padding-left: var(--sail);
+  }
+
+  .mx-sai {
+    @apply ml-sai mr-sai;
+  }
+
+  .my-sai {
+    @apply mt-sai mb-sai;
+  }
+
+  .m-sai {
+    @apply my-sai mx-sai;
+  }
+
+  .top-sai {
+    top: var(--sait);
+  }
+
+  .right-sai {
+    right: var(--sair);
+  }
+
+  .bottom-sai {
+    bottom: var(--saib);
+  }
+
+  .left-sai {
+    left: var(--sail);
+  }
 }
 
 /* utilities */
@@ -294,6 +328,16 @@ html {
   color: var(--base-content);
 }
 
+/* content rendered by welshman/content */
+
+.welshman-content a {
+  @apply link;
+}
+
+.welshman-content-error a {
+  @apply underline;
+}
+
 /* date input */
 
 .picker {
@@ -335,11 +379,11 @@ progress[value]::-webkit-progress-value {
 /* content width for fixed elements */
 
 .cw {
-  @apply w-full md:w-[calc(100%-18.5rem)];
+  @apply w-full md:left-[18.5rem] md:w-[calc(100%-18.5rem-var(--sair))];
 }
 
 .cb {
-  @apply saib bottom-14 md:bottom-0;
+  @apply md:bottom-sai bottom-[calc(var(--saib)+3.5rem)];
 }
 
 /* chat view */
@@ -349,5 +393,5 @@ progress[value]::-webkit-progress-value {
 }
 
 .chat__scroll-down {
-  @apply saib fixed bottom-28 right-4 md:bottom-16;
+  @apply fixed bottom-28 right-4 md:bottom-16;
 }

src/app/commands.ts

@@ -1,6 +1,6 @@
 import * as nip19 from "nostr-tools/nip19"
 import {get} from "svelte/store"
-import {randomId, ifLet, poll, uniq, equals, TIMEZONE, LOCALE} from "@welshman/lib"
+import {randomId, poll, uniq, equals, TIMEZONE, LOCALE} from "@welshman/lib"
 import type {Feed} from "@welshman/feeds"
 import type {TrustedEvent, EventContent} from "@welshman/util"
 import {
@@ -266,18 +266,20 @@ export const checkRelayAccess = async (url: string, claim = "") => {
     relays: [url],
   })
 
-  ifLet(await getThunkError(thunk), error => {
+  const error = await getThunkError(thunk)
+
+  if (error) {
     const message =
-      socket.auth.details?.replace(/^.*: /, "") ||
-      error?.replace(/^.*: /, "") ||
+      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 `Failed to join relay (${message})`
+      return message
     }
-  })
+  }
 }
 
 export const checkRelayProfile = async (url: string) => {

src/app/components/BunkerConnect.svelte

@@ -9,7 +9,7 @@
     loading = $state(false)
     clientSecret = makeSecret()
     abortController = new AbortController()
-    broker = Nip46Broker.get({clientSecret: this.clientSecret, relays: SIGNER_RELAYS})
+    broker = new Nip46Broker({clientSecret: this.clientSecret, relays: SIGNER_RELAYS})
     onNostrConnect: (response: Nip46ResponseWithResult) => void
 
     constructor({onNostrConnect}: {onNostrConnect: (response: Nip46ResponseWithResult) => void}) {
@@ -45,6 +45,7 @@
     }
 
     stop() {
+      this.broker.cleanup()
       this.abortController.abort()
     }
   }

src/app/components/Chat.svelte

@@ -126,9 +126,11 @@
     })
 
     observer.observe(chatCompose!)
+    observer.observe(dynamicPadding!)
 
     return () => {
       observer.unobserve(chatCompose!)
+      observer.unobserve(dynamicPadding!)
     }
   })
 

src/app/components/LogInBunker.svelte

@@ -46,12 +46,13 @@
 
     try {
       const {clientSecret} = controller
-      const broker = Nip46Broker.get({relays, clientSecret, signerPubkey})
+      const broker = new Nip46Broker({relays, clientSecret, signerPubkey})
       const result = await broker.connect(connectSecret, NIP46_PERMS)
       const pubkey = await broker.getPublicKey()
 
       // TODO: remove ack result
       if (pubkey && ["ack", connectSecret].includes(result)) {
+        broker.cleanup()
         controller.stop()
 
         await loadUserData(pubkey)

src/app/components/LogInPassword.svelte

@@ -34,7 +34,7 @@
     ? [normalizeRelayUrl("ws://" + stripProtocol(BURROW_URL))]
     : [normalizeRelayUrl(BURROW_URL)]
 
-  const broker = Nip46Broker.get({clientSecret, relays})
+  const broker = new Nip46Broker({clientSecret, relays})
 
   const back = () => history.back()
 
@@ -89,7 +89,7 @@
       await loadUserData(pubkey)
 
       addSession({...session, email})
-
+      broker.cleanup()
       setChecked("*")
       clearModals()
     }

src/app/components/PrimaryNav.svelte

@@ -51,7 +51,8 @@
 
 <svelte:window bind:innerHeight={windowHeight} />
 
-<div class="sail sait saib relative z-nav hidden w-14 flex-shrink-0 bg-base-200 pt-4 md:block">
+<div
+  class="ml-sai mt-sai mb-sai relative z-nav hidden w-14 flex-shrink-0 bg-base-200 pt-4 md:block">
   <div class="flex h-full flex-col justify-between">
     <div>
       {#if PLATFORM_RELAY}
@@ -103,7 +104,7 @@
 {@render children?.()}
 
 <!-- a little extra something for ios -->
-<div class="fixed bottom-0 left-0 right-0 z-nav h-14 bg-base-100 md:hidden"></div>
+<div class="fixed bottom-0 left-0 right-0 z-nav h-[var(--saib)] bg-base-100 md:hidden"></div>
 <div
   class="border-top bottom-sai fixed left-0 right-0 z-nav h-14 border border-base-200 bg-base-100 md:hidden">
   <div class="content-padding-x content-sizing flex justify-between px-2">

src/app/components/ProfileDetail.svelte

@@ -66,7 +66,7 @@
   </div>
   <ProfileInfo {pubkey} {url} />
   <ModalFooter>
-    <Button onclick={back} class="btn btn-link">
+    <Button onclick={back} class="hidden md:btn md:btn-link">
       <Icon icon="alt-arrow-left" />
       Go back
     </Button>

src/app/components/ProfileFeed.svelte

@@ -45,7 +45,8 @@
           e => e.id,
           sortBy(e => -e.created_at, buffer),
         )
-        events = [...events, ...buffer.splice(0, 5)]
+
+        events = uniqBy(e => e.id, [...events, ...buffer.splice(0, 5)])
 
         if (buffer.length < 50) {
           ctrl.load(50)

src/app/components/QRCode.svelte

@@ -4,7 +4,7 @@
   import Button from "@lib/components/Button.svelte"
   import {clip} from "@app/toast"
 
-  const {code} = $props()
+  const {code, ...props} = $props()
 
   let canvas: Element | undefined = $state()
   let wrapper: Element | undefined = $state()
@@ -26,7 +26,7 @@
   })
 </script>
 
-<Button class="max-w-full" onclick={copy}>
+<Button class="max-w-full {props.class}" onclick={copy}>
   <div bind:this={wrapper} style={`height: ${height}px`}>
     <canvas
       class="rounded-box"

src/app/components/RelayItem.svelte

@@ -29,7 +29,7 @@
         >{displayUrl($relay.profile.contact)}</Link>
       &bull;
     {/if}
-    {#if $relay?.profile?.supported_nips}
+    {#if Array.isArray($relay?.profile?.supported_nips)}
       <span
         class="tooltip cursor-pointer underline"
         data-tip="NIPs supported: {$relay.profile.supported_nips.join(', ')}">

src/app/components/SpaceAuthError.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
   import {displayRelayUrl} from "@welshman/util"
+  import {parse, renderAsHtml} from "@welshman/content"
   import Spinner from "@lib/components/Spinner.svelte"
   import Button from "@lib/components/Button.svelte"
-  import Field from "@lib/components/Field.svelte"
   import Icon from "@lib/components/Icon.svelte"
   import {preventDefault} from "@lib/html"
+  import {ucFirst} from "@lib/util"
   import ModalHeader from "@lib/components/ModalHeader.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
   import {pushToast} from "@app/toast"
@@ -15,8 +16,8 @@
 
   const back = () => history.back()
 
-  const joinRelay = async (claim: string) => {
-    const error = await attemptRelayAccess(url, claim)
+  const joinRelay = async () => {
+    const error = await attemptRelayAccess(url)
 
     if (error) {
       return pushToast({theme: "error", message: error})
@@ -33,13 +34,12 @@
     loading = true
 
     try {
-      await joinRelay(claim)
+      await joinRelay()
     } finally {
       loading = false
     }
   }
 
-  let claim = $state("")
   let loading = $state(false)
 </script>
 
@@ -53,32 +53,17 @@
     {/snippet}
   </ModalHeader>
   <p>
-    We received an error from the relay indicating you don't have access to {displayRelayUrl(url)}.
+    We received an error from the relay indicating you don't have access to {displayRelayUrl(url)}:
   </p>
-  <p class="border-l border-solid border-error pl-4 text-error">
-    {error}
+  <p class="bg-alt card2 welshman-content">
+    {@html renderAsHtml(parse({content: ucFirst(error)}))}
   </p>
-  <p>If you have one, you can try entering an invite code below to request access.</p>
-  <Field>
-    {#snippet label()}
-      <p>Invite code</p>
-    {/snippet}
-    {#snippet input()}
-      <label class="input input-bordered flex w-full items-center gap-2">
-        <Icon icon="link-round" />
-        <input bind:value={claim} class="grow" type="text" />
-      </label>
-    {/snippet}
-    {#snippet info()}
-      <p>Enter an invite code provided to you by the admin of the relay.</p>
-    {/snippet}
-  </Field>
   <ModalFooter>
     <Button class="btn btn-link" onclick={back}>
       <Icon icon="alt-arrow-left" />
       Go back
     </Button>
-    <Button type="submit" class="btn btn-primary" disabled={!claim || loading}>
+    <Button type="submit" class="btn btn-primary" disabled={loading}>
       <Spinner {loading}>Request Access</Spinner>
       <Icon icon="alt-arrow-right" />
     </Button>

src/app/components/SpaceInviteAccept.svelte

@@ -23,7 +23,7 @@
     const error = await attemptRelayAccess(url, claim)
 
     if (error) {
-      return pushToast({theme: "error", message: error})
+      return pushToast({theme: "error", message: error, timeout: 30_000})
     }
 
     const socket = Pool.get().get(url)

src/app/components/Toast.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import {parse, renderAsHtml} from "@welshman/content"
   import {fly} from "@lib/transition"
   import Icon from "@lib/components/Icon.svelte"
   import Button from "@lib/components/Button.svelte"
@@ -7,7 +8,7 @@
 
 {#if $toast}
   {@const theme = $toast.theme || "info"}
-  <div transition:fly class="toast z-toast">
+  <div transition:fly class="bottom-sai right-sai toast z-toast">
     {#key $toast.id}
       <div
         role="alert"
@@ -15,7 +16,9 @@
         class:bg-base-100={theme === "info"}
         class:text-base-content={theme === "info"}
         class:alert-error={theme === "error"}>
-        {$toast.message}
+        <p class="welshman-content-error">
+          {@html renderAsHtml(parse({content: $toast.message}))}
+        </p>
         <Button class="flex items-center opacity-75" onclick={() => popToast($toast.id)}>
           <Icon icon="close-circle" />
         </Button>

src/app/state.ts

@@ -485,7 +485,7 @@ export const messages = derived(
 export const groupMeta = deriveEvents(repository, {filters: [{kinds: [GROUP_META]}]})
 
 export const hasNip29 = (relay?: Relay) =>
-  relay?.profile?.supported_nips?.map(String)?.includes("29")
+  relay?.profile?.supported_nips?.map?.(String)?.includes?.("29")
 
 // Channels
 

src/lib/components/ContentSearch.svelte

@@ -8,13 +8,13 @@
   const {...props}: Props = $props()
 </script>
 
-<div class="col-2 content-padding-t content-padding-x h-full {props.class}">
+<div class="content-padding-t content-padding-x flex h-full flex-col gap-1 {props.class}">
   <div class="z-feature">
     <div class="content-sizing">
       {@render props.input?.()}
     </div>
   </div>
-  <div class="scroll-container overflow-auto pt-2">
+  <div class="scroll-container overflow-auto">
     <div class="content-sizing">
       {@render props.content?.()}
     </div>

src/lib/components/Divider.svelte

@@ -1,9 +1,11 @@
 <script lang="ts">
+  import type {Snippet} from "svelte"
+
   interface Props {
-    children?: import("svelte").Snippet
+    children?: Snippet
   }
 
-  const {children}: Props = $props()
+  const {children, ...props}: Props = $props()
 </script>
 
 <div class="flex items-center gap-2 p-2 text-xs uppercase opacity-50">

src/lib/components/Drawer.svelte

@@ -12,7 +12,7 @@
     onclick={onClose}>
   </button>
   <div
-    class="scroll-container saiy sair absolute bottom-0 right-0 top-0 w-80 overflow-auto bg-base-200 text-base-content lg:w-96"
+    class="scroll-container py-sai pr-sair absolute bottom-0 right-0 top-0 w-80 overflow-auto bg-base-200 text-base-content lg:w-96"
     transition:translate={{axis: "x", duration: 300}}>
     {@render children?.()}
   </div>

src/lib/components/Page.svelte

@@ -8,6 +8,7 @@
 </script>
 
 <div
-  class="sait saib sair scroll-container mb-14 max-h-screen flex-grow overflow-auto bg-base-200 md:mb-0 {props.class}">
+  data-component="Page"
+  class="scroll-container bottom-sai top-sai cw fixed mb-14 overflow-auto bg-base-200 md:mb-0 {props.class}">
   {@render props.children?.()}
 </div>

src/lib/components/PageBar.svelte

@@ -11,9 +11,9 @@
   const {...props}: Props = $props()
 </script>
 
-<div class="sait cw fixed top-2 z-feature rounded-xl px-2 pt-2 {props.class}">
+<div data-component="PageBar" class="cw top-sai fixed z-feature p-2">
   <div
-    class="flex min-h-12 items-center justify-between gap-4 rounded-xl bg-base-100 px-4 shadow-xl">
+    class="flex min-h-12 items-center justify-between gap-4 rounded-xl rounded-xl bg-base-100 px-4 shadow-xl">
     <div class="ellipsize flex items-center gap-4 whitespace-nowrap">
       {@render props.icon?.()}
       {@render props.title?.()}

src/lib/components/PageContent.svelte

@@ -13,6 +13,7 @@
 <div
   {...props}
   bind:this={element}
-  class="scroll-container saib cw fixed top-12 h-[calc(100%-6.5rem)] overflow-y-auto overflow-x-hidden md:h-[calc(100%-3rem)] {props.class}">
+  data-component="PageContent"
+  class="scroll-container cw md:bottom-sai fixed bottom-[calc(var(--saib)+3.5rem)] top-[calc(var(--sait)+3rem)] overflow-y-auto overflow-x-hidden {props.class}">
   {@render children?.()}
 </div>

src/lib/components/SecondaryNav.svelte

@@ -7,6 +7,6 @@
 </script>
 
 <div
-  class="sail sait saib hidden max-h-screen w-60 flex-shrink-0 flex-col gap-1 bg-base-300 md:flex">
+  class="ml-sai mt-sai mb-sai hidden max-h-screen w-60 flex-shrink-0 flex-col gap-1 bg-base-300 md:flex">
   {@render children?.()}
 </div>

src/lib/util.ts

@@ -15,3 +15,5 @@ export const nsecDecode = (nsec: string) => {
 export const day = (seconds: number) => Math.floor(seconds / DAY)
 
 export const daysBetween = (start: number, end: number) => [...range(start, end, DAY)].map(day)
+
+export const ucFirst = (s: string) => s.slice(0, 1).toUpperCase() + s.slice(1)

src/routes/+layout.svelte

@@ -96,7 +96,7 @@
         if (login?.startsWith("bunker://")) {
           const clientSecret = makeSecret()
           const {signerPubkey, connectSecret, relays} = Nip46Broker.parseBunkerUrl(login)
-          const broker = Nip46Broker.get({relays, clientSecret, signerPubkey})
+          const broker = new Nip46Broker({relays, clientSecret, signerPubkey})
           const result = await broker.connect(connectSecret, appState.NIP46_PERMS)
           const pubkey = await broker.getPublicKey()
 
@@ -105,6 +105,7 @@
             await loadUserData(pubkey)
 
             loginWithNip46(pubkey, clientSecret, signerPubkey, relays)
+            broker.cleanup()
             success = true
           }
         } else if (login) {

src/routes/settings/+page.svelte

@@ -58,8 +58,6 @@
   let settings = $state({...$userSettingValues})
   let mutedPubkeys = $state(getPubkeyTagValues(getListTags($userMutes)))
   let blossomServers = $state(getTagValues("server", getListTags($userBlossomServers)))
-
-  $inspect(blossomServers)
 </script>
 
 <form class="content column gap-4" {onsubmit}>

src/routes/settings/about/+page.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import {Capacitor} from "@capacitor/core"
   import Link from "@lib/components/Link.svelte"
   import Button from "@lib/components/Button.svelte"
   import Icon from "@lib/components/Icon.svelte"
@@ -19,13 +20,15 @@
       <p class="text-center text-2xl">Thanks for using</p>
       <h1 class="mb-4 text-center text-5xl font-bold uppercase">{PLATFORM_NAME}</h1>
       <div class="grid grid-cols-1 gap-8 lg:grid-cols-2">
-        <div class="card2 bg-alt flex flex-col gap-2 text-center shadow-2xl">
-          <h3 class="text-2xl sm:h-12">Donate</h3>
-          <p class="sm:h-16">Funds will be used to support development.</p>
-          <Link external href="https://geyser.fund/project/flotilla" class="btn btn-primary">
-            Support the Developer
-          </Link>
-        </div>
+        {#if Capacitor.getPlatform() !== "ios"}
+          <div class="card2 bg-alt flex flex-col gap-2 text-center shadow-2xl">
+            <h3 class="text-2xl sm:h-12">Donate</h3>
+            <p class="sm:h-16">Funds will be used to support development.</p>
+            <Link external href="https://geyser.fund/project/flotilla" class="btn btn-primary">
+              Support the Developer
+            </Link>
+          </div>
+        {/if}
         <div class="card2 bg-alt flex flex-col gap-2 text-center shadow-2xl">
           <h3 class="text-2xl sm:h-12">Get in touch</h3>
           <p class="sm:h-16">Having problems? Let us know.</p>

src/routes/spaces/[relay]/+page.svelte

@@ -112,7 +112,7 @@
             <span class="ellipsize">Requires PoW {limitation?.min_pow_difficulty}</span>
           </p>
         {/if}
-        {#if supported_nips}
+        {#if Array.isArray(supported_nips)}
           <p class="badge badge-neutral">
             <span class="ellipsize">NIPs: {supported_nips.join(", ")}</span>
           </p>
@@ -189,8 +189,8 @@
     </Button>
   </div>
   {#if pubkey}
+    <Divider>Recent posts from the relay admin</Divider>
     <div class="hidden flex-col gap-2" class:!flex={relayAdminEvents.length > 0}>
-      <Divider>Recent posts from the relay admin</Divider>
       <ProfileFeed hideLoading {url} {pubkey} bind:events={relayAdminEvents} />
     </div>
   {/if}

src/routes/spaces/[relay]/[room]/+page.svelte

@@ -42,6 +42,7 @@
   import {pushToast} from "@app/toast"
 
   const {room = GENERAL} = $page.params
+  const mounted = now()
   const lastChecked = $checked[$page.url.pathname]
   const url = decodeRelay($page.params.relay)
   const filter = {kinds: [MESSAGE], "#h": [room]}
@@ -170,7 +171,8 @@
           !newMessagesSeen &&
           adjustedLastChecked &&
           event.pubkey !== $pubkey &&
-          event.created_at > adjustedLastChecked
+          event.created_at > adjustedLastChecked &&
+          event.created_at < mounted
         ) {
           elements.push({type: "new-messages", id: "new-messages"})
           newMessagesSeen = true
@@ -213,13 +215,17 @@
     }))
 
     const observer = new ResizeObserver(() => {
-      dynamicPadding!.style.minHeight = `${chatCompose!.offsetHeight}px`
+      if (dynamicPadding && chatCompose) {
+        dynamicPadding!.style.minHeight = `${chatCompose!.offsetHeight}px`
+      }
     })
 
     observer.observe(chatCompose!)
+    observer.observe(dynamicPadding!)
 
     return () => {
       observer.unobserve(chatCompose!)
+      observer.unobserve(dynamicPadding!)
     }
   })