Page MenuHomePhabricator
Files F3559376

D5211.id17198.diff
No OneTemporary
Actions

D5211.id17198.diff
View Options

diff --git a/web/modals/threads/create/compose-subchannel-modal.react.js b/web/modals/threads/create/compose-subchannel-modal.react.js
--- a/web/modals/threads/create/compose-subchannel-modal.react.js
+++ b/web/modals/threads/create/compose-subchannel-modal.react.js
@@ -1,10 +1,20 @@
// @flow
import * as React from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { newThread, newThreadActionTypes } from 'lib/actions/thread-actions';
+import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors';
import type { ThreadInfo } from 'lib/types/thread-types';
+import { threadTypes } from 'lib/types/thread-types';
+import {
+ useDispatchActionPromise,
+ useServerCall,
+} from 'lib/utils/action-utils';
import { trimText } from 'lib/utils/text-utils';
import Stepper from '../../../components/stepper.react';
+import { updateNavInfoActionType } from '../../../redux/action-types';
+import { nonThreadCalendarQuery } from '../../../selectors/nav-selectors';
import Modal from '../../modal.react';
import css from './compose-subchannel-modal.css';
import SubchannelMembers from './steps/subchannel-members.react';
@@ -16,6 +26,17 @@
+parentThreadInfo: ThreadInfo,
};
+const threadTypesPerVisibility = {
+ open: [
+ threadTypes.COMMUNITY_OPEN_SUBTHREAD,
+ threadTypes.COMMUNITY_OPEN_ANNOUNCEMENT_SUBTHREAD,
+ ],
+ closed: [
+ threadTypes.COMMUNITY_SECRET_SUBTHREAD,
+ threadTypes.COMMUNITY_SECRET_ANNOUNCEMENT_SUBTHREAD,
+ ],
+};
+
type Steps = 'settings' | 'members';
type HeaderProps = {
@@ -34,6 +55,10 @@
);
}
+const createSubchannelLoadingStatusSelector = createLoadingStatusSelector(
+ newThreadActionTypes,
+);
+
function ComposeSubchannelModal(props: Props): React.Node {
const { parentThreadInfo, onClose } = props;
const { uiName: parentThreadName } = parentThreadInfo;
@@ -50,6 +75,70 @@
>(new Set());
const [searchUserText, setSearchUserText] = React.useState<string>('');
+ const loadingState = useSelector(createSubchannelLoadingStatusSelector);
+
+ const [errorMessage, setErrorMessage] = React.useState<string>('');
+
+ const calendarQuery = useSelector(nonThreadCalendarQuery);
+ const callNewThread = useServerCall(newThread);
+
+ const dispatchActionPromise = useDispatchActionPromise();
+ const dispatch = useDispatch();
+
+ const createSubchannel = React.useCallback(async () => {
+ try {
+ const threadType =
+ threadTypesPerVisibility[visibilityType][+announcement];
+ const query = calendarQuery();
+ const result = await callNewThread({
+ name: channelName,
+ type: threadType,
+ parentThreadID: parentThreadInfo.id,
+ initialMemberIDs: Array.from(selectedUsers),
+ calendarQuery: query,
+ color: parentThreadInfo.color,
+ });
+
+ return result;
+ } catch (e) {
+ await setErrorMessage(
+ e.message === 'invalid_parameters'
+ ? 'announcement channels currently not available'
+ : 'unknown error',
+ );
+
+ return null;
+ }
+ }, [
+ parentThreadInfo,
+ selectedUsers,
+ visibilityType,
+ announcement,
+ callNewThread,
+ calendarQuery,
+ channelName,
+ ]);
+
+ const dispatchCreateSubchannel = React.useCallback(async () => {
+ await setErrorMessage('');
+
+ const response = createSubchannel();
+ await dispatchActionPromise(newThreadActionTypes, response);
+ const result = await response;
+
+ if (result) {
+ const { newThreadID } = result;
+ await dispatch({
+ type: updateNavInfoActionType,
+ payload: {
+ activeChatThreadID: newThreadID,
+ },
+ });
+
+ props.onClose();
+ }
+ }, [dispatchActionPromise, createSubchannel, props, dispatch]);
+
const onChangeChannelName = React.useCallback(
(event: SyntheticEvent<HTMLInputElement>) => {
const target = event.currentTarget;
@@ -115,6 +204,7 @@
content: 'Next',
disabled: !channelName.trim(),
onClick: () => {
+ setErrorMessage('');
setChannelName(channelName.trim());
setActiveStep('members');
},
@@ -127,13 +217,15 @@
},
nextProps: {
content: 'Create',
+ loading: loadingState === 'loading',
+ disabled: selectedUsers.size === 0,
onClick: () => {
- // TODO: make form logic
+ dispatchCreateSubchannel();
},
},
},
}),
- [channelName],
+ [channelName, dispatchCreateSubchannel, loadingState, selectedUsers],
);
const subchannelMembers = React.useMemo(
@@ -169,9 +261,10 @@
name="members"
prevProps={stepperButtons.members.prevProps}
nextProps={stepperButtons.members.nextProps}
+ errorMessage={errorMessage}
/>,
],
- [subchannelSettings, subchannelMembers, stepperButtons],
+ [subchannelSettings, subchannelMembers, stepperButtons, errorMessage],
);
const modalName =

File Metadata

Mime Type
text/plain
Expires
Sat, Dec 28, 5:58 AM (3 h, 5 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2724118
Default Alt Text
D5211.id17198.diff (4 KB)

Event Timeline