Page MenuHomePhabricator
Differential D14423

[terraform] Bump RabbitMQ engine_version to 3.13.7
ClosedPublic
Actions

Authored by bartek on Feb 28 2025, 2:01 AM.
Tags
None
Referenced Files
F5254111: D14423.id47300.diff
Sun, Apr 6, 6:58 AM
F5246321: D14423.id.diff
Sat, Apr 5, 10:48 PM
Unknown Object (File)
Sat, Apr 5, 1:14 PM
Unknown Object (File)
Wed, Apr 2, 2:43 PM
Unknown Object (File)
Sun, Mar 30, 3:31 PM
Unknown Object (File)
Fri, Mar 28, 7:23 AM
Unknown Object (File)
Thu, Mar 27, 9:54 AM
Unknown Object (File)
Mon, Mar 24, 8:05 PM
View All 51 Files
Subscribers
tomek

Details

Reviewers
ashoat
kamil
Commits
rCOMMd2b3b9c85abc: [terraform] Bump RabbitMQ engine_version to 3.13.7
Summary

ENG-10277.

Test Plan

Applied this to staging and tested two core functionalities, DMs and notifs

After deploying to prod, tested that there are no changes in terrform

Diff Detail

Repository
rCOMM Comm
Branch
bump-rmq
Lint
No Lint Coverage
Unit
No Test Coverage

Event Timeline

kamil created this revision.Feb 28 2025, 2:01 AM
kamil held this revision as a draft.
Herald added a subscriber: tomek. · View Herald TranscriptFeb 28 2025, 2:01 AM
Harbormaster completed remote builds in B33650: Diff 47300.Feb 28 2025, 2:44 AM
kamil updated this revision to Diff 47304.Feb 28 2025, 3:36 AM

add auto_minor_version_upgrade

kamil added inline comments.Feb 28 2025, 3:42 AM
services/terraform/remote/service_tunnelbroker.tf
51 ↗(On Diff #47304)

This is required by version 3.13. I think it could cause some downtime during the maintenance window as we are using SINGLE_INSTANCE and AWS can now reboot the instance automatically. (cc. @bartek, @ashoat).

kamil added inline comments.Feb 28 2025, 3:46 AM
services/terraform/remote/service_tunnelbroker.tf
51 ↗(On Diff #47304)

Additionally, this could cause differences in terraform, e.g, I updated the version to be 3.13, but AWS automatically bumped the version to 3.13.7 (docs)

kamil edited the test plan for this revision. (Show Details)Feb 28 2025, 3:46 AM
kamil published this revision for review.Feb 28 2025, 3:55 AM
bartek accepted this revision.Feb 28 2025, 5:05 AM
This revision is now accepted and ready to land.Feb 28 2025, 5:05 AM
kamil updated this revision to Diff 47339.Mar 4 2025, 1:07 AM

bump to 3.13.7`

kamil retitled this revision from [terraform] Bump RabbitMQ engine_version to 3.13 to [terraform] Bump RabbitMQ engine_version to 3.13.7.Mar 4 2025, 1:08 AM
kamil edited the test plan for this revision. (Show Details)
Harbormaster failed remote builds in B33663: Diff 47339!Mar 4 2025, 1:11 AM
kamil updated this revision to Diff 47340.Mar 4 2025, 1:28 AM
kamil edited the test plan for this revision. (Show Details)

CI

Harbormaster failed remote builds in B33664: Diff 47340!Mar 4 2025, 1:31 AM
kamil updated this revision to Diff 47341.Mar 4 2025, 2:00 AM

CI

Harbormaster failed remote builds in B33665: Diff 47341!Mar 4 2025, 2:11 AM
kamil updated this revision to Diff 47360.Mar 5 2025, 12:31 AM

CI

Harbormaster failed remote builds in B33684: Diff 47360!Mar 5 2025, 12:35 AM
bartek commandeered this revision.Mar 5 2025, 11:02 AM
bartek edited reviewers, added: kamil; removed: bartek.
This revision now requires review to proceed.Mar 5 2025, 11:02 AM
ashoat accepted this revision.Mar 5 2025, 11:05 AM
This revision is now accepted and ready to land.Mar 5 2025, 11:05 AM
This revision was landed with ongoing or failed builds.Mar 5 2025, 11:08 AM
Closed by commit rCOMMd2b3b9c85abc: [terraform] Bump RabbitMQ engine_version to 3.13.7 (authored by kamil, committed by bartek). · Explain Why
This revision was automatically updated to reflect the committed changes.
bartek added a commit: rCOMMd2b3b9c85abc: [terraform] Bump RabbitMQ engine_version to 3.13.7.

Revision Contents
Changeset List

PathSize
services/
2 lines
terraform/
remote/
2 lines

Diff 47300

View Options

services/docker-compose.yml

Show First 20 Lines • Show All 262 Lines • ▼ Show 20 Linesconst createThreadLoadingStatusSelector =
createLoadingStatusSelector(newThreadActionTypes); createLoadingStatusSelector(newThreadActionTypes);
type ConnectedChatInputBarBaseProps = { type ConnectedChatInputBarBaseProps = {
...BaseProps, ...BaseProps,
+onInputBarLayout?: (event: LayoutEvent) => mixed, +onInputBarLayout?: (event: LayoutEvent) => mixed,
+openCamera: () => mixed, +openCamera: () => mixed,
+navigation?: ChatNavigationProp<'MessageList'>, +navigation?: ChatNavigationProp<'MessageList'>,
}; };
function ConnectedChatInputBarBase(props: ConnectedChatInputBarBaseProps) { function ConnectedChatInputBarBase({
threadInfo,
navigation,
openCamera,
onInputBarLayout,
}: ConnectedChatInputBarBaseProps) {
const navContext = React.useContext(NavContext); const navContext = React.useContext(NavContext);
const keyboardState = React.useContext(KeyboardContext); const keyboardState = React.useContext(KeyboardContext);
const inputState = React.useContext(InputStateContext); const inputState = React.useContext(InputStateContext);
const overlayContext = React.useContext(OverlayContext); const overlayContext = React.useContext(OverlayContext);
const viewerID = useSelector( const viewerID = useSelector(
state => state.currentUserInfo && state.currentUserInfo.id, state => state.currentUserInfo && state.currentUserInfo.id,
); );
const draft = useSelector( const draft = useSelector(
state => state => state.draftStore.drafts[draftKeyFromThreadID(threadInfo.id)] ?? '',
state.draftStore.drafts[draftKeyFromThreadID(props.threadInfo.id)] ?? '',
); );
const joinThreadLoadingStatus = useSelector(joinThreadLoadingStatusSelector); const joinThreadLoadingStatus = useSelector(joinThreadLoadingStatusSelector);
const createThreadLoadingStatus = useSelector( const createThreadLoadingStatus = useSelector(
createThreadLoadingStatusSelector, createThreadLoadingStatusSelector,
); );
const threadCreationInProgress = createThreadLoadingStatus === 'loading'; const threadCreationInProgress = createThreadLoadingStatus === 'loading';
const calendarQuery = useSelector(state => const calendarQuery = useSelector(state =>
nonThreadCalendarQuery({ nonThreadCalendarQuery({
redux: state, redux: state,
navContext, navContext,
}), }),
); );
const userInfos = useSelector(state => state.userStore.userInfos); const userInfos = useSelector(state => state.userStore.userInfos);
const styles = useStyles(unboundStyles); const styles = useStyles(unboundStyles);
const colors = useColors(); const colors = useColors();
const isActive = React.useMemo( const isActive = React.useMemo(
() => props.threadInfo.id === activeThreadSelector(navContext), () => threadInfo.id === activeThreadSelector(navContext),
[props.threadInfo.id, navContext], [threadInfo.id, navContext],
); );
const dispatch = useDispatch(); const dispatch = useDispatch();
const dispatchActionPromise = useDispatchActionPromise(); const dispatchActionPromise = useDispatchActionPromise();
const rawThreadInfo = useSelector( const rawThreadInfo = useSelector(
state => state.threadStore.threadInfos[props.threadInfo.id], state => state.threadStore.threadInfos[threadInfo.id],
); );
const { getChatMentionSearchIndex } = useChatMentionContext(); const { getChatMentionSearchIndex } = useChatMentionContext();
const chatMentionSearchIndex = getChatMentionSearchIndex(props.threadInfo); const chatMentionSearchIndex = getChatMentionSearchIndex(threadInfo);
const { parentThreadID, community } = props.threadInfo; const { parentThreadID, community } = threadInfo;
const parentThreadInfo = useSelector(state => const parentThreadInfo = useSelector(state =>
parentThreadID ? threadInfoSelector(state)[parentThreadID] : null, parentThreadID ? threadInfoSelector(state)[parentThreadID] : null,
); );
const communityThreadInfo = useSelector(state => const communityThreadInfo = useSelector(state =>
community ? threadInfoSelector(state)[community] : null, community ? threadInfoSelector(state)[community] : null,
); );
const threadFrozen = useThreadFrozenDueToViewerBlock( const threadFrozen = useThreadFrozenDueToViewerBlock(
props.threadInfo, threadInfo,
communityThreadInfo, communityThreadInfo,
viewerID, viewerID,
userInfos, userInfos,
); );
const userMentionsCandidates = useUserMentionsCandidates( const userMentionsCandidates = useUserMentionsCandidates(
props.threadInfo, threadInfo,
parentThreadInfo, parentThreadInfo,
); );
const chatMentionCandidates = useThreadChatMentionCandidates( const chatMentionCandidates = useThreadChatMentionCandidates(threadInfo);
props.threadInfo,
);
const messageEditingContext = React.useContext(MessageEditingContext); const messageEditingContext = React.useContext(MessageEditingContext);
const editedMessageInfo = messageEditingContext?.editState.editedMessage; const editedMessageInfo = messageEditingContext?.editState.editedMessage;
const editedMessagePreview = useMessagePreview( const editedMessagePreview = useMessagePreview(
editedMessageInfo, editedMessageInfo,
props.threadInfo, threadInfo,
getDefaultTextMessageRules(chatMentionCandidates).simpleMarkdownRules, getDefaultTextMessageRules(chatMentionCandidates).simpleMarkdownRules,
); );
const editMessage = useEditMessage(props.threadInfo); const editMessage = useEditMessage(threadInfo);
const [selectionState, setSelectionState] = const [selectionState, setSelectionState] =
React.useState<SyncedSelectionData>({ React.useState<SyncedSelectionData>({
text: draft, text: draft,
selection: { start: 0, end: 0 }, selection: { start: 0, end: 0 },
}); });
const [text, setText] = React.useState(draft); const [text, setText] = React.useState(draft);
Show All 34 Linesfunction ConnectedChatInputBarBase({
const suggestions: $ReadOnlyArray<MentionTypeaheadSuggestionItem> = const suggestions: $ReadOnlyArray<MentionTypeaheadSuggestionItem> =
React.useMemo( React.useMemo(
() => [...suggestedUsers, ...suggestedChats], () => [...suggestedUsers, ...suggestedChats],
[suggestedUsers, suggestedChats], [suggestedUsers, suggestedChats],
); );
const currentUserIsVoiced = useThreadHasPermission( const currentUserIsVoiced = useThreadHasPermission(
props.threadInfo, threadInfo,
threadPermissions.VOICED, threadPermissions.VOICED,
); );
const currentUserCanJoin = useThreadHasPermission( const currentUserCanJoin = useThreadHasPermission(
props.threadInfo, threadInfo,
threadPermissions.JOIN_THREAD, threadPermissions.JOIN_THREAD,
); );
const isExitingDuringEditModeRef = React.useRef(false); const isExitingDuringEditModeRef = React.useRef(false);
const expandoButtonsOpen = useValue(1); const expandoButtonsOpen = useValue(1);
const targetExpandoButtonsOpen = useValue(1); const targetExpandoButtonsOpen = useValue(1);
▲ Show 20 Lines • Show All 126 Lines • ▼ Show 20 Lines const shouldShowTextInput = React.useCallback(() => {
// and won't list the viewer as a member, // and won't list the viewer as a member,
// which will end up hiding the input. // which will end up hiding the input.
// In this case, we will assume that our creation action // In this case, we will assume that our creation action
// will get translated into a join, and as long // will get translated into a join, and as long
// as members are voiced, we can show the input. // as members are voiced, we can show the input.
if (!threadCreationInProgress) { if (!threadCreationInProgress) {
return false; return false;
} }
return checkIfDefaultMembersAreVoiced(props.threadInfo); return checkIfDefaultMembersAreVoiced(threadInfo);
}, [currentUserIsVoiced, props.threadInfo, threadCreationInProgress]); }, [currentUserIsVoiced, threadInfo, threadCreationInProgress]);
const isEditMode = React.useCallback(() => { const isEditMode = React.useCallback(() => {
const editState = messageEditingContext?.editState; const editState = messageEditingContext?.editState;
const isThisThread = const isThisThread = editState?.editedMessage?.threadID === threadInfo.id;
editState?.editedMessage?.threadID === props.threadInfo.id;
return editState?.editedMessage !== null && isThisThread; return editState?.editedMessage !== null && isThisThread;
}, [messageEditingContext?.editState, props.threadInfo.id]); }, [messageEditingContext?.editState, threadInfo.id]);
const immediatelyShowSendButton = React.useCallback(() => { const immediatelyShowSendButton = React.useCallback(() => {
sendButtonContainerOpen.setValue(1); sendButtonContainerOpen.setValue(1);
targetSendButtonContainerOpen.setValue(1); targetSendButtonContainerOpen.setValue(1);
}, [sendButtonContainerOpen, targetSendButtonContainerOpen]); }, [sendButtonContainerOpen, targetSendButtonContainerOpen]);
const updateSendButton = React.useCallback( const updateSendButton = React.useCallback(
(currentText: string) => { (currentText: string) => {
▲ Show 20 Lines • Show All 59 Lines • ▼ Show 20 Linesfunction ConnectedChatInputBarBase({
); );
const saveDraft = React.useMemo( const saveDraft = React.useMemo(
() => () =>
_throttle(newText => { _throttle(newText => {
dispatch({ dispatch({
type: updateDraftActionType, type: updateDraftActionType,
payload: { payload: {
key: draftKeyFromThreadID(props.threadInfo.id), key: draftKeyFromThreadID(threadInfo.id),
text: newText, text: newText,
}, },
}); });
}, 400), }, 400),
[dispatch, props.threadInfo.id], [dispatch, threadInfo.id],
); );
const isMessageEdited = React.useCallback( const isMessageEdited = React.useCallback(
(newText?: string): boolean => { (newText?: string): boolean => {
let updatedText = newText ?? text; let updatedText = newText ?? text;
updatedText = trimMessage(updatedText); updatedText = trimMessage(updatedText);
const originalText = editedMessageInfo?.text; const originalText = editedMessageInfo?.text;
return updatedText !== originalText; return updatedText !== originalText;
Show All 25 Lines const focusAndUpdateButtonsVisibility = React.useCallback(() => {
} }
immediatelyShowSendButton(); immediatelyShowSendButton();
immediatelyHideButtons(); immediatelyHideButtons();
textInput.focus(); textInput.focus();
}, [immediatelyHideButtons, immediatelyShowSendButton]); }, [immediatelyHideButtons, immediatelyShowSendButton]);
const blockNavigation = React.useCallback(() => { const blockNavigation = React.useCallback(() => {
const { navigation } = props;
if (!navigation || !navigation.isFocused()) { if (!navigation || !navigation.isFocused()) {
return; return;
} }
navigation.setParams({ navigation.setParams({
removeEditMode: removeEditMode, removeEditMode: removeEditMode,
}); });
}, [props, removeEditMode]); }, [navigation, removeEditMode]);
const unblockNavigation = React.useCallback(() => { const unblockNavigation = React.useCallback(() => {
const { navigation } = props; navigation?.setParams({ removeEditMode: null });
if (!navigation) { }, [navigation]);
return;
}
navigation.setParams({ removeEditMode: null });
}, [props]);
const exitEditMode = React.useCallback(() => { const exitEditMode = React.useCallback(() => {
messageEditingContext?.setEditedMessage(null, () => { messageEditingContext?.setEditedMessage(null, () => {
unblockNavigation(); unblockNavigation();
updateText(draft); updateText(draft);
focusAndUpdateButtonsVisibility(); focusAndUpdateButtonsVisibility();
updateSendButton(draft); updateSendButton(draft);
}); });
▲ Show 20 Lines • Show All 111 Lines • ▼ Show 20 Lines const onSend = React.useCallback(async () => {
const creatorID = viewerID; const creatorID = viewerID;
invariant(creatorID, 'should have viewer ID in order to send a message'); invariant(creatorID, 'should have viewer ID in order to send a message');
invariant(inputState, 'inputState should be set in ChatInputBar.onSend'); invariant(inputState, 'inputState should be set in ChatInputBar.onSend');
await inputState.sendTextMessage( await inputState.sendTextMessage(
{ {
type: messageTypes.TEXT, type: messageTypes.TEXT,
localID, localID,
threadID: props.threadInfo.id, threadID: threadInfo.id,
text: newText, text: newText,
creatorID, creatorID,
time: Date.now(), time: Date.now(),
}, },
props.threadInfo, threadInfo,
parentThreadInfo, parentThreadInfo,
); );
}, [ }, [
editMessageInner, editMessageInner,
getEditedMessage, getEditedMessage,
inputState, inputState,
parentThreadInfo, parentThreadInfo,
props.threadInfo, threadInfo,
text, text,
updateSendButton, updateSendButton,
viewerID, viewerID,
]); ]);
const removeEditMode: RemoveEditMode = React.useCallback( const removeEditMode: RemoveEditMode = React.useCallback(
action => { action => {
const { navigation } = props;
if (!navigation || isExitingDuringEditModeRef.current) { if (!navigation || isExitingDuringEditModeRef.current) {
return 'ignore_action'; return 'ignore_action';
} }
if (!isMessageEdited()) { if (!isMessageEdited()) {
unblockNavigation(); unblockNavigation();
return 'reduce_action'; return 'reduce_action';
} }
const unblockAndDispatch = () => { const unblockAndDispatch = () => {
unblockNavigation(); unblockNavigation();
navigation.dispatch(action); navigation.dispatch(action);
}; };
const onContinueEditing = () => { const onContinueEditing = () => {
overlayContext?.resetScrollBlockingModalStatus(); overlayContext?.resetScrollBlockingModalStatus();
}; };
exitEditAlert({ exitEditAlert({
onDiscard: unblockAndDispatch, onDiscard: unblockAndDispatch,
onContinueEditing, onContinueEditing,
}); });
return 'ignore_action'; return 'ignore_action';
}, },
[isMessageEdited, overlayContext, props, unblockNavigation], [isMessageEdited, navigation, overlayContext, unblockNavigation],
); );
const onPressExitEditMode = React.useCallback(() => { const onPressExitEditMode = React.useCallback(() => {
if (!isMessageEdited()) { if (!isMessageEdited()) {
exitEditMode(); exitEditMode();
return; return;
} }
exitEditAlert({ exitEditAlert({
Show All 32 Lines (e: {
if (!isEditMode()) { if (!isEditMode()) {
return; return;
} }
const { action } = e.data; const { action } = e.data;
e.preventDefault(); e.preventDefault();
const saveExit = () => { const saveExit = () => {
messageEditingContext?.setEditedMessage(null, () => { messageEditingContext?.setEditedMessage(null, () => {
isExitingDuringEditModeRef.current = true; isExitingDuringEditModeRef.current = true;
props.navigation?.dispatch(action); navigation?.dispatch(action);
}); });
}; };
if (!isMessageEdited()) { if (!isMessageEdited()) {
saveExit(); saveExit();
return; return;
} }
exitEditAlert({ exitEditAlert({
onDiscard: saveExit, onDiscard: saveExit,
}); });
}, },
[isEditMode, isMessageEdited, messageEditingContext, props.navigation], [isEditMode, isMessageEdited, messageEditingContext, navigation],
); );
React.useEffect(() => { React.useEffect(() => {
if (isActive) { if (isActive) {
addEditInputMessageListener(); addEditInputMessageListener();
} }
return () => { return () => {
if (isActive) { if (isActive) {
removeEditInputMessageListener(); removeEditInputMessageListener();
} }
}; };
}, [addEditInputMessageListener, isActive, removeEditInputMessageListener]); }, [addEditInputMessageListener, isActive, removeEditInputMessageListener]);
React.useEffect(() => { React.useEffect(() => {
const { navigation } = props;
const clearBeforeRemoveListener = navigation?.addListener( const clearBeforeRemoveListener = navigation?.addListener(
'beforeRemove', 'beforeRemove',
onNavigationBeforeRemove, onNavigationBeforeRemove,
); );
const clearFocusListener = navigation?.addListener( const clearFocusListener = navigation?.addListener(
'focus', 'focus',
onNavigationFocus, onNavigationFocus,
); );
const clearBlurListener = navigation?.addListener('blur', onNavigationBlur); const clearBlurListener = navigation?.addListener('blur', onNavigationBlur);
return () => { return () => {
clearBeforeRemoveListener?.(); clearBeforeRemoveListener?.();
clearFocusListener?.(); clearFocusListener?.();
clearBlurListener?.(); clearBlurListener?.();
}; };
}, [onNavigationBeforeRemove, onNavigationBlur, onNavigationFocus, props]); }, [
navigation,
onNavigationBeforeRemove,
onNavigationBlur,
onNavigationFocus,
]);
const callJoinThread = useJoinThread(); const callJoinThread = useJoinThread();
const joinAction = React.useCallback(async (): Promise<ThreadJoinPayload> => { const joinAction = React.useCallback(async (): Promise<ThreadJoinPayload> => {
let joinThreadInput; let joinThreadInput;
if (rawThreadInfo.thick) { if (rawThreadInfo.thick) {
joinThreadInput = { joinThreadInput = {
thick: true, thick: true,
rawThreadInfo: rawThreadInfo, rawThreadInfo: rawThreadInfo,
}; };
} else { } else {
const query = calendarQuery(); const query = calendarQuery();
joinThreadInput = { joinThreadInput = {
thick: false, thick: false,
threadID: props.threadInfo.id, threadID: threadInfo.id,
calendarQuery: { calendarQuery: {
startDate: query.startDate, startDate: query.startDate,
endDate: query.endDate, endDate: query.endDate,
filters: [ filters: [
...query.filters, ...query.filters,
{ type: 'threads', threadIDs: [props.threadInfo.id] }, { type: 'threads', threadIDs: [threadInfo.id] },
], ],
}, },
}; };
} }
return await callJoinThread(joinThreadInput); return await callJoinThread(joinThreadInput);
}, [calendarQuery, callJoinThread, props.threadInfo.id, rawThreadInfo]); }, [calendarQuery, callJoinThread, threadInfo.id, rawThreadInfo]);
const onPressJoin = React.useCallback(() => { const onPressJoin = React.useCallback(() => {
void dispatchActionPromise(joinThreadActionTypes, joinAction()); void dispatchActionPromise(joinThreadActionTypes, joinAction());
}, [dispatchActionPromise, joinAction]); }, [dispatchActionPromise, joinAction]);
const setIOSKeyboardHeight = React.useCallback(() => { const setIOSKeyboardHeight = React.useCallback(() => {
if (Platform.OS !== 'ios') { if (Platform.OS !== 'ios') {
return; return;
} }
const textInput = textInputRef.current; const textInput = textInputRef.current;
if (!textInput) { if (!textInput) {
return; return;
} }
const keyboardHeight = getKeyboardHeight(); const keyboardHeight = getKeyboardHeight();
if (keyboardHeight === null || keyboardHeight === undefined) { if (keyboardHeight === null || keyboardHeight === undefined) {
return; return;
} }
TextInputKeyboardMangerIOS.setKeyboardHeight(textInput, keyboardHeight); TextInputKeyboardMangerIOS.setKeyboardHeight(textInput, keyboardHeight);
}, []); }, []);
const showMediaGallery = React.useCallback(() => { const showMediaGallery = React.useCallback(() => {
invariant(keyboardState, 'keyboardState should be initialized'); invariant(keyboardState, 'keyboardState should be initialized');
keyboardState.showMediaGallery(props.threadInfo); keyboardState.showMediaGallery(threadInfo);
}, [keyboardState, props.threadInfo]); }, [keyboardState, threadInfo]);
const dismissKeyboard = React.useCallback(() => { const dismissKeyboard = React.useCallback(() => {
keyboardState?.dismissKeyboard(); keyboardState?.dismissKeyboard();
}, [keyboardState]); }, [keyboardState]);
const prevThreadInfoID = React.useRef<?string>(); const prevThreadInfoID = React.useRef<?string>();
const prevDraft = React.useRef<?string>(); const prevDraft = React.useRef<?string>();
React.useEffect(() => { React.useEffect(() => {
if ( if (
textEdited && textEdited &&
text && text &&
prevThreadInfoID.current && prevThreadInfoID.current &&
props.threadInfo.id !== prevThreadInfoID.current threadInfo.id !== prevThreadInfoID.current
) { ) {
dispatch({ dispatch({
type: moveDraftActionType, type: moveDraftActionType,
payload: { payload: {
oldKey: draftKeyFromThreadID(prevThreadInfoID.current), oldKey: draftKeyFromThreadID(prevThreadInfoID.current),
newKey: draftKeyFromThreadID(props.threadInfo.id), newKey: draftKeyFromThreadID(threadInfo.id),
}, },
}); });
} else if (!textEdited && draft !== prevDraft.current) { } else if (!textEdited && draft !== prevDraft.current) {
setText(draft); setText(draft);
} }
prevThreadInfoID.current = props.threadInfo.id; prevThreadInfoID.current = threadInfo.id;
prevDraft.current = draft; prevDraft.current = draft;
}, [dispatch, draft, props.threadInfo.id, text, textEdited]); }, [dispatch, draft, threadInfo.id, text, textEdited]);
const prevIsActiveRef = React.useRef(isActive); const prevIsActiveRef = React.useRef(isActive);
React.useEffect(() => { React.useEffect(() => {
if (isActive && !prevIsActiveRef.current) { if (isActive && !prevIsActiveRef.current) {
addEditInputMessageListener(); addEditInputMessageListener();
} else if (!isActive && prevIsActiveRef) { } else if (!isActive && prevIsActiveRef) {
removeEditInputMessageListener(); removeEditInputMessageListener();
} }
▲ Show 20 Lines • Show All 57 Lines • ▼ Show 20 Lines const expandoButton = (
onPress={expandButtons} onPress={expandButtons}
activeOpacity={0.4} activeOpacity={0.4}
style={styles.expandButton} style={styles.expandButton}
> >
<AnimatedView style={expandIconStyle}> <AnimatedView style={expandIconStyle}>
<SWMansionIcon <SWMansionIcon
name="chevron-right" name="chevron-right"
size={22} size={22}
color={`#${props.threadInfo.color}`} color={`#${threadInfo.color}`}
/> />
</AnimatedView> </AnimatedView>
</TouchableOpacity> </TouchableOpacity>
); );
const threadColor = `#${props.threadInfo.color}`; const threadColor = `#${threadInfo.color}`;
const expandoButtonsViewStyle: Array<ViewStyle> = [ const expandoButtonsViewStyle: Array<ViewStyle> = [
styles.innerExpandoButtons, styles.innerExpandoButtons,
]; ];
if (isEditMode()) { if (isEditMode()) {
expandoButtonsViewStyle.push({ display: 'none' }); expandoButtonsViewStyle.push({ display: 'none' });
} }
return ( return (
<TouchableWithoutFeedback onPress={dismissKeyboard}> <TouchableWithoutFeedback onPress={dismissKeyboard}>
<View style={styles.inputContainer}> <View style={styles.inputContainer}>
<AnimatedView style={expandoButtonsStyle}> <AnimatedView style={expandoButtonsStyle}>
<View style={expandoButtonsViewStyle}> <View style={expandoButtonsViewStyle}>
{buttonsExpanded ? expandoButton : null} {buttonsExpanded ? expandoButton : null}
<TouchableOpacity onPress={showMediaGallery} activeOpacity={0.4}> <TouchableOpacity onPress={showMediaGallery} activeOpacity={0.4}>
<AnimatedView style={cameraRollIconStyle}> <AnimatedView style={cameraRollIconStyle}>
<SWMansionIcon <SWMansionIcon
name="image-1" name="image-1"
size={28} size={28}
color={`#${props.threadInfo.color}`} color={`#${threadInfo.color}`}
/> />
</AnimatedView> </AnimatedView>
</TouchableOpacity> </TouchableOpacity>
<TouchableOpacity <TouchableOpacity
onPress={props.openCamera} onPress={openCamera}
activeOpacity={0.4} activeOpacity={0.4}
disabled={!buttonsExpanded} disabled={!buttonsExpanded}
> >
<AnimatedView style={cameraIconStyle}> <AnimatedView style={cameraIconStyle}>
<SWMansionIcon <SWMansionIcon
name="camera" name="camera"
size={28} size={28}
color={`#${props.threadInfo.color}`} color={`#${threadInfo.color}`}
/> />
</AnimatedView> </AnimatedView>
</TouchableOpacity> </TouchableOpacity>
{buttonsExpanded ? null : expandoButton} {buttonsExpanded ? null : expandoButton}
</View> </View>
</AnimatedView> </AnimatedView>
<SelectableTextInput <SelectableTextInput
allowImagePasteForThreadID={props.threadInfo.id} allowImagePasteForThreadID={threadInfo.id}
value={text} value={text}
onChangeText={updateText} onChangeText={updateText}
selection={selectionState.selection} selection={selectionState.selection}
onUpdateSyncedSelectionData={setSelectionState} onUpdateSyncedSelectionData={setSelectionState}
placeholder="Send a message..." placeholder="Send a message..."
placeholderTextColor={colors.listInputButton} placeholderTextColor={colors.listInputButton}
multiline={true} multiline={true}
style={styles.textInput} style={styles.textInput}
textInputRef={setTextInputRef} textInputRef={setTextInputRef}
clearableTextInputRef={setClearableTextInputRef} clearableTextInputRef={setClearableTextInputRef}
ref={selectableTextInputRef} ref={selectableTextInputRef}
selectionColor={`#${props.threadInfo.color}`} selectionColor={`#${threadInfo.color}`}
/> />
<AnimatedView style={sendButtonContainerStyle}> <AnimatedView style={sendButtonContainerStyle}>
<TouchableOpacity <TouchableOpacity
onPress={onSend} onPress={onSend}
activeOpacity={0.4} activeOpacity={0.4}
style={styles.sendButton} style={styles.sendButton}
disabled={trimMessage(text) === ''} disabled={trimMessage(text) === ''}
> >
<Icon <Icon
name="md-send" name="md-send"
size={25} size={25}
style={styles.sendIcon} style={styles.sendIcon}
color={threadColor} color={threadColor}
/> />
</TouchableOpacity> </TouchableOpacity>
</AnimatedView> </AnimatedView>
</View> </View>
</TouchableWithoutFeedback> </TouchableWithoutFeedback>
); );
}; };
const isMember = viewerIsMember(props.threadInfo); const isMember = viewerIsMember(threadInfo);
let joinButton = null; let joinButton = null;
const threadColor = `#${props.threadInfo.color}`; const threadColor = `#${threadInfo.color}`;
if (!isMember && currentUserCanJoin && !threadCreationInProgress) { if (!isMember && currentUserCanJoin && !threadCreationInProgress) {
let buttonContent; let buttonContent;
if (joinThreadLoadingStatus === 'loading') { if (joinThreadLoadingStatus === 'loading') {
buttonContent = ( buttonContent = (
<ActivityIndicator <ActivityIndicator
size="small" size="small"
color="white" color="white"
style={styles.joinThreadLoadingIndicator} style={styles.joinThreadLoadingIndicator}
/> />
); );
} else { } else {
const textStyle = colorIsDark(props.threadInfo.color) const textStyle = colorIsDark(threadInfo.color)
? styles.joinButtonTextLight ? styles.joinButtonTextLight
: styles.joinButtonTextDark; : styles.joinButtonTextDark;
buttonContent = ( buttonContent = (
<View style={styles.joinButtonContent}> <View style={styles.joinButtonContent}>
<SWMansionIcon name="plus" style={textStyle} /> <SWMansionIcon name="plus" style={textStyle} />
<Text style={textStyle}>Join Chat</Text> <Text style={textStyle}>Join Chat</Text>
</View> </View>
); );
Show All 22 Lines typeaheadTooltip = (
focusAndUpdateTextAndSelection={focusAndUpdateTextAndSelection} focusAndUpdateTextAndSelection={focusAndUpdateTextAndSelection}
typeaheadTooltipActionsGetter={mentionTypeaheadTooltipActions} typeaheadTooltipActionsGetter={mentionTypeaheadTooltipActions}
TypeaheadTooltipButtonComponent={MentionTypeaheadTooltipButton} TypeaheadTooltipButtonComponent={MentionTypeaheadTooltipButton}
/> />
); );
} }
let content; let content;
const defaultMembersAreVoiced = checkIfDefaultMembersAreVoiced( const defaultMembersAreVoiced = checkIfDefaultMembersAreVoiced(threadInfo);
props.threadInfo,
);
if (shouldShowTextInput()) { if (shouldShowTextInput()) {
content = renderInput(); content = renderInput();
} else if ( } else if (
threadFrozen && threadFrozen &&
threadActualMembers(props.threadInfo.members).length === 2 threadActualMembers(threadInfo.members).length === 2
) { ) {
content = ( content = (
<Text style={styles.explanation}> <Text style={styles.explanation}>
You can&rsquo;t send messages to a user that you&rsquo;ve blocked. You can&rsquo;t send messages to a user that you&rsquo;ve blocked.
</Text> </Text>
); );
} else if (isMember) { } else if (isMember) {
content = ( content = (
▲ Show 20 Lines • Show All 42 Lines • ▼ Show 20 Lines editedMessage = (
color={threadColor} color={threadColor}
onPress={onPressExitEditMode} onPress={onPressExitEditMode}
/> />
</AnimatedView> </AnimatedView>
); );
} }
return ( return (
<AnimatedView style={styles.container} onLayout={props.onInputBarLayout}> <AnimatedView style={styles.container} onLayout={onInputBarLayout}>
{typeaheadTooltip} {typeaheadTooltip}
{joinButton} {joinButton}
{editedMessage} {editedMessage}
{content} {content}
{keyboardInputHost} {keyboardInputHost}
</AnimatedView> </AnimatedView>
); );
} }
▲ Show 20 Lines • Show All 114 Lines • Show Last 20 Lines
View Options

services/terraform/remote/service_tunnelbroker.tf

Show First 20 Lines • Show All 262 Lines • ▼ Show 20 Linesconst createThreadLoadingStatusSelector =
createLoadingStatusSelector(newThreadActionTypes); createLoadingStatusSelector(newThreadActionTypes);
type ConnectedChatInputBarBaseProps = { type ConnectedChatInputBarBaseProps = {
...BaseProps, ...BaseProps,
+onInputBarLayout?: (event: LayoutEvent) => mixed, +onInputBarLayout?: (event: LayoutEvent) => mixed,
+openCamera: () => mixed, +openCamera: () => mixed,
+navigation?: ChatNavigationProp<'MessageList'>, +navigation?: ChatNavigationProp<'MessageList'>,
}; };
function ConnectedChatInputBarBase(props: ConnectedChatInputBarBaseProps) { function ConnectedChatInputBarBase({
threadInfo,
navigation,
openCamera,
onInputBarLayout,
}: ConnectedChatInputBarBaseProps) {
const navContext = React.useContext(NavContext); const navContext = React.useContext(NavContext);
const keyboardState = React.useContext(KeyboardContext); const keyboardState = React.useContext(KeyboardContext);
const inputState = React.useContext(InputStateContext); const inputState = React.useContext(InputStateContext);
const overlayContext = React.useContext(OverlayContext); const overlayContext = React.useContext(OverlayContext);
const viewerID = useSelector( const viewerID = useSelector(
state => state.currentUserInfo && state.currentUserInfo.id, state => state.currentUserInfo && state.currentUserInfo.id,
); );
const draft = useSelector( const draft = useSelector(
state => state => state.draftStore.drafts[draftKeyFromThreadID(threadInfo.id)] ?? '',
state.draftStore.drafts[draftKeyFromThreadID(props.threadInfo.id)] ?? '',
); );
const joinThreadLoadingStatus = useSelector(joinThreadLoadingStatusSelector); const joinThreadLoadingStatus = useSelector(joinThreadLoadingStatusSelector);
const createThreadLoadingStatus = useSelector( const createThreadLoadingStatus = useSelector(
createThreadLoadingStatusSelector, createThreadLoadingStatusSelector,
); );
const threadCreationInProgress = createThreadLoadingStatus === 'loading'; const threadCreationInProgress = createThreadLoadingStatus === 'loading';
const calendarQuery = useSelector(state => const calendarQuery = useSelector(state =>
nonThreadCalendarQuery({ nonThreadCalendarQuery({
redux: state, redux: state,
navContext, navContext,
}), }),
); );
const userInfos = useSelector(state => state.userStore.userInfos); const userInfos = useSelector(state => state.userStore.userInfos);
const styles = useStyles(unboundStyles); const styles = useStyles(unboundStyles);
const colors = useColors(); const colors = useColors();
const isActive = React.useMemo( const isActive = React.useMemo(
() => props.threadInfo.id === activeThreadSelector(navContext), () => threadInfo.id === activeThreadSelector(navContext),
[props.threadInfo.id, navContext], [threadInfo.id, navContext],
); );
const dispatch = useDispatch(); const dispatch = useDispatch();
const dispatchActionPromise = useDispatchActionPromise(); const dispatchActionPromise = useDispatchActionPromise();
const rawThreadInfo = useSelector( const rawThreadInfo = useSelector(
state => state.threadStore.threadInfos[props.threadInfo.id], state => state.threadStore.threadInfos[threadInfo.id],
); );
const { getChatMentionSearchIndex } = useChatMentionContext(); const { getChatMentionSearchIndex } = useChatMentionContext();
const chatMentionSearchIndex = getChatMentionSearchIndex(props.threadInfo); const chatMentionSearchIndex = getChatMentionSearchIndex(threadInfo);
const { parentThreadID, community } = props.threadInfo; const { parentThreadID, community } = threadInfo;
const parentThreadInfo = useSelector(state => const parentThreadInfo = useSelector(state =>
parentThreadID ? threadInfoSelector(state)[parentThreadID] : null, parentThreadID ? threadInfoSelector(state)[parentThreadID] : null,
); );
const communityThreadInfo = useSelector(state => const communityThreadInfo = useSelector(state =>
community ? threadInfoSelector(state)[community] : null, community ? threadInfoSelector(state)[community] : null,
); );
const threadFrozen = useThreadFrozenDueToViewerBlock( const threadFrozen = useThreadFrozenDueToViewerBlock(
props.threadInfo, threadInfo,
communityThreadInfo, communityThreadInfo,
viewerID, viewerID,
userInfos, userInfos,
); );
const userMentionsCandidates = useUserMentionsCandidates( const userMentionsCandidates = useUserMentionsCandidates(
props.threadInfo, threadInfo,
parentThreadInfo, parentThreadInfo,
); );
const chatMentionCandidates = useThreadChatMentionCandidates( const chatMentionCandidates = useThreadChatMentionCandidates(threadInfo);
props.threadInfo,
);
const messageEditingContext = React.useContext(MessageEditingContext); const messageEditingContext = React.useContext(MessageEditingContext);
const editedMessageInfo = messageEditingContext?.editState.editedMessage; const editedMessageInfo = messageEditingContext?.editState.editedMessage;
const editedMessagePreview = useMessagePreview( const editedMessagePreview = useMessagePreview(
editedMessageInfo, editedMessageInfo,
props.threadInfo, threadInfo,
getDefaultTextMessageRules(chatMentionCandidates).simpleMarkdownRules, getDefaultTextMessageRules(chatMentionCandidates).simpleMarkdownRules,
); );
const editMessage = useEditMessage(props.threadInfo); const editMessage = useEditMessage(threadInfo);
const [selectionState, setSelectionState] = const [selectionState, setSelectionState] =
React.useState<SyncedSelectionData>({ React.useState<SyncedSelectionData>({
text: draft, text: draft,
selection: { start: 0, end: 0 }, selection: { start: 0, end: 0 },
}); });
const [text, setText] = React.useState(draft); const [text, setText] = React.useState(draft);
Show All 34 Linesfunction ConnectedChatInputBarBase({
const suggestions: $ReadOnlyArray<MentionTypeaheadSuggestionItem> = const suggestions: $ReadOnlyArray<MentionTypeaheadSuggestionItem> =
React.useMemo( React.useMemo(
() => [...suggestedUsers, ...suggestedChats], () => [...suggestedUsers, ...suggestedChats],
[suggestedUsers, suggestedChats], [suggestedUsers, suggestedChats],
); );
const currentUserIsVoiced = useThreadHasPermission( const currentUserIsVoiced = useThreadHasPermission(
props.threadInfo, threadInfo,
threadPermissions.VOICED, threadPermissions.VOICED,
); );
const currentUserCanJoin = useThreadHasPermission( const currentUserCanJoin = useThreadHasPermission(
props.threadInfo, threadInfo,
threadPermissions.JOIN_THREAD, threadPermissions.JOIN_THREAD,
); );
const isExitingDuringEditModeRef = React.useRef(false); const isExitingDuringEditModeRef = React.useRef(false);
const expandoButtonsOpen = useValue(1); const expandoButtonsOpen = useValue(1);
const targetExpandoButtonsOpen = useValue(1); const targetExpandoButtonsOpen = useValue(1);
▲ Show 20 Lines • Show All 126 Lines • ▼ Show 20 Lines const shouldShowTextInput = React.useCallback(() => {
// and won't list the viewer as a member, // and won't list the viewer as a member,
// which will end up hiding the input. // which will end up hiding the input.
// In this case, we will assume that our creation action // In this case, we will assume that our creation action
// will get translated into a join, and as long // will get translated into a join, and as long
// as members are voiced, we can show the input. // as members are voiced, we can show the input.
if (!threadCreationInProgress) { if (!threadCreationInProgress) {
return false; return false;
} }
return checkIfDefaultMembersAreVoiced(props.threadInfo); return checkIfDefaultMembersAreVoiced(threadInfo);
}, [currentUserIsVoiced, props.threadInfo, threadCreationInProgress]); }, [currentUserIsVoiced, threadInfo, threadCreationInProgress]);
const isEditMode = React.useCallback(() => { const isEditMode = React.useCallback(() => {
const editState = messageEditingContext?.editState; const editState = messageEditingContext?.editState;
const isThisThread = const isThisThread = editState?.editedMessage?.threadID === threadInfo.id;
editState?.editedMessage?.threadID === props.threadInfo.id;
return editState?.editedMessage !== null && isThisThread; return editState?.editedMessage !== null && isThisThread;
}, [messageEditingContext?.editState, props.threadInfo.id]); }, [messageEditingContext?.editState, threadInfo.id]);
const immediatelyShowSendButton = React.useCallback(() => { const immediatelyShowSendButton = React.useCallback(() => {
sendButtonContainerOpen.setValue(1); sendButtonContainerOpen.setValue(1);
targetSendButtonContainerOpen.setValue(1); targetSendButtonContainerOpen.setValue(1);
}, [sendButtonContainerOpen, targetSendButtonContainerOpen]); }, [sendButtonContainerOpen, targetSendButtonContainerOpen]);
const updateSendButton = React.useCallback( const updateSendButton = React.useCallback(
(currentText: string) => { (currentText: string) => {
▲ Show 20 Lines • Show All 59 Lines • ▼ Show 20 Linesfunction ConnectedChatInputBarBase({
); );
const saveDraft = React.useMemo( const saveDraft = React.useMemo(
() => () =>
_throttle(newText => { _throttle(newText => {
dispatch({ dispatch({
type: updateDraftActionType, type: updateDraftActionType,
payload: { payload: {
key: draftKeyFromThreadID(props.threadInfo.id), key: draftKeyFromThreadID(threadInfo.id),
text: newText, text: newText,
}, },
}); });
}, 400), }, 400),
[dispatch, props.threadInfo.id], [dispatch, threadInfo.id],
); );
const isMessageEdited = React.useCallback( const isMessageEdited = React.useCallback(
(newText?: string): boolean => { (newText?: string): boolean => {
let updatedText = newText ?? text; let updatedText = newText ?? text;
updatedText = trimMessage(updatedText); updatedText = trimMessage(updatedText);
const originalText = editedMessageInfo?.text; const originalText = editedMessageInfo?.text;
return updatedText !== originalText; return updatedText !== originalText;
Show All 25 Lines const focusAndUpdateButtonsVisibility = React.useCallback(() => {
} }
immediatelyShowSendButton(); immediatelyShowSendButton();
immediatelyHideButtons(); immediatelyHideButtons();
textInput.focus(); textInput.focus();
}, [immediatelyHideButtons, immediatelyShowSendButton]); }, [immediatelyHideButtons, immediatelyShowSendButton]);
const blockNavigation = React.useCallback(() => { const blockNavigation = React.useCallback(() => {
const { navigation } = props;
if (!navigation || !navigation.isFocused()) { if (!navigation || !navigation.isFocused()) {
return; return;
} }
navigation.setParams({ navigation.setParams({
removeEditMode: removeEditMode, removeEditMode: removeEditMode,
}); });
}, [props, removeEditMode]); }, [navigation, removeEditMode]);
const unblockNavigation = React.useCallback(() => { const unblockNavigation = React.useCallback(() => {
const { navigation } = props; navigation?.setParams({ removeEditMode: null });
if (!navigation) { }, [navigation]);
return;
}
navigation.setParams({ removeEditMode: null });
}, [props]);
const exitEditMode = React.useCallback(() => { const exitEditMode = React.useCallback(() => {
messageEditingContext?.setEditedMessage(null, () => { messageEditingContext?.setEditedMessage(null, () => {
unblockNavigation(); unblockNavigation();
updateText(draft); updateText(draft);
focusAndUpdateButtonsVisibility(); focusAndUpdateButtonsVisibility();
updateSendButton(draft); updateSendButton(draft);
}); });
▲ Show 20 Lines • Show All 111 Lines • ▼ Show 20 Lines const onSend = React.useCallback(async () => {
const creatorID = viewerID; const creatorID = viewerID;
invariant(creatorID, 'should have viewer ID in order to send a message'); invariant(creatorID, 'should have viewer ID in order to send a message');
invariant(inputState, 'inputState should be set in ChatInputBar.onSend'); invariant(inputState, 'inputState should be set in ChatInputBar.onSend');
await inputState.sendTextMessage( await inputState.sendTextMessage(
{ {
type: messageTypes.TEXT, type: messageTypes.TEXT,
localID, localID,
threadID: props.threadInfo.id, threadID: threadInfo.id,
text: newText, text: newText,
creatorID, creatorID,
time: Date.now(), time: Date.now(),
}, },
props.threadInfo, threadInfo,
parentThreadInfo, parentThreadInfo,
); );
}, [ }, [
editMessageInner, editMessageInner,
getEditedMessage, getEditedMessage,
inputState, inputState,
parentThreadInfo, parentThreadInfo,
props.threadInfo, threadInfo,
text, text,
updateSendButton, updateSendButton,
viewerID, viewerID,
]); ]);
const removeEditMode: RemoveEditMode = React.useCallback( const removeEditMode: RemoveEditMode = React.useCallback(
action => { action => {
const { navigation } = props;
if (!navigation || isExitingDuringEditModeRef.current) { if (!navigation || isExitingDuringEditModeRef.current) {
return 'ignore_action'; return 'ignore_action';
} }
if (!isMessageEdited()) { if (!isMessageEdited()) {
unblockNavigation(); unblockNavigation();
return 'reduce_action'; return 'reduce_action';
} }
const unblockAndDispatch = () => { const unblockAndDispatch = () => {
unblockNavigation(); unblockNavigation();
navigation.dispatch(action); navigation.dispatch(action);
}; };
const onContinueEditing = () => { const onContinueEditing = () => {
overlayContext?.resetScrollBlockingModalStatus(); overlayContext?.resetScrollBlockingModalStatus();
}; };
exitEditAlert({ exitEditAlert({
onDiscard: unblockAndDispatch, onDiscard: unblockAndDispatch,
onContinueEditing, onContinueEditing,
}); });
return 'ignore_action'; return 'ignore_action';
}, },
[isMessageEdited, overlayContext, props, unblockNavigation], [isMessageEdited, navigation, overlayContext, unblockNavigation],
); );
const onPressExitEditMode = React.useCallback(() => { const onPressExitEditMode = React.useCallback(() => {
if (!isMessageEdited()) { if (!isMessageEdited()) {
exitEditMode(); exitEditMode();
return; return;
} }
exitEditAlert({ exitEditAlert({
Show All 32 Lines (e: {
if (!isEditMode()) { if (!isEditMode()) {
return; return;
} }
const { action } = e.data; const { action } = e.data;
e.preventDefault(); e.preventDefault();
const saveExit = () => { const saveExit = () => {
messageEditingContext?.setEditedMessage(null, () => { messageEditingContext?.setEditedMessage(null, () => {
isExitingDuringEditModeRef.current = true; isExitingDuringEditModeRef.current = true;
props.navigation?.dispatch(action); navigation?.dispatch(action);
}); });
}; };
if (!isMessageEdited()) { if (!isMessageEdited()) {
saveExit(); saveExit();
return; return;
} }
exitEditAlert({ exitEditAlert({
onDiscard: saveExit, onDiscard: saveExit,
}); });
}, },
[isEditMode, isMessageEdited, messageEditingContext, props.navigation], [isEditMode, isMessageEdited, messageEditingContext, navigation],
); );
React.useEffect(() => { React.useEffect(() => {
if (isActive) { if (isActive) {
addEditInputMessageListener(); addEditInputMessageListener();
} }
return () => { return () => {
if (isActive) { if (isActive) {
removeEditInputMessageListener(); removeEditInputMessageListener();
} }
}; };
}, [addEditInputMessageListener, isActive, removeEditInputMessageListener]); }, [addEditInputMessageListener, isActive, removeEditInputMessageListener]);
React.useEffect(() => { React.useEffect(() => {
const { navigation } = props;
const clearBeforeRemoveListener = navigation?.addListener( const clearBeforeRemoveListener = navigation?.addListener(
'beforeRemove', 'beforeRemove',
onNavigationBeforeRemove, onNavigationBeforeRemove,
); );
const clearFocusListener = navigation?.addListener( const clearFocusListener = navigation?.addListener(
'focus', 'focus',
onNavigationFocus, onNavigationFocus,
); );
const clearBlurListener = navigation?.addListener('blur', onNavigationBlur); const clearBlurListener = navigation?.addListener('blur', onNavigationBlur);
return () => { return () => {
clearBeforeRemoveListener?.(); clearBeforeRemoveListener?.();
clearFocusListener?.(); clearFocusListener?.();
clearBlurListener?.(); clearBlurListener?.();
}; };
}, [onNavigationBeforeRemove, onNavigationBlur, onNavigationFocus, props]); }, [
navigation,
onNavigationBeforeRemove,
onNavigationBlur,
onNavigationFocus,
]);
const callJoinThread = useJoinThread(); const callJoinThread = useJoinThread();
const joinAction = React.useCallback(async (): Promise<ThreadJoinPayload> => { const joinAction = React.useCallback(async (): Promise<ThreadJoinPayload> => {
let joinThreadInput; let joinThreadInput;
if (rawThreadInfo.thick) { if (rawThreadInfo.thick) {
joinThreadInput = { joinThreadInput = {
thick: true, thick: true,
rawThreadInfo: rawThreadInfo, rawThreadInfo: rawThreadInfo,
}; };
} else { } else {
const query = calendarQuery(); const query = calendarQuery();
joinThreadInput = { joinThreadInput = {
thick: false, thick: false,
threadID: props.threadInfo.id, threadID: threadInfo.id,
calendarQuery: { calendarQuery: {
startDate: query.startDate, startDate: query.startDate,
endDate: query.endDate, endDate: query.endDate,
filters: [ filters: [
...query.filters, ...query.filters,
{ type: 'threads', threadIDs: [props.threadInfo.id] }, { type: 'threads', threadIDs: [threadInfo.id] },
], ],
}, },
}; };
} }
return await callJoinThread(joinThreadInput); return await callJoinThread(joinThreadInput);
}, [calendarQuery, callJoinThread, props.threadInfo.id, rawThreadInfo]); }, [calendarQuery, callJoinThread, threadInfo.id, rawThreadInfo]);
const onPressJoin = React.useCallback(() => { const onPressJoin = React.useCallback(() => {
void dispatchActionPromise(joinThreadActionTypes, joinAction()); void dispatchActionPromise(joinThreadActionTypes, joinAction());
}, [dispatchActionPromise, joinAction]); }, [dispatchActionPromise, joinAction]);
const setIOSKeyboardHeight = React.useCallback(() => { const setIOSKeyboardHeight = React.useCallback(() => {
if (Platform.OS !== 'ios') { if (Platform.OS !== 'ios') {
return; return;
} }
const textInput = textInputRef.current; const textInput = textInputRef.current;
if (!textInput) { if (!textInput) {
return; return;
} }
const keyboardHeight = getKeyboardHeight(); const keyboardHeight = getKeyboardHeight();
if (keyboardHeight === null || keyboardHeight === undefined) { if (keyboardHeight === null || keyboardHeight === undefined) {
return; return;
} }
TextInputKeyboardMangerIOS.setKeyboardHeight(textInput, keyboardHeight); TextInputKeyboardMangerIOS.setKeyboardHeight(textInput, keyboardHeight);
}, []); }, []);
const showMediaGallery = React.useCallback(() => { const showMediaGallery = React.useCallback(() => {
invariant(keyboardState, 'keyboardState should be initialized'); invariant(keyboardState, 'keyboardState should be initialized');
keyboardState.showMediaGallery(props.threadInfo); keyboardState.showMediaGallery(threadInfo);
}, [keyboardState, props.threadInfo]); }, [keyboardState, threadInfo]);
const dismissKeyboard = React.useCallback(() => { const dismissKeyboard = React.useCallback(() => {
keyboardState?.dismissKeyboard(); keyboardState?.dismissKeyboard();
}, [keyboardState]); }, [keyboardState]);
const prevThreadInfoID = React.useRef<?string>(); const prevThreadInfoID = React.useRef<?string>();
const prevDraft = React.useRef<?string>(); const prevDraft = React.useRef<?string>();
React.useEffect(() => { React.useEffect(() => {
if ( if (
textEdited && textEdited &&
text && text &&
prevThreadInfoID.current && prevThreadInfoID.current &&
props.threadInfo.id !== prevThreadInfoID.current threadInfo.id !== prevThreadInfoID.current
) { ) {
dispatch({ dispatch({
type: moveDraftActionType, type: moveDraftActionType,
payload: { payload: {
oldKey: draftKeyFromThreadID(prevThreadInfoID.current), oldKey: draftKeyFromThreadID(prevThreadInfoID.current),
newKey: draftKeyFromThreadID(props.threadInfo.id), newKey: draftKeyFromThreadID(threadInfo.id),
}, },
}); });
} else if (!textEdited && draft !== prevDraft.current) { } else if (!textEdited && draft !== prevDraft.current) {
setText(draft); setText(draft);
} }
prevThreadInfoID.current = props.threadInfo.id; prevThreadInfoID.current = threadInfo.id;
prevDraft.current = draft; prevDraft.current = draft;
}, [dispatch, draft, props.threadInfo.id, text, textEdited]); }, [dispatch, draft, threadInfo.id, text, textEdited]);
const prevIsActiveRef = React.useRef(isActive); const prevIsActiveRef = React.useRef(isActive);
React.useEffect(() => { React.useEffect(() => {
if (isActive && !prevIsActiveRef.current) { if (isActive && !prevIsActiveRef.current) {
addEditInputMessageListener(); addEditInputMessageListener();
} else if (!isActive && prevIsActiveRef) { } else if (!isActive && prevIsActiveRef) {
removeEditInputMessageListener(); removeEditInputMessageListener();
} }
▲ Show 20 Lines • Show All 57 Lines • ▼ Show 20 Lines const expandoButton = (
onPress={expandButtons} onPress={expandButtons}
activeOpacity={0.4} activeOpacity={0.4}
style={styles.expandButton} style={styles.expandButton}
> >
<AnimatedView style={expandIconStyle}> <AnimatedView style={expandIconStyle}>
<SWMansionIcon <SWMansionIcon
name="chevron-right" name="chevron-right"
size={22} size={22}
color={`#${props.threadInfo.color}`} color={`#${threadInfo.color}`}
/> />
</AnimatedView> </AnimatedView>
</TouchableOpacity> </TouchableOpacity>
); );
const threadColor = `#${props.threadInfo.color}`; const threadColor = `#${threadInfo.color}`;
const expandoButtonsViewStyle: Array<ViewStyle> = [ const expandoButtonsViewStyle: Array<ViewStyle> = [
styles.innerExpandoButtons, styles.innerExpandoButtons,
]; ];
if (isEditMode()) { if (isEditMode()) {
expandoButtonsViewStyle.push({ display: 'none' }); expandoButtonsViewStyle.push({ display: 'none' });
} }
return ( return (
<TouchableWithoutFeedback onPress={dismissKeyboard}> <TouchableWithoutFeedback onPress={dismissKeyboard}>
<View style={styles.inputContainer}> <View style={styles.inputContainer}>
<AnimatedView style={expandoButtonsStyle}> <AnimatedView style={expandoButtonsStyle}>
<View style={expandoButtonsViewStyle}> <View style={expandoButtonsViewStyle}>
{buttonsExpanded ? expandoButton : null} {buttonsExpanded ? expandoButton : null}
<TouchableOpacity onPress={showMediaGallery} activeOpacity={0.4}> <TouchableOpacity onPress={showMediaGallery} activeOpacity={0.4}>
<AnimatedView style={cameraRollIconStyle}> <AnimatedView style={cameraRollIconStyle}>
<SWMansionIcon <SWMansionIcon
name="image-1" name="image-1"
size={28} size={28}
color={`#${props.threadInfo.color}`} color={`#${threadInfo.color}`}
/> />
</AnimatedView> </AnimatedView>
</TouchableOpacity> </TouchableOpacity>
<TouchableOpacity <TouchableOpacity
onPress={props.openCamera} onPress={openCamera}
activeOpacity={0.4} activeOpacity={0.4}
disabled={!buttonsExpanded} disabled={!buttonsExpanded}
> >
<AnimatedView style={cameraIconStyle}> <AnimatedView style={cameraIconStyle}>
<SWMansionIcon <SWMansionIcon
name="camera" name="camera"
size={28} size={28}
color={`#${props.threadInfo.color}`} color={`#${threadInfo.color}`}
/> />
</AnimatedView> </AnimatedView>
</TouchableOpacity> </TouchableOpacity>
{buttonsExpanded ? null : expandoButton} {buttonsExpanded ? null : expandoButton}
</View> </View>
</AnimatedView> </AnimatedView>
<SelectableTextInput <SelectableTextInput
allowImagePasteForThreadID={props.threadInfo.id} allowImagePasteForThreadID={threadInfo.id}
value={text} value={text}
onChangeText={updateText} onChangeText={updateText}
selection={selectionState.selection} selection={selectionState.selection}
onUpdateSyncedSelectionData={setSelectionState} onUpdateSyncedSelectionData={setSelectionState}
placeholder="Send a message..." placeholder="Send a message..."
placeholderTextColor={colors.listInputButton} placeholderTextColor={colors.listInputButton}
multiline={true} multiline={true}
style={styles.textInput} style={styles.textInput}
textInputRef={setTextInputRef} textInputRef={setTextInputRef}
clearableTextInputRef={setClearableTextInputRef} clearableTextInputRef={setClearableTextInputRef}
ref={selectableTextInputRef} ref={selectableTextInputRef}
selectionColor={`#${props.threadInfo.color}`} selectionColor={`#${threadInfo.color}`}
/> />
<AnimatedView style={sendButtonContainerStyle}> <AnimatedView style={sendButtonContainerStyle}>
<TouchableOpacity <TouchableOpacity
onPress={onSend} onPress={onSend}
activeOpacity={0.4} activeOpacity={0.4}
style={styles.sendButton} style={styles.sendButton}
disabled={trimMessage(text) === ''} disabled={trimMessage(text) === ''}
> >
<Icon <Icon
name="md-send" name="md-send"
size={25} size={25}
style={styles.sendIcon} style={styles.sendIcon}
color={threadColor} color={threadColor}
/> />
</TouchableOpacity> </TouchableOpacity>
</AnimatedView> </AnimatedView>
</View> </View>
</TouchableWithoutFeedback> </TouchableWithoutFeedback>
); );
}; };
const isMember = viewerIsMember(props.threadInfo); const isMember = viewerIsMember(threadInfo);
let joinButton = null; let joinButton = null;
const threadColor = `#${props.threadInfo.color}`; const threadColor = `#${threadInfo.color}`;
if (!isMember && currentUserCanJoin && !threadCreationInProgress) { if (!isMember && currentUserCanJoin && !threadCreationInProgress) {
let buttonContent; let buttonContent;
if (joinThreadLoadingStatus === 'loading') { if (joinThreadLoadingStatus === 'loading') {
buttonContent = ( buttonContent = (
<ActivityIndicator <ActivityIndicator
size="small" size="small"
color="white" color="white"
style={styles.joinThreadLoadingIndicator} style={styles.joinThreadLoadingIndicator}
/> />
); );
} else { } else {
const textStyle = colorIsDark(props.threadInfo.color) const textStyle = colorIsDark(threadInfo.color)
? styles.joinButtonTextLight ? styles.joinButtonTextLight
: styles.joinButtonTextDark; : styles.joinButtonTextDark;
buttonContent = ( buttonContent = (
<View style={styles.joinButtonContent}> <View style={styles.joinButtonContent}>
<SWMansionIcon name="plus" style={textStyle} /> <SWMansionIcon name="plus" style={textStyle} />
<Text style={textStyle}>Join Chat</Text> <Text style={textStyle}>Join Chat</Text>
</View> </View>
); );
Show All 22 Lines typeaheadTooltip = (
focusAndUpdateTextAndSelection={focusAndUpdateTextAndSelection} focusAndUpdateTextAndSelection={focusAndUpdateTextAndSelection}
typeaheadTooltipActionsGetter={mentionTypeaheadTooltipActions} typeaheadTooltipActionsGetter={mentionTypeaheadTooltipActions}
TypeaheadTooltipButtonComponent={MentionTypeaheadTooltipButton} TypeaheadTooltipButtonComponent={MentionTypeaheadTooltipButton}
/> />
); );
} }
let content; let content;
const defaultMembersAreVoiced = checkIfDefaultMembersAreVoiced( const defaultMembersAreVoiced = checkIfDefaultMembersAreVoiced(threadInfo);
props.threadInfo,
);
if (shouldShowTextInput()) { if (shouldShowTextInput()) {
content = renderInput(); content = renderInput();
} else if ( } else if (
threadFrozen && threadFrozen &&
threadActualMembers(props.threadInfo.members).length === 2 threadActualMembers(threadInfo.members).length === 2
) { ) {
content = ( content = (
<Text style={styles.explanation}> <Text style={styles.explanation}>
You can&rsquo;t send messages to a user that you&rsquo;ve blocked. You can&rsquo;t send messages to a user that you&rsquo;ve blocked.
</Text> </Text>
); );
} else if (isMember) { } else if (isMember) {
content = ( content = (
▲ Show 20 Lines • Show All 42 Lines • ▼ Show 20 Lines editedMessage = (
color={threadColor} color={threadColor}
onPress={onPressExitEditMode} onPress={onPressExitEditMode}
/> />
</AnimatedView> </AnimatedView>
); );
} }
return ( return (
<AnimatedView style={styles.container} onLayout={props.onInputBarLayout}> <AnimatedView style={styles.container} onLayout={onInputBarLayout}>
{typeaheadTooltip} {typeaheadTooltip}
{joinButton} {joinButton}
{editedMessage} {editedMessage}
{content} {content}
{keyboardInputHost} {keyboardInputHost}
</AnimatedView> </AnimatedView>
); );
} }
▲ Show 20 Lines • Show All 114 Lines • Show Last 20 Lines