diff --git a/web/modals/threads/members/add-members-modal.react.js b/web/modals/threads/members/add-members-modal.react.js --- a/web/modals/threads/members/add-members-modal.react.js +++ b/web/modals/threads/members/add-members-modal.react.js @@ -21,19 +21,39 @@ type ContentProps = { +searchText: string, +threadID: string, - +onClose: () => void, }; function AddMembersModalContent(props: ContentProps): React.Node { - const { searchText, threadID, onClose } = props; - - const { pendingUsersToAdd } = useAddUsersListContext(); + const { searchText, threadID } = props; const { userInfos, sortedUsersWithENSNames } = useAddMembersListUserInfos({ threadID, searchText, }); + return ( +
+
+ 0} + userInfos={userInfos} + sortedUsersWithENSNames={sortedUsersWithENSNames} + /> +
+
+ ); +} + +type Props = { + +threadID: string, + +onClose: () => void, +}; + +function AddMembersModal(props: Props): React.Node { + const { threadID, onClose } = props; + + const { pendingUsersToAdd } = useAddUsersListContext(); + const dispatchActionPromise = useDispatchActionPromise(); const callChangeThreadSettings = useChangeThreadSettings(); @@ -54,48 +74,24 @@ threadID, ]); - return ( -
-
- 0} - userInfos={userInfos} - sortedUsersWithENSNames={sortedUsersWithENSNames} - /> -
-
- - -
-
+ const primaryButton = React.useMemo( + () => ( + + ), + [addUsers, pendingUsersToAdd.size], ); -} - -type Props = { - +threadID: string, - +onClose: () => void, -}; - -function AddMembersModal(props: Props): React.Node { - const { threadID, onClose } = props; const addMembersModalContent = React.useCallback( (searchText: string) => ( - + ), - [onClose, threadID], + [threadID], ); return ( @@ -104,6 +100,7 @@ searchPlaceholder="Search members" onClose={onClose} size="fit-content" + primaryButton={primaryButton} > {addMembersModalContent} diff --git a/web/modals/threads/members/members-modal.css b/web/modals/threads/members/members-modal.css --- a/web/modals/threads/members/members-modal.css +++ b/web/modals/threads/members/members-modal.css @@ -80,10 +80,3 @@ overflow: auto; flex: 1; } - -div.addMembersFooter { - display: flex; - justify-content: end; - column-gap: 16px; - margin-top: 16px; -} diff --git a/web/sidebar/community-creation/community-creation-members-modal.react.js b/web/sidebar/community-creation/community-creation-members-modal.react.js --- a/web/sidebar/community-creation/community-creation-members-modal.react.js +++ b/web/sidebar/community-creation/community-creation-members-modal.react.js @@ -30,11 +30,7 @@ searchText={searchText} placeholder="Search members" /> - + );