Polish RBAC role/member stores and remove state-role cycle

src/app/components/RoleBadge.svelte

@@ -4,29 +4,21 @@
   import {roleColorToCSS} from "@app/core/roles"
 
   type Props = {
-    role: RoleDefinition | string
-    label?: string
-    color?: number
+    role: RoleDefinition
     class?: string
   }
 
-  const {role, label, color, ...props}: Props = $props()
-
-  const roleName = $derived(typeof role === "string" ? role : role.name)
-  const roleLabel = $derived(
-    label || (typeof role === "string" ? undefined : role.label) || roleName,
-  )
-  const roleColor = $derived(color ?? (typeof role === "string" ? undefined : role.color))
+  const {role, ...props}: Props = $props()
 
   const style = $derived(
-    roleColor === undefined
+    role.color === undefined
       ? ""
-      : `color: ${roleColorToCSS(roleColor)}; border-color: ${roleColorToCSS(roleColor)};`,
+      : `color: ${roleColorToCSS(role.color)}; border-color: ${roleColorToCSS(role.color)};`,
   )
 
   const className = $derived(cx("badge badge-outline badge-sm", props.class))
 </script>
 
 <span class={className} {style}>
-  {roleLabel}
+  {role.label || role.name}
 </span>

src/app/components/RoomDetail.svelte

@@ -253,7 +253,7 @@
         {/if}
       </div>
     </div>
-    {#if $members !== undefined && $members.length > 0}
+    {#if $members.length > 0}
       <div class="card2 card2-sm bg-alt flex items-center justify-between gap-4">
         <div class="flex items-center gap-4">
           <span>Members:</span>
@@ -261,10 +261,6 @@
         </div>
         <Button class="btn btn-neutral btn-sm" onclick={showMembers}>View All</Button>
       </div>
-    {:else if $members === undefined}
-      <div class="card2 card2-sm bg-base-200 flex items-center gap-4">
-        <span class="text-error">Member list not available from this relay</span>
-      </div>
     {/if}
     {#if $userIsAdmin && $roleDefinitions.length > 0}
       <div class="card2 card2-sm bg-alt col-4">

src/app/components/RoomMembers.svelte

@@ -83,11 +83,7 @@
       </ModalSubtitle>
     </ModalHeader>
     <div class="flex flex-col gap-2">
-      {#if $members === undefined}
-        <div class="card2 bg-base-200 p-4">
-          <span class="text-error">Member list not available from this relay</span>
-        </div>
-      {:else if $members.length === 0}
+      {#if $members.length === 0}
         <div class="card2 bg-base-200 p-4">
           <span class="text-base-content/70">No members yet</span>
         </div>

src/app/components/SpaceMembers.svelte

@@ -22,13 +22,10 @@
   import Profile from "@app/components/Profile.svelte"
   import SpaceMembersAdd from "@app/components/SpaceMembersAdd.svelte"
   import SpaceMembersBanned from "@app/components/SpaceMembersBanned.svelte"
-  import {
-    deriveSpaceMembers,
-    deriveSpaceBannedPubkeyItems,
-    deriveSupportedMethods,
-  } from "@app/core/state"
+  import {deriveSpaceMembers, deriveSpaceBannedPubkeyItems} from "@app/core/state"
   import {
     deriveGroupedSpaceMembers,
+    deriveSupportedMethods,
     deriveUserHasSpacePermission,
     ROOM_PERMISSION_ADD_MEMBER,
     ROOM_PERMISSION_REMOVE_MEMBER,
@@ -126,11 +123,7 @@
       {/if}
     {/if}
     <div class="flex flex-col gap-2">
-      {#if $members === undefined}
-        <div class="card2 bg-base-200 p-4">
-          <span class="text-error">Member list not available from this space</span>
-        </div>
-      {:else if $members.length === 0}
+      {#if $members.length === 0}
         <div class="card2 bg-base-200 p-4">
           <span class="text-base-content/70">No members yet</span>
         </div>

src/app/components/SpaceMembersBanned.svelte

@@ -16,7 +16,8 @@
   import ModalSubtitle from "@lib/components/ModalSubtitle.svelte"
   import ModalFooter from "@lib/components/ModalFooter.svelte"
   import Profile from "@app/components/Profile.svelte"
-  import {deriveSpaceBannedPubkeyItems, deriveSupportedMethods} from "@app/core/state"
+  import {deriveSupportedMethods} from "@app/core/roles"
+  import {deriveSpaceBannedPubkeyItems} from "@app/core/state"
   import {addSpaceMembers} from "@app/core/commands"
   import {pushToast} from "@app/util/toast"