Support room version 12 (#2399)

* WIP - support room version 12

* add room creators hook

* revert changes from powerlevels

* improve use room creators hook

* add hook to get dm users

* add options to add creators in create room/space

* add member item component in member drawer

* remove unused import

* extract member drawer header component

* get room creators as set only if room version support them

* add room permissions hook

* support room v12 creators power

* make predecessor event id optional

* add info about founders in permissions

* allow to create infinite powers to room creators

* allow everyone with permission to create infinite power

* handle additional creators in room upgrade

* add option to follow space tombstone

src/app/features/room-settings/general/General.tsx

@@ -13,6 +13,8 @@ import {
   RoomPublish,
   RoomUpgrade,
 } from '../../common-settings/general';
+import { useRoomCreators } from '../../../hooks/useRoomCreators';
+import { useRoomPermissions } from '../../../hooks/useRoomPermissions';
 
 type GeneralProps = {
   requestClose: () => void;
@@ -20,6 +22,8 @@ type GeneralProps = {
 export function General({ requestClose }: GeneralProps) {
   const room = useRoom();
   const powerLevels = usePowerLevels(room);
+  const creators = useRoomCreators(room);
+  const permissions = useRoomPermissions(creators, powerLevels);
 
   return (
     <Page>
@@ -41,22 +45,22 @@ export function General({ requestClose }: GeneralProps) {
         <Scroll hideTrack visibility="Hover">
           <PageContent>
             <Box direction="Column" gap="700">
-              <RoomProfile powerLevels={powerLevels} />
+              <RoomProfile permissions={permissions} />
               <Box direction="Column" gap="100">
                 <Text size="L400">Options</Text>
-                <RoomJoinRules powerLevels={powerLevels} />
-                <RoomHistoryVisibility powerLevels={powerLevels} />
-                <RoomEncryption powerLevels={powerLevels} />
-                <RoomPublish powerLevels={powerLevels} />
+                <RoomJoinRules permissions={permissions} />
+                <RoomHistoryVisibility permissions={permissions} />
+                <RoomEncryption permissions={permissions} />
+                <RoomPublish permissions={permissions} />
               </Box>
               <Box direction="Column" gap="100">
                 <Text size="L400">Addresses</Text>
-                <RoomPublishedAddresses powerLevels={powerLevels} />
-                <RoomLocalAddresses powerLevels={powerLevels} />
+                <RoomPublishedAddresses permissions={permissions} />
+                <RoomLocalAddresses permissions={permissions} />
               </Box>
               <Box direction="Column" gap="100">
                 <Text size="L400">Advance Options</Text>
-                <RoomUpgrade powerLevels={powerLevels} requestClose={requestClose} />
+                <RoomUpgrade permissions={permissions} requestClose={requestClose} />
               </Box>
             </Box>
           </PageContent>

src/app/features/room-settings/permissions/Permissions.tsx

@@ -2,11 +2,13 @@ import React, { useState } from 'react';
 import { Box, Icon, IconButton, Icons, Scroll, Text } from 'folds';
 import { Page, PageContent, PageHeader } from '../../../components/page';
 import { useRoom } from '../../../hooks/useRoom';
-import { usePowerLevels, usePowerLevelsAPI } from '../../../hooks/usePowerLevels';
+import { usePowerLevels } from '../../../hooks/usePowerLevels';
 import { useMatrixClient } from '../../../hooks/useMatrixClient';
 import { StateEvent } from '../../../../types/matrix/room';
 import { usePermissionGroups } from './usePermissionItems';
 import { PermissionGroups, Powers, PowersEditor } from '../../common-settings/permissions';
+import { useRoomCreators } from '../../../hooks/useRoomCreators';
+import { useRoomPermissions } from '../../../hooks/useRoomPermissions';
 
 type PermissionsProps = {
   requestClose: () => void;
@@ -15,11 +17,12 @@ export function Permissions({ requestClose }: PermissionsProps) {
   const mx = useMatrixClient();
   const room = useRoom();
   const powerLevels = usePowerLevels(room);
-  const { getPowerLevel, canSendStateEvent } = usePowerLevelsAPI(powerLevels);
-  const canEditPowers = canSendStateEvent(
-    StateEvent.PowerLevelTags,
-    getPowerLevel(mx.getSafeUserId())
-  );
+  const creators = useRoomCreators(room);
+
+  const permissions = useRoomPermissions(creators, powerLevels);
+
+  const canEditPowers = permissions.stateEvent(StateEvent.PowerLevelTags, mx.getSafeUserId());
+  const canEditPermissions = permissions.stateEvent(StateEvent.RoomPowerLevels, mx.getSafeUserId());
   const permissionGroups = usePermissionGroups();
 
   const [powerEditor, setPowerEditor] = useState(false);
@@ -57,7 +60,11 @@ export function Permissions({ requestClose }: PermissionsProps) {
                 onEdit={canEditPowers ? handleEditPowers : undefined}
                 permissionGroups={permissionGroups}
               />
-              <PermissionGroups powerLevels={powerLevels} permissionGroups={permissionGroups} />
+              <PermissionGroups
+                canEdit={canEditPermissions}
+                powerLevels={powerLevels}
+                permissionGroups={permissionGroups}
+              />
             </Box>
           </PageContent>
         </Scroll>