Use dismissBottomSheet helper function instead of emitting an event (#5965)

This commit is contained in:
Elias Nahum
2022-02-15 08:44:26 -03:00
committed by GitHub
parent e9c2e9a669
commit df5c780337
16 changed files with 54 additions and 66 deletions

View File

@@ -8,18 +8,18 @@ import withObservables from '@nozbe/with-observables';
import Clipboard from '@react-native-community/clipboard';
import React, {useCallback, useMemo} from 'react';
import {useIntl} from 'react-intl';
import {DeviceEventEmitter, GestureResponderEvent, StyleProp, StyleSheet, Text, TextStyle, View} from 'react-native';
import {GestureResponderEvent, StyleProp, StyleSheet, Text, TextStyle, View} from 'react-native';
import {combineLatest, of as of$} from 'rxjs';
import {map, switchMap} from 'rxjs/operators';
import CompassIcon from '@components/compass_icon';
import SlideUpPanelItem, {ITEM_HEIGHT} from '@components/slide_up_panel_item';
import {Events, Preferences} from '@constants';
import {Preferences} from '@constants';
import {MM_TABLES, SYSTEM_IDENTIFIERS} from '@constants/database';
import {useTheme} from '@context/theme';
import UserModel from '@database/models/server/user';
import {getTeammateNameDisplaySetting} from '@helpers/api/preference';
import {bottomSheet, showModal} from '@screens/navigation';
import {bottomSheet, dismissBottomSheet, showModal} from '@screens/navigation';
import {displayUsername, getUserMentionKeys, getUsersByUsername} from '@utils/user';
import type {WithDatabaseArgs} from '@typings/database/database';
@@ -140,7 +140,7 @@ const AtMention = ({
<SlideUpPanelItem
icon='content-copy'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
let username = mentionName;
if (user.username) {
username = user.username;
@@ -155,7 +155,7 @@ const AtMention = ({
destructive={true}
icon='cancel'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
}}
testID='at_mention.bottom_sheet.cancel'
text={intl.formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}

View File

@@ -5,14 +5,13 @@ import {useManagedConfig} from '@mattermost/react-native-emm';
import Clipboard from '@react-native-community/clipboard';
import React, {useCallback} from 'react';
import {useIntl} from 'react-intl';
import {DeviceEventEmitter, Keyboard, StyleSheet, Text, TextStyle, View} from 'react-native';
import {Keyboard, StyleSheet, Text, TextStyle, View} from 'react-native';
import FormattedText from '@components/formatted_text';
import SlideUpPanelItem, {ITEM_HEIGHT} from '@components/slide_up_panel_item';
import TouchableWithFeedback from '@components/touchable_with_feedback';
import {Events} from '@constants';
import {useTheme} from '@context/theme';
import {bottomSheet, goToScreen} from '@screens/navigation';
import {bottomSheet, dismissBottomSheet, goToScreen} from '@screens/navigation';
import {getDisplayNameForLanguage} from '@utils/markdown';
import {preventDoubleTap} from '@utils/tap';
import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme';
@@ -136,7 +135,7 @@ const MarkdownCodeBlock = ({language = '', content, textStyle}: MarkdownCodeBloc
<SlideUpPanelItem
icon='content-copy'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
Clipboard.setString(content);
}}
testID='at_mention.bottom_sheet.copy_code'
@@ -146,7 +145,7 @@ const MarkdownCodeBlock = ({language = '', content, textStyle}: MarkdownCodeBloc
destructive={true}
icon='cancel'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
}}
testID='at_mention.bottom_sheet.cancel'
text={intl.formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}

View File

@@ -5,7 +5,7 @@ import {useManagedConfig} from '@mattermost/react-native-emm';
import Clipboard from '@react-native-community/clipboard';
import React, {useCallback, useRef, useState} from 'react';
import {useIntl} from 'react-intl';
import {Alert, DeviceEventEmitter, Platform, StyleProp, StyleSheet, Text, TextStyle, View} from 'react-native';
import {Alert, Platform, StyleProp, StyleSheet, Text, TextStyle, View} from 'react-native';
import parseUrl from 'url-parse';
import CompassIcon from '@components/compass_icon';
@@ -13,11 +13,10 @@ import FormattedText from '@components/formatted_text';
import ProgressiveImage from '@components/progressive_image';
import SlideUpPanelItem, {ITEM_HEIGHT} from '@components/slide_up_panel_item';
import TouchableWithFeedback from '@components/touchable_with_feedback';
import {Events} from '@constants';
import {useServerUrl} from '@context/server';
import {useTheme} from '@context/theme';
import {useIsTablet} from '@hooks/device';
import {bottomSheet} from '@screens/navigation';
import {bottomSheet, dismissBottomSheet} from '@screens/navigation';
import {openGallerWithMockFile} from '@utils/gallery';
import {generateId} from '@utils/general';
import {calculateDimensions, getViewPortWidth, isGifTooLarge} from '@utils/images';
@@ -122,7 +121,7 @@ const MarkdownImage = ({
<SlideUpPanelItem
icon='content-copy'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
Clipboard.setString(linkDestination || source);
}}
testID='at_mention.bottom_sheet.copy_url'
@@ -132,7 +131,7 @@ const MarkdownImage = ({
destructive={true}
icon='cancel'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
}}
testID='at_mention.bottom_sheet.cancel'
text={intl.formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}

View File

@@ -7,7 +7,7 @@ import withObservables from '@nozbe/with-observables';
import Clipboard from '@react-native-community/clipboard';
import React, {Children, ReactElement, useCallback} from 'react';
import {useIntl} from 'react-intl';
import {Alert, DeviceEventEmitter, StyleSheet, Text, View} from 'react-native';
import {Alert, StyleSheet, Text, View} from 'react-native';
import {of as of$} from 'rxjs';
import {switchMap} from 'rxjs/operators';
import urlParse from 'url-parse';
@@ -15,12 +15,11 @@ import urlParse from 'url-parse';
import {showPermalink} from '@actions/local/permalink';
import {switchToChannelByName} from '@actions/remote/channel';
import SlideUpPanelItem, {ITEM_HEIGHT} from '@components/slide_up_panel_item';
import {Events} from '@constants';
import {MM_TABLES, SYSTEM_IDENTIFIERS} from '@constants/database';
import DeepLinkTypes from '@constants/deep_linking';
import {useServerUrl} from '@context/server';
import {useTheme} from '@context/theme';
import {bottomSheet, dismissAllModals, popToRoot} from '@screens/navigation';
import {bottomSheet, dismissAllModals, dismissBottomSheet, popToRoot} from '@screens/navigation';
import {errorBadChannel} from '@utils/draft';
import {preventDoubleTap} from '@utils/tap';
import {matchDeepLink, normalizeProtocol, tryOpenURL} from '@utils/url';
@@ -133,7 +132,7 @@ const MarkdownLink = ({children, experimentalNormalizeMarkdownLinks, href, siteU
<SlideUpPanelItem
icon='content-copy'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
Clipboard.setString(href);
}}
testID='at_mention.bottom_sheet.copy_url'
@@ -143,7 +142,7 @@ const MarkdownLink = ({children, experimentalNormalizeMarkdownLinks, href, siteU
destructive={true}
icon='cancel'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
}}
testID='at_mention.bottom_sheet.cancel'
text={intl.formatMessage({id: 'mobile.post.cancel', defaultMessage: 'Cancel'})}

View File

@@ -2,15 +2,15 @@
// See LICENSE.txt for license information.
import React from 'react';
import {View, DeviceEventEmitter} from 'react-native';
import {View} from 'react-native';
import {CameraOptions} from 'react-native-image-picker';
import CompassIcon from '@components/compass_icon';
import FormattedText from '@components/formatted_text';
import TouchableWithFeedback from '@components/touchable_with_feedback';
import {Events} from '@constants';
import {useTheme} from '@context/theme';
import {useIsTablet} from '@hooks/device';
import {dismissBottomSheet} from '@screens/navigation';
import {makeStyleSheetFromTheme} from '@utils/theme';
type Props = {
@@ -65,7 +65,7 @@ const CameraType = ({onPress}: Props) => {
};
onPress(options);
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
};
const onVideo = () => {
@@ -76,7 +76,7 @@ const CameraType = ({onPress}: Props) => {
};
onPress(options);
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
};
return (

View File

@@ -3,15 +3,14 @@
import React, {useCallback} from 'react';
import {useIntl} from 'react-intl';
import {DeviceEventEmitter, StyleSheet, View} from 'react-native';
import {StyleSheet, View} from 'react-native';
import {removePost} from '@actions/local/post';
import CompassIcon from '@components/compass_icon';
import SlideUpPanelItem, {ITEM_HEIGHT} from '@components/slide_up_panel_item';
import TouchableWithFeedback from '@components/touchable_with_feedback';
import {Events} from '@constants';
import {useServerUrl} from '@context/server';
import {bottomSheet} from '@screens/navigation';
import {bottomSheet, dismissBottomSheet} from '@screens/navigation';
import type PostModel from '@typings/database/models/servers/post';
@@ -46,7 +45,7 @@ const Failed = ({post, theme}: FailedProps) => {
<SlideUpPanelItem
icon='send-outline'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
retryPost(serverUrl, post);
}}
testID='post.failed.retry'
@@ -56,7 +55,7 @@ const Failed = ({post, theme}: FailedProps) => {
destructive={true}
icon='close-circle-outline'
onPress={() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
removePost(serverUrl, post);
}}
testID='post.failed.delete'

View File

@@ -3,10 +3,9 @@
import React, {useCallback} from 'react';
import {useIntl} from 'react-intl';
import {DeviceEventEmitter} from 'react-native';
import {Events} from '@constants';
import BottomSheetContent from '@screens/bottom_sheet/content';
import {dismissBottomSheet} from '@screens/navigation';
import TeamList from './team_list';
@@ -23,7 +22,7 @@ export default function AddTeamSlideUp({otherTeams, canCreateTeams, showTitle =
const onPressCreate = useCallback(() => {
//TODO Create team screen
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
}, []);
return (

View File

@@ -2,14 +2,14 @@
// See LICENSE.txt for license information.
import React, {useCallback} from 'react';
import {DeviceEventEmitter, Text, View} from 'react-native';
import {Text, View} from 'react-native';
import {addUserToTeam} from '@actions/remote/team';
import TeamIcon from '@components/team_sidebar/team_list/team_item/team_icon';
import TouchableWithFeedback from '@components/touchable_with_feedback';
import {Events} from '@constants';
import {useServerUrl} from '@context/server';
import {useTheme} from '@context/theme';
import {dismissBottomSheet} from '@screens/navigation';
import {makeStyleSheetFromTheme} from '@utils/theme';
import type TeamModel from '@typings/database/models/servers/team';
@@ -25,7 +25,7 @@ export default function TeamListItem({team, currentUserId}: Props) {
const serverUrl = useServerUrl();
const onPress = useCallback(async () => {
await addUserToTeam(serverUrl, team.id, currentUserId);
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
}, []);
return (

View File

@@ -3,13 +3,12 @@
import React, {useCallback} from 'react';
import {useIntl} from 'react-intl';
import {DeviceEventEmitter} from 'react-native';
import SlideUpPanelItem from '@components/slide_up_panel_item';
import {Events} from '@constants';
import {useTheme} from '@context/theme';
import {useIsTablet} from '@hooks/device';
import BottomSheetContent from '@screens/bottom_sheet/content';
import {dismissBottomSheet} from '@screens/navigation';
import {
makeStyleSheetFromTheme,
@@ -49,17 +48,17 @@ export default function DropdownSlideup({
};
const handlePublicPress = useCallback(() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
onPress(PUBLIC);
}, [onPress]);
const handleArchivedPress = useCallback(() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
onPress(ARCHIVED);
}, [onPress]);
const handleSharedPress = useCallback(() => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
onPress(SHARED);
}, [onPress]);

View File

@@ -2,16 +2,16 @@
// See LICENSE.txt for license information.
import React, {useCallback, useMemo, useState} from 'react';
import {DeviceEventEmitter, Platform, View} from 'react-native';
import {Platform, View} from 'react-native';
import {Client} from '@client/rest';
import ProfileImage from '@components/profile_picture';
import {Events} from '@constants';
import {ACCOUNT_OUTLINE_IMAGE} from '@constants/profile';
import {useServerUrl} from '@context/server';
import {useTheme} from '@context/theme';
import useDidUpdate from '@hooks/did_update';
import NetworkManager from '@init/network_manager';
import {dismissBottomSheet} from '@screens/navigation';
import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme';
import ProfileImagePicker from './profile_image_picker';
@@ -81,7 +81,7 @@ const EditProfilePicture = ({user, onUpdateProfilePicture}: ChangeProfilePicture
setPictureUrl(pUrl);
onUpdateProfilePicture({isRemoved, localPath});
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
}, [onUpdateProfilePicture]);
const pictureSource = useMemo(() => {

View File

@@ -3,17 +3,16 @@
import React, {useCallback} from 'react';
import {useIntl} from 'react-intl';
import {DeviceEventEmitter, TextStyle} from 'react-native';
import {TextStyle} from 'react-native';
import {setStatus} from '@actions/remote/user';
import MenuItem from '@components/menu_item';
import SlideUpPanelItem, {ITEM_HEIGHT} from '@components/slide_up_panel_item';
import StatusLabel from '@components/status_label';
import UserStatusIndicator from '@components/user_status';
import {Events} from '@constants';
import General from '@constants/general';
import {useServerUrl} from '@context/server';
import {bottomSheet, dismissModal} from '@screens/navigation';
import {bottomSheet, dismissBottomSheet, dismissModal} from '@screens/navigation';
import {preventDoubleTap} from '@utils/tap';
import {changeOpacity} from '@utils/theme';
import {confirmOutOfOfficeDisabled} from '@utils/user';
@@ -111,7 +110,7 @@ const UserStatus = ({currentUser, style, theme}: Props) => {
}
updateStatus(status);
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
return null;
}, []);

View File

@@ -192,7 +192,7 @@ const ServerItem = ({isActive, server}: Props) => {
const onServerPressed = useCallback(async () => {
if (isActive) {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
return;
}

View File

@@ -632,7 +632,7 @@ export async function bottomSheet({title, renderContent, snapPoints, initialSnap
}
}
export async function dismissBottomSheet() {
export async function dismissBottomSheet(alternativeScreen = Screens.BOTTOM_SHEET) {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
await EphemeralStore.waitUntilScreensIsRemoved(Screens.BOTTOM_SHEET);
await EphemeralStore.waitUntilScreensIsRemoved(alternativeScreen);
}

View File

@@ -3,10 +3,10 @@
import React, {useCallback} from 'react';
import {useIntl} from 'react-intl';
import {DeviceEventEmitter, useWindowDimensions, View} from 'react-native';
import {useWindowDimensions, View} from 'react-native';
import CompassIcon from '@components/compass_icon';
import {Events, Screens} from '@constants';
import {Screens} from '@constants';
import {
LARGE_CONTAINER_SIZE,
LARGE_ICON_SIZE,
@@ -16,8 +16,7 @@ import {
SMALL_ICON_SIZE,
} from '@constants/reaction_picker';
import {useTheme} from '@context/theme';
import {showModal} from '@screens/navigation';
import EphemeralStore from '@store/ephemeral_store';
import {dismissBottomSheet, showModal} from '@screens/navigation';
import {makeStyleSheetFromTheme} from '@utils/theme';
import PickReaction from './components/pick_reaction';
@@ -52,8 +51,7 @@ const ReactionBar = ({recentEmojis = []}: QuickReactionProps) => {
}, []);
const openEmojiPicker = useCallback(async () => {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
await EphemeralStore.waitUntilScreensIsRemoved(Screens.POST_OPTIONS);
await dismissBottomSheet(Screens.POST_OPTIONS);
const closeButton = CompassIcon.getImageSourceSync('close', 24, theme.sidebarHeaderTextColor);
const screen = Screens.EMOJI_PICKER;

View File

@@ -2,14 +2,14 @@
// See LICENSE.txt for license information.
import {IntlShape} from 'react-intl';
import {Alert, DeviceEventEmitter, NativeModules, Platform, StatusBar} from 'react-native';
import {Alert, NativeModules, Platform, StatusBar} from 'react-native';
import AndroidOpenSettings from 'react-native-android-open-settings';
import DeviceInfo from 'react-native-device-info';
import DocumentPicker, {DocumentPickerResponse} from 'react-native-document-picker';
import {Asset, CameraOptions, ImageLibraryOptions, ImagePickerResponse, launchCamera, launchImageLibrary} from 'react-native-image-picker';
import Permissions, {AndroidPermission, IOSPermission} from 'react-native-permissions';
import {Events} from '@constants';
import {dismissBottomSheet} from '@screens/navigation';
import {extractFileInfo, lookupMimeType} from '@utils/file';
const ShareExtension = NativeModules.MattermostShare;
@@ -101,7 +101,7 @@ export default class FilePickerUtil {
const out = await extractFileInfo(files);
if (out.length > 0) {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
dismissBottomSheet();
this.uploadFiles(out);
}
};

View File

@@ -2,12 +2,11 @@
// See LICENSE.txt for license information.
import {IntlShape} from 'react-intl';
import {Alert, AlertButton, DeviceEventEmitter} from 'react-native';
import {Alert, AlertButton} from 'react-native';
import CompassIcon from '@components/compass_icon';
import {Events, Screens, SupportedServer} from '@constants';
import {showModal} from '@screens/navigation';
import EphemeralStore from '@store/ephemeral_store';
import {Screens, SupportedServer} from '@constants';
import {dismissBottomSheet, showModal} from '@screens/navigation';
import {LaunchType} from '@typings/launch';
import {changeOpacity} from '@utils/theme';
import {tryOpenURL} from '@utils/url';
@@ -34,9 +33,7 @@ export function semverFromServerVersion(value: string) {
}
export async function addNewServer(theme: Theme, serverUrl?: string, displayName?: string) {
DeviceEventEmitter.emit(Events.CLOSE_BOTTOM_SHEET);
await EphemeralStore.waitUntilScreensIsRemoved(Screens.BOTTOM_SHEET);
await dismissBottomSheet();
const closeButton = CompassIcon.getImageSourceSync('close', 24, changeOpacity(theme.centerChannelColor, 0.56));
const closeButtonId = 'close-server';
const props = {