Show lock icon for closed channels

src/app/components/MenuSpace.svelte

@@ -14,7 +14,6 @@
   import SpaceJoin from "@app/components/SpaceJoin.svelte"
   import ProfileList from "@app/components/ProfileList.svelte"
   import RoomCreate from "@app/components/RoomCreate.svelte"
-  import ChannelName from "@app/components/ChannelName.svelte"
   import MenuSpaceRoomItem from "@app/components/MenuSpaceRoomItem.svelte"
   import {
     getMembershipUrls,
@@ -121,7 +120,7 @@
       <div class="h-2" />
       <SecondaryNavHeader>Your Rooms</SecondaryNavHeader>
       {#each $userRooms as room, i (room)}
-        <MenuSpaceRoomItem {url} {room} />
+        <MenuSpaceRoomItem notify {url} {room} />
       {/each}
       {#if $otherRooms.length > 0}
         <div class="h-2" />
@@ -134,12 +133,7 @@
         </SecondaryNavHeader>
       {/if}
       {#each $otherRooms as room, i (room)}
-        <SecondaryNavItem href={makeSpacePath(url, room)}>
-          <Icon icon="hashtag" />
-          <div class="min-w-0 overflow-hidden text-ellipsis">
-            <ChannelName {url} {room} />
-          </div>
-        </SecondaryNavItem>
+        <MenuSpaceRoomItem {url} {room} />
       {/each}
       <SecondaryNavItem on:click={addRoom}>
         <Icon icon="add-circle" />

src/app/components/MenuSpaceRoomItem.svelte

@@ -1,19 +1,29 @@
 <script lang="ts">
+  import {readable} from "svelte/store"
   import Icon from "@lib/components/Icon.svelte"
   import SecondaryNavItem from "@lib/components/SecondaryNavItem.svelte"
   import ChannelName from "@app/components/ChannelName.svelte"
   import {makeSpacePath} from "@app/routes"
+  import {deriveChannel, channelIsLocked} from "@app/state"
   import {deriveNotification, getRoomFilters} from "@app/notifications"
 
   export let url
   export let room
+  export let notify = false
 
   const path = makeSpacePath(url, room)
-  const notification = deriveNotification(path, getRoomFilters(room), url)
+  const channel = deriveChannel(url, room)
+  const notification = notify
+    ? deriveNotification(path, getRoomFilters(room), url)
+    : readable(false)
 </script>
 
 <SecondaryNavItem href={path} notification={$notification}>
-  <Icon icon="hashtag" />
+  {#if channelIsLocked($channel)}
+    <Icon icon="lock" size={4} />
+  {:else}
+    <Icon icon="hashtag" />
+  {/if}
   <div class="min-w-0 overflow-hidden text-ellipsis">
     <ChannelName {url} {room} />
   </div>

src/app/components/ThunkStatus.svelte

@@ -50,9 +50,9 @@
       component={ThunkStatusDetail}
       props={{url, message, status, retry}}
       params={{interactive: true}}>
-      <span class="flex cursor-pointer items-center gap-1">
+      <span class="flex cursor-pointer items-center gap-1 text-error">
         <Icon icon="danger" size={3} />
-        <span class="opacity-50">Failed to send!</span>
+        <span>Failed to send!</span>
       </span>
     </Tippy>
   {:else if canCancel || isPending}