Page MenuHomePhorge
Files F32561661

D11024.1767323102.diff
No OneTemporary
Actions

Size
4 KB
Referenced Files
None
Subscribers
None

D11024.1767323102.diff
View Options

diff --git a/web/sidebar/community-creation/community-creation-members-modal.css b/web/sidebar/community-creation/community-creation-members-modal.css
--- a/web/sidebar/community-creation/community-creation-members-modal.css
+++ b/web/sidebar/community-creation/community-creation-members-modal.css
@@ -2,5 +2,5 @@
display: flex;
flex-direction: column;
overflow: hidden;
- margin: 16px;
+ height: 60vh;
}
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
@@ -2,38 +2,111 @@
import * as React from 'react';
+import {
+ changeThreadSettingsActionTypes,
+ useChangeThreadSettings,
+} from 'lib/actions/thread-actions.js';
+import { useModalContext } from 'lib/components/modal-provider.react.js';
+import { useDispatchActionPromise } from 'lib/utils/redux-promise-utils.js';
+
import CommunityCreationKeyserverLabel from './community-creation-keyserver-label.react.js';
import css from './community-creation-members-modal.css';
+import Button from '../../components/button.react.js';
import Search from '../../components/search.react.js';
import Modal from '../../modals/modal.react.js';
import { AddMembersList } from '../../modals/threads/members/add-members-modal.react.js';
+import {
+ useAddUsersListContext,
+ AddUsersListProvider,
+} from '../../settings/relationship/add-users-list-provider.react.js';
+
+const subheader = <CommunityCreationKeyserverLabel />;
type Props = {
+threadID: string,
+onClose: () => void,
};
-function CommunityCreationMembersModal(props: Props): React.Node {
+function CommunityCreationMembersModalContent(props: Props): React.Node {
const { threadID, onClose } = props;
+
+ const { pendingUsersToAdd } = useAddUsersListContext();
+
const [searchText, setSearchText] = React.useState('');
+ const dispatchActionPromise = useDispatchActionPromise();
+ const callChangeThreadSettings = useChangeThreadSettings();
+
+ const addUsers = React.useCallback(() => {
+ void dispatchActionPromise(
+ changeThreadSettingsActionTypes,
+ callChangeThreadSettings({
+ threadID,
+ changes: { newMemberIDs: Array.from(pendingUsersToAdd.keys()) },
+ }),
+ );
+ onClose();
+ }, [
+ callChangeThreadSettings,
+ dispatchActionPromise,
+ onClose,
+ pendingUsersToAdd,
+ threadID,
+ ]);
+
+ const primaryButton = React.useMemo(
+ () => (
+ <Button
+ disabled={!pendingUsersToAdd.size}
+ variant="filled"
+ onClick={addUsers}
+ >
+ Add selected members
+ </Button>
+ ),
+ [addUsers, pendingUsersToAdd.size],
+ );
+
return (
<Modal
name="Add members to the community"
subtitle="You may also add members later"
onClose={onClose}
size="large"
+ subheader={subheader}
+ primaryButton={primaryButton}
>
- <CommunityCreationKeyserverLabel />
<div className={css.container}>
- <Search
- onChangeText={setSearchText}
- searchText={searchText}
- placeholder="Search members"
- />
+ <div>
+ <Search
+ onChangeText={setSearchText}
+ searchText={searchText}
+ placeholder="Search members"
+ />
+ </div>
<AddMembersList searchText={searchText} threadID={threadID} />
</div>
</Modal>
);
}
+function CommunityCreationMembersModal(props: Props): React.Node {
+ const { threadID } = props;
+
+ const { popModal } = useModalContext();
+
+ const communityCreationMembersModal = React.useMemo(
+ () => (
+ <AddUsersListProvider>
+ <CommunityCreationMembersModalContent
+ threadID={threadID}
+ onClose={popModal}
+ />
+ </AddUsersListProvider>
+ ),
+ [popModal, threadID],
+ );
+
+ return communityCreationMembersModal;
+}
+
export default CommunityCreationMembersModal;

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 2, 3:05 AM (5 h, 41 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5877753
Default Alt Text
D11024.1767323102.diff (4 KB)

Event Timeline