From fbd8b921941170309bc7ddc7bb0b4f87690ca2e0 Mon Sep 17 00:00:00 2001 From: Elias Nahum Date: Thu, 28 Oct 2021 10:15:17 -0300 Subject: [PATCH] [Gekidou] Avoid technical debt (#5795) * Apply Status bar color * useIsTablet hook instead of useSplitView in combination with the constant * Constants clean up --- app/actions/remote/session.ts | 4 +- app/client/rest/base.ts | 4 +- app/components/failed_action/index.tsx | 2 - .../markdown/markdown_image/index.tsx | 8 +- .../post/body/content/image_preview/index.tsx | 8 +- .../attachment_image/index.tsx | 8 +- .../opengraph/opengraph_image/index.tsx | 2 +- .../post/body/content/youtube/index.tsx | 8 +- .../post_list/post/body/files/index.tsx | 10 +- app/components/server_version/index.tsx | 4 +- app/components/status_bar/index.tsx | 23 --- .../team_sidebar/add_team/add_team.tsx | 7 +- app/constants/attachment.ts | 10 -- app/constants/device.ts | 15 -- app/constants/emoji.ts | 2 - app/constants/events.ts | 3 + app/constants/general.ts | 40 ----- app/constants/index.ts | 15 +- app/constants/list.ts | 13 -- app/constants/navigation.ts | 3 - app/constants/permissions.ts | 22 +++ app/constants/post_draft.ts | 36 ----- app/constants/sso.ts | 8 +- app/constants/supported_server.ts | 14 ++ app/constants/view.ts | 140 +----------------- app/context/theme/index.tsx | 8 +- app/init/global_event_handler.ts | 16 +- app/init/push_notifications.ts | 4 +- app/screens/about/index.tsx | 2 - app/screens/bottom_sheet/content.tsx | 6 +- app/screens/bottom_sheet/index.tsx | 7 +- app/screens/channel/channel_nav_bar/index.tsx | 65 ++------ app/screens/channel/index.tsx | 2 - app/screens/custom_status/index.tsx | 2 - .../custom_status_clear_after/index.tsx | 3 +- .../home/account/components/options/index.tsx | 2 +- app/screens/home/account/index.tsx | 19 +-- app/screens/home/channel_list/index.tsx | 15 +- app/screens/login/index.tsx | 2 - app/screens/login_options/gitlab.tsx | 4 +- app/screens/login_options/google.tsx | 4 +- app/screens/login_options/index.tsx | 3 +- app/screens/login_options/office365.tsx | 4 +- app/screens/login_options/open_id.tsx | 4 +- app/screens/login_options/saml.tsx | 4 +- app/screens/navigation.ts | 16 +- app/screens/server/index.tsx | 10 +- app/screens/sso/index.tsx | 12 +- app/screens/sso/sso_with_redirect_url.tsx | 6 +- app/screens/sso/sso_with_webview.tsx | 6 +- app/utils/images/index.ts | 2 +- app/utils/supported_server/index.ts | 4 +- app/utils/theme/index.ts | 7 +- app/utils/user/index.ts | 6 +- test/test_helper.js | 3 +- 55 files changed, 185 insertions(+), 472 deletions(-) delete mode 100644 app/components/status_bar/index.tsx delete mode 100644 app/constants/attachment.ts delete mode 100644 app/constants/list.ts delete mode 100644 app/constants/post_draft.ts create mode 100644 app/constants/supported_server.ts diff --git a/app/actions/remote/session.ts b/app/actions/remote/session.ts index 3096de76f..7cee87510 100644 --- a/app/actions/remote/session.ts +++ b/app/actions/remote/session.ts @@ -4,7 +4,7 @@ import {DeviceEventEmitter} from 'react-native'; import {autoUpdateTimezone, getDeviceTimezone, isTimezoneEnabled} from '@actions/local/timezone'; -import {General, Database} from '@constants'; +import {Database, Events} from '@constants'; import DatabaseManager from '@database/manager'; import {getServerCredentials} from '@init/credentials'; import NetworkManager from '@init/network_manager'; @@ -155,7 +155,7 @@ export const logout = async (serverUrl: string, skipServerLogout = false) => { } } - DeviceEventEmitter.emit(General.SERVER_LOGOUT, serverUrl); + DeviceEventEmitter.emit(Events.SERVER_LOGOUT, serverUrl); }; export const sendPasswordResetEmail = async (serverUrl: string, email: string) => { diff --git a/app/client/rest/base.ts b/app/client/rest/base.ts index 941c7a5d0..a5c048619 100644 --- a/app/client/rest/base.ts +++ b/app/client/rest/base.ts @@ -3,7 +3,7 @@ import {DeviceEventEmitter} from 'react-native'; -import {General} from '@constants'; +import {Events} from '@constants'; import {t} from '@i18n'; import {Analytics, create} from '@init/analytics'; import {setServerCredentials} from '@init/credentials'; @@ -233,7 +233,7 @@ export default class ClientBase { const hasCacheControl = Boolean(headers[ClientConstants.HEADER_CACHE_CONTROL] || headers[ClientConstants.HEADER_CACHE_CONTROL.toLowerCase()]); if (serverVersion && !hasCacheControl && this.serverVersion !== serverVersion) { this.serverVersion = serverVersion; - DeviceEventEmitter.emit(General.SERVER_VERSION_CHANGED, {serverUrl: this.apiClient.baseUrl, serverVersion}); + DeviceEventEmitter.emit(Events.SERVER_VERSION_CHANGED, {serverUrl: this.apiClient.baseUrl, serverVersion}); } const bearerToken = headers[ClientConstants.HEADER_TOKEN] || headers[ClientConstants.HEADER_TOKEN.toLowerCase()]; diff --git a/app/components/failed_action/index.tsx b/app/components/failed_action/index.tsx index 8919c07c5..b4f31aabf 100644 --- a/app/components/failed_action/index.tsx +++ b/app/components/failed_action/index.tsx @@ -6,7 +6,6 @@ import {useIntl} from 'react-intl'; import {Text, View} from 'react-native'; import Button from 'react-native-button'; -import {View as ViewConstants} from '@constants'; import {useTheme} from '@context/theme'; import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme'; @@ -26,7 +25,6 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme: Theme) => { flex: 1, justifyContent: 'center', paddingHorizontal: 20, - paddingVertical: ViewConstants.INDICATOR_BAR_HEIGHT, paddingBottom: 15, }, title: { diff --git a/app/components/markdown/markdown_image/index.tsx b/app/components/markdown/markdown_image/index.tsx index e0d6f5678..c98c482c2 100644 --- a/app/components/markdown/markdown_image/index.tsx +++ b/app/components/markdown/markdown_image/index.tsx @@ -13,9 +13,9 @@ 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 {Device, Navigation} from '@constants'; +import {Navigation} from '@constants'; import {useServerUrl} from '@context/server_url'; -import {useSplitView} from '@hooks/device'; +import {useIsTablet} from '@hooks/device'; import {showModalOverCurrentContext} from '@screens/navigation'; import {openGallerWithMockFile} from '@utils/gallery'; import {generateId} from '@utils/general'; @@ -53,7 +53,7 @@ const MarkdownImage = ({ linkDestination, postId, source, }: MarkdownImageProps) => { const intl = useIntl(); - const isSplitView = useSplitView(); + const isTablet = useIsTablet(); const managedConfig = useManagedConfig(); const genericFileId = useRef(generateId()).current; const metadata = imagesMetadata?.[source] || Object.values(imagesMetadata || {})[0]; @@ -86,7 +86,7 @@ const MarkdownImage = ({ height: originalSize.height, }; - const {height, width} = calculateDimensions(fileInfo.height, fileInfo.width, getViewPortWidth(isReplyPost, Device.IS_TABLET && !isSplitView)); + const {height, width} = calculateDimensions(fileInfo.height, fileInfo.width, getViewPortWidth(isReplyPost, isTablet)); const handleLinkPress = useCallback(() => { if (linkDestination) { diff --git a/app/components/post_list/post/body/content/image_preview/index.tsx b/app/components/post_list/post/body/content/image_preview/index.tsx index 7a6e7a717..8092e4151 100644 --- a/app/components/post_list/post/body/content/image_preview/index.tsx +++ b/app/components/post_list/post/body/content/image_preview/index.tsx @@ -13,10 +13,9 @@ import {getRedirectLocation} from '@actions/remote/general'; import FileIcon from '@components/post_list/post/body/files/file_icon'; import ProgressiveImage from '@components/progressive_image'; import TouchableWithFeedback from '@components/touchable_with_feedback'; -import {Device} from '@constants'; import {MM_TABLES, SYSTEM_IDENTIFIERS} from '@constants/database'; import {useServerUrl} from '@context/server_url'; -import {useSplitView} from '@hooks/device'; +import {useIsTablet} from '@hooks/device'; import useDidUpdate from '@hooks/did_update'; import {openGallerWithMockFile} from '@utils/gallery'; import {generateId} from '@utils/general'; @@ -56,10 +55,9 @@ const ImagePreview = ({expandedLink, isReplyPost, link, metadata, postId, theme} const serverUrl = useServerUrl(); const fileId = useRef(generateId()).current; const [imageUrl, setImageUrl] = useState(expandedLink || link); - const splitView = useSplitView(); - const tabletOffset = !splitView && Device.IS_TABLET; + const isTablet = useIsTablet(); const imageProps = metadata.images![link]; - const dimensions = calculateDimensions(imageProps.height, imageProps.width, getViewPortWidth(isReplyPost, tabletOffset)); + const dimensions = calculateDimensions(imageProps.height, imageProps.width, getViewPortWidth(isReplyPost, isTablet)); const onError = useCallback(() => { setError(true); diff --git a/app/components/post_list/post/body/content/message_attachments/attachment_image/index.tsx b/app/components/post_list/post/body/content/message_attachments/attachment_image/index.tsx index 34571369d..9ea824886 100644 --- a/app/components/post_list/post/body/content/message_attachments/attachment_image/index.tsx +++ b/app/components/post_list/post/body/content/message_attachments/attachment_image/index.tsx @@ -7,8 +7,7 @@ import {View} from 'react-native'; import FileIcon from '@components/post_list/post/body/files/file_icon'; import ProgressiveImage from '@components/progressive_image'; import TouchableWithFeedback from '@components/touchable_with_feedback'; -import {Device} from '@constants'; -import {useSplitView} from '@hooks/device'; +import {useIsTablet} from '@hooks/device'; import {openGallerWithMockFile} from '@utils/gallery'; import {generateId} from '@utils/general'; import {isGifTooLarge, calculateDimensions, getViewPortWidth} from '@utils/images'; @@ -49,9 +48,8 @@ export type Props = { const AttachmentImage = ({imageUrl, imageMetadata, postId, theme}: Props) => { const [error, setError] = useState(false); const fileId = useRef(generateId()).current; - const splitView = useSplitView(); - const tabletOffset = !splitView && Device.IS_TABLET; - const {height, width} = calculateDimensions(imageMetadata.height, imageMetadata.width, getViewPortWidth(false, tabletOffset)); + const isTablet = useIsTablet(); + const {height, width} = calculateDimensions(imageMetadata.height, imageMetadata.width, getViewPortWidth(false, isTablet)); const style = getStyleSheet(theme); const onError = useCallback(() => { diff --git a/app/components/post_list/post/body/content/opengraph/opengraph_image/index.tsx b/app/components/post_list/post/body/content/opengraph/opengraph_image/index.tsx index 79db5e087..cc55a6f65 100644 --- a/app/components/post_list/post/body/content/opengraph/opengraph_image/index.tsx +++ b/app/components/post_list/post/body/content/opengraph/opengraph_image/index.tsx @@ -44,7 +44,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => { const getViewPostWidth = (isReplyPost: boolean, deviceHeight: number, deviceWidth: number) => { const deviceSize = deviceWidth > deviceHeight ? deviceHeight : deviceWidth; const viewPortWidth = deviceSize - VIEWPORT_IMAGE_OFFSET - (isReplyPost ? VIEWPORT_IMAGE_REPLY_OFFSET : 0); - const tabletOffset = DeviceConstant.IS_TABLET ? ViewConstants.TABLET.SIDEBAR_WIDTH : 0; + const tabletOffset = DeviceConstant.IS_TABLET ? ViewConstants.TABLET_SIDEBAR_WIDTH : 0; return viewPortWidth - tabletOffset; }; diff --git a/app/components/post_list/post/body/content/youtube/index.tsx b/app/components/post_list/post/body/content/youtube/index.tsx index 65e105d52..15f78ea48 100644 --- a/app/components/post_list/post/body/content/youtube/index.tsx +++ b/app/components/post_list/post/body/content/youtube/index.tsx @@ -12,9 +12,8 @@ import {switchMap} from 'rxjs/operators'; import ProgressiveImage from '@components/progressive_image'; import TouchableWithFeedback from '@components/touchable_with_feedback'; -import {Device} from '@constants'; import {MM_TABLES, SYSTEM_IDENTIFIERS} from '@constants/database'; -import {useSplitView} from '@hooks/device'; +import {useIsTablet} from '@hooks/device'; import {emptyFunction} from '@utils/general'; import {calculateDimensions, getViewPortWidth} from '@utils/images'; import {getYouTubeVideoId, tryOpenURL} from '@utils/url'; @@ -54,14 +53,13 @@ const styles = StyleSheet.create({ const YouTube = ({googleDeveloperKey, isReplyPost, metadata}: YouTubeProps) => { const intl = useIntl(); - const splitView = useSplitView(); + const isTablet = useIsTablet(); const link = metadata.embeds![0].url; const videoId = getYouTubeVideoId(link); - const tabletOffset = !splitView && Device.IS_TABLET; const dimensions = calculateDimensions( MAX_YOUTUBE_IMAGE_HEIGHT, MAX_YOUTUBE_IMAGE_WIDTH, - getViewPortWidth(isReplyPost, tabletOffset), + getViewPortWidth(isReplyPost, isTablet), ); const getYouTubeTime = () => { diff --git a/app/components/post_list/post/body/files/index.tsx b/app/components/post_list/post/body/files/index.tsx index 145b39cd0..f3e773590 100644 --- a/app/components/post_list/post/body/files/index.tsx +++ b/app/components/post_list/post/body/files/index.tsx @@ -8,10 +8,9 @@ import {DeviceEventEmitter, StyleProp, StyleSheet, View, ViewStyle} from 'react- import {combineLatest, of as of$} from 'rxjs'; import {map, switchMap} from 'rxjs/operators'; -import {Device} from '@constants'; import {MM_TABLES, SYSTEM_IDENTIFIERS} from '@constants/database'; import {useServerUrl} from '@context/server_url'; -import {useSplitView} from '@hooks/device'; +import {useIsTablet} from '@hooks/device'; import NetworkManager from '@init/network_manager'; import {isGif, isImage} from '@utils/file'; import {openGalleryAtIndex} from '@utils/gallery'; @@ -57,7 +56,7 @@ const styles = StyleSheet.create({ const Files = ({authorId, canDownloadFiles, failed, files, isReplyPost, postId, theme}: FilesProps) => { const [inViewPort, setInViewPort] = useState(false); const serverUrl = useServerUrl(); - const isSplitView = useSplitView(); + const isTablet = useIsTablet(); const imageAttachments = useRef([]).current; const nonImageAttachments = useRef([]).current; const filesInfo: FileInfo[] = useMemo(() => files.map((f) => ({ @@ -141,7 +140,7 @@ const Files = ({authorId, canDownloadFiles, failed, files, isReplyPost, postId, theme={theme} isSingleImage={singleImage} nonVisibleImagesCount={nonVisibleImagesCount} - wrapperWidth={getViewPortWidth(isReplyPost, (!isSplitView && Device.IS_TABLET))} + wrapperWidth={getViewPortWidth(isReplyPost, isTablet)} inViewPort={inViewPort} /> @@ -155,8 +154,7 @@ const Files = ({authorId, canDownloadFiles, failed, files, isReplyPost, postId, } const visibleImages = imageAttachments.slice(0, MAX_VISIBLE_ROW_IMAGES); - const tabletOffset = !isSplitView && Device.IS_TABLET; - const portraitPostWidth = getViewPortWidth(isReplyPost, tabletOffset); + const portraitPostWidth = getViewPortWidth(isReplyPost, isTablet); let nonVisibleImagesCount; if (imageAttachments.length > MAX_VISIBLE_ROW_IMAGES) { diff --git a/app/components/server_version/index.tsx b/app/components/server_version/index.tsx index c555c0e68..2608540bd 100644 --- a/app/components/server_version/index.tsx +++ b/app/components/server_version/index.tsx @@ -8,7 +8,7 @@ import {useIntl} from 'react-intl'; import {of as of$} from 'rxjs'; import {map, switchMap} from 'rxjs/operators'; -import {View} from '@constants'; +import {SupportedServer} from '@constants'; import {MM_TABLES, SYSTEM_IDENTIFIERS} from '@constants/database'; import {isMinimumServerVersion} from '@utils/helpers'; import {unsupportedServer} from '@utils/supported_server'; @@ -32,7 +32,7 @@ const ServerVersion = ({version, roles}: ServerVersionProps) => { const serverVersion = version || ''; if (serverVersion) { - const {RequiredServer: {MAJOR_VERSION, MIN_VERSION, PATCH_VERSION}} = View; + const {MAJOR_VERSION, MIN_VERSION, PATCH_VERSION} = SupportedServer; const isSupportedServer = isMinimumServerVersion(serverVersion, MAJOR_VERSION, MIN_VERSION, PATCH_VERSION); if (!isSupportedServer) { diff --git a/app/components/status_bar/index.tsx b/app/components/status_bar/index.tsx deleted file mode 100644 index bda3598ae..000000000 --- a/app/components/status_bar/index.tsx +++ /dev/null @@ -1,23 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -import React from 'react'; -import {Platform, StatusBar as NativeStatusBar, StatusBarStyle} from 'react-native'; -import tinyColor from 'tinycolor2'; - -type StatusBarProps = { - theme: Theme; - headerColor?: string; -}; - -const StatusBar = ({theme, headerColor}: StatusBarProps) => { - const headerBarStyle = tinyColor(headerColor ?? theme.sidebarHeaderBg); - let barStyle: StatusBarStyle = 'light-content'; - if (headerBarStyle.isLight() && Platform.OS === 'ios') { - barStyle = 'dark-content'; - } - - return ; -}; - -export default StatusBar; diff --git a/app/components/team_sidebar/add_team/add_team.tsx b/app/components/team_sidebar/add_team/add_team.tsx index 297a3074f..3888ea3b7 100644 --- a/app/components/team_sidebar/add_team/add_team.tsx +++ b/app/components/team_sidebar/add_team/add_team.tsx @@ -8,9 +8,9 @@ import {OptionsModalPresentationStyle} from 'react-native-navigation'; import CompassIcon from '@components/compass_icon'; import TouchableWithFeedback from '@components/touchable_with_feedback'; -import {Device, Screens} from '@constants'; +import {Screens} from '@constants'; import {useTheme} from '@context/theme'; -import {useSplitView} from '@hooks/device'; +import {useIsTablet} from '@hooks/device'; import {showModal, showModalOverCurrentContext} from '@screens/navigation'; import {preventDoubleTap} from '@utils/tap'; import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme'; @@ -33,8 +33,7 @@ export default function AddTeam({canCreateTeams, otherTeams}: Props) { const styles = getStyleSheet(theme); const dimensions = useWindowDimensions(); const intl = useIntl(); - const isSplitView = useSplitView(); - const isTablet = Device.IS_TABLET && !isSplitView; + const isTablet = useIsTablet(); const maxHeight = Math.round((dimensions.height * 0.9)); const onPress = useCallback(preventDoubleTap(() => { diff --git a/app/constants/attachment.ts b/app/constants/attachment.ts deleted file mode 100644 index 24e7b843a..000000000 --- a/app/constants/attachment.ts +++ /dev/null @@ -1,10 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -export const ATTACHMENT_DOWNLOAD = 'attachment_download'; -export const MAX_ATTACHMENT_FOOTER_LENGTH = 300; - -export default { - ATTACHMENT_DOWNLOAD, - MAX_ATTACHMENT_FOOTER_LENGTH, -}; diff --git a/app/constants/device.ts b/app/constants/device.ts index d325a94a8..ea48d1ce7 100644 --- a/app/constants/device.ts +++ b/app/constants/device.ts @@ -1,27 +1,12 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import {Platform} from 'react-native'; import DeviceInfo from 'react-native-device-info'; import {FileSystem} from 'react-native-unimodules'; -import keyMirror from '@utils/key_mirror'; - -const device = keyMirror({ - CONNECTION_CHANGED: null, - DEVICE_DIMENSIONS_CHANGED: null, - DEVICE_TYPE_CHANGED: null, - DEVICE_ORIENTATION_CHANGED: null, - STATUSBAR_HEIGHT_CHANGED: null, -}); - export default { - ...device, DOCUMENTS_PATH: `${FileSystem.cacheDirectory}/Documents`, - IMAGES_PATH: `${FileSystem.cacheDirectory}/Images`, - IS_IPHONE_WITH_INSETS: Platform.OS === 'ios' && DeviceInfo.hasNotch(), IS_TABLET: DeviceInfo.isTablet(), PUSH_NOTIFY_ANDROID_REACT_NATIVE: 'android_rn', PUSH_NOTIFY_APPLE_REACT_NATIVE: 'apple_rn', - VIDEOS_PATH: `${FileSystem.cacheDirectory}/Videos`, }; diff --git a/app/constants/emoji.ts b/app/constants/emoji.ts index 5c94f7ad2..267b48c75 100644 --- a/app/constants/emoji.ts +++ b/app/constants/emoji.ts @@ -1,7 +1,6 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -export const ALL_EMOJIS = 'all_emojis'; export const MAX_ALLOWED_REACTIONS = 40; export const SORT_BY_NAME = 'name'; export const EMOJIS_PER_PAGE = 200; @@ -16,7 +15,6 @@ export const reEmoticon = /^(?:(:-?\))|(;-?\))|(:o)|(:-o)|(:-?])|(:-?d)|(x-d)|(: // before the next emoji by looking for any character that could start an emoji (:, ;, x, or <) export const reMain = /^[\s\S]+?(?=[:;x<]|$)/i; export default { - ALL_EMOJIS, MAX_ALLOWED_REACTIONS, SORT_BY_NAME, }; diff --git a/app/constants/events.ts b/app/constants/events.ts index 5e2cab4c0..fabed5d07 100644 --- a/app/constants/events.ts +++ b/app/constants/events.ts @@ -6,8 +6,11 @@ import keyMirror from '@utils/key_mirror'; export default keyMirror({ ACCOUNT_SELECT_TABLET_VIEW: null, CHANNEL_DELETED: null, + CONFIG_CHANGED: null, LEAVE_CHANNEL: null, LEAVE_TEAM: null, NOTIFICATION_ERROR: null, + SERVER_LOGOUT: null, + SERVER_VERSION_CHANGED: null, TEAM_LOAD_ERROR: null, }); diff --git a/app/constants/general.ts b/app/constants/general.ts index 7e9dc21a5..2fbe43d9f 100644 --- a/app/constants/general.ts +++ b/app/constants/general.ts @@ -2,59 +2,21 @@ // See LICENSE.txt for license information. export default { - CONFIG_CHANGED: 'config_changed', - SERVER_VERSION_CHANGED: 'server_version_changed', PAGE_SIZE_DEFAULT: 60, - PAGE_SIZE_MAXIMUM: 200, - LOGS_PAGE_SIZE_DEFAULT: 10000, - PROFILE_CHUNK_SIZE: 100, - CHANNELS_CHUNK_SIZE: 50, POST_CHUNK_SIZE: 60, - TEAMS_CHUNK_SIZE: 50, - SEARCH_TIMEOUT_MILLISECONDS: 100, STATUS_INTERVAL: 60000, AUTOCOMPLETE_LIMIT_DEFAULT: 25, - AUTOCOMPLETE_SPLIT_CHARACTERS: ['.', '-', '_'], MENTION: 'mention', OUT_OF_OFFICE: 'ooo', OFFLINE: 'offline', AWAY: 'away', ONLINE: 'online', DND: 'dnd', - PERMISSIONS_ALL: 'all', - PERMISSIONS_CHANNEL_ADMIN: 'channel_admin', - PERMISSIONS_TEAM_ADMIN: 'team_admin', - PERMISSIONS_SYSTEM_ADMIN: 'system_admin', - TEAM_GUEST_ROLE: 'team_guest', - TEAM_USER_ROLE: 'team_user', - TEAM_ADMIN_ROLE: 'team_admin', - CHANNEL_GUEST_ROLE: 'channel_guest', - CHANNEL_USER_ROLE: 'channel_user', - CHANNEL_ADMIN_ROLE: 'channel_admin', - SYSTEM_GUEST_ROLE: 'system_guest', - SYSTEM_USER_ROLE: 'system_user', - SYSTEM_ADMIN_ROLE: 'system_admin', - SYSTEM_USER_ACCESS_TOKEN_ROLE: 'system_user_access_token', - SYSTEM_POST_ALL_ROLE: 'system_post_all', - SYSTEM_POST_ALL_PUBLIC_ROLE: 'system_post_all_public', - ALLOW_EDIT_POST_ALWAYS: 'always', - ALLOW_EDIT_POST_NEVER: 'never', - ALLOW_EDIT_POST_TIME_LIMIT: 'time_limit', - DEFAULT_POST_EDIT_TIME_LIMIT: 300, - RESTRICT_DIRECT_MESSAGE_ANY: 'any', - RESTRICT_DIRECT_MESSAGE_TEAM: 'team', - SWITCH_TO_DEFAULT_CHANNEL: 'switch_to_default_channel', - REMOVED_FROM_CHANNEL: 'removed_from_channel', DEFAULT_CHANNEL: 'town-square', DM_CHANNEL: 'D', OPEN_CHANNEL: 'O', PRIVATE_CHANNEL: 'P', GM_CHANNEL: 'G', - PUSH_NOTIFY_APPLE_REACT_NATIVE: 'apple_rn', - PUSH_NOTIFY_ANDROID_REACT_NATIVE: 'android_rn', - STORE_REHYDRATION_COMPLETE: 'store_hydration_complete', - OFFLINE_STORE_RESET: 'offline_store_reset', - OFFLINE_STORE_PURGE: 'offline_store_purge', TEAMMATE_NAME_DISPLAY: { SHOW_USERNAME: 'username', SHOW_NICKNAME_FULLNAME: 'nickname_full_name', @@ -64,10 +26,8 @@ export default { MAX_USERS_IN_GM: 8, MIN_USERS_IN_GM: 3, MAX_GROUP_CHANNELS_FOR_PROFILES: 50, - DEFAULT_LOCALE: 'en', DEFAULT_AUTOLINKED_URL_SCHEMES: ['http', 'https', 'ftp', 'mailto', 'tel', 'mattermost'], DISABLED: 'disabled', DEFAULT_ON: 'default_on', DEFAULT_OFF: 'default_off', - SERVER_LOGOUT: 'server_logout', }; diff --git a/app/constants/index.ts b/app/constants/index.ts index b1bcc2fbc..cd3888aea 100644 --- a/app/constants/index.ts +++ b/app/constants/index.ts @@ -3,7 +3,6 @@ import ActionType from './action_type'; import Apps from './apps'; -import Attachment from './attachment'; import {CustomStatusDuration} from './custom_status'; import Database from './database'; import DeepLink from './deep_linking'; @@ -12,21 +11,20 @@ import Emoji from './emoji'; import Events from './events'; import Files from './files'; import General from './general'; -import List from './list'; import Navigation from './navigation'; import Network from './network'; import Permissions from './permissions'; import Post from './post'; import Preferences from './preferences'; import Screens from './screens'; -import SSO, {REDIRECT_URL_SCHEME, REDIRECT_URL_SCHEME_DEV} from './sso'; -import View, {Upgrade} from './view'; +import Sso from './sso'; +import SupportedServer from './supported_server'; +import View from './view'; import WebsocketEvents from './websocket'; export { ActionType, Apps, - Attachment, CustomStatusDuration, Database, DeepLink, @@ -35,17 +33,14 @@ export { Events, Files, General, - List, Navigation, Network, Permissions, Post, Preferences, - REDIRECT_URL_SCHEME, - REDIRECT_URL_SCHEME_DEV, - SSO, Screens, - Upgrade, + SupportedServer, + Sso, View, WebsocketEvents, }; diff --git a/app/constants/list.ts b/app/constants/list.ts deleted file mode 100644 index 72a8fb14c..000000000 --- a/app/constants/list.ts +++ /dev/null @@ -1,13 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -const VISIBILITY_CONFIG_DEFAULTS = { - itemVisiblePercentThreshold: 100, - waitForInteraction: false, -}; - -export default { - VISIBILITY_CONFIG_DEFAULTS, - VISIBILITY_SCROLL_DOWN: 'down', - VISIBILITY_SCROLL_UP: 'up', -}; diff --git a/app/constants/navigation.ts b/app/constants/navigation.ts index ec52c20ff..e18d7463a 100644 --- a/app/constants/navigation.ts +++ b/app/constants/navigation.ts @@ -6,11 +6,8 @@ import keyMirror from '@utils/key_mirror'; const Navigation = keyMirror({ NAVIGATION_CLOSE_MODAL: null, NAVIGATION_HOME: null, - NAVIGATION_NO_TEAMS: null, - NAVIGATION_ERROR_TEAMS: null, NAVIGATION_SHOW_OVERLAY: null, NAVIGATION_DISMISS_AND_POP_TO_ROOT: null, - BLUR_POST_DRAFT: null, }); export default Navigation; diff --git a/app/constants/permissions.ts b/app/constants/permissions.ts index c42119734..b568d9f82 100644 --- a/app/constants/permissions.ts +++ b/app/constants/permissions.ts @@ -1,6 +1,28 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. export default { + PERMISSIONS_ALL: 'all', + PERMISSIONS_CHANNEL_ADMIN: 'channel_admin', + PERMISSIONS_TEAM_ADMIN: 'team_admin', + PERMISSIONS_SYSTEM_ADMIN: 'system_admin', + TEAM_GUEST_ROLE: 'team_guest', + TEAM_USER_ROLE: 'team_user', + TEAM_ADMIN_ROLE: 'team_admin', + CHANNEL_GUEST_ROLE: 'channel_guest', + CHANNEL_USER_ROLE: 'channel_user', + CHANNEL_ADMIN_ROLE: 'channel_admin', + SYSTEM_GUEST_ROLE: 'system_guest', + SYSTEM_USER_ROLE: 'system_user', + SYSTEM_ADMIN_ROLE: 'system_admin', + SYSTEM_USER_ACCESS_TOKEN_ROLE: 'system_user_access_token', + SYSTEM_POST_ALL_ROLE: 'system_post_all', + SYSTEM_POST_ALL_PUBLIC_ROLE: 'system_post_all_public', + ALLOW_EDIT_POST_ALWAYS: 'always', + ALLOW_EDIT_POST_NEVER: 'never', + ALLOW_EDIT_POST_TIME_LIMIT: 'time_limit', + DEFAULT_POST_EDIT_TIME_LIMIT: 300, + RESTRICT_DIRECT_MESSAGE_ANY: 'any', + RESTRICT_DIRECT_MESSAGE_TEAM: 'team', INVITE_USER: 'invite_user', ADD_USER_TO_TEAM: 'add_user_to_team', USE_SLASH_COMMANDS: 'use_slash_commands', diff --git a/app/constants/post_draft.ts b/app/constants/post_draft.ts deleted file mode 100644 index e41da7af1..000000000 --- a/app/constants/post_draft.ts +++ /dev/null @@ -1,36 +0,0 @@ -// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. -// See LICENSE.txt for license information. - -export const ACCESSORIES_CONTAINER_NATIVE_ID = 'channelAccessoriesContainer'; -export const CHANNEL_POST_TEXTBOX_CURSOR_CHANGE = 'onChannelTextBoxCursorChange'; -export const CHANNEL_POST_TEXTBOX_VALUE_CHANGE = 'onChannelTextBoxValueChange'; -export const ICON_SIZE = 24; -export const INSERT_TO_COMMENT = 'insert_to_comment'; -export const INSERT_TO_DRAFT = 'insert_to_draft'; -export const IS_REACTION_REGEX = /(^\+:([^:\s]*):)$/i; -export const MAX_FILE_COUNT = 5; -export const MAX_FILE_COUNT_WARNING = 'onMaxFileCountWarning'; -export const MAX_MESSAGE_LENGTH_FALLBACK = 4000; -export const PASTE_FILES = 'onPasteFiles'; -export const TYPING_HEIGHT = 18; -export const TYPING_VISIBLE = 'typingVisible'; -export const UPDATE_NATIVE_SCROLLVIEW = 'onUpdateNativeScrollView'; -export const UPLOAD_FILES = 'onUploadFiles'; - -export default { - ACCESSORIES_CONTAINER_NATIVE_ID, - CHANNEL_POST_TEXTBOX_CURSOR_CHANGE, - CHANNEL_POST_TEXTBOX_VALUE_CHANGE, - ICON_SIZE, - INSERT_TO_COMMENT, - INSERT_TO_DRAFT, - IS_REACTION_REGEX, - MAX_FILE_COUNT, - MAX_FILE_COUNT_WARNING, - MAX_MESSAGE_LENGTH_FALLBACK, - PASTE_FILES, - TYPING_HEIGHT, - TYPING_VISIBLE, - UPDATE_NATIVE_SCROLLVIEW, - UPLOAD_FILES, -}; diff --git a/app/constants/sso.ts b/app/constants/sso.ts index cfaac0a55..d743bff64 100644 --- a/app/constants/sso.ts +++ b/app/constants/sso.ts @@ -6,10 +6,16 @@ import keyMirror from '@utils/key_mirror'; export const REDIRECT_URL_SCHEME = 'mmauth://'; export const REDIRECT_URL_SCHEME_DEV = 'mmauthbeta://'; -export default keyMirror({ +const constants = keyMirror({ GITLAB: null, GOOGLE: null, OFFICE365: null, OPENID: null, SAML: null, }); + +export default { + ...constants, + REDIRECT_URL_SCHEME, + REDIRECT_URL_SCHEME_DEV, +}; diff --git a/app/constants/supported_server.ts b/app/constants/supported_server.ts new file mode 100644 index 000000000..312939494 --- /dev/null +++ b/app/constants/supported_server.ts @@ -0,0 +1,14 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +export const FULL_VERSION = '6.0.0'; +export const MAJOR_VERSION = 0; +export const MIN_VERSION = 0; +export const PATCH_VERSION = 0; + +export default { + FULL_VERSION, + MAJOR_VERSION, + MIN_VERSION, + PATCH_VERSION, +}; diff --git a/app/constants/view.ts b/app/constants/view.ts index 5f225a8c6..ad51205dd 100644 --- a/app/constants/view.ts +++ b/app/constants/view.ts @@ -1,144 +1,18 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import DeviceInfo from 'react-native-device-info'; - -import keyMirror from '@utils/key_mirror'; - -// The iPhone 11 and iPhone 11 Pro Max have a navbar height of 44 and iPhone 11 Pro has 32 -const IPHONE_11_LANDSCAPE_HEIGHT = ['iPhone 11', 'iPhone 11 Pro Max']; - -export const Upgrade = { - CAN_UPGRADE: 'can_upgrade', - MUST_UPGRADE: 'must_upgrade', - NO_UPGRADE: 'no_upgrade', - IS_BETA: 'is_beta', -}; - -export const SidebarSectionTypes = { - UNREADS: 'unreads', - FAVORITE: 'favorite', - PUBLIC: 'public', - PRIVATE: 'private', - DIRECT: 'direct', - RECENT_ACTIVITY: 'recent', - ALPHA: 'alpha', -}; - -export const NotificationLevels = { - DEFAULT: 'default', - ALL: 'all', - MENTION: 'mention', - NONE: 'none', -}; - -export const NOTIFY_ALL_MEMBERS = 5; -export const INDICATOR_BAR_HEIGHT = 38; - -export const CHANNEL_ITEM_LARGE_BADGE_MAX_WIDTH = 38; -export const CHANNEL_ITEM_SMALL_BADGE_MAX_WIDTH = 32; -export const LARGE_BADGE_MAX_WIDTH = 30; -export const SMALL_BADGE_MAX_WIDTH = 26; -export const MAX_BADGE_RIGHT_POSITION = -13; -export const LARGE_BADGE_RIGHT_POSITION = -11; -export const SMALL_BADGE_RIGHT_POSITION = -9; -export const TEAM_SIDEBAR_WIDTH = 72; export const BOTTOM_TAB_ICON_SIZE = 31.2; - -export const TABLET = { - SIDEBAR_WIDTH: 320, -}; - -const ViewTypes = keyMirror({ - DATA_CLEANUP: null, - SERVER_URL_CHANGED: null, - - POST_DRAFT_CHANGED: null, - COMMENT_DRAFT_CHANGED: null, - SEARCH_DRAFT_CHANGED: null, - - POST_DRAFT_SELECTION_CHANGED: null, - COMMENT_DRAFT_SELECTION_CHANGED: null, - - SET_POST_DRAFT: null, - SET_COMMENT_DRAFT: null, - - SET_TEMP_UPLOAD_FILES_FOR_POST_DRAFT: null, - RETRY_UPLOAD_FILE_FOR_POST: null, - - CLEAR_FILES_FOR_POST_DRAFT: null, - CLEAR_FAILED_FILES_FOR_POST_DRAFT: null, - - REMOVE_FILE_FROM_POST_DRAFT: null, - REMOVE_LAST_FILE_FROM_POST_DRAFT: null, - - SET_CHANNEL_LOADER: null, - SET_CHANNEL_REFRESHING: null, - SET_CHANNEL_RETRY_FAILED: null, - SET_CHANNEL_DISPLAY_NAME: null, - - REMOVE_LAST_CHANNEL_FOR_TEAM: null, - - SET_INITIAL_POST_VISIBILITY: null, - RECEIVED_FOCUSED_POST: null, - LOADING_POSTS: null, - SET_LOAD_MORE_POSTS_VISIBLE: null, - - RECEIVED_POSTS_FOR_CHANNEL_AT_TIME: null, - - SET_LAST_UPGRADE_CHECK: null, - - ADD_RECENT_EMOJI: null, - ANNOUNCEMENT_BANNER: null, - - INCREMENT_EMOJI_PICKER_PAGE: null, - - SET_DEEP_LINK_URL: null, - - SET_PROFILE_IMAGE_URI: null, - - SELECTED_ACTION_MENU: null, - SUBMIT_ATTACHMENT_MENU_ACTION: null, - - PORTRAIT: null, - LANDSCAPE: null, - - INDICATOR_BAR_VISIBLE: null, - - CHANNEL_NAV_BAR_CHANGED: null, - -}); - -const RequiredServer = { - FULL_VERSION: 5.25, - MAJOR_VERSION: 5, - MIN_VERSION: 25, - PATCH_VERSION: 0, -}; +export const PROFILE_PICTURE_SIZE = 32; +export const PROFILE_PICTURE_EMOJI_SIZE = 28; +export const TABLET_SIDEBAR_WIDTH = 320; +export const TEAM_SIDEBAR_WIDTH = 72; export default { - ...ViewTypes, - RequiredServer, BOTTOM_TAB_ICON_SIZE, - FEATURE_TOGGLE_PREFIX: 'feature_enabled_', - EMBED_PREVIEW: 'embed_preview', - LINK_PREVIEW_DISPLAY: 'link_previews', - MIN_CHANNELNAME_LENGTH: 2, - MAX_CHANNELNAME_LENGTH: 64, - ANDROID_TOP_LANDSCAPE: 46, - ANDROID_TOP_PORTRAIT: 56, - IOS_TOP_LANDSCAPE: IPHONE_11_LANDSCAPE_HEIGHT.includes(DeviceInfo.getModel()) ? 44 : 32, - IOS_TOP_PORTRAIT: 64, - IOS_INSETS_TOP_PORTRAIT: 88, - STATUS_BAR_HEIGHT: 20, - PROFILE_PICTURE_SIZE: 32, - PROFILE_PICTURE_EMOJI_SIZE: 28, + PROFILE_PICTURE_SIZE, + PROFILE_PICTURE_EMOJI_SIZE, DATA_SOURCE_USERS: 'users', DATA_SOURCE_CHANNELS: 'channels', - NotificationLevels, - SidebarSectionTypes, - IOS_HORIZONTAL_LANDSCAPE: 44, - INDICATOR_BAR_HEIGHT, - TABLET, + TABLET_SIDEBAR_WIDTH, TEAM_SIDEBAR_WIDTH, }; diff --git a/app/context/theme/index.tsx b/app/context/theme/index.tsx index da67ad930..b225c2d99 100644 --- a/app/context/theme/index.tsx +++ b/app/context/theme/index.tsx @@ -56,7 +56,13 @@ const ThemeProvider = ({currentTeamId, children, themes}: Props) => { } } - return getDefaultThemeByAppearance(); + const defaultTheme = getDefaultThemeByAppearance(); + EphemeralStore.theme = defaultTheme; + requestAnimationFrame(() => { + setNavigationStackStyles(defaultTheme); + }); + + return defaultTheme; }; useEffect(() => { diff --git a/app/init/global_event_handler.ts b/app/init/global_event_handler.ts index 19d7ba2af..c1f419b71 100644 --- a/app/init/global_event_handler.ts +++ b/app/init/global_event_handler.ts @@ -8,7 +8,7 @@ import semver from 'semver'; import {selectAllMyChannelIds} from '@actions/local/channel'; import {fetchConfigAndLicense} from '@actions/remote/systems'; import LocalConfig from '@assets/config.json'; -import {General, REDIRECT_URL_SCHEME, REDIRECT_URL_SCHEME_DEV} from '@constants'; +import {Events, Sso} from '@constants'; import DatabaseManager from '@database/manager'; import {DEFAULT_LOCALE, getTranslations, resetMomentLocale, t} from '@i18n'; import * as analytics from '@init/analytics'; @@ -18,6 +18,7 @@ import NetworkManager from '@init/network_manager'; import PushNotifications from '@init/push_notifications'; import WebsocketManager from '@init/websocket_manager'; import {queryCurrentUser} from '@queries/servers/user'; +import EphemeralStore from '@store/ephemeral_store'; import {LaunchType} from '@typings/launch'; import {deleteFileCache} from '@utils/file'; @@ -27,9 +28,9 @@ class GlobalEventHandler { JavascriptAndNativeErrorHandler: jsAndNativeErrorHandler | undefined; constructor() { - DeviceEventEmitter.addListener(General.SERVER_LOGOUT, this.onLogout); - DeviceEventEmitter.addListener(General.SERVER_VERSION_CHANGED, this.onServerVersionChanged); - DeviceEventEmitter.addListener(General.CONFIG_CHANGED, this.onServerConfigChanged); + DeviceEventEmitter.addListener(Events.SERVER_LOGOUT, this.onLogout); + DeviceEventEmitter.addListener(Events.SERVER_VERSION_CHANGED, this.onServerVersionChanged); + DeviceEventEmitter.addListener(Events.CONFIG_CHANGED, this.onServerConfigChanged); Linking.addEventListener('url', this.onDeepLink); } @@ -51,7 +52,7 @@ class GlobalEventHandler { }; onDeepLink = (event: LinkingCallbackArg) => { - if (event.url?.startsWith(REDIRECT_URL_SCHEME) || event.url?.startsWith(REDIRECT_URL_SCHEME_DEV)) { + if (event.url?.startsWith(Sso.REDIRECT_URL_SCHEME) || event.url?.startsWith(Sso.REDIRECT_URL_SCHEME_DEV)) { return; } @@ -101,6 +102,11 @@ class GlobalEventHandler { this.resetLocale(); this.clearCookiesForServer(serverUrl); deleteFileCache(serverUrl); + + if (!Object.keys(DatabaseManager.serverDatabases).length) { + EphemeralStore.theme = undefined; + } + relaunchApp({launchType: LaunchType.Normal}, true); }; diff --git a/app/init/push_notifications.ts b/app/init/push_notifications.ts index dc6ee79ba..7fd796c7b 100644 --- a/app/init/push_notifications.ts +++ b/app/init/push_notifications.ts @@ -17,7 +17,7 @@ import { import {markChannelAsViewed} from '@actions/local/channel'; import {backgroundNotification, openNotification} from '@actions/remote/notifications'; import EphemeralStore from '@app/store/ephemeral_store'; -import {Device, General, Navigation, Screens} from '@constants'; +import {Device, Events, Navigation, Screens} from '@constants'; import {GLOBAL_IDENTIFIERS} from '@constants/database'; import DatabaseManager from '@database/manager'; import {DEFAULT_LOCALE, getLocalizedMessage, t} from '@i18n'; @@ -187,7 +187,7 @@ class PushNotifications { const serverUrl = await this.getServerUrlFromNotification(notification); if (serverUrl) { - DeviceEventEmitter.emit(General.SERVER_LOGOUT, serverUrl); + DeviceEventEmitter.emit(Events.SERVER_LOGOUT, serverUrl); } } diff --git a/app/screens/about/index.tsx b/app/screens/about/index.tsx index d4aaafadc..60b8defc6 100644 --- a/app/screens/about/index.tsx +++ b/app/screens/about/index.tsx @@ -13,7 +13,6 @@ import Config from '@assets/config.json'; import AppVersion from '@components/app_version'; import CompassIcon from '@components/compass_icon'; import FormattedText from '@components/formatted_text'; -import StatusBar from '@components/status_bar'; import AboutLinks from '@constants/about_links'; import {MM_TABLES, SYSTEM_IDENTIFIERS} from '@constants/database'; import {useTheme} from '@context/theme'; @@ -175,7 +174,6 @@ const ConnectedAbout = ({config, license}: ConnectedAboutProps) => { style={style.container} testID='about.screen' > - { const BottomSheetContent = ({buttonText, buttonIcon, children, onPress, showButton, showTitle, title}: Props) => { const dimensions = useWindowDimensions(); const theme = useTheme(); - const isSplitView = useSplitView(); - const isTablet = Device.IS_TABLET && !isSplitView; + const isTablet = useIsTablet(); const styles = getStyleSheet(theme); const separatorWidth = Math.max(dimensions.width, 450); diff --git a/app/screens/bottom_sheet/index.tsx b/app/screens/bottom_sheet/index.tsx index 106d5038f..d55e84a1a 100644 --- a/app/screens/bottom_sheet/index.tsx +++ b/app/screens/bottom_sheet/index.tsx @@ -9,9 +9,9 @@ import Animated from 'react-native-reanimated'; import RNBottomSheet from 'reanimated-bottom-sheet'; import {changeOpacity, makeStyleSheetFromTheme} from '@app/utils/theme'; -import {Device, Navigation} from '@constants'; +import {Navigation} from '@constants'; import {useTheme} from '@context/theme'; -import {useSplitView} from '@hooks/device'; +import {useIsTablet} from '@hooks/device'; import {dismissModal} from '@screens/navigation'; import {hapticFeedback} from '@utils/general'; @@ -27,8 +27,7 @@ type SlideUpPanelProps = { const BottomSheet = ({closeButtonId, initialSnapIndex = 0, renderContent, snapPoints = ['90%', '50%', 50]}: SlideUpPanelProps) => { const sheetRef = useRef(null); const dimensions = useWindowDimensions(); - const isSplitView = useSplitView(); - const isTablet = Device.IS_TABLET && !isSplitView; + const isTablet = useIsTablet(); const theme = useTheme(); const lastSnap = snapPoints.length - 1; diff --git a/app/screens/channel/channel_nav_bar/index.tsx b/app/screens/channel/channel_nav_bar/index.tsx index e33634971..5643a16c2 100644 --- a/app/screens/channel/channel_nav_bar/index.tsx +++ b/app/screens/channel/channel_nav_bar/index.tsx @@ -4,13 +4,11 @@ import {withDatabase} from '@nozbe/watermelondb/DatabaseProvider'; import withObservables from '@nozbe/with-observables'; import React from 'react'; -import {DeviceEventEmitter, LayoutChangeEvent, Platform, useWindowDimensions, View} from 'react-native'; -import {useSafeAreaInsets} from 'react-native-safe-area-context'; +import {Platform} from 'react-native'; +import {SafeAreaView} from 'react-native-safe-area-context'; -import {Device, View as ViewConstants} from '@constants'; import {MM_TABLES} from '@constants/database'; import {useTheme} from '@context/theme'; -import {useSplitView} from '@hooks/device'; import {makeStyleSheetFromTheme} from '@utils/theme'; import ChannelTitle from './channel_title'; @@ -23,66 +21,23 @@ type ChannelNavBar = { onPress: () => void; } +// Todo: Create common NavBar: See Gekidou & Mobile v2 task Board const ChannelNavBar = ({channel, onPress}: ChannelNavBar) => { - const insets = useSafeAreaInsets(); const theme = useTheme(); - const isSplitView = useSplitView(); const style = getStyleFromTheme(theme); - const dimensions = useWindowDimensions(); - const isLandscape = dimensions.width > dimensions.height; - - let height = 0; - let paddingTop = 0; - let canHaveSubtitle = true; - - const onLayout = ({nativeEvent}: LayoutChangeEvent) => { - const {height: layoutHeight} = nativeEvent.layout; - if (height !== layoutHeight && Platform.OS === 'ios') { - height = layoutHeight; - } - - DeviceEventEmitter.emit(ViewConstants.CHANNEL_NAV_BAR_CHANGED, layoutHeight); - }; - - switch (Platform.OS) { - case 'android': - height = ViewConstants.ANDROID_TOP_PORTRAIT; - if (Device.IS_TABLET) { - height = ViewConstants.ANDROID_TOP_LANDSCAPE; - } - break; - case 'ios': - height = ViewConstants.IOS_TOP_PORTRAIT - ViewConstants.STATUS_BAR_HEIGHT; - if (Device.IS_TABLET && isLandscape) { - height -= 1; - } else if (isLandscape) { - height = ViewConstants.IOS_TOP_LANDSCAPE; - canHaveSubtitle = false; - } - - if (Device.IS_IPHONE_WITH_INSETS && isLandscape) { - canHaveSubtitle = false; - } - break; - } - - if (!Device.IS_TABLET || (Device.IS_TABLET && isSplitView)) { - height += insets.top; - paddingTop = insets.top; - } - return ( - - + ); }; @@ -96,9 +51,11 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme) => { ...Platform.select({ android: { elevation: 10, + height: 56, }, ios: { zIndex: 10, + height: 88, }, }), }, diff --git a/app/screens/channel/index.tsx b/app/screens/channel/index.tsx index f4e4a6d0b..6947381fd 100644 --- a/app/screens/channel/index.tsx +++ b/app/screens/channel/index.tsx @@ -12,7 +12,6 @@ import {map} from 'rxjs/operators'; import {logout} from '@actions/remote/session'; import PostList from '@components/post_list'; import ServerVersion from '@components/server_version'; -import StatusBar from '@components/status_bar'; import {Screens, Database} from '@constants'; import {useServerUrl} from '@context/server_url'; import {useTheme} from '@context/theme'; @@ -130,7 +129,6 @@ const Channel = ({currentChannelId, currentTeamId, time}: ChannelProps) => { edges={['left', 'right', 'bottom']} > - {renderComponent} ); diff --git a/app/screens/custom_status/index.tsx b/app/screens/custom_status/index.tsx index cd89eae60..cf90380bc 100644 --- a/app/screens/custom_status/index.tsx +++ b/app/screens/custom_status/index.tsx @@ -15,7 +15,6 @@ import {switchMap, catchError} from 'rxjs/operators'; import {updateLocalCustomStatus} from '@actions/local/user'; import {removeRecentCustomStatus, updateCustomStatus, unsetCustomStatus} from '@actions/remote/user'; import CompassIcon from '@components/compass_icon'; -import StatusBar from '@components/status_bar'; import TabletTitle from '@components/tablet_title'; import {CustomStatusDuration, Events, Screens} from '@constants'; import {SET_CUSTOM_STATUS_FAILURE} from '@constants/custom_status'; @@ -344,7 +343,6 @@ class CustomStatusModal extends NavigationComponent { keyboardDismissMode='none' keyboardShouldPersistTaps='always' > - { style={style.container} testID='clear_after.screen' > - {this.renderClearAfterMenu()} diff --git a/app/screens/home/account/components/options/index.tsx b/app/screens/home/account/components/options/index.tsx index 0456906e4..5edadfef7 100644 --- a/app/screens/home/account/components/options/index.tsx +++ b/app/screens/home/account/components/options/index.tsx @@ -51,7 +51,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme: Theme) => { const AccountOptions = ({user, enableCustomUserStatuses, isCustomStatusExpirySupported, isTablet, theme}: AccountScreenProps) => { const styles = getStyleSheet(theme); const dimensions = useWindowDimensions(); - const width = dimensions.width - (isTablet ? ViewConstants.TABLET.SIDEBAR_WIDTH : 0); + const width = dimensions.width - (isTablet ? ViewConstants.TABLET_SIDEBAR_WIDTH : 0); return ( {isTablet && } - ({ const ChannelListScreen = (props: ChannelProps) => { const theme = useTheme(); const styles = getStyleSheet(theme); - const isSplitView = useSplitView(); - const showTabletLayout = Device.IS_TABLET && !isSplitView; + const isTablet = useIsTablet(); const route = useRoute(); const isFocused = useIsFocused(); const insets = useSafeAreaInsets(); const params = route.params as {direction: string}; let tabletSidebarStyle; - if (showTabletLayout) { - const {TABLET, TEAM_SIDEBAR_WIDTH} = ViewConstants; - tabletSidebarStyle = {maxWidth: (TABLET.SIDEBAR_WIDTH - TEAM_SIDEBAR_WIDTH)}; + if (isTablet) { + const {TABLET_SIDEBAR_WIDTH, TEAM_SIDEBAR_WIDTH} = ViewConstants; + tabletSidebarStyle = {maxWidth: (TABLET_SIDEBAR_WIDTH - TEAM_SIDEBAR_WIDTH)}; } const animated = useAnimatedStyle(() => { @@ -92,7 +91,7 @@ const ChannelListScreen = (props: ChannelProps) => { {'Channel List'} - {showTabletLayout && + {isTablet && } diff --git a/app/screens/login/index.tsx b/app/screens/login/index.tsx index 15135fdd1..f4982a165 100644 --- a/app/screens/login/index.tsx +++ b/app/screens/login/index.tsx @@ -9,7 +9,6 @@ import { InteractionManager, Keyboard, SafeAreaView, - StatusBar, StyleProp, Text, TextInput, @@ -321,7 +320,6 @@ const Login: NavigationFunctionComponent = ({config, extra, launchError, launchT return ( - { @@ -14,7 +14,7 @@ const GitLabOption = ({config, onPress, theme}: LoginOptionWithConfigProps) => { const forceHideFromLocal = LocalConfig.HideGitLabLoginExperimental; const handlePress = () => { - onPress(SSO.GITLAB); + onPress(Sso.GITLAB); }; if (!forceHideFromLocal && config.EnableSignUpWithGitLab === 'true') { diff --git a/app/screens/login_options/google.tsx b/app/screens/login_options/google.tsx index 6879014cd..8568417c4 100644 --- a/app/screens/login_options/google.tsx +++ b/app/screens/login_options/google.tsx @@ -6,14 +6,14 @@ import {Image} from 'react-native'; import Button from 'react-native-button'; import FormattedText from '@components/formatted_text'; -import {SSO} from '@constants'; +import {Sso} from '@constants'; import {makeStyleSheetFromTheme} from '@utils/theme'; const GoogleOption = ({config, onPress, theme}: LoginOptionWithConfigProps) => { const styles = getStyleSheet(theme); const handlePress = () => { - onPress(SSO.GOOGLE); + onPress(Sso.GOOGLE); }; if (config.EnableSignUpWithGoogle === 'true') { diff --git a/app/screens/login_options/index.tsx b/app/screens/login_options/index.tsx index ddcb603a9..c475dd586 100644 --- a/app/screens/login_options/index.tsx +++ b/app/screens/login_options/index.tsx @@ -3,7 +3,7 @@ import React from 'react'; import {useIntl} from 'react-intl'; -import {Image, ScrollView, StatusBar, Text} from 'react-native'; +import {Image, ScrollView, Text} from 'react-native'; import {NavigationFunctionComponent} from 'react-native-navigation'; import {SafeAreaView} from 'react-native-safe-area-context'; @@ -83,7 +83,6 @@ const LoginOptions: NavigationFunctionComponent = ({config, extra, launchType, l style={styles.container} contentContainerStyle={styles.innerContainer} > - { @@ -16,7 +16,7 @@ const Office365Option = ({config, license, onPress, theme}: LoginOptionWithConfi license.Office365OAuth === 'true'; const handlePress = () => { - onPress(SSO.OFFICE365); + onPress(Sso.OFFICE365); }; if (!forceHideFromLocal && o365Enabled) { diff --git a/app/screens/login_options/open_id.tsx b/app/screens/login_options/open_id.tsx index 2392d17d4..b25110844 100644 --- a/app/screens/login_options/open_id.tsx +++ b/app/screens/login_options/open_id.tsx @@ -5,7 +5,7 @@ import React from 'react'; import Button from 'react-native-button'; import FormattedText from '@components/formatted_text'; -import {SSO} from '@constants'; +import {Sso} from '@constants'; import {isMinimumServerVersion} from '@utils/helpers'; import {makeStyleSheetFromTheme} from '@utils/theme'; @@ -14,7 +14,7 @@ const OpenIdOption = ({config, license, onPress, theme}: LoginOptionWithConfigAn const openIdEnabled = config.EnableSignUpWithOpenId === 'true' && license.IsLicensed === 'true' && isMinimumServerVersion(config.Version, 5, 33, 0); const handlePress = () => { - onPress(SSO.OPENID); + onPress(Sso.OPENID); }; if (openIdEnabled) { diff --git a/app/screens/login_options/saml.tsx b/app/screens/login_options/saml.tsx index 2a3a372ed..c799e9753 100644 --- a/app/screens/login_options/saml.tsx +++ b/app/screens/login_options/saml.tsx @@ -6,7 +6,7 @@ import {Text} from 'react-native'; import Button from 'react-native-button'; import LocalConfig from '@assets/config.json'; -import {SSO} from '@constants'; +import {Sso} from '@constants'; import {makeStyleSheetFromTheme} from '@utils/theme'; const SamlOption = ({config, license, onPress, theme}: LoginOptionWithConfigAndLicenseProps) => { @@ -15,7 +15,7 @@ const SamlOption = ({config, license, onPress, theme}: LoginOptionWithConfigAndL const enabled = config.EnableSaml === 'true' && license.IsLicensed === 'true' && license.SAML === 'true'; const handlePress = () => { - onPress(SSO.SAML); + onPress(Sso.SAML); }; if (!forceHideFromLocal && enabled) { diff --git a/app/screens/navigation.ts b/app/screens/navigation.ts index 14b04af19..2079340e9 100644 --- a/app/screens/navigation.ts +++ b/app/screens/navigation.ts @@ -4,8 +4,9 @@ /* eslint-disable max-lines */ import merge from 'deepmerge'; -import {Appearance, DeviceEventEmitter, NativeModules, Platform} from 'react-native'; +import {Appearance, DeviceEventEmitter, NativeModules, StatusBar, Platform} from 'react-native'; import {Navigation, Options, OptionsModalPresentationStyle} from 'react-native-navigation'; +import tinyColor from 'tinycolor2'; import CompassIcon from '@components/compass_icon'; import {Device, Preferences, Screens} from '@constants'; @@ -24,9 +25,6 @@ Navigation.setDefaultOptions({ //@ts-expect-error all not defined in type definition orientation: [Device.IS_TABLET ? 'all' : 'portrait'], }, - statusBar: { - backgroundColor: 'rgba(20, 33, 62, 0.42)', - }, }); function getThemeFromState() { @@ -41,6 +39,8 @@ function getThemeFromState() { export function resetToHome(passProps = {}) { const theme = getThemeFromState(); + const isDark = tinyColor(theme.sidebarBg).isDark(); + StatusBar.setBarStyle(isDark ? 'light-content' : 'dark-content'); EphemeralStore.clearNavigationComponents(); @@ -56,6 +56,7 @@ export function resetToHome(passProps = {}) { }, statusBar: { visible: true, + backgroundColor: theme.sidebarBg, }, topBar: { visible: false, @@ -80,6 +81,8 @@ export function resetToHome(passProps = {}) { export function resetToSelectServer(passProps: LaunchProps) { const theme = getThemeFromState(); + const isDark = tinyColor(theme.sidebarBg).isDark(); + StatusBar.setBarStyle(isDark ? 'light-content' : 'dark-content'); EphemeralStore.clearNavigationComponents(); @@ -98,6 +101,7 @@ export function resetToSelectServer(passProps: LaunchProps) { }, statusBar: { visible: true, + backgroundColor: theme.sidebarBg, }, topBar: { backButton: { @@ -125,12 +129,16 @@ export function resetToSelectServer(passProps: LaunchProps) { export function resetToTeams(name: string, title: string, passProps = {}, options = {}) { const theme = getThemeFromState(); + const isDark = tinyColor(theme.sidebarBg).isDark(); + StatusBar.setBarStyle(isDark ? 'light-content' : 'dark-content'); + const defaultOptions = { layout: { componentBackgroundColor: theme.centerChannelBg, }, statusBar: { visible: true, + backgroundColor: theme.sidebarBg, }, topBar: { visible: true, diff --git a/app/screens/server/index.tsx b/app/screens/server/index.tsx index ec86d3b68..69cdee4b6 100644 --- a/app/screens/server/index.tsx +++ b/app/screens/server/index.tsx @@ -6,12 +6,11 @@ import React, {useCallback, useEffect, useRef, useState} from 'react'; import {useIntl} from 'react-intl'; import { ActivityIndicator, EventSubscription, Image, Keyboard, KeyboardAvoidingView, - Platform, StatusBar, StatusBarStyle, StyleSheet, TextInput, TouchableWithoutFeedback, View, + Platform, StyleSheet, TextInput, TouchableWithoutFeedback, View, } from 'react-native'; import Button from 'react-native-button'; import {Navigation, NavigationFunctionComponent} from 'react-native-navigation'; import {SafeAreaView} from 'react-native-safe-area-context'; -import tinyColor from 'tinycolor2'; import {doPing} from '@actions/remote/general'; import {fetchConfigAndLicense} from '@actions/remote/systems'; @@ -259,13 +258,7 @@ const Server: NavigationFunctionComponent = ({componentId, extra, launchType, la ); } - const statusColor = tinyColor(theme.centerChannelBg); const inputDisabled = managedConfig.allowOtherServers === 'false' || connecting; - let barStyle: StatusBarStyle = 'light-content'; - if (Platform.OS === 'ios' && statusColor.isLight()) { - barStyle = 'dark-content'; - } - const inputStyle = [styles.inputBox]; if (inputDisabled) { inputStyle.push(styles.disabledInput); @@ -282,7 +275,6 @@ const Server: NavigationFunctionComponent = ({componentId, extra, launchType, la keyboardVerticalOffset={0} enabled={Platform.OS === 'ios'} > - (''); const style = getStyleSheet(theme); const intl = useIntl(); - let customUrlScheme = REDIRECT_URL_SCHEME; + let customUrlScheme = Sso.REDIRECT_URL_SCHEME; if (DeviceInfo.getBundleId && DeviceInfo.getBundleId().includes('rnbeta')) { - customUrlScheme = REDIRECT_URL_SCHEME_DEV; + customUrlScheme = Sso.REDIRECT_URL_SCHEME_DEV; } const redirectUrl = customUrlScheme + 'callback'; diff --git a/app/screens/sso/sso_with_webview.tsx b/app/screens/sso/sso_with_webview.tsx index f6a5da2f5..28674668f 100644 --- a/app/screens/sso/sso_with_webview.tsx +++ b/app/screens/sso/sso_with_webview.tsx @@ -16,7 +16,7 @@ import { import urlParse from 'url-parse'; import Loading from '@components/loading'; -import {SSO} from '@constants'; +import {Sso} from '@constants'; import {popTopScreen} from '@screens/navigation'; import {changeOpacity, makeStyleSheetFromTheme} from '@utils/theme'; @@ -192,7 +192,7 @@ const SSOWithWebView = ({completeUrlPath, doSSOLogin, loginError, loginUrl, serv const parsed = urlParse(url); let isLastRedirect = url.includes(completeUrlPath); - if (ssoType === SSO.SAML) { + if (ssoType === Sso.SAML) { isLastRedirect = isLastRedirect && !parsed.query; } @@ -203,7 +203,7 @@ const SSOWithWebView = ({completeUrlPath, doSSOLogin, loginError, loginUrl, serv const renderWebView = () => { if (shouldRenderWebView) { - const userAgent = ssoType === SSO.GOOGLE ? 'Mozilla/5.0 (Linux; Android 10; Android SDK built for x86 Build/LMY48X) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/81.0.4044.117 Mobile Safari/608.2.11' : undefined; + const userAgent = ssoType === Sso.GOOGLE ? 'Mozilla/5.0 (Linux; Android 10; Android SDK built for x86 Build/LMY48X) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/81.0.4044.117 Mobile Safari/608.2.11' : undefined; return ( { diff --git a/test/test_helper.js b/test/test_helper.js index fa8345082..c99171982 100644 --- a/test/test_helper.js +++ b/test/test_helper.js @@ -7,13 +7,12 @@ import nock from 'nock'; import Config from '@assets/config.json'; import {Client} from '@client/rest'; -import GENERAL_CONSTANTS from '@constants/general'; import DatabaseManager from '@database/manager'; import {prepareCommonSystemValues} from '@queries/servers/system'; import {generateId} from '@utils/general'; const PASSWORD = 'password1'; -const DEFAULT_LOCALE = GENERAL_CONSTANTS.DEFAULT_LOCALE; +const DEFAULT_LOCALE = 'en'; class TestHelper { constructor() {