Automated cherry pick of #3927 (#3928)

* Bump app build number to 268

* Update server version in Android description

Co-authored-by: Miguel Alatzar <migbot@users.noreply.github.com>

.eslintrc.json

@@ -1,13 +1,7 @@
 {
   "extends": [
-    "plugin:mattermost/react",
-    "plugin:@typescript-eslint/eslint-recommended",
-    "plugin:@typescript-eslint/recommended"
-  ],
-  "parser": "@typescript-eslint/parser",
-  "plugins": [
-    "mattermost",
-    "@typescript-eslint"
+    "./node_modules/eslint-config-mattermost/.eslintrc.json",
+    "./node_modules/eslint-config-mattermost/.eslintrc-react.json"
   ],
   "settings": {
     "react": {
@@ -24,16 +18,7 @@
   "rules": {
     "global-require": 0,
     "react/display-name": [2, { "ignoreTranspilerName": false }],
-    "react/jsx-filename-extension": [2, {"extensions": [".js"]}],
-    "no-undefined": 0,
-    "@typescript-eslint/camelcase": 0,
-    "@typescript-eslint/no-undefined": 0,
-    "@typescript-eslint/no-non-null-assertion": 0,
-    "@typescript-eslint/no-unused-vars": 2,
-    "@typescript-eslint/no-explicit-any": "warn",
-    "@typescript-eslint/no-use-before-define": 0,
-    "@typescript-eslint/no-var-requires": 0,
-    "@typescript-eslint/explicit-function-return-type": 0
+    "react/jsx-filename-extension": [2, {"extensions": [".js"]}]
   },
   "overrides": [
     {

.gitignore

@@ -87,7 +87,6 @@ ios/sentry.properties
 # Testing
 .nyc_output
 coverage
-.tmp
 
 # Bundle artifact
 *.jsbundle

CHANGELOG.md

@@ -1,93 +1,5 @@
 # Mattermost Mobile Apps Changelog
 
-## 1.29.0 Release
-- Release Date: March 16, 2020
-- Server Versions Supported: Server v5.9+ is required, Self-Signed SSL Certificates are not supported unless the user installs the CA certificate on their device
-
-### Compatibility
- - Android operating system 7+ [is required by Google](https://android-developers.googleblog.com/2017/12/improving-app-security-and-performance.html).
- - iPhone 5s devices and later with iOS 11+ is required.
-
-**Note:** The persisted sidebar on Android tablets was removed in order to significantly improve the mobile app performance.
-
-**Note:** An issue was fixed where a user's status was set as online when replying to a message from a push notification. This fix only works in combination with server v5.20.0+.
- 
-### Improvements
- - Significantly improved how quickly channels load when you open the app and when you switch between them.
- - Set all requests timeouts to a maximum of 5 seconds to improve reliability on bad networks.
- - Changed "Copy Permalink" to "Copy Link" for readability.
- 
-### Bug Fixes
- - Fixed an issue where downloaded files on Android had the words `download successful` appended to their filenames, preventing the file from being opened until it was renamed in the file manager.
- - Fixed a silent crash on Android when receiving a push notification.
- - Fixed an issue on Android where users could not swipe to close sidebar unless the gesture was initiated outside of the sidebar.
- - Fixed an issue where channels drawers were partially shown with orientation change on iOS RN61.
- - Fixed an issue on iOS where the message box obstructed the bottom part of the message when opened from the notification banner.
- - Fixed an issue where switching teams showed the center channel from the old team until the new team's channel data got loaded.
- - Fixed an issue where users could not post messages after returning from an archived channel.
- - Fixed an issue where user experienced infinite scrolling when viewing all public joinable/archived channels.
- - Fixed an issue where archived channels membership was lost on the client.
- - Fixed an issue on iOS where the channel intro scrolled past the top of the channel.
- - Fixed an issue on Android where inline custom emojis did not display in portrait mode.
- - Fixed an issue where markdown tables did not display all rows in a post when it had multiple heights.
- - Fixed an issue where deleting documents and data caused a flash of the background when the app reloaded.
- - Fixed an issue where tall and thin image attachments got pushed to the left instead of appearing centered.
- 
-### Known Issues
- - Some gender neutral emojis don't render as jumbo emojis.
-
-## 1.28.0 Release
-- Release Date: February 16, 2020
-- Server Versions Supported: Server v5.9+ is required, Self-Signed SSL Certificates are not supported unless the user installs the CA certificate on their device
-
-### Compatibility
- - Android operating system 7+ [is required by Google](https://android-developers.googleblog.com/2017/12/improving-app-security-and-performance.html).
- - iPhone 5s devices and later with iOS 11+ is required.
- 
-### Highlights
-
-#### UI/UX Improvements to the Post Draft Area
- - Links added to facilitate easier access to common functions:
-   - finding channel members for @mentioning;
-   - finding and referencing slash commands;
-   - attaching photos and videos;
-   - accessing the camera
-
-#### Deep Linking
- - Links to posts in email notifications now launch to a browser landing page with option to open in the Mobile app.
-
-### Improvements
- - Removed markdown rendering from Channel Purpose in channel info screen.
- - Improved channel info transition so that it opens up as a modal rather than as a drawer from the right.
- - Clicking on the time in the iOS status bar now scrolls up the center channel.
- - Improved the sliding behaviour of the left-hand sidebar on iOS.
- - Added more responsiveness to markdown tables.
- - User's own username with a suffix 'you' is now shown in the username autocomplete.
- - Improved sorting of emojis in the emoji picker so that thumbsup is sorted first, then thumbsdown, and then custom emoji.
-
-### Bug Fixes
- - Fixed an issue on Android where the app displayed an incorrect timestamp when the experimental Timezone setting was disabled.
- - Fixed an issue where combined system messages with many users listed hid posts above them.
- - Fixed an issue on iOS where the app crashed when pasting a GIF via the keyboard.
- - Fixed an issue where explicit links to teams and channels on the same server currently logged in to didn't switch to that team and channel.
- - Fixed an issue where the keyboard glitched when returning to the main channel view after viewing a code block in the right-hand side.
- - Fixed an issue with default boolean values in interactive dialogs.
- 
-### Known Issues
- - Markdown tables are missing a header colour.
-
-## 1.27.1 Release
-- Release Date: January 21, 2020
-- Server Versions Supported: Server v5.9+ is required, Self-Signed SSL Certificates are not supported unless the user installs the CA certificate on their device
-
-### Compatibility
- - Android operating system 7+ [is required by Google](https://android-developers.googleblog.com/2017/12/improving-app-security-and-performance.html).
- - iPhone 5s devices and later with iOS 11+ is required.
-
-### Bug Fixes
- - Fixed an issue where all previously auto-closed Direct Message channels were listed in the channel sidebar.
- - Fixed a regression affecting webapp and mobile apps where some users were experiencing client-side performance issues. This was mainly affecting users with more than 100 channels listed in the channel sidebar and with channels sorted alphabetically.
-
 ## 1.27.0 Release
 - Release Date: January 16, 2020
 - Server Versions Supported: Server v5.9+ is required, Self-Signed SSL Certificates are not supported unless the user installs the CA certificate on their device

Gemfile

@@ -1,3 +0,0 @@
-source "https://rubygems.org"
-
-gem "cocoapods", "1.7.5"

Gemfile.lock

@@ -1,76 +0,0 @@
-GEM
-  remote: https://rubygems.org/
-  specs:
-    CFPropertyList (3.0.2)
-    activesupport (4.2.11.1)
-      i18n (~> 0.7)
-      minitest (~> 5.1)
-      thread_safe (~> 0.3, >= 0.3.4)
-      tzinfo (~> 1.1)
-    atomos (0.1.3)
-    claide (1.0.3)
-    cocoapods (1.7.5)
-      activesupport (>= 4.0.2, < 5)
-      claide (>= 1.0.2, < 2.0)
-      cocoapods-core (= 1.7.5)
-      cocoapods-deintegrate (>= 1.0.3, < 2.0)
-      cocoapods-downloader (>= 1.2.2, < 2.0)
-      cocoapods-plugins (>= 1.0.0, < 2.0)
-      cocoapods-search (>= 1.0.0, < 2.0)
-      cocoapods-stats (>= 1.0.0, < 2.0)
-      cocoapods-trunk (>= 1.3.1, < 2.0)
-      cocoapods-try (>= 1.1.0, < 2.0)
-      colored2 (~> 3.1)
-      escape (~> 0.0.4)
-      fourflusher (>= 2.3.0, < 3.0)
-      gh_inspector (~> 1.0)
-      molinillo (~> 0.6.6)
-      nap (~> 1.0)
-      ruby-macho (~> 1.4)
-      xcodeproj (>= 1.10.0, < 2.0)
-    cocoapods-core (1.7.5)
-      activesupport (>= 4.0.2, < 6)
-      fuzzy_match (~> 2.0.4)
-      nap (~> 1.0)
-    cocoapods-deintegrate (1.0.4)
-    cocoapods-downloader (1.3.0)
-    cocoapods-plugins (1.0.0)
-      nap
-    cocoapods-search (1.0.0)
-    cocoapods-stats (1.1.0)
-    cocoapods-trunk (1.4.1)
-      nap (>= 0.8, < 2.0)
-      netrc (~> 0.11)
-    cocoapods-try (1.1.0)
-    colored2 (3.1.2)
-    concurrent-ruby (1.1.5)
-    escape (0.0.4)
-    fourflusher (2.3.1)
-    fuzzy_match (2.0.4)
-    gh_inspector (1.1.3)
-    i18n (0.9.5)
-      concurrent-ruby (~> 1.0)
-    minitest (5.14.0)
-    molinillo (0.6.6)
-    nanaimo (0.2.6)
-    nap (1.1.0)
-    netrc (0.11.0)
-    ruby-macho (1.4.0)
-    thread_safe (0.3.6)
-    tzinfo (1.2.6)
-      thread_safe (~> 0.1)
-    xcodeproj (1.15.0)
-      CFPropertyList (>= 2.3.3, < 4.0)
-      atomos (~> 0.1.3)
-      claide (>= 1.0.2, < 2.0)
-      colored2 (~> 3.1)
-      nanaimo (~> 0.2.6)
-
-PLATFORMS
-  ruby
-
-DEPENDENCIES
-  cocoapods (= 1.7.5)
-
-BUNDLED WITH
-   2.0.2

Makefile

@@ -7,6 +7,7 @@
 .PHONY: build-pr can-build-pr prepare-pr
 .PHONY: test help
 
+POD := $(shell which pod 2> /dev/null)
 OS := $(shell sh -c 'uname -s 2>/dev/null')
 BASE_ASSETS = $(shell find assets/base -type d) $(shell find assets/base -type f -name '*')
 OVERRIDE_ASSETS = $(shell find assets/override -type d 2> /dev/null) $(shell find assets/override -type f -name '*' 2> /dev/null)
@@ -32,11 +33,13 @@ npm-ci: package.json
 
 .podinstall:
 ifeq ($(OS), Darwin)
-	@echo "Required version of Cocoapods is not installed"
-	@echo Installing gems;
-	@bundle install
+ifdef POD
 	@echo Getting Cocoapods dependencies;
-	@cd ios && bundle exec pod install;
+	@cd ios && pod install;
+else
+	@echo "Cocoapods is not installed https://cocoapods.org/"
+	@exit 1
+endif
 endif
 	@touch $@
 

NOTICE.txt

@@ -876,6 +876,262 @@ SOFTWARE.
 
 ---
 
+## jsc-android
+
+This product contains 'jsc-android' by React Native Community.
+
+Pre-build version of JavaScriptCore to be used by React Native apps
+
+* HOMEPAGE:
+  * https://github.com/react-community/jsc-android-buildscripts#readme
+
+* LICENSE: BSD-2-Clause
+
+BSD 2-Clause License
+
+Copyright (c) 2017, Software Mansion Sp. z o. o. Sp. k. AND 650 Industries, Inc.
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+* Redistributions of source code must retain the above copyright notice, this
+  list of conditions and the following disclaimer.
+
+* Redistributions in binary form must reproduce the above copyright notice,
+  this list of conditions and the following disclaimer in the documentation
+  and/or other materials provided with the distribution.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+---
+
+## mattermost-redux
+
+This product contains 'mattermost-redux' by Mattermost.
+
+Common code (API client, Redux stores, logic, utility functions) for building a Mattermost client
+
+* HOMEPAGE:
+  * https://github.com/mattermost/mattermost-redux
+
+* LICENSE: Apache-2.0
+
+Copyright 2015-present Mattermost, Inc.
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "{}"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright {yyyy} {name of copyright owner}
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
+
+---
+
 ## mime-db
 
 This product contains 'mime-db' by Douglas Christopher Wilson.
@@ -1530,29 +1786,6 @@ SOFTWARE.
 
 ---
 
-## react-native-hw-keyboard-event
-
-This product contains 'react-native-hw-keyboard-event' by Emilio Rodriguez.
-
-Event handler for hardware keyboard keystrokes
-
-* HOMEPAGE:
-  * https://github.com/emilioicai/react-native-hw-keyboard-event
-
-* LICENSE: MIT
-
-MIT License
-
-Copyright (c) 2019 Emilio Rodriguez
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-
----
-
 ## react-native-image-gallery
 
 This product contains a modified version of 'react-native-image-gallery' by Archriss.
@@ -1771,41 +2004,6 @@ THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH RE
 
 ---
 
-## react-native-mmkv-storage
-
-This product contains 'react-native-mmkv-storage' by Ammar Ahmed.
-
-An efficient, small & encrypted mobile key-value storage framework for React Native
-
-* HOMEPAGE:
-  * https://github.com/ammarahm-ed/react-native-mmkv-storage
-
-* LICENSE: MIT
-
-MIT License
-
-Copyright (c) 2020 Ammar Ahmed
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-
----
-
 ## react-native-navigation
 
 This product contains a modified version of 'react-native-navigation' by Wix.com.
@@ -2102,41 +2300,6 @@ SOFTWARE.
 
 ---
 
-## react-native-v8
-
-This product contains 'react-native-v8' by Kudo Chien.
-
-Opt-in V8 runtime for React Native Android
-
-* HOMEPAGE:
-  * https://github.com/Kudo/react-native-v8
-
-* LICENSE: MIT
-
-MIT License
-
-Copyright (c) 2019 Kudo
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-
----
-
 ## react-native-vector-icons
 
 This product contains 'react-native-vector-icons' by Joel Arvidsson.
@@ -2410,41 +2573,6 @@ SOFTWARE.
 
 ---
 
-## redux-action-buffer
-
-This product contains 'redux-action-buffer' by Zack Story.
-
-A middleware for redux that buffers all actions into a queue until a breaker condition is met, at which point the queue is released (i.e. actions are triggered).
-
-* HOMEPAGE:
-  * https://github.com/rt2zz/redux-action-buffer
-
-* LICENSE: MIT
-
-The MIT License (MIT)
-
-Copyright (c) 2015-2017 rt2zz and contributors
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.
-
----
-
 ## redux-batched-actions
 
 This product contains 'redux-batched-actions' by Tim Shelburne.
@@ -2480,6 +2608,41 @@ SOFTWARE.
 
 ---
 
+## redux-offline
+
+This product contains 'redux-offline' by redux-offline.
+
+Build Offline-First Apps for Web and React Native
+
+* HOMEPAGE:
+  * https://github.com/redux-offline/redux-offline
+
+* LICENSE: MIT
+
+MIT License
+
+Copyright (c) 2017 Jani Eväkallio
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+---
+
 ## redux-persist
 
 This product contains 'redux-persist' by Zack Story.
@@ -2550,41 +2713,6 @@ SOFTWARE.
 
 ---
 
-## redux-reset
-
-This product contains 'redux-reset' by Wang Zixiao.
-
-Gives redux the ability to reset the state
-
-* HOMEPAGE:
-  * https://github.com/wwayne/redux-reset
-
-* LICENSE: MIT
-
-The MIT License (MIT)
-
-Copyright (c) 2016 Wang Zixiao
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
-
----
-
 ## redux-thunk
 
 This product contains 'redux-thunk' by Dan Abramov.
@@ -2753,29 +2881,6 @@ IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
 
 ---
 
-## serialize-error
-
-This product contains 'serialize-error' by Sindre Sorhus.
-
-Serialize/deserialize an error into a plain object
-
-* HOMEPAGE:
-  * https://github.com/sindresorhus/serialize-error
-
-* LICENSE: MIT
-
-MIT License
-
-Copyright (c) Sindre Sorhus <sindresorhus@gmail.com> (https://sindresorhus.com)
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-
----
-
 ## shallow-equals
 
 This product contains 'shallow-equals' by Hugh Kennedy.

PULL_REQUEST_TEMPLATE.md

@@ -24,6 +24,7 @@ Otherwise, link the JIRA ticket.
 Place an '[x]' (no spaces) in all applicable fields. Please remove unrelated fields.
 -->
 - [ ] Added or updated unit tests (required for all new features)
+- [ ] All new/modified APIs include changes to [mattermost-redux](https://github.com/mattermost/mattermost-redux) (please link)
 - [ ] Has UI changes
 - [ ] Includes text changes and localization file updates
 

README.md

@@ -1,7 +1,7 @@
 # Mattermost Mobile
 
 - **Minimum Server versions:** Current ESR version (5.19)
-- **Supported iOS versions:** 11+
+- **Supported iOS versions:** 10.3+
 - **Supported Android versions:** 7.0+
 
 Mattermost is an open source Slack-alternative used by thousands of companies around the world in 14 languages. Learn more at [https://about.mattermost.com](https://about.mattermost.com).
@@ -20,7 +20,7 @@ To help with testing app updates before they're released, you can:
 
 1. Sign up to be a beta tester
    - [Android](https://play.google.com/apps/testing/com.mattermost.rnbeta)
-   - [iOS](https://testflight.apple.com/join/Q7Rx7K9P) - Open this link from your iOS device
+   - [iOS](https://testflight.apple.com/join/Q7Rx7K9P)
 2. Install the `Mattermost Beta` app. New updates in the Beta app are released periodically. You will receive a notification when the new updates are available.
 3. File any bugs you find by filing a [GitHub issue](https://github.com/mattermost/mattermost-mobile/issues) with:
    - Device information

android/app/build.gradle

@@ -130,8 +130,9 @@ android {
         applicationId "com.mattermost.rnbeta"
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
-        versionCode 296
-        versionName "1.31.2"
+        missingDimensionStrategy "RNN.reactNativeVersion", "reactNative60"
+        versionCode 268
+        versionName "1.28.0"
         multiDexEnabled = true
         ndk {
             abiFilters 'armeabi-v7a','arm64-v8a','x86','x86_64'
@@ -239,8 +240,33 @@ dependencies {
     implementation 'com.google.android.material:material:1.0.0'
     implementation 'androidx.constraintlayout:constraintlayout:1.1.3'
     implementation 'com.google.firebase:firebase-messaging:17.3.4'
+    implementation project(':react-native-document-picker')
+    implementation project(':react-native-keychain')
+    implementation project(':react-native-doc-viewer')
+    implementation project(':react-native-video')
+    implementation project(':react-native-navigation')
+    implementation project(':react-native-image-picker')
+    implementation project(':react-native-device-info')
     implementation project(':reactnativenotifications')
+    implementation project(':react-native-cookies')
+    implementation project(':react-native-linear-gradient')
+    implementation project(':react-native-vector-icons')
+    implementation project(':react-native-svg')
+    implementation project(':react-native-local-auth')
+    implementation project(':jail-monkey')
+    implementation project(':react-native-youtube')
+    implementation project(':react-native-exception-handler')
+    implementation project(':rn-fetch-blob')
+    implementation project(':react-native-webview')
+    implementation project(':react-native-gesture-handler')
+    implementation project(':@react-native-community_async-storage')
+    implementation project(':@react-native-community_netinfo')
+    implementation project(':@sentry_react-native')
+    implementation project(':react-native-android-open-settings')
+    implementation project(':react-native-haptic-feedback')
+    implementation project(':react-native-permissions')
 
+    implementation project(':react-native-fast-image')
     // For animated GIF support
     implementation 'com.facebook.fresco:fresco:2.0.0'
     implementation 'com.facebook.fresco:animated-gif:2.0.0'
@@ -257,4 +283,3 @@ task copyDownloadableDepsToLibs(type: Copy) {
 }
 
 apply plugin: 'com.google.gms.google-services'
-apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

android/app/src/main/java/com/mattermost/rnbeta/MainActivity.java

@@ -2,49 +2,13 @@ package com.mattermost.rnbeta;
 
 import android.os.Bundle;
 import androidx.annotation.Nullable;
-import android.view.KeyEvent;
-import android.content.res.Configuration;
 
 import com.reactnativenavigation.NavigationActivity;
-import com.github.emilioicai.hwkeyboardevent.HWKeyboardEventModule;
 
 public class MainActivity extends NavigationActivity {
-    private boolean HWKeyboardConnected = false;
-
     @Override
     protected void onCreate(@Nullable Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.launch_screen);
-        setHWKeyboardConnected();
-    }
-
-    @Override
-    public void onConfigurationChanged(Configuration newConfig) {
-        super.onConfigurationChanged(newConfig);
-
-        if (newConfig.hardKeyboardHidden == Configuration.HARDKEYBOARDHIDDEN_NO) {
-            HWKeyboardConnected = true;
-        } else if (newConfig.hardKeyboardHidden == Configuration.HARDKEYBOARDHIDDEN_YES) {
-            HWKeyboardConnected = false;
-        }
-    }
-
-    /*
-    https://mattermost.atlassian.net/browse/MM-10601
-    Required by react-native-hw-keyboard-event
-    (https://github.com/emilioicai/react-native-hw-keyboard-event)
-    */
-    @Override
-    public boolean dispatchKeyEvent(KeyEvent event) {
-        if (HWKeyboardConnected && event.getKeyCode() == KeyEvent.KEYCODE_ENTER && event.getAction() == KeyEvent.ACTION_UP) {
-            String keyPressed = event.isShiftPressed() ? "shift-enter" : "enter";
-            HWKeyboardEventModule.getInstance().keyPressed(keyPressed);
-            return true;
-        }
-        return super.dispatchKeyEvent(event);
-    };
-
-    private void setHWKeyboardConnected() {
-        HWKeyboardConnected = getResources().getConfiguration().keyboard == Configuration.KEYBOARD_QWERTY;
     }
 }

android/app/src/main/java/com/mattermost/rnbeta/MainApplication.java

@@ -1,5 +1,6 @@
 package com.mattermost.rnbeta;
 
+import androidx.annotation.NonNull;
 import androidx.annotation.Nullable;
 import android.content.Context;
 import android.content.RestrictionsManager;
@@ -7,14 +8,42 @@ import android.os.Bundle;
 import android.util.Log;
 import java.io.File;
 import java.util.HashMap;
+import java.util.Arrays;
 import java.util.List;
 import java.util.Map;
 
-import com.mattermost.share.RealPathUtil;
 import com.mattermost.share.ShareModule;
-import com.wix.reactnativenotifications.RNNotificationsPackage;
+import com.learnium.RNDeviceInfo.RNDeviceModule;
+import com.imagepicker.ImagePickerModule;
+import com.psykar.cookiemanager.CookieManagerModule;
+import com.oblador.vectoricons.VectorIconsModule;
+import com.wix.reactnativenotifications.RNNotificationsModule;
+import io.tradle.react.LocalAuthModule;
+import com.gantix.JailMonkey.JailMonkeyModule;
+import com.RNFetchBlob.RNFetchBlob;
+import com.masteratul.exceptionhandler.ReactNativeExceptionHandlerModule;
+import com.inprogress.reactnativeyoutube.YouTubeStandaloneModule;
+import com.philipphecht.RNDocViewerModule;
+import io.github.elyx0.reactnativedocumentpicker.DocumentPickerModule;
+import com.oblador.keychain.KeychainModule;
+import com.reactnativecommunity.asyncstorage.AsyncStorageModule;
+import com.reactnativecommunity.netinfo.NetInfoModule;
+import com.reactnativecommunity.webview.RNCWebViewPackage;
+import io.sentry.RNSentryModule;
+import com.dylanvann.fastimage.FastImageViewPackage;
+import com.levelasquez.androidopensettings.AndroidOpenSettings;
+import com.mkuczera.RNReactNativeHapticFeedbackModule;
+import com.reactnativecommunity.rnpermissions.RNPermissionsModule;
+
+import com.reactnativecommunity.webview.RNCWebViewPackage;
+import com.brentvatne.react.ReactVideoPackage;
+import com.BV.LinearGradient.LinearGradientPackage;
+import com.horcrux.svg.SvgPackage;
+import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
 
 import com.reactnativenavigation.NavigationApplication;
+import com.reactnativenavigation.react.NavigationReactNativeHost;
+import com.reactnativenavigation.react.ReactGateway;
 import com.wix.reactnativenotifications.core.notification.INotificationsApplication;
 import com.wix.reactnativenotifications.core.notification.IPushNotification;
 import com.wix.reactnativenotifications.core.notificationdrawer.IPushNotificationsDrawer;
@@ -23,7 +52,6 @@ import com.wix.reactnativenotifications.core.AppLaunchHelper;
 import com.wix.reactnativenotifications.core.AppLifecycleFacade;
 import com.wix.reactnativenotifications.core.JsIOHelper;
 
-import com.facebook.react.PackageList;
 import com.facebook.react.ReactPackage;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.TurboReactPackage;
@@ -39,6 +67,8 @@ import com.facebook.react.module.model.ReactModuleInfoProvider;
 import com.facebook.react.modules.core.DeviceEventManagerModule;
 import com.facebook.soloader.SoLoader;
 
+import com.mattermost.share.RealPathUtil;
+
 public class MainApplication extends NavigationApplication implements INotificationsApplication, INotificationsDrawerApplication {
   public static MainApplication instance;
 
@@ -54,34 +84,78 @@ public class MainApplication extends NavigationApplication implements INotificat
 
   private Bundle mManagedConfig = null;
 
-private final ReactNativeHost mReactNativeHost =
-  new ReactNativeHost(this) {
-    @Override
-    public boolean getUseDeveloperSupport() {
-      return BuildConfig.DEBUG;
-    }
+  @Override
+  protected ReactGateway createReactGateway() {
+    ReactNativeHost host = new NavigationReactNativeHost(this, isDebug(), createAdditionalReactPackages()) {
+      @Override
+      protected String getJSMainModuleName() {
+        return "index";
+      }
+    };
+    return new ReactGateway(this, isDebug(), host);
+  }
 
-    @Override
-    protected List<ReactPackage> getPackages() {
-      @SuppressWarnings("UnnecessaryLocalVariable")
-      List<ReactPackage> packages = new PackageList(this).getPackages();
-      // Packages that cannot be autolinked yet can be added manually here, for example:
-      // packages.add(new MyReactNativePackage());
-      packages.add(new RNNotificationsPackage(MainApplication.this));
-      packages.add(new RNPasteableTextInputPackage());
-      packages.add(
-        new TurboReactPackage() {
+  @Override
+  public boolean isDebug() {
+    return BuildConfig.DEBUG;
+  }
+
+  @NonNull
+  @Override
+  public List<ReactPackage> createAdditionalReactPackages() {
+    // Add the packages you require here.
+    // No need to add RnnPackage and MainReactPackage
+    return Arrays.<ReactPackage>asList(
+            new TurboReactPackage() {
               @Override
               public NativeModule getModule(String name, ReactApplicationContext reactContext) {
                 switch (name) {
-                  case "MattermostManaged":
-                    return MattermostManagedModule.getInstance(reactContext);
                   case "MattermostShare":
                     return new ShareModule(instance, reactContext);
+                  case "RNDeviceInfo":
+                    return new RNDeviceModule(reactContext, false);
+                  case "ImagePickerManager":
+                    return new ImagePickerModule(reactContext, R.style.DefaultExplainingPermissionsTheme);
+                  case "RNCookieManagerAndroid":
+                    return new CookieManagerModule(reactContext);
+                  case "RNVectorIconsModule":
+                    return new VectorIconsModule(reactContext);
+                  case "WixRNNotifications":
+                    return new RNNotificationsModule(instance, reactContext);
+                  case "RNLocalAuth":
+                    return new LocalAuthModule(reactContext);
+                  case "JailMonkey":
+                    return new JailMonkeyModule(reactContext, false);
+                  case "RNFetchBlob":
+                    return new RNFetchBlob(reactContext);
+                  case "MattermostManaged":
+                    return MattermostManagedModule.getInstance(reactContext);
                   case "NotificationPreferences":
                     return NotificationPreferencesModule.getInstance(instance, reactContext);
                   case "RNTextInputReset":
                     return new RNTextInputResetModule(reactContext);
+                  case "ReactNativeExceptionHandler":
+                    return new ReactNativeExceptionHandlerModule(reactContext);
+                  case "YouTubeStandaloneModule":
+                    return new YouTubeStandaloneModule(reactContext);
+                  case "RNDocViewer":
+                    return new RNDocViewerModule(reactContext);
+                  case "RNDocumentPicker":
+                    return new DocumentPickerModule(reactContext);
+                  case "RNKeychainManager":
+                    return new KeychainModule(reactContext);
+                  case "RNSentry":
+                    return new RNSentryModule(reactContext);
+                  case AsyncStorageModule.NAME:
+                    return new AsyncStorageModule(reactContext);
+                  case NetInfoModule.NAME:
+                    return new NetInfoModule(reactContext);
+                  case "RNAndroidOpenSettings":
+                    return new AndroidOpenSettings(reactContext);
+                  case "RNReactNativeHapticFeedbackModule":
+                    return new RNReactNativeHapticFeedbackModule(reactContext);
+                  case "RNPermissions":
+                    return new RNPermissionsModule(reactContext);
                   default:
                     throw new IllegalArgumentException("Could not find module " + name);
                 }
@@ -94,28 +168,42 @@ private final ReactNativeHost mReactNativeHost =
                   public Map<String, ReactModuleInfo> getReactModuleInfos() {
                     Map<String, ReactModuleInfo> map = new HashMap<>();
                     map.put("MattermostManaged", new ReactModuleInfo("MattermostManaged", "com.mattermost.rnbeta.MattermostManagedModule", false, false, false, false, false));
-                    map.put("MattermostShare", new ReactModuleInfo("MattermostShare", "com.mattermost.share.ShareModule", false, false, true, false, false));
                     map.put("NotificationPreferences", new ReactModuleInfo("NotificationPreferences", "com.mattermost.rnbeta.NotificationPreferencesModule", false, false, false, false, false));
                     map.put("RNTextInputReset", new ReactModuleInfo("RNTextInputReset", "com.mattermost.rnbeta.RNTextInputResetModule", false, false, false, false, false));
+
+                    map.put("MattermostShare", new ReactModuleInfo("MattermostShare", "com.mattermost.share.ShareModule", false, false, true, false, false));
+                    map.put("RNDeviceInfo", new ReactModuleInfo("RNDeviceInfo", "com.learnium.RNDeviceInfo.RNDeviceModule", false, false, true, false, false));
+                    map.put("ImagePickerManager", new ReactModuleInfo("ImagePickerManager", "com.imagepicker.ImagePickerModule", false, false, false, false, false));
+                    map.put("RNCookieManagerAndroid", new ReactModuleInfo("RNCookieManagerAndroid", "com.psykar.cookiemanager.CookieManagerModule", false, false, false, false, false));
+                    map.put("RNVectorIconsModule", new ReactModuleInfo("RNVectorIconsModule", "com.oblador.vectoricons.VectorIconsModule", false, false, false, false, false));
+                    map.put("WixRNNotifications", new ReactModuleInfo("WixRNNotifications", "com.wix.reactnativenotifications.RNNotificationsModule", false, false, false, false, false));
+                    map.put("RNLocalAuth", new ReactModuleInfo("RNLocalAuth", "io.tradle.react.LocalAuthModule", false, false, false, false, false));
+                    map.put("JailMonkey", new ReactModuleInfo("JailMonkey", "com.gantix.JailMonkey.JailMonkeyModule", false, false, true, false, false));
+                    map.put("RNFetchBlob", new ReactModuleInfo("RNFetchBlob", "com.RNFetchBlob.RNFetchBlob", false, false, true, false, false));
+                    map.put("ReactNativeExceptionHandler", new ReactModuleInfo("ReactNativeExceptionHandler", "com.masteratul.exceptionhandler.ReactNativeExceptionHandlerModule", false, false, false, false, false));
+                    map.put("YouTubeStandaloneModule", new ReactModuleInfo("YouTubeStandaloneModule", "com.inprogress.reactnativeyoutube.YouTubeStandaloneModule", false, false, false, false, false));
+                    map.put("RNDocViewer", new ReactModuleInfo("RNDocViewer", "com.philipphecht.RNDocViewerModule", false, false, false, false, false));
+                    map.put("RNDocumentPicker", new ReactModuleInfo("RNDocumentPicker", "io.github.elyx0.reactnativedocumentpicker.DocumentPickerModule", false, false, false, false, false));
+                    map.put("RNKeychainManager", new ReactModuleInfo("RNKeychainManager", "com.oblador.keychain.KeychainModule", false, false, true, false, false));
+                    map.put("RNSentry", new ReactModuleInfo("RNSentry", "com.sentry.RNSentryModule", false, false, true, false, false));
+                    map.put(AsyncStorageModule.NAME, new ReactModuleInfo(AsyncStorageModule.NAME, "com.reactnativecommunity.asyncstorage.AsyncStorageModule", false, false, false, false, false));
+                    map.put(NetInfoModule.NAME, new ReactModuleInfo(NetInfoModule.NAME, "com.reactnativecommunity.netinfo.NetInfoModule", false, false, false, false, false));
+                    map.put("RNAndroidOpenSettings", new ReactModuleInfo("RNAndroidOpenSettings", "com.levelasquez.androidopensettings.AndroidOpenSettings", false, false, false, false, false));
+                    map.put("RNReactNativeHapticFeedbackModule", new ReactModuleInfo("RNReactNativeHapticFeedback", "com.mkuczera.RNReactNativeHapticFeedbackModule", false, false, false, false, false));
+                    map.put("RNPermissions", new ReactModuleInfo("RNPermissions", "com.reactnativecommunity.rnpermissions.RNPermissionsModule", false, false, false, false, false));
                     return map;
                   }
                 };
               }
-            }
-      );
-
-      return packages;
-    }
-
-    @Override
-    protected String getJSMainModuleName() {
-      return "index";
-    }
-  };
-
-  @Override
-  public ReactNativeHost getReactNativeHost() {
-    return mReactNativeHost;
+            },
+            new FastImageViewPackage(),
+            new RNCWebViewPackage(),
+            new SvgPackage(),
+            new LinearGradientPackage(),
+            new ReactVideoPackage(),
+            new RNGestureHandlerPackage(),
+            new RNPasteableTextInputPackage()
+    );
   }
 
   @Override
@@ -151,11 +239,14 @@ private final ReactNativeHost mReactNativeHost =
   }
 
   public ReactContext getRunningReactContext() {
-    if (mReactNativeHost == null) {
+    final ReactGateway reactGateway = getReactGateway();
+
+    if (reactGateway == null) {
         return null;
     }
 
-    return mReactNativeHost
+    return reactGateway
+        .getReactNativeHost()
         .getReactInstanceManager()
         .getCurrentReactContext();
   }

android/app/src/main/java/com/mattermost/rnbeta/NotificationReplyBroadcastReceiver.java

@@ -63,6 +63,7 @@ public class NotificationReplyBroadcastReceiver extends BroadcastReceiver {
                         String token = map.getString("password");
                         String serverUrl = map.getString("service");
 
+                        Log.i("ReactNative", String.format("URL=%s", serverUrl));
                         replyToMessage(serverUrl, token, notificationId, message);
                     }
                 }
@@ -87,16 +88,12 @@ public class NotificationReplyBroadcastReceiver extends BroadcastReceiver {
         final MediaType JSON = MediaType.parse("application/json; charset=utf-8");
         String json = buildReplyPost(channelId, rootId, message.toString());
         RequestBody body = RequestBody.create(JSON, json);
-
-        String postsEndpoint = "/api/v4/posts?set_online=false";
-        String url = String.format("%s%s", serverUrl.replaceAll("/$", ""), postsEndpoint);
-        Log.i("ReactNative", String.format("Reply URL=%s", url));
         Request request = new Request.Builder()
-            .header("Authorization", String.format("Bearer %s", token))
-            .header("Content-Type", "application/json")
-            .url(url)
-            .post(body)
-            .build();
+                .header("Authorization", String.format("Bearer %s", token))
+                .header("Content-Type", "application/json")
+                .url(String.format("%s/api/v4/posts", serverUrl.replaceAll("/$", "")))
+                .post(body)
+                .build();
 
         client.newCall(request).enqueue(new okhttp3.Callback() {
             @Override

android/app/src/main/java/com/mattermost/rnbeta/RNPasteableEditTextOnPasteListener.java

@@ -19,7 +19,6 @@ import com.mattermost.share.RealPathUtil;
 import com.mattermost.share.ShareModule;
 
 import java.io.FileNotFoundException;
-import java.io.File;
 import java.nio.file.Files;
 import java.nio.file.Paths;
 import java.util.regex.Matcher;
@@ -134,16 +133,9 @@ public class RNPasteableEditTextOnPasteListener implements RNEditTextOnPasteList
 
     private String moveToImagesCache(String src, String fileName) {
         ReactContext ctx = (ReactContext)mEditText.getContext();
-        String cacheFolder = ctx.getCacheDir().getAbsolutePath() + "/Images/";
-        String dest = cacheFolder + fileName;
-        File folder = new File(cacheFolder);
-
+        String dest = ctx.getCacheDir().getAbsolutePath() + "/Images/" + fileName;
 
         try {
-            if (!folder.exists()) {
-                folder.mkdirs();
-            }
-
             Files.move(Paths.get(src), Paths.get(dest));
         } catch (Exception err) {
             return null;

android/app/src/main/java/com/mattermost/share/ShareModule.java

@@ -194,12 +194,8 @@ public class ShareModule extends ReactContextBaseJavaModule {
         JSONObject json = new JSONObject();
         try {
             json.put("user_id", data.getString("currentUserId"));
-            if (data.hasKey("channelId")) {
-                json.put("channel_id", data.getString("channelId"));
-            }
-            if (data.hasKey("value")) {
-                json.put("message", data.getString("value"));
-            }
+            json.put("channel_id", data.getString("channelId"));
+            json.put("message", data.getString("value"));
         } catch (JSONException e) {
             e.printStackTrace();
         }

android/build.gradle

@@ -7,9 +7,6 @@ buildscript {
         compileSdkVersion = 28
         targetSdkVersion = 28
         supportLibVersion = "28.0.0"
-        kotlinVersion = "1.3.61"
-        RNNKotlinVersion = kotlinVersion
- 
     }
     repositories {
         jcenter()
@@ -20,7 +17,6 @@ buildscript {
     dependencies {
         classpath 'com.android.tools.build:gradle:3.4.2'
         classpath 'com.google.gms:google-services:4.2.0'
-         classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlinVersion"
 
         // NOTE: Do not place your application dependencies here; they belong
         // in the individual module build.gradle files

android/settings.gradle

@@ -1,5 +1,55 @@
 rootProject.name = 'Mattermost'
+include ':@sentry_react-native'
+project(':@sentry_react-native').projectDir = new File(rootProject.projectDir, '../node_modules/@sentry/react-native/android')
+include ':react-native-android-open-settings'
+project(':react-native-android-open-settings').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-android-open-settings/android')
+include ':react-native-permissions'
+project(':react-native-permissions').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-permissions/android')
+include ':react-native-fast-image'
+project(':react-native-fast-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fast-image/android')
+include ':react-native-haptic-feedback'
+project(':react-native-haptic-feedback').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-haptic-feedback/android')
+include ':react-native-gesture-handler'
+project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
+include ':react-native-document-picker'
+project(':react-native-document-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-document-picker/android')
+include ':react-native-keychain'
+project(':react-native-keychain').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-keychain/android')
+include ':react-native-doc-viewer'
+project(':react-native-doc-viewer').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-doc-viewer/android')
+include ':react-native-video'
+project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android')
+include ':react-native-youtube'
+project(':react-native-youtube').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-youtube/android')
+include ':react-native-exception-handler'
+project(':react-native-exception-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-exception-handler/android')
+include ':rn-fetch-blob'
+project(':rn-fetch-blob').projectDir = new File(rootProject.projectDir, '../node_modules/rn-fetch-blob/android')
+include ':jail-monkey'
+project(':jail-monkey').projectDir = new File(rootProject.projectDir, '../node_modules/jail-monkey/android')
+include ':react-native-local-auth'
+project(':react-native-local-auth').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-local-auth/android')
+include ':react-native-navigation'
+project(':react-native-navigation').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-navigation/lib/android/app/')
+include ':react-native-image-picker'
+project(':react-native-image-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-image-picker/android')
+include ':react-native-device-info'
+project(':react-native-device-info').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-device-info/android')
+include ':react-native-cookies'
+project(':react-native-cookies').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-cookies/android')
+include ':react-native-vector-icons'
+project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
 include ':reactnativenotifications'
 project(':reactnativenotifications').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-notifications/android/app')
-apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
+
 include ':app'
+include ':react-native-svg'
+project(':react-native-svg').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-svg/android')
+include ':react-native-linear-gradient'
+project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')
+include ':react-native-webview'
+project(':react-native-webview').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webview/android')
+include ':@react-native-community_async-storage'
+project(':@react-native-community_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/async-storage/android')
+include ':@react-native-community_netinfo'
+project(':@react-native-community_netinfo').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/netinfo/android')

app/actions/device/index.js

@@ -1,17 +1,17 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
+import {networkStatusChangedAction} from 'redux-offline';
+
 import {DeviceTypes} from 'app/constants';
 
 export function connection(isOnline) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        if (isOnline !== undefined && isOnline !== state.device.connection) { //eslint-disable-line no-undefined
-            dispatch({
-                type: DeviceTypes.CONNECTION_CHANGED,
-                data: isOnline,
-            });
-        }
+    return async (dispatch) => {
+        dispatch(networkStatusChangedAction(isOnline));
+        dispatch({
+            type: DeviceTypes.CONNECTION_CHANGED,
+            data: isOnline,
+        });
     };
 }
 

app/actions/helpers/channels.ts

@@ -1,355 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import {ChannelTypes, PreferenceTypes, RoleTypes, UserTypes} from '@mm-redux/action_types';
-import {Client4} from '@mm-redux/client';
-import {General, Preferences} from '@mm-redux/constants';
-import {getCurrentChannelId} from '@mm-redux/selectors/entities/channels';
-import {getConfig} from '@mm-redux/selectors/entities/general';
-import {getMyPreferences} from '@mm-redux/selectors/entities/preferences';
-import {getCurrentUserId, getUsers, getUserIdsInChannels} from '@mm-redux/selectors/entities/users';
-import {getUserIdFromChannelName, isAutoClosed} from '@mm-redux/utils/channel_utils';
-import {getPreferenceKey} from '@mm-redux/utils/preference_utils';
-
-import {ActionResult, GenericAction} from '@mm-redux/types/actions';
-import {Channel, ChannelMembership} from '@mm-redux/types/channels';
-import {PreferenceType} from '@mm-redux/types/preferences';
-import {GlobalState} from '@mm-redux/types/store';
-import {UserProfile} from '@mm-redux/types/users';
-import {RelationOneToMany} from '@mm-redux/types/utilities';
-
-import {isDirectChannelVisible, isGroupChannelVisible} from '@utils/channels';
-import {buildPreference} from '@utils/preferences';
-
-export async function loadSidebarDirectMessagesProfiles(state: GlobalState, channels: Array<Channel>, channelMembers: Array<ChannelMembership>) {
-    const currentUserId = getCurrentUserId(state);
-    const usersInChannel: RelationOneToMany<Channel, UserProfile> = getUserIdsInChannels(state);
-    const directChannels = Object.values(channels).filter((c) => c.type === General.DM_CHANNEL || c.type === General.GM_CHANNEL);
-    const prefs: Array<PreferenceType> = [];
-    const promises: Array<Promise<ActionResult>> = []; //only fetch profiles that we don't have and the Direct channel should be visible
-    const actions = [];
-
-    // Prepare preferences and start fetching profiles to batch them
-    directChannels.forEach((c) => {
-        const profileIds = Array.from(usersInChannel[c.id] || []);
-        const profilesInChannel: Array<string> = profileIds.filter((u: string) => u !== currentUserId);
-        switch (c.type) {
-        case General.DM_CHANNEL: {
-            const dm = fetchDirectMessageProfileIfNeeded(state, c, channelMembers, profilesInChannel);
-            if (dm.preferences.length) {
-                prefs.push(...dm.preferences);
-            }
-
-            if (dm.promise) {
-                promises.push(dm.promise);
-            }
-            break;
-        }
-        case General.GM_CHANNEL: {
-            const gm = fetchGroupMessageProfilesIfNeeded(state, c, channelMembers, profilesInChannel);
-
-            if (gm.preferences.length) {
-                prefs.push(...gm.preferences);
-            }
-
-            if (gm.promise) {
-                promises.push(gm.promise);
-            }
-            break;
-        }
-        }
-    });
-
-    // Save preferences if there are any changes
-    if (prefs.length) {
-        Client4.savePreferences(currentUserId, prefs);
-        actions.push({
-            type: PreferenceTypes.RECEIVED_PREFERENCES,
-            data: prefs,
-        });
-    }
-
-    const profilesAction = await getProfilesFromPromises(promises);
-    if (profilesAction) {
-        actions.push(profilesAction);
-    }
-
-    return actions;
-}
-
-export async function fetchMyChannel(channelId: string) {
-    try {
-        const data = await Client4.getChannel(channelId);
-
-        return {data};
-    } catch (error) {
-        return {error};
-    }
-}
-
-export async function fetchMyChannelMember(channelId: string) {
-    try {
-        const data = await Client4.getMyChannelMember(channelId);
-
-        return {data};
-    } catch (error) {
-        return {error};
-    }
-}
-
-export function markChannelAsUnread(state: GlobalState, teamId: string, channelId: string, mentions: Array<string>): Array<GenericAction> {
-    const {myMembers} = state.entities.channels;
-    const {currentUserId} = state.entities.users;
-
-    const actions: GenericAction[] = [{
-        type: ChannelTypes.INCREMENT_TOTAL_MSG_COUNT,
-        data: {
-            channelId,
-            amount: 1,
-        },
-    }, {
-        type: ChannelTypes.INCREMENT_UNREAD_MSG_COUNT,
-        data: {
-            teamId,
-            channelId,
-            amount: 1,
-            onlyMentions: myMembers[channelId] && myMembers[channelId].notify_props &&
-                myMembers[channelId].notify_props.mark_unread === General.MENTION,
-        },
-    }];
-
-    if (mentions && mentions.indexOf(currentUserId) !== -1) {
-        actions.push({
-            type: ChannelTypes.INCREMENT_UNREAD_MENTION_COUNT,
-            data: {
-                teamId,
-                channelId,
-                amount: 1,
-            },
-        });
-    }
-
-    return actions;
-}
-
-export function makeDirectChannelVisibleIfNecessary(state: GlobalState, otherUserId: string): GenericAction|null {
-    const myPreferences = getMyPreferences(state);
-    const currentUserId = getCurrentUserId(state);
-
-    let preference = myPreferences[getPreferenceKey(Preferences.CATEGORY_DIRECT_CHANNEL_SHOW, otherUserId)];
-
-    if (!preference || preference.value === 'false') {
-        preference = {
-            user_id: currentUserId,
-            category: Preferences.CATEGORY_DIRECT_CHANNEL_SHOW,
-            name: otherUserId,
-            value: 'true',
-        };
-
-        return {
-            type: PreferenceTypes.RECEIVED_PREFERENCES,
-            data: [preference],
-        };
-    }
-
-    return null;
-}
-
-export async function makeGroupMessageVisibleIfNecessary(state: GlobalState, channelId: string) {
-    try {
-        const myPreferences = getMyPreferences(state);
-        const currentUserId = getCurrentUserId(state);
-
-        let preference = myPreferences[getPreferenceKey(Preferences.CATEGORY_GROUP_CHANNEL_SHOW, channelId)];
-
-        if (!preference || preference.value === 'false') {
-            preference = {
-                user_id: currentUserId,
-                category: Preferences.CATEGORY_GROUP_CHANNEL_SHOW,
-                name: channelId,
-                value: 'true',
-            };
-
-            const profilesInChannel = await fetchUsersInChannel(state, channelId);
-
-            return [{
-                type: UserTypes.RECEIVED_BATCHED_PROFILES_IN_CHANNEL,
-                data: [profilesInChannel],
-            }, {
-                type: PreferenceTypes.RECEIVED_PREFERENCES,
-                data: [preference],
-            }];
-        }
-
-        return null;
-    } catch {
-        return null;
-    }
-}
-
-export async function fetchChannelAndMyMember(channelId: string): Promise<Array<GenericAction>> {
-    const actions: Array<GenericAction> = [];
-
-    try {
-        const [channel, member] = await Promise.all([
-            Client4.getChannel(channelId),
-            Client4.getMyChannelMember(channelId),
-        ]);
-
-        actions.push({
-            type: ChannelTypes.RECEIVED_CHANNEL,
-            data: channel,
-        },
-        {
-            type: ChannelTypes.RECEIVED_MY_CHANNEL_MEMBER,
-            data: member,
-        });
-
-        const roles = await Client4.getRolesByNames(member.roles.split(' '));
-        if (roles.length) {
-            actions.push({
-                type: RoleTypes.RECEIVED_ROLES,
-                data: roles,
-            });
-        }
-    } catch {
-        // do nothing
-    }
-
-    return actions;
-}
-
-export async function getAddedDmUsersIfNecessary(state: GlobalState, preferences: PreferenceType[]): Promise<Array<GenericAction>> {
-    const userIds: string[] = [];
-    const actions: Array<GenericAction> = [];
-
-    for (const preference of preferences) {
-        if (preference.category === Preferences.CATEGORY_DIRECT_CHANNEL_SHOW && preference.value === 'true') {
-            userIds.push(preference.name);
-        }
-    }
-
-    if (userIds.length !== 0) {
-        const profiles = getUsers(state);
-        const currentUserId = getCurrentUserId(state);
-
-        const needProfiles: string[] = [];
-
-        for (const userId of userIds) {
-            if (!profiles[userId] && userId !== currentUserId) {
-                needProfiles.push(userId);
-            }
-        }
-
-        if (needProfiles.length > 0) {
-            const data = await Client4.getProfilesByIds(userIds);
-            if (profiles.lenght) {
-                actions.push({
-                    type: UserTypes.RECEIVED_PROFILES_LIST,
-                    data,
-                });
-            }
-        }
-    }
-
-    return actions;
-}
-
-function fetchDirectMessageProfileIfNeeded(state: GlobalState, channel: Channel, channelMembers: Array<ChannelMembership>, profilesInChannel: Array<string>) {
-    const currentUserId = getCurrentUserId(state);
-    const myPreferences = getMyPreferences(state);
-    const users = getUsers(state);
-    const config = getConfig(state);
-    const currentChannelId = getCurrentChannelId(state);
-    const otherUserId = getUserIdFromChannelName(currentUserId, channel.name);
-    const otherUser = users[otherUserId];
-    const dmVisible = isDirectChannelVisible(currentUserId, myPreferences, channel);
-    const dmAutoClosed = isAutoClosed(config, myPreferences, channel, channel.last_post_at, otherUser ? otherUser.delete_at : 0, currentChannelId);
-    const member = channelMembers.find((cm) => cm.channel_id === channel.id);
-    const dmIsUnread = member ? member.mention_count > 0 : false;
-    const dmFetchProfile = dmIsUnread || (dmVisible && !dmAutoClosed);
-    const preferences = [];
-
-    // when then DM is hidden but has new messages
-    if ((!dmVisible || dmAutoClosed) && dmIsUnread) {
-        preferences.push(buildPreference(Preferences.CATEGORY_DIRECT_CHANNEL_SHOW, currentUserId, otherUserId));
-        preferences.push(buildPreference(Preferences.CATEGORY_CHANNEL_OPEN_TIME, currentUserId, channel.id, Date.now().toString()));
-    }
-
-    if (dmFetchProfile && !profilesInChannel.includes(otherUserId) && otherUserId !== currentUserId) {
-        return {
-            preferences,
-            promise: fetchUsersInChannel(state, channel.id),
-        };
-    }
-
-    return {preferences};
-}
-
-function fetchGroupMessageProfilesIfNeeded(state: GlobalState, channel: Channel, channelMembers: Array<ChannelMembership>, profilesInChannel: Array<string>) {
-    const currentUserId = getCurrentUserId(state);
-    const myPreferences = getMyPreferences(state);
-    const config = getConfig(state);
-    const gmVisible = isGroupChannelVisible(myPreferences, channel.id);
-    const gmAutoClosed = isAutoClosed(config, myPreferences, channel, channel.last_post_at, 0);
-    const channelMember = channelMembers.find((cm) => cm.channel_id === channel.id);
-    let hasMentions = false;
-    let isUnread = false;
-
-    if (channelMember) {
-        hasMentions = channelMember.mention_count > 0;
-        isUnread = channelMember.msg_count < channel.total_msg_count;
-    }
-
-    const gmIsUnread = hasMentions || isUnread;
-    const gmFetchProfile = gmIsUnread || (gmVisible && !gmAutoClosed);
-    const preferences = [];
-
-    // when then GM is hidden but has new messages
-    if ((!gmVisible || gmAutoClosed) && gmIsUnread) {
-        preferences.push(buildPreference(Preferences.CATEGORY_GROUP_CHANNEL_SHOW, currentUserId, channel.id));
-        preferences.push(buildPreference(Preferences.CATEGORY_CHANNEL_OPEN_TIME, currentUserId, channel.id, Date.now().toString()));
-    }
-
-    if (gmFetchProfile && !profilesInChannel.length) {
-        return {
-            preferences,
-            promise: fetchUsersInChannel(state, channel.id),
-        };
-    }
-
-    return {preferences};
-}
-
-async function fetchUsersInChannel(state: GlobalState, channelId: string): Promise<ActionResult> {
-    try {
-        const currentUserId = getCurrentUserId(state);
-        const profiles = await Client4.getProfilesInChannel(channelId);
-
-        // When fetching profiles in channels we exclude our own user
-        const users = profiles.filter((p: UserProfile) => p.id !== currentUserId);
-        const data = {
-            channelId,
-            users,
-        };
-
-        return {data};
-    } catch (error) {
-        return {error};
-    }
-}
-
-async function getProfilesFromPromises(promises: Array<Promise<ActionResult>>): Promise<GenericAction | null> {
-    // Get the profiles returned by the promises
-    if (!promises.length) {
-        return null;
-    }
-
-    const result = await Promise.all(promises);
-    const data = result.filter((p: any) => !p.error);
-
-    return {
-        type: UserTypes.RECEIVED_BATCHED_PROFILES_IN_CHANNEL,
-        data,
-    };
-}

app/actions/navigation/index.js

@@ -1,19 +1,18 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {Keyboard, Platform} from 'react-native';
+import {Platform} from 'react-native';
 import {Navigation} from 'react-native-navigation';
+
 import merge from 'deepmerge';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
-import EphemeralStore from '@store/ephemeral_store';
-import Store from '@store/store';
-
-const CHANNEL_SCREEN = 'Channel';
+import store from 'app/store';
+import EphemeralStore from 'app/store/ephemeral_store';
 
 function getThemeFromState() {
-    const state = Store.redux?.getState() || {};
+    const state = store.getState();
 
     return getTheme(state);
 }
@@ -21,63 +20,38 @@ function getThemeFromState() {
 export function resetToChannel(passProps = {}) {
     const theme = getThemeFromState();
 
-    EphemeralStore.clearNavigationComponents();
-
-    const stack = {
-        children: [{
-            component: {
-                id: CHANNEL_SCREEN,
-                name: CHANNEL_SCREEN,
-                passProps,
-                options: {
-                    layout: {
-                        componentBackgroundColor: theme.centerChannelBg,
-                    },
-                    statusBar: {
-                        visible: true,
-                    },
-                    topBar: {
-                        visible: false,
-                        height: 0,
-                        background: {
-                            color: theme.sidebarHeaderBg,
-                        },
-                        backButton: {
-                            visible: false,
-                            color: theme.sidebarHeaderTextColor,
-                        },
-                    },
-                },
-            },
-        }],
-    };
-
-    let platformStack = {stack};
-    if (Platform.OS === 'android') {
-        platformStack = {
-            sideMenu: {
-                left: {
-                    component: {
-                        id: 'MainSidebar',
-                        name: 'MainSidebar',
-                    },
-                },
-                center: {
-                    stack,
-                },
-                right: {
-                    component: {
-                        id: 'SettingsSidebar',
-                        name: 'SettingsSidebar',
-                    },
-                },
-            },
-        };
-    }
-
     Navigation.setRoot({
         root: {
-            ...platformStack,
+            stack: {
+                children: [{
+                    component: {
+                        name: 'Channel',
+                        passProps,
+                        options: {
+                            layout: {
+                                backgroundColor: 'transparent',
+                            },
+                            statusBar: {
+                                visible: true,
+                            },
+                            topBar: {
+                                visible: false,
+                                height: 0,
+                                backButton: {
+                                    color: theme.sidebarHeaderTextColor,
+                                    title: '',
+                                },
+                                background: {
+                                    color: theme.sidebarHeaderBg,
+                                },
+                                title: {
+                                    color: theme.sidebarHeaderTextColor,
+                                },
+                            },
+                        },
+                    },
+                }],
+            },
         },
     });
 }
@@ -90,16 +64,11 @@ export function resetToSelectServer(allowOtherServers) {
             stack: {
                 children: [{
                     component: {
-                        id: 'SelectServer',
                         name: 'SelectServer',
                         passProps: {
                             allowOtherServers,
                         },
                         options: {
-                            layout: {
-                                backgroundColor: theme.centerChannelBg,
-                                componentBackgroundColor: theme.centerChannelBg,
-                            },
                             statusBar: {
                                 visible: true,
                             },
@@ -126,7 +95,7 @@ export function resetToTeams(name, title, passProps = {}, options = {}) {
     const theme = getThemeFromState();
     const defaultOptions = {
         layout: {
-            componentBackgroundColor: theme.centerChannelBg,
+            backgroundColor: theme.centerChannelBg,
         },
         statusBar: {
             visible: true,
@@ -152,7 +121,6 @@ export function resetToTeams(name, title, passProps = {}, options = {}) {
             stack: {
                 children: [{
                     component: {
-                        id: name,
                         name,
                         passProps,
                         options: merge(defaultOptions, options),
@@ -168,12 +136,7 @@ export function goToScreen(name, title, passProps = {}, options = {}) {
     const componentId = EphemeralStore.getNavigationTopComponentId();
     const defaultOptions = {
         layout: {
-            componentBackgroundColor: theme.centerChannelBg,
-        },
-        popGesture: true,
-        sideMenu: {
-            left: {enabled: false},
-            right: {enabled: false},
+            backgroundColor: theme.centerChannelBg,
         },
         topBar: {
             animate: true,
@@ -194,7 +157,6 @@ export function goToScreen(name, title, passProps = {}, options = {}) {
 
     Navigation.push(componentId, {
         component: {
-            id: name,
             name,
             passProps,
             options: merge(defaultOptions, options),
@@ -225,9 +187,8 @@ export async function popToRoot() {
 export function showModal(name, title, passProps = {}, options = {}) {
     const theme = getThemeFromState();
     const defaultOptions = {
-        modalPresentationStyle: Platform.select({ios: 'fullScreen', android: 'none'}),
         layout: {
-            componentBackgroundColor: theme.centerChannelBg,
+            backgroundColor: theme.centerChannelBg,
         },
         statusBar: {
             visible: true,
@@ -255,7 +216,6 @@ export function showModal(name, title, passProps = {}, options = {}) {
         stack: {
             children: [{
                 component: {
-                    id: name,
                     name,
                     passProps,
                     options: merge(defaultOptions, options),
@@ -272,7 +232,6 @@ export function showModalOverCurrentContext(name, passProps = {}, options = {})
         modalPresentationStyle: 'overCurrentContext',
         layout: {
             backgroundColor: 'transparent',
-            componentBackgroundColor: 'transparent',
         },
         topBar: {
             visible: false,
@@ -280,7 +239,6 @@ export function showModalOverCurrentContext(name, passProps = {}, options = {})
         },
         animations: {
             showModal: {
-                waitForRender: true,
                 enabled: animationsEnabled,
                 alpha: {
                     from: 0,
@@ -337,6 +295,23 @@ export async function dismissAllModals(options = {}) {
     }
 }
 
+export function peek(name, passProps = {}, options = {}) {
+    const componentId = EphemeralStore.getNavigationTopComponentId();
+    const defaultOptions = {
+        preview: {
+            commit: false,
+        },
+    };
+
+    Navigation.push(componentId, {
+        component: {
+            name,
+            passProps,
+            options: merge(defaultOptions, options),
+        },
+    });
+}
+
 export function setButtons(componentId, buttons = {leftButtons: [], rightButtons: []}) {
     const options = {
         topBar: {
@@ -353,10 +328,6 @@ export function mergeNavigationOptions(componentId, options) {
 
 export function showOverlay(name, passProps, options = {}) {
     const defaultOptions = {
-        layout: {
-            backgroundColor: 'transparent',
-            componentBackgroundColor: 'transparent',
-        },
         overlay: {
             interceptTouchOutside: false,
         },
@@ -379,69 +350,3 @@ export async function dismissOverlay(componentId) {
         // this componentId to dismiss. We'll do nothing in this case.
     }
 }
-
-export function openMainSideMenu() {
-    if (Platform.OS === 'ios') {
-        return;
-    }
-
-    const componentId = EphemeralStore.getNavigationTopComponentId();
-
-    Keyboard.dismiss();
-    Navigation.mergeOptions(componentId, {
-        sideMenu: {
-            left: {visible: true},
-        },
-    });
-}
-
-export function closeMainSideMenu() {
-    if (Platform.OS === 'ios') {
-        return;
-    }
-
-    Keyboard.dismiss();
-    Navigation.mergeOptions(CHANNEL_SCREEN, {
-        sideMenu: {
-            left: {visible: false},
-        },
-    });
-}
-
-export function enableMainSideMenu(enabled, visible = true) {
-    if (Platform.OS === 'ios') {
-        return;
-    }
-
-    Navigation.mergeOptions(CHANNEL_SCREEN, {
-        sideMenu: {
-            left: {enabled, visible},
-        },
-    });
-}
-
-export function openSettingsSideMenu() {
-    if (Platform.OS === 'ios') {
-        return;
-    }
-
-    Keyboard.dismiss();
-    Navigation.mergeOptions(CHANNEL_SCREEN, {
-        sideMenu: {
-            right: {visible: true},
-        },
-    });
-}
-
-export function closeSettingsSideMenu() {
-    if (Platform.OS === 'ios') {
-        return;
-    }
-
-    Keyboard.dismiss();
-    Navigation.mergeOptions(CHANNEL_SCREEN, {
-        sideMenu: {
-            right: {visible: false},
-        },
-    });
-}

app/actions/navigation/index.test.js

@@ -3,27 +3,20 @@
 
 import {Platform} from 'react-native';
 import {Navigation} from 'react-native-navigation';
-import configureMockStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
+
 import merge from 'deepmerge';
 
-import * as NavigationActions from '@actions/navigation';
-import Preferences from '@mm-redux/constants/preferences';
-import EphemeralStore from '@store/ephemeral_store';
-import intitialState from '@store/initial_state';
-import Store from '@store/store';
+import Preferences from 'mattermost-redux/constants/preferences';
 
-jest.unmock('@actions/navigation');
-jest.mock('@store/ephemeral_store', () => ({
+import EphemeralStore from 'app/store/ephemeral_store';
+import * as NavigationActions from 'app/actions/navigation';
+
+jest.unmock('app/actions/navigation');
+jest.mock('app/store/ephemeral_store', () => ({
     getNavigationTopComponentId: jest.fn(),
-    clearNavigationComponents: jest.fn(),
 }));
 
-const mockStore = configureMockStore([thunk]);
-const store = mockStore(intitialState);
-Store.redux = store;
-
-describe('@actions/navigation', () => {
+describe('app/actions/navigation', () => {
     const topComponentId = 'top-component-id';
     const name = 'name';
     const title = 'title';
@@ -44,12 +37,11 @@ describe('@actions/navigation', () => {
                 stack: {
                     children: [{
                         component: {
-                            id: 'Channel',
                             name: 'Channel',
                             passProps,
                             options: {
                                 layout: {
-                                    componentBackgroundColor: theme.centerChannelBg,
+                                    backgroundColor: 'transparent',
                                 },
                                 statusBar: {
                                     visible: true,
@@ -58,12 +50,15 @@ describe('@actions/navigation', () => {
                                     visible: false,
                                     height: 0,
                                     backButton: {
-                                        visible: false,
                                         color: theme.sidebarHeaderTextColor,
+                                        title: '',
                                     },
                                     background: {
                                         color: theme.sidebarHeaderBg,
                                     },
+                                    title: {
+                                        color: theme.sidebarHeaderTextColor,
+                                    },
                                 },
                             },
                         },
@@ -85,16 +80,11 @@ describe('@actions/navigation', () => {
                 stack: {
                     children: [{
                         component: {
-                            id: 'SelectServer',
                             name: 'SelectServer',
                             passProps: {
                                 allowOtherServers,
                             },
                             options: {
-                                layout: {
-                                    backgroundColor: theme.centerChannelBg,
-                                    componentBackgroundColor: theme.centerChannelBg,
-                                },
                                 statusBar: {
                                     visible: true,
                                 },
@@ -125,7 +115,7 @@ describe('@actions/navigation', () => {
 
         const defaultOptions = {
             layout: {
-                componentBackgroundColor: theme.centerChannelBg,
+                backgroundColor: theme.centerChannelBg,
             },
             statusBar: {
                 visible: true,
@@ -151,7 +141,6 @@ describe('@actions/navigation', () => {
                 stack: {
                     children: [{
                         component: {
-                            id: name,
                             name,
                             passProps,
                             options: merge(defaultOptions, options),
@@ -170,12 +159,7 @@ describe('@actions/navigation', () => {
 
         const defaultOptions = {
             layout: {
-                componentBackgroundColor: theme.centerChannelBg,
-            },
-            popGesture: true,
-            sideMenu: {
-                left: {enabled: false},
-                right: {enabled: false},
+                backgroundColor: theme.centerChannelBg,
             },
             topBar: {
                 animate: true,
@@ -196,7 +180,6 @@ describe('@actions/navigation', () => {
 
         const expectedLayout = {
             component: {
-                id: name,
                 name,
                 passProps,
                 options: merge(defaultOptions, options),
@@ -229,9 +212,8 @@ describe('@actions/navigation', () => {
         const showModal = jest.spyOn(Navigation, 'showModal');
 
         const defaultOptions = {
-            modalPresentationStyle: Platform.select({ios: 'fullScreen', android: 'none'}),
             layout: {
-                componentBackgroundColor: theme.centerChannelBg,
+                backgroundColor: theme.centerChannelBg,
             },
             statusBar: {
                 visible: true,
@@ -259,7 +241,6 @@ describe('@actions/navigation', () => {
             stack: {
                 children: [{
                     component: {
-                        id: name,
                         name,
                         passProps,
                         options: merge(defaultOptions, options),
@@ -281,7 +262,6 @@ describe('@actions/navigation', () => {
             modalPresentationStyle: 'overCurrentContext',
             layout: {
                 backgroundColor: 'transparent',
-                componentBackgroundColor: 'transparent',
             },
             topBar: {
                 visible: false,
@@ -289,7 +269,6 @@ describe('@actions/navigation', () => {
             },
             animations: {
                 showModal: {
-                    waitForRender: true,
                     enabled: animationsEnabled,
                     alpha: {
                         from: 0,
@@ -308,9 +287,8 @@ describe('@actions/navigation', () => {
             },
         };
         const showModalOptions = {
-            modalPresentationStyle: Platform.select({ios: 'fullScreen', android: 'none'}),
             layout: {
-                componentBackgroundColor: theme.centerChannelBg,
+                backgroundColor: theme.centerChannelBg,
             },
             statusBar: {
                 visible: true,
@@ -339,7 +317,6 @@ describe('@actions/navigation', () => {
             stack: {
                 children: [{
                     component: {
-                        id: name,
                         name,
                         passProps,
                         options: merge(showModalOptions, defaultOptions),
@@ -366,9 +343,8 @@ describe('@actions/navigation', () => {
             },
         };
         const defaultOptions = {
-            modalPresentationStyle: Platform.select({ios: 'fullScreen', android: 'none'}),
             layout: {
-                componentBackgroundColor: theme.centerChannelBg,
+                backgroundColor: theme.centerChannelBg,
             },
             statusBar: {
                 visible: true,
@@ -396,7 +372,6 @@ describe('@actions/navigation', () => {
             stack: {
                 children: [{
                     component: {
-                        id: showSearchModalName,
                         name: showSearchModalName,
                         passProps: showSearchModalPassProps,
                         options: merge(defaultOptions, showSearchModalOptions),
@@ -423,6 +398,27 @@ describe('@actions/navigation', () => {
         expect(dismissAllModals).toHaveBeenCalledWith(options);
     });
 
+    test('peek should call Navigation.push', async () => {
+        const push = jest.spyOn(Navigation, 'push');
+
+        const defaultOptions = {
+            preview: {
+                commit: false,
+            },
+        };
+
+        const expectedLayout = {
+            component: {
+                name,
+                passProps,
+                options: merge(defaultOptions, options),
+            },
+        };
+
+        await NavigationActions.peek(name, passProps, options);
+        expect(push).toHaveBeenCalledWith(topComponentId, expectedLayout);
+    });
+
     test('mergeNavigationOptions should call Navigation.mergeOptions', () => {
         const mergeOptions = jest.spyOn(Navigation, 'mergeOptions');
 
@@ -451,10 +447,6 @@ describe('@actions/navigation', () => {
         const showOverlay = jest.spyOn(Navigation, 'showOverlay');
 
         const defaultOptions = {
-            layout: {
-                backgroundColor: 'transparent',
-                componentBackgroundColor: 'transparent',
-            },
             overlay: {
                 interceptTouchOutside: false,
             },

app/actions/views/channel.js

@@ -5,39 +5,64 @@ import {batchActions} from 'redux-batched-actions';
 
 import {ViewTypes} from 'app/constants';
 
-import {ChannelTypes, RoleTypes} from '@mm-redux/action_types';
+import {UserTypes} from 'mattermost-redux/action_types';
 import {
     fetchMyChannelsAndMembers,
     getChannelByNameAndTeamName,
+    markChannelAsRead,
+    markChannelAsViewed,
     leaveChannel as serviceLeaveChannel,
-} from '@mm-redux/actions/channels';
-import {getFilesForPost} from '@mm-redux/actions/files';
-import {savePreferences} from '@mm-redux/actions/preferences';
-import {selectTeam} from '@mm-redux/actions/teams';
-import {Client4} from '@mm-redux/client';
-import {General, Preferences} from '@mm-redux/constants';
-import {getPostIdsInChannel} from '@mm-redux/selectors/entities/posts';
+    selectChannel,
+    getChannelStats,
+} from 'mattermost-redux/actions/channels';
 import {
+    getPosts,
+    getPostsBefore,
+    getPostsSince,
+    getPostThread,
+} from 'mattermost-redux/actions/posts';
+import {getFilesForPost} from 'mattermost-redux/actions/files';
+import {savePreferences} from 'mattermost-redux/actions/preferences';
+import {getTeamMembersByIds, selectTeam} from 'mattermost-redux/actions/teams';
+import {getProfilesInChannel} from 'mattermost-redux/actions/users';
+import {General, Preferences} from 'mattermost-redux/constants';
+import {getPostIdsInChannel} from 'mattermost-redux/selectors/entities/posts';
+import {
+    getChannel,
     getCurrentChannelId,
+    getMyChannelMember,
     getRedirectChannelNameForTeam,
     getChannelsNameMapInTeam,
     isManuallyUnread,
-} from '@mm-redux/selectors/entities/channels';
-import {getCurrentUserId} from '@mm-redux/selectors/entities/users';
-import {getTeamByName} from '@mm-redux/selectors/entities/teams';
+} from 'mattermost-redux/selectors/entities/channels';
+import {getCurrentTeamId, getTeamByName} from 'mattermost-redux/selectors/entities/teams';
 
-import {getChannelByName as selectChannelByName} from '@mm-redux/utils/channel_utils';
-import EventEmitter from '@mm-redux/utils/event_emitter';
+import {getChannelReachable} from 'app/selectors/channel';
 
-import {loadSidebarDirectMessagesProfiles} from '@actions/helpers/channels';
-import {getPosts, getPostsBefore, getPostsSince, getPostThread, loadUnreadChannelPosts} from '@actions/views/post';
-import {INSERT_TO_COMMENT, INSERT_TO_DRAFT} from '@constants/post_textbox';
-import {getChannelReachable} from '@selectors/channel';
-import telemetry from '@telemetry';
-import {isDirectChannelVisible, isGroupChannelVisible, getChannelSinceValue} from '@utils/channels';
-import {isPendingPost} from '@utils/general';
+import telemetry from 'app/telemetry';
 
-const MAX_RETRIES = 3;
+import {
+    getChannelByName,
+    getDirectChannelName,
+    getUserIdFromChannelName,
+    isDirectChannel,
+    isGroupChannel,
+    getChannelByName as getChannelByNameSelector,
+} from 'mattermost-redux/utils/channel_utils';
+import EventEmitter from 'mattermost-redux/utils/event_emitter';
+import {getLastCreateAt} from 'mattermost-redux/utils/post_utils';
+import {getPreferencesByCategory} from 'mattermost-redux/utils/preference_utils';
+
+import {INSERT_TO_COMMENT, INSERT_TO_DRAFT} from 'app/constants/post_textbox';
+import {isDirectChannelVisible, isGroupChannelVisible} from 'app/utils/channels';
+
+const MAX_POST_TRIES = 3;
+
+export function loadChannelsIfNecessary(teamId) {
+    return async (dispatch) => {
+        await dispatch(fetchMyChannelsAndMembers(teamId));
+    };
+}
 
 export function loadChannelsByTeamName(teamName, errorHandler) {
     return async (dispatch, getState) => {
@@ -55,59 +80,187 @@ export function loadChannelsByTeamName(teamName, errorHandler) {
     };
 }
 
+export function loadProfilesAndTeamMembersForDMSidebar(teamId) {
+    return async (dispatch, getState) => {
+        const state = getState();
+        const {currentUserId, profilesInChannel} = state.entities.users;
+        const {channels, myMembers} = state.entities.channels;
+        const {myPreferences} = state.entities.preferences;
+        const {membersInTeam} = state.entities.teams;
+        const dmPrefs = getPreferencesByCategory(myPreferences, Preferences.CATEGORY_DIRECT_CHANNEL_SHOW);
+        const gmPrefs = getPreferencesByCategory(myPreferences, Preferences.CATEGORY_GROUP_CHANNEL_SHOW);
+        const members = [];
+        const loadProfilesForChannels = [];
+        const prefs = [];
+
+        function buildPref(name) {
+            return {
+                user_id: currentUserId,
+                category: Preferences.CATEGORY_DIRECT_CHANNEL_SHOW,
+                name,
+                value: 'true',
+            };
+        }
+
+        // Find DM's and GM's that need to be shown
+        const directChannels = Object.values(channels).filter((c) => (isDirectChannel(c) || isGroupChannel(c)));
+        directChannels.forEach((channel) => {
+            const member = myMembers[channel.id];
+            if (isDirectChannel(channel) && !isDirectChannelVisible(currentUserId, myPreferences, channel) && member && member.mention_count > 0) {
+                const teammateId = getUserIdFromChannelName(currentUserId, channel.name);
+                let pref = dmPrefs.get(teammateId);
+                if (pref) {
+                    pref = {...pref, value: 'true'};
+                } else {
+                    pref = buildPref(teammateId);
+                }
+                dmPrefs.set(teammateId, pref);
+                prefs.push(pref);
+            } else if (isGroupChannel(channel) && !isGroupChannelVisible(myPreferences, channel) && member && (member.mention_count > 0 || member.msg_count < channel.total_msg_count)) {
+                const id = channel.id;
+                let pref = gmPrefs.get(id);
+                if (pref) {
+                    pref = {...pref, value: 'true'};
+                } else {
+                    pref = buildPref(id);
+                }
+                gmPrefs.set(id, pref);
+                prefs.push(pref);
+            }
+        });
+
+        if (prefs.length) {
+            savePreferences(currentUserId, prefs)(dispatch, getState);
+        }
+
+        for (const [key, pref] of dmPrefs) {
+            if (pref.value === 'true') {
+                members.push(key);
+            }
+        }
+
+        for (const [key, pref] of gmPrefs) {
+            //only load the profiles in channels if we don't already have them
+            if (pref.value === 'true' && !profilesInChannel[key]) {
+                loadProfilesForChannels.push(key);
+            }
+        }
+
+        if (loadProfilesForChannels.length) {
+            for (let i = 0; i < loadProfilesForChannels.length; i++) {
+                const channelId = loadProfilesForChannels[i];
+                getProfilesInChannel(channelId, 0)(dispatch, getState);
+            }
+        }
+
+        let membersToLoad = members;
+        if (membersInTeam[teamId]) {
+            membersToLoad = members.filter((m) => !membersInTeam[teamId].hasOwnProperty(m));
+        }
+
+        if (membersToLoad.length) {
+            getTeamMembersByIds(teamId, membersToLoad)(dispatch, getState);
+        }
+
+        const actions = [];
+        for (let i = 0; i < members.length; i++) {
+            const channelName = getDirectChannelName(currentUserId, members[i]);
+            const channel = getChannelByName(channels, channelName);
+            if (channel) {
+                actions.push({
+                    type: UserTypes.RECEIVED_PROFILE_IN_CHANNEL,
+                    data: {id: channel.id, user_id: members[i]},
+                });
+            }
+        }
+
+        if (actions.length) {
+            dispatch(batchActions(actions), getState);
+        }
+    };
+}
+
 export function loadPostsIfNecessaryWithRetry(channelId) {
     return async (dispatch, getState) => {
         const state = getState();
-        const postIds = getPostIdsInChannel(state, channelId);
+        const {posts} = state.entities.posts;
+        const postsIds = getPostIdsInChannel(state, channelId);
         const actions = [];
 
         const time = Date.now();
 
         let loadMorePostsVisible = true;
-        let postAction;
-        if (!postIds || postIds.length < ViewTypes.POST_VISIBILITY_CHUNK_SIZE) {
+        let received;
+        if (!postsIds || postsIds.length < ViewTypes.POST_VISIBILITY_CHUNK_SIZE) {
             // Get the first page of posts if it appears we haven't gotten it yet, like the webapp
-            postAction = getPosts(channelId);
-        } else {
-            const since = getChannelSinceValue(state, channelId, postIds);
-            postAction = getPostsSince(channelId, since);
-        }
+            received = await retryGetPostsAction(getPosts(channelId), dispatch, getState);
 
-        const received = await dispatch(fetchPostActionWithRetry(postAction));
+            if (received?.order) {
+                const count = received.order.length;
+                loadMorePostsVisible = count >= ViewTypes.POST_VISIBILITY_CHUNK_SIZE;
+                actions.push({
+                    type: ViewTypes.SET_INITIAL_POST_COUNT,
+                    data: {
+                        channelId,
+                        count,
+                    },
+                });
+            }
+        } else {
+            const lastConnectAt = state.websocket?.lastConnectAt || 0;
+            const lastGetPosts = state.views.channel.lastGetPosts[channelId];
+
+            let since;
+            if (lastGetPosts && lastGetPosts < lastConnectAt) {
+                // Since the websocket disconnected, we may have missed some posts since then
+                since = lastGetPosts;
+            } else {
+                // Trust that we've received all posts since the last time the websocket disconnected
+                // so just get any that have changed since the latest one we've received
+                const postsForChannel = postsIds.map((id) => posts[id]);
+                since = getLastCreateAt(postsForChannel);
+            }
+
+            received = await retryGetPostsAction(getPostsSince(channelId, since), dispatch, getState);
+
+            if (received?.order) {
+                const count = received.order.length;
+                loadMorePostsVisible = postsIds.length + count >= ViewTypes.POST_VISIBILITY_CHUNK_SIZE;
+                actions.push({
+                    type: ViewTypes.SET_INITIAL_POST_COUNT,
+                    data: {
+                        channelId,
+                        count: postsIds.length + count,
+                    },
+                });
+            }
+        }
 
         if (received) {
             actions.push({
                 type: ViewTypes.RECEIVED_POSTS_FOR_CHANNEL_AT_TIME,
                 channelId,
                 time,
-            },
-            setChannelRetryFailed(false));
-
-            if (received?.order) {
-                const count = received.order.length;
-                loadMorePostsVisible = count >= ViewTypes.POST_VISIBILITY_CHUNK_SIZE;
-            }
+            });
         }
 
         actions.push(setLoadMorePostsVisible(loadMorePostsVisible));
-        dispatch(batchActions(actions, 'BATCH_LOAD_POSTS_IN_CHANNEL'));
+        dispatch(batchActions(actions));
     };
 }
 
-export function fetchPostActionWithRetry(action, maxTries = MAX_RETRIES) {
-    return async (dispatch) => {
-        for (let i = 0; i <= maxTries; i++) {
-            const {data} = await dispatch(action); // eslint-disable-line no-await-in-loop
+export async function retryGetPostsAction(action, dispatch, getState, maxTries = MAX_POST_TRIES) {
+    for (let i = 0; i < maxTries; i++) {
+        const {data} = await dispatch(action); // eslint-disable-line no-await-in-loop
 
-            if (data) {
-                return data;
-            }
+        if (data) {
+            dispatch(setChannelRetryFailed(false));
+            return data;
         }
+    }
 
-        dispatch(setChannelRetryFailed(true));
-
-        return null;
-    };
+    dispatch(setChannelRetryFailed(true));
+    return null;
 }
 
 export function loadFilesForPostIfNecessary(postId) {
@@ -184,6 +337,7 @@ export function selectPenultimateChannel(teamId) {
             lastChannel.delete_at === 0 &&
             (lastChannel.team_id === teamId || isDMVisible || isGMVisible)
         ) {
+            dispatch(setChannelLoading(true));
             dispatch(handleSelectChannel(lastChannelId));
             return;
         }
@@ -197,7 +351,8 @@ export function selectDefaultChannel(teamId) {
         const state = getState();
 
         const channelsInTeam = getChannelsNameMapInTeam(state, teamId);
-        const channel = selectChannelByName(channelsInTeam, getRedirectChannelNameForTeam(state, teamId));
+        const channel = getChannelByNameSelector(channelsInTeam, getRedirectChannelNameForTeam(state, teamId));
+
         let channelId;
         if (channel) {
             channelId = channel.id;
@@ -215,32 +370,39 @@ export function selectDefaultChannel(teamId) {
     };
 }
 
-export function handleSelectChannel(channelId) {
+export function handleSelectChannel(channelId, fromPushNotification = false) {
     return async (dispatch, getState) => {
-        const dt = Date.now();
         const state = getState();
-        const {channels, currentChannelId, myMembers} = state.entities.channels;
-        const {currentTeamId} = state.entities.teams;
-        const channel = channels[channelId];
-        const member = myMembers[channelId];
+        const channel = getChannel(state, channelId);
+        const currentTeamId = getCurrentTeamId(state);
+        const currentChannelId = getCurrentChannelId(state);
+        const sameChannel = channelId === currentChannelId;
+        const member = getMyChannelMember(state, channelId);
 
-        dispatch(loadPostsIfNecessaryWithRetry(channelId));
+        dispatch(setLoadMorePostsVisible(true));
 
-        if (channel && currentChannelId !== channelId) {
-            const actions = markAsViewedAndReadBatch(state, channelId, currentChannelId);
-            actions.push({
-                type: ChannelTypes.SELECT_CHANNEL,
-                data: channelId,
-                extra: {
-                    channel,
-                    member,
-                    teamId: channel.team_id || currentTeamId,
-                },
-            });
-            dispatch(batchActions(actions, 'BATCH_SWITCH_CHANNEL'));
+        // If the app is open from push notification, we already fetched the posts.
+        if (!fromPushNotification) {
+            dispatch(loadPostsIfNecessaryWithRetry(channelId));
         }
 
-        console.log('channel switch to', channel?.display_name, channelId, (Date.now() - dt), 'ms'); //eslint-disable-line
+        let previousChannelId;
+        if (!fromPushNotification && !sameChannel) {
+            previousChannelId = currentChannelId;
+        }
+
+        const actions = [
+            selectChannel(channelId),
+            getChannelStats(channelId),
+            setChannelDisplayName(channel.display_name),
+            setInitialPostVisibility(channelId),
+            setChannelLoading(false),
+            setLastChannelForTeam(currentTeamId, channelId),
+            selectChannelWithMember(channelId, channel, member),
+        ];
+
+        dispatch(batchActions(actions));
+        dispatch(markChannelViewedAndRead(channelId, previousChannelId));
     };
 }
 
@@ -278,16 +440,12 @@ export function handleSelectChannelByName(channelName, teamName, errorHandler) {
 }
 
 export function handlePostDraftChanged(channelId, draft) {
-    return (dispatch, getState) => {
-        const state = getState();
-
-        if (state.views.channel.drafts[channelId]?.draft !== draft) {
-            dispatch({
-                type: ViewTypes.POST_DRAFT_CHANGED,
-                channelId,
-                draft,
-            });
-        }
+    return async (dispatch, getState) => {
+        dispatch({
+            type: ViewTypes.POST_DRAFT_CHANGED,
+            channelId,
+            draft,
+        }, getState);
     };
 }
 
@@ -303,96 +461,20 @@ export function insertToDraft(value) {
 }
 
 export function markChannelViewedAndRead(channelId, previousChannelId, markOnServer = true) {
-    return (dispatch, getState) => {
-        const state = getState();
-        const actions = markAsViewedAndReadBatch(state, channelId, previousChannelId, markOnServer);
-
-        dispatch(batchActions(actions, 'BATCH_MARK_CHANNEL_VIEWED_AND_READ'));
+    return (dispatch) => {
+        dispatch(markChannelAsRead(channelId, previousChannelId, markOnServer));
+        dispatch(markChannelAsViewed(channelId, previousChannelId));
     };
 }
 
-export function markAsViewedAndReadBatch(state, channelId, prevChannelId = '', markOnServer = true) {
-    const actions = [];
-    const {channels, myMembers} = state.entities.channels;
-    const channel = channels[channelId];
-    const member = myMembers[channelId];
-    const prevMember = myMembers[prevChannelId];
-    const prevChanManuallyUnread = isManuallyUnread(state, prevChannelId);
-    const prevChannel = (!prevChanManuallyUnread && prevChannelId) ? channels[prevChannelId] : null; // May be null since prevChannelId is optional
-
-    if (markOnServer) {
-        Client4.viewMyChannel(channelId, prevChanManuallyUnread ? '' : prevChannelId);
-    }
-
-    if (member) {
-        actions.push({
-            type: ChannelTypes.RECEIVED_MY_CHANNEL_MEMBER,
-            data: {...member, last_viewed_at: Date.now()},
-        });
-
-        if (isManuallyUnread(state, channelId)) {
-            actions.push({
-                type: ChannelTypes.REMOVE_MANUALLY_UNREAD,
-                data: {channelId},
-            });
-        }
-
-        if (channel) {
-            actions.push({
-                type: ChannelTypes.DECREMENT_UNREAD_MSG_COUNT,
-                data: {
-                    teamId: channel.team_id,
-                    channelId,
-                    amount: channel.total_msg_count - member.msg_count,
-                },
-            }, {
-                type: ChannelTypes.DECREMENT_UNREAD_MENTION_COUNT,
-                data: {
-                    teamId: channel.team_id,
-                    channelId,
-                    amount: member.mention_count,
-                },
-            });
-        }
-    }
-
-    if (prevMember) {
-        if (!prevChanManuallyUnread) {
-            actions.push({
-                type: ChannelTypes.RECEIVED_MY_CHANNEL_MEMBER,
-                data: {...prevMember, last_viewed_at: Date.now()},
-            });
-        }
-
-        if (prevChannel) {
-            actions.push({
-                type: ChannelTypes.DECREMENT_UNREAD_MSG_COUNT,
-                data: {
-                    teamId: prevChannel.team_id,
-                    channelId: prevChannelId,
-                    amount: prevChannel.total_msg_count - prevMember.msg_count,
-                },
-            }, {
-                type: ChannelTypes.DECREMENT_UNREAD_MENTION_COUNT,
-                data: {
-                    teamId: prevChannel.team_id,
-                    channelId: prevChannelId,
-                    amount: prevMember.mention_count,
-                },
-            });
-        }
-    }
-
-    return actions;
-}
-
 export function markChannelViewedAndReadOnReconnect(channelId) {
     return (dispatch, getState) => {
         if (isManuallyUnread(getState(), channelId)) {
             return;
         }
 
-        dispatch(markChannelViewedAndRead(channelId));
+        dispatch(markChannelAsRead(channelId));
+        dispatch(markChannelAsViewed(channelId));
     };
 }
 
@@ -458,16 +540,10 @@ export function closeGMChannel(channel) {
 }
 
 export function refreshChannelWithRetry(channelId) {
-    return async (dispatch) => {
+    return async (dispatch, getState) => {
         dispatch(setChannelRefreshing(true));
-        const posts = await dispatch(fetchPostActionWithRetry(getPosts(channelId)));
-        const actions = [setChannelRefreshing(false)];
-
-        if (posts) {
-            actions.push(setChannelRetryFailed(false));
-        }
-
-        dispatch(batchActions(actions, 'BATCH_REEFRESH_CHANNEL'));
+        const posts = await retryGetPostsAction(getPosts(channelId), dispatch, getState);
+        dispatch(setChannelRefreshing(false));
         return posts;
     };
 }
@@ -532,8 +608,8 @@ export function setChannelDisplayName(displayName) {
 export function increasePostVisibility(channelId, postId) {
     return async (dispatch, getState) => {
         const state = getState();
-        const {loadingPosts} = state.views.channel;
-        const currentUserId = getCurrentUserId(state);
+        const {loadingPosts, postVisibility} = state.views.channel;
+        const currentPostVisibility = postVisibility[channelId] || 0;
 
         if (loadingPosts[channelId]) {
             return true;
@@ -544,8 +620,17 @@ export function increasePostVisibility(channelId, postId) {
             return true;
         }
 
-        if (isPendingPost(postId, currentUserId)) {
-            // This is the first created post in the channel
+        // Check if we already have the posts that we want to show
+        const loadedPostCount = state.views.channel.postCountInChannel[channelId] || 0;
+        const desiredPostVisibility = currentPostVisibility + ViewTypes.POST_VISIBILITY_CHUNK_SIZE;
+
+        if (loadedPostCount >= desiredPostVisibility) {
+            // We already have the posts, so we just need to show them
+            dispatch(batchActions([
+                doIncreasePostVisibility(channelId),
+                setLoadMorePostsVisible(true),
+            ]));
+
             return true;
         }
 
@@ -560,8 +645,7 @@ export function increasePostVisibility(channelId, postId) {
 
         const pageSize = ViewTypes.POST_VISIBILITY_CHUNK_SIZE;
 
-        const postAction = getPostsBefore(channelId, postId, 0, pageSize);
-        const result = await dispatch(fetchPostActionWithRetry(postAction));
+        const result = await retryGetPostsAction(getPostsBefore(channelId, postId, 0, pageSize), dispatch, getState);
 
         const actions = [{
             type: ViewTypes.LOADING_POSTS,
@@ -569,19 +653,27 @@ export function increasePostVisibility(channelId, postId) {
             channelId,
         }];
 
-        if (result) {
-            actions.push(setChannelRetryFailed(false));
-        }
-
         let hasMorePost = false;
         if (result?.order) {
             const count = result.order.length;
             hasMorePost = count >= pageSize;
 
+            actions.push({
+                type: ViewTypes.INCREASE_POST_COUNT,
+                data: {
+                    channelId,
+                    count,
+                },
+            });
+
+            // make sure to increment the posts visibility
+            // only if we got results
+            actions.push(doIncreasePostVisibility(channelId));
+
             actions.push(setLoadMorePostsVisible(hasMorePost));
         }
 
-        dispatch(batchActions(actions, 'BATCH_LOAD_MORE_POSTS'));
+        dispatch(batchActions(actions));
         telemetry.end(['posts:loading']);
         telemetry.save();
 
@@ -589,6 +681,24 @@ export function increasePostVisibility(channelId, postId) {
     };
 }
 
+export function increasePostVisibilityByOne(channelId) {
+    return (dispatch) => {
+        dispatch({
+            type: ViewTypes.INCREASE_POST_VISIBILITY,
+            data: channelId,
+            amount: 1,
+        });
+    };
+}
+
+function doIncreasePostVisibility(channelId) {
+    return {
+        type: ViewTypes.INCREASE_POST_VISIBILITY,
+        data: channelId,
+        amount: ViewTypes.POST_VISIBILITY_CHUNK_SIZE,
+    };
+}
+
 function setLoadMorePostsVisible(visible) {
     return {
         type: ViewTypes.SET_LOAD_MORE_POSTS_VISIBLE,
@@ -596,80 +706,26 @@ function setLoadMorePostsVisible(visible) {
     };
 }
 
-export function loadChannelsForTeam(teamId, skipDispatch = false) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        const currentUserId = getCurrentUserId(state);
-        const data = {sync: true, teamId};
-        const actions = [];
-
-        if (currentUserId) {
-            for (let i = 0; i <= MAX_RETRIES; i++) {
-                try {
-                    console.log('Fetching channels attempt', teamId, (i + 1)); //eslint-disable-line no-console
-                    const [channels, channelMembers] = await Promise.all([ //eslint-disable-line no-await-in-loop
-                        Client4.getMyChannels(teamId, true),
-                        Client4.getMyChannelMembers(teamId),
-                    ]);
-
-                    data.channels = channels;
-                    data.channelMembers = channelMembers;
-                    break;
-                } catch (err) {
-                    if (i === MAX_RETRIES) {
-                        const hasChannelsLoaded = state.entities.channels.channelsInTeam[teamId]?.size > 0;
-                        return {error: hasChannelsLoaded ? null : err};
-                    }
-                }
-            }
-
-            if (data.channels) {
-                actions.push({
-                    type: ChannelTypes.RECEIVED_MY_CHANNELS_WITH_MEMBERS,
-                    data,
-                });
-
-                if (!skipDispatch) {
-                    const rolesToLoad = new Set();
-                    const members = data.channelMembers;
-                    for (const member of members) {
-                        for (const role of member.roles.split(' ')) {
-                            rolesToLoad.add(role);
-                        }
-                    }
-
-                    if (rolesToLoad.size > 0) {
-                        data.roles = await Client4.getRolesByNames(Array.from(rolesToLoad));
-                        if (data.roles.length) {
-                            actions.push({
-                                type: RoleTypes.RECEIVED_ROLES,
-                                data: data.roles,
-                            });
-                        }
-                    }
-
-                    dispatch(batchActions(actions, 'BATCH_LOAD_CHANNELS_FOR_TEAM'));
-                }
-
-                // Fetch needed profiles from channel creators and direct channels
-                dispatch(loadSidebar(data));
-
-                dispatch(loadUnreadChannelPosts(data.channels, data.channelMembers));
-            }
-        }
-
-        return {data};
+function setInitialPostVisibility(channelId) {
+    return {
+        type: ViewTypes.SET_INITIAL_POST_VISIBILITY,
+        data: channelId,
     };
 }
 
-function loadSidebar(data) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        const {channels, channelMembers} = data;
-
-        const sidebarActions = await loadSidebarDirectMessagesProfiles(state, channels, channelMembers);
-        if (sidebarActions.length) {
-            dispatch(batchActions(sidebarActions, 'BATCH_LOAD_SIDEBAR'));
-        }
+function setLastChannelForTeam(teamId, channelId) {
+    return {
+        type: ViewTypes.SET_LAST_CHANNEL_FOR_TEAM,
+        teamId,
+        channelId,
+    };
+}
+
+function selectChannelWithMember(channelId, channel, member) {
+    return {
+        type: ViewTypes.SELECT_CHANNEL_WITH_MEMBER,
+        data: channelId,
+        channel,
+        member,
     };
 }

app/actions/views/channel.test.js

@@ -4,25 +4,24 @@
 import configureStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 
+import initialState from 'app/initial_state';
+import {ViewTypes} from 'app/constants';
 import testHelper from 'test/test_helper';
 
-import * as ChannelActions from '@actions/views/channel';
-import {ViewTypes} from '@constants';
-import {ChannelTypes} from '@mm-redux/action_types';
-import postReducer from '@mm-redux/reducers/entities/posts';
-import initialState from '@store/initial_state';
-
+import * as ChannelActions from 'app/actions/views/channel';
 const {
     handleSelectChannel,
     handleSelectChannelByName,
     loadPostsIfNecessaryWithRetry,
 } = ChannelActions;
 
+import postReducer from 'mattermost-redux/reducers/entities/posts';
+
 const MOCK_CHANNEL_MARK_AS_READ = 'MOCK_CHANNEL_MARK_AS_READ';
 const MOCK_CHANNEL_MARK_AS_VIEWED = 'MOCK_CHANNEL_MARK_AS_VIEWED';
 
-jest.mock('@mm-redux/actions/channels', () => {
-    const channelActions = require.requireActual('@mm-redux/actions/channels');
+jest.mock('mattermost-redux/actions/channels', () => {
+    const channelActions = require.requireActual('mattermost-redux/actions/channels');
     return {
         ...channelActions,
         markChannelAsRead: jest.fn().mockReturnValue({type: 'MOCK_CHANNEL_MARK_AS_READ'}),
@@ -30,8 +29,8 @@ jest.mock('@mm-redux/actions/channels', () => {
     };
 });
 
-jest.mock('@mm-redux/selectors/entities/teams', () => {
-    const teamSelectors = require.requireActual('@mm-redux/selectors/entities/teams');
+jest.mock('mattermost-redux/selectors/entities/teams', () => {
+    const teamSelectors = require.requireActual('mattermost-redux/selectors/entities/teams');
     return {
         ...teamSelectors,
         getTeamByName: jest.fn(() => ({name: 'current-team-name'})),
@@ -49,7 +48,7 @@ describe('Actions.Views.Channel', () => {
     const MOCK_RECEIVED_POSTS_IN_CHANNEL = 'RECEIVED_POSTS_IN_CHANNEL';
     const MOCK_RECEIVED_POSTS_SINCE = 'MOCK_RECEIVED_POSTS_SINCE';
 
-    const actions = require('@mm-redux/actions/channels');
+    const actions = require('mattermost-redux/actions/channels');
     actions.getChannelByNameAndTeamName = jest.fn((teamName) => {
         if (teamName) {
             return {
@@ -67,7 +66,7 @@ describe('Actions.Views.Channel', () => {
         type: MOCK_SELECT_CHANNEL_TYPE,
         data: 'selected-channel-id',
     });
-    const postActions = require('./post');
+    const postActions = require('mattermost-redux/actions/posts');
     postActions.getPostsSince = jest.fn(() => {
         return {
             type: MOCK_RECEIVED_POSTS_SINCE,
@@ -97,7 +96,7 @@ describe('Actions.Views.Channel', () => {
         };
     });
 
-    const postUtils = require('@mm-redux/utils/post_utils');
+    const postUtils = require('mattermost-redux/utils/post_utils');
     postUtils.getLastCreateAt = jest.fn((array) => {
         return array[0].create_at;
     });
@@ -117,29 +116,21 @@ describe('Actions.Views.Channel', () => {
             },
             channels: {
                 currentChannelId,
-                manuallyUnread: {},
-                channels: {
-                    'channel-id': {id: 'channel-id', display_name: 'Test Channel'},
-                    'channel-id-2': {id: 'channel-id-2', display_name: 'Test Channel'},
-                },
-                myMembers: {
-                    'channel-id': {channel_id: 'channel-id', user_id: currentUserId, mention_count: 0, msg_count: 0},
-                    'channel-id-2': {channel_id: 'channel-id-2', user_id: currentUserId, mention_count: 0, msg_count: 0},
-                },
             },
             teams: {
-                currentTeamId,
                 teams: {
-                    [currentTeamId]: {
-                        id: currentTeamId,
-                        name: currentTeamName,
+                    currentTeamId,
+                    currentTeams: {
+                        [currentTeamId]: {
+                            name: currentTeamName,
+                        },
                     },
                 },
             },
         },
     };
 
-    const channelSelectors = require('@mm-redux/selectors/entities/channels');
+    const channelSelectors = require('mattermost-redux/selectors/entities/channels');
     channelSelectors.getChannel = jest.fn((state, channelId) => ({data: channelId}));
     channelSelectors.getCurrentChannelId = jest.fn(() => currentChannelId);
     channelSelectors.getMyChannelMember = jest.fn(() => ({data: {member: {}}}));
@@ -156,13 +147,14 @@ describe('Actions.Views.Channel', () => {
         const receivedChannel = storeActions.some((action) => action.type === MOCK_RECEIVE_CHANNEL_TYPE);
         expect(receivedChannel).toBe(true);
 
-        const selectedChannel = storeActions.some(({type}) => type === MOCK_RECEIVE_CHANNEL_TYPE);
+        const storeBatchActions = storeActions.filter(({type}) => type === 'BATCHING_REDUCER.BATCH');
+        const selectedChannel = storeBatchActions[0].payload.some((action) => action.type === MOCK_SELECT_CHANNEL_TYPE);
         expect(selectedChannel).toBe(true);
     });
 
     test('handleSelectChannelByName failure from null currentTeamName', async () => {
         const failStoreObj = {...storeObj};
-        failStoreObj.entities.teams.currentTeamId = 'not-in-current-teams';
+        failStoreObj.entities.teams.teams.currentTeamId = 'not-in-current-teams';
         store = mockStore(failStoreObj);
 
         await store.dispatch(handleSelectChannelByName(currentChannelName, null));
@@ -176,7 +168,6 @@ describe('Actions.Views.Channel', () => {
     });
 
     test('handleSelectChannelByName failure from no permission to channel', async () => {
-        store = mockStore({...storeObj});
         actions.getChannelByNameAndTeamName = jest.fn(() => {
             return {
                 type: 'MOCK_ERROR',
@@ -212,9 +203,9 @@ describe('Actions.Views.Channel', () => {
         expect(postActions.getPosts).toBeCalled();
 
         const storeActions = store.getActions();
-        const storeBatchActions = storeActions.filter(({type}) => type === 'BATCH_LOAD_POSTS_IN_CHANNEL');
+        const storeBatchActions = storeActions.filter(({type}) => type === 'BATCHING_REDUCER.BATCH');
         const receivedPosts = storeActions.find(({type}) => type === MOCK_RECEIVED_POSTS);
-        const receivedPostsAtAction = storeBatchActions[0].payload.some((action) => action.type === ViewTypes.RECEIVED_POSTS_FOR_CHANNEL_AT_TIME);
+        const receivedPostsAtAction = storeBatchActions[0].payload.some((action) => action.type === 'RECEIVED_POSTS_FOR_CHANNEL_AT_TIME');
 
         nextPostState = postReducer(store.getState().entities.posts, receivedPosts);
         nextPostState = postReducer(nextPostState, {
@@ -286,45 +277,35 @@ describe('Actions.Views.Channel', () => {
     });
 
     const handleSelectChannelCases = [
-        [currentChannelId],
-        [`${currentChannelId}-2`],
-        [`not-${currentChannelId}`],
-        [`not-${currentChannelId}-2`],
+        [currentChannelId, true],
+        [currentChannelId, false],
+        [`not-${currentChannelId}`, true],
+        [`not-${currentChannelId}`, false],
     ];
-    test.each(handleSelectChannelCases)('handleSelectChannel dispatches selectChannelWithMember', async (channelId) => {
-        const testObj = {...storeObj};
-        testObj.entities.teams.currentTeamId = currentTeamId;
-        store = mockStore(testObj);
+    test.each(handleSelectChannelCases)('handleSelectChannel dispatches selectChannelWithMember', async (channelId, fromPushNotification) => {
+        store = mockStore({...storeObj});
 
-        await store.dispatch(handleSelectChannel(channelId));
+        await store.dispatch(handleSelectChannel(channelId, fromPushNotification));
         const storeActions = store.getActions();
-        const storeBatchActions = storeActions.find(({type}) => type === 'BATCH_SWITCH_CHANNEL');
-        const selectChannelWithMember = storeBatchActions?.payload.find(({type}) => type === ChannelTypes.SELECT_CHANNEL);
+        const storeBatchActions = storeActions.find(({type}) => type === 'BATCHING_REDUCER.BATCH');
+        const selectChannelWithMember = storeBatchActions.payload.find(({type}) => type === ViewTypes.SELECT_CHANNEL_WITH_MEMBER);
         const viewedAction = storeActions.find(({type}) => type === MOCK_CHANNEL_MARK_AS_VIEWED);
         const readAction = storeActions.find(({type}) => type === MOCK_CHANNEL_MARK_AS_READ);
 
         const expectedSelectChannelWithMember = {
-            type: ChannelTypes.SELECT_CHANNEL,
+            type: ViewTypes.SELECT_CHANNEL_WITH_MEMBER,
             data: channelId,
-            extra: {
-                channel: {
-                    id: channelId,
-                    display_name: 'Test Channel',
-                },
-                member: {
-                    channel_id: channelId,
-                    user_id: currentUserId,
-                    mention_count: 0,
-                    msg_count: 0,
-                },
-                teamId: currentTeamId,
+            channel: {
+                data: channelId,
             },
+            member: {
+                data: {
+                    member: {},
+                },
+            },
+
         };
-        if (channelId.includes('not') || channelId === currentChannelId) {
-            expect(selectChannelWithMember).toBe(undefined);
-        } else {
-            expect(selectChannelWithMember).toStrictEqual(expectedSelectChannelWithMember);
-        }
+        expect(selectChannelWithMember).toStrictEqual(expectedSelectChannelWithMember);
         expect(viewedAction).not.toBe(null);
         expect(readAction).not.toBe(null);
     });

app/actions/views/channel_add_members.js

@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {addChannelMember} from '@mm-redux/actions/channels';
+import {addChannelMember} from 'mattermost-redux/actions/channels';
 
 export function handleAddChannelMembers(channelId, members) {
     return async (dispatch) => {

app/actions/views/channel_members.js

@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {removeChannelMember} from '@mm-redux/actions/channels';
+import {removeChannelMember} from 'mattermost-redux/actions/channels';
 
 export function handleRemoveChannelMembers(channelId, members) {
     return async (dispatch, getState) => {

app/actions/views/command.js

@@ -1,9 +1,9 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {IntegrationTypes} from '@mm-redux/action_types';
-import {executeCommand as executeCommandService} from '@mm-redux/actions/integrations';
-import {getCurrentTeamId} from '@mm-redux/selectors/entities/teams';
+import {IntegrationTypes} from 'mattermost-redux/action_types';
+import {executeCommand as executeCommandService} from 'mattermost-redux/actions/integrations';
+import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
 
 export function executeCommand(message, channelId, rootId) {
     return async (dispatch, getState) => {

app/actions/views/create_channel.js

@@ -2,11 +2,11 @@
 // See LICENSE.txt for license information.
 
 import {handleSelectChannel, setChannelDisplayName} from './channel';
-import {createChannel} from '@mm-redux/actions/channels';
-import {getCurrentTeamId} from '@mm-redux/selectors/entities/teams';
-import {getCurrentUserId} from '@mm-redux/selectors/entities/users';
-import {cleanUpUrlable} from '@mm-redux/utils/channel_utils';
-import {generateId} from '@mm-redux/utils/helpers';
+import {createChannel} from 'mattermost-redux/actions/channels';
+import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
+import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
+import {cleanUpUrlable} from 'mattermost-redux/utils/channel_utils';
+import {generateId} from 'mattermost-redux/utils/helpers';
 
 export function generateChannelNameFromDisplayName(displayName) {
     let name = cleanUpUrlable(displayName);

app/actions/views/edit_profile.js

@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {updateMe, setDefaultProfileImage} from '@mm-redux/actions/users';
+import {updateMe, setDefaultProfileImage} from 'mattermost-redux/actions/users';
 
 import {ViewTypes} from 'app/constants';
 

app/actions/views/emoji.js

@@ -1,12 +1,8 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {batchActions} from 'redux-batched-actions';
-
-import {EmojiTypes} from '@mm-redux/action_types';
-import {addReaction as serviceAddReaction, getNeededCustomEmojis} from '@mm-redux/actions/posts';
-import {Client4} from '@mm-redux/client';
-import {getPostIdsInCurrentChannel, makeGetPostIdsForThread} from '@mm-redux/selectors/entities/posts';
+import {addReaction as serviceAddReaction} from 'mattermost-redux/actions/posts';
+import {getPostIdsInCurrentChannel, makeGetPostIdsForThread} from 'mattermost-redux/selectors/entities/posts';
 
 import {ViewTypes} from 'app/constants';
 
@@ -46,55 +42,3 @@ export function incrementEmojiPickerPage() {
         return {data: true};
     };
 }
-
-export function getEmojisInPosts(posts) {
-    return async (dispatch, getState) => {
-        const state = getState();
-
-        // Do not wait for this as they need to be loaded one by one
-        const emojisToLoad = getNeededCustomEmojis(state, posts);
-
-        if (emojisToLoad?.size > 0) {
-            const promises = emojisToLoad.map((name) => getCustomEmojiByName(name));
-            const result = await Promise.all(promises);
-            const actions = [];
-            const data = [];
-
-            result.forEach((emoji, index) => {
-                const name = emojisToLoad[index];
-
-                if (emoji) {
-                    switch (emoji) {
-                    case 404:
-                        actions.push({type: EmojiTypes.CUSTOM_EMOJI_DOES_NOT_EXIST, data: name});
-                        break;
-                    default:
-                        data.push(emoji);
-                    }
-                }
-            });
-
-            if (data.length) {
-                actions.push({type: EmojiTypes.RECEIVED_CUSTOM_EMOJIS, data});
-            }
-
-            if (actions.length) {
-                dispatch(batchActions(actions, 'BATCH_GET_EMOJIS_FOR_POSTS'));
-            }
-        }
-    };
-}
-
-async function getCustomEmojiByName(name) {
-    try {
-        const data = await Client4.getCustomEmojiByName(name);
-
-        return data;
-    } catch (error) {
-        if (error.status_code === 404) {
-            return 404;
-        }
-    }
-
-    return null;
-}

app/actions/views/file_upload.js

@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {FileTypes} from '@mm-redux/action_types';
+import {FileTypes} from 'mattermost-redux/action_types';
 
 import {ViewTypes} from 'app/constants';
 import {buildFileUploadData, generateId} from 'app/utils/file';

app/actions/views/login.js

@@ -3,21 +3,40 @@
 
 import moment from 'moment-timezone';
 
-import {getDataRetentionPolicy} from '@mm-redux/actions/general';
-import {GeneralTypes} from '@mm-redux/action_types';
-import {getSessions} from '@mm-redux/actions/users';
-import {autoUpdateTimezone} from '@mm-redux/actions/timezone';
-import {Client4} from '@mm-redux/client';
-import {getConfig, getLicense} from '@mm-redux/selectors/entities/general';
-import {isTimezoneEnabled} from '@mm-redux/selectors/entities/timezone';
-import {getCurrentUserId} from '@mm-redux/selectors/entities/users';
+import {getDataRetentionPolicy} from 'mattermost-redux/actions/general';
+import {GeneralTypes} from 'mattermost-redux/action_types';
+import {getSessions} from 'mattermost-redux/actions/users';
+import {autoUpdateTimezone} from 'mattermost-redux/actions/timezone';
+import {Client4} from 'mattermost-redux/client';
+import {getConfig, getLicense} from 'mattermost-redux/selectors/entities/general';
+import {isTimezoneEnabled} from 'mattermost-redux/selectors/entities/timezone';
+import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
 
+import {ViewTypes} from 'app/constants';
 import {setAppCredentials} from 'app/init/credentials';
 import PushNotifications from 'app/push_notifications';
 import {getDeviceTimezoneAsync} from 'app/utils/timezone';
 import {setCSRFFromCookie} from 'app/utils/security';
 import {loadConfigAndLicense} from 'app/actions/views/root';
 
+export function handleLoginIdChanged(loginId) {
+    return async (dispatch, getState) => {
+        dispatch({
+            type: ViewTypes.LOGIN_ID_CHANGED,
+            loginId,
+        }, getState);
+    };
+}
+
+export function handlePasswordChanged(password) {
+    return async (dispatch, getState) => {
+        dispatch({
+            type: ViewTypes.PASSWORD_CHANGED,
+            password,
+        }, getState);
+    };
+}
+
 export function handleSuccessfulLogin() {
     return async (dispatch, getState) => {
         await dispatch(loadConfigAndLicense());
@@ -107,6 +126,8 @@ export function scheduleExpiredNotification(intl) {
 }
 
 export default {
+    handleLoginIdChanged,
+    handlePasswordChanged,
     handleSuccessfulLogin,
     scheduleExpiredNotification,
 };

app/actions/views/login.test.js

@@ -4,9 +4,15 @@
 import configureStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 
-import {Client4} from '@mm-redux/client';
+import * as GeneralActions from 'mattermost-redux/actions/general';
 
-import {handleSuccessfulLogin} from 'app/actions/views/login';
+import {ViewTypes} from 'app/constants';
+
+import {
+    handleLoginIdChanged,
+    handlePasswordChanged,
+    handleSuccessfulLogin,
+} from 'app/actions/views/login';
 
 jest.mock('app/init/credentials', () => ({
     setAppCredentials: () => jest.fn(),
@@ -45,9 +51,31 @@ describe('Actions.Views.Login', () => {
         });
     });
 
+    test('handleLoginIdChanged', () => {
+        const loginId = 'email@example.com';
+
+        const action = {
+            type: ViewTypes.LOGIN_ID_CHANGED,
+            loginId,
+        };
+        store.dispatch(handleLoginIdChanged(loginId));
+        expect(store.getActions()).toEqual([action]);
+    });
+
+    test('handlePasswordChanged', () => {
+        const password = 'password';
+        const action = {
+            type: ViewTypes.PASSWORD_CHANGED,
+            password,
+        };
+
+        store.dispatch(handlePasswordChanged(password));
+        expect(store.getActions()).toEqual([action]);
+    });
+
     test('handleSuccessfulLogin gets config and license ', async () => {
-        const getClientConfig = jest.spyOn(Client4, 'getClientConfigOld');
-        const getLicenseConfig = jest.spyOn(Client4, 'getClientLicenseOld');
+        const getClientConfig = jest.spyOn(GeneralActions, 'getClientConfig');
+        const getLicenseConfig = jest.spyOn(GeneralActions, 'getLicenseConfig');
 
         await store.dispatch(handleSuccessfulLogin());
         expect(getClientConfig).toHaveBeenCalled();

app/actions/views/more_dms.js

@@ -1,9 +1,9 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {getDirectChannelName} from '@mm-redux/utils/channel_utils';
-import {createDirectChannel, createGroupChannel} from '@mm-redux/actions/channels';
-import {getProfilesByIds, getStatusesByIds} from '@mm-redux/actions/users';
+import {getDirectChannelName} from 'mattermost-redux/utils/channel_utils';
+import {createDirectChannel, createGroupChannel} from 'mattermost-redux/actions/channels';
+import {getProfilesByIds, getStatusesByIds} from 'mattermost-redux/actions/users';
 import {handleSelectChannel, toggleDMChannel, toggleGMChannel} from 'app/actions/views/channel';
 
 export function makeDirectChannel(otherUserId, switchToChannel = true) {

app/actions/views/post.js

@@ -1,32 +1,12 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {batchActions} from 'redux-batched-actions';
+import {Posts} from 'mattermost-redux/constants';
+import {doPostAction, receivedNewPost} from 'mattermost-redux/actions/posts';
 
-import {UserTypes} from '@mm-redux/action_types';
-import {
-    doPostAction,
-    getNeededAtMentionedUsernames,
-    receivedNewPost,
-    receivedPost,
-    receivedPosts,
-    receivedPostsBefore,
-    receivedPostsInChannel,
-    receivedPostsSince,
-    receivedPostsInThread,
-} from '@mm-redux/actions/posts';
-import {Client4} from '@mm-redux/client';
-import {Posts} from '@mm-redux/constants';
-import {getPost as selectPost, getPostIdsInChannel} from '@mm-redux/selectors/entities/posts';
-import {getCurrentChannelId} from '@mm-redux/selectors/entities/channels';
-import {removeUserFromList} from '@mm-redux/utils/user_utils';
-import {isUnreadChannel, isArchivedChannel} from '@mm-redux/utils/channel_utils';
+import {ViewTypes} from 'app/constants';
 
-import {ViewTypes} from '@constants';
-import {generateId} from '@utils/file';
-import {getChannelSinceValue} from '@utils/channels';
-
-import {getEmojisInPosts} from './emoji';
+import {generateId} from 'app/utils/file';
 
 export function sendAddToChannelEphemeralPost(user, addedUsername, message, channelId, postRootId = '') {
     return async (dispatch) => {
@@ -78,403 +58,3 @@ export function selectAttachmentMenuAction(postId, actionId, text, value) {
         dispatch(doPostAction(postId, actionId, value));
     };
 }
-
-export function getPosts(channelId, page = 0, perPage = Posts.POST_CHUNK_SIZE) {
-    return async (dispatch, getState) => {
-        try {
-            const state = getState();
-            const {postsInChannel} = state.entities.posts;
-            const postForChannel = postsInChannel[channelId];
-            const data = await Client4.getPosts(channelId, page, perPage);
-            const posts = Object.values(data.posts);
-            const actions = [];
-
-            if (posts?.length) {
-                actions.push(receivedPosts(data));
-                const additional = await dispatch(getPostsAdditionalDataBatch(posts));
-                if (additional.data.length) {
-                    actions.push(...additional.data);
-                }
-            }
-
-            if (posts?.length || !postForChannel) {
-                actions.push(receivedPostsInChannel(data, channelId, page === 0, data.prev_post_id === ''));
-            }
-
-            dispatch(batchActions(actions, 'BATCH_GET_POSTS'));
-
-            return {data};
-        } catch (error) {
-            return {error};
-        }
-    };
-}
-
-export function getPost(postId) {
-    return async (dispatch) => {
-        try {
-            const data = await Client4.getPost(postId);
-
-            if (data) {
-                const actions = [
-                    receivedPost(data),
-                ];
-
-                const additional = await dispatch(getPostsAdditionalDataBatch([data]));
-                if (additional.data.length) {
-                    actions.push(...additional.data);
-                }
-
-                dispatch(batchActions(actions, 'BATCH_GET_POST'));
-            }
-
-            return {data};
-        } catch (error) {
-            return {error};
-        }
-    };
-}
-
-export function getPostsSince(channelId, since) {
-    return async (dispatch) => {
-        try {
-            const data = await Client4.getPostsSince(channelId, since);
-            const posts = Object.values(data.posts);
-
-            if (posts?.length) {
-                const actions = [
-                    receivedPosts(data),
-                    receivedPostsSince(data, channelId),
-                ];
-
-                const additional = await dispatch(getPostsAdditionalDataBatch(posts));
-                if (additional.data.length) {
-                    actions.push(...additional.data);
-                }
-
-                dispatch(batchActions(actions, 'BATCH_GET_POSTS_SINCE'));
-            }
-
-            return {data};
-        } catch (error) {
-            return {error};
-        }
-    };
-}
-
-export function getPostsBefore(channelId, postId, page = 0, perPage = Posts.POST_CHUNK_SIZE) {
-    return async (dispatch) => {
-        try {
-            const data = await Client4.getPostsBefore(channelId, postId, page, perPage);
-            const posts = Object.values(data.posts);
-
-            if (posts?.length) {
-                const actions = [
-                    receivedPosts(data),
-                    receivedPostsBefore(data, channelId, postId, data.prev_post_id === ''),
-                ];
-
-                const additional = await dispatch(getPostsAdditionalDataBatch(posts));
-                if (additional.data.length) {
-                    actions.push(...additional.data);
-                }
-
-                dispatch(batchActions(actions, 'BATCH_GET_POSTS_BEFORE'));
-            }
-
-            return {data};
-        } catch (error) {
-            return {error};
-        }
-    };
-}
-
-export function getPostThread(rootId, skipDispatch = false) {
-    return async (dispatch) => {
-        try {
-            const data = await Client4.getPostThread(rootId);
-            const posts = Object.values(data.posts);
-
-            if (posts.length) {
-                const actions = [
-                    receivedPosts(data),
-                    receivedPostsInThread(data, rootId),
-                ];
-
-                const additional = await dispatch(getPostsAdditionalDataBatch(posts));
-                if (additional.data.length) {
-                    actions.push(...additional.data);
-                }
-
-                if (skipDispatch) {
-                    return {data: actions};
-                }
-
-                dispatch(batchActions(actions, 'BATCH_GET_POSTS_THREAD'));
-            }
-
-            return {data};
-        } catch (error) {
-            return {error};
-        }
-    };
-}
-
-export function getPostsAround(channelId, postId, perPage = Posts.POST_CHUNK_SIZE / 2) {
-    return async (dispatch) => {
-        try {
-            const [before, thread, after] = await Promise.all([
-                Client4.getPostsBefore(channelId, postId, 0, perPage),
-                Client4.getPostThread(postId),
-                Client4.getPostsAfter(channelId, postId, 0, perPage),
-            ]);
-
-            const data = {
-                posts: {
-                    ...after.posts,
-                    ...thread.posts,
-                    ...before.posts,
-                },
-                order: [ // Remember that the order is newest posts first
-                    ...after.order,
-                    postId,
-                    ...before.order,
-                ],
-                next_post_id: after.next_post_id,
-                prev_post_id: before.prev_post_id,
-            };
-
-            const posts = Object.values(data.posts);
-
-            if (posts?.length) {
-                const actions = [
-                    receivedPosts(data),
-                    receivedPostsInChannel(data, channelId, after.next_post_id === '', before.prev_post_id === ''),
-                ];
-
-                const additional = await dispatch(getPostsAdditionalDataBatch(posts));
-                if (additional.data.length) {
-                    actions.push(...additional.data);
-                }
-
-                dispatch(batchActions(actions, 'BATCH_GET_POSTS_AROUND'));
-            }
-
-            return {data};
-        } catch (error) {
-            return {error};
-        }
-    };
-}
-
-export function handleNewPostBatch(WebSocketMessage) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        const post = JSON.parse(WebSocketMessage.data.post);
-        const actions = [receivedNewPost(post)];
-
-        // If we don't have the thread for this post, fetch it from the server
-        // and include the actions in the batch
-        if (post.root_id) {
-            const rootPost = selectPost(state, post.root_id);
-
-            if (!rootPost) {
-                const thread = await dispatch(getPostThread(post.root_id, true));
-                if (thread.actions?.length) {
-                    actions.push(...thread.actions);
-                }
-            }
-        }
-
-        const additional = await dispatch(getPostsAdditionalDataBatch([post]));
-        if (additional.data.length) {
-            actions.push(...additional.data);
-        }
-
-        return actions;
-    };
-}
-
-export function getPostsAdditionalDataBatch(posts = []) {
-    return async (dispatch, getState) => {
-        const data = [];
-
-        if (!posts.length) {
-            return {data};
-        }
-
-        // Custom Emojis used in the posts
-        // Do not wait for this as they need to be loaded one by one
-        dispatch(getEmojisInPosts(posts));
-
-        try {
-            const state = getState();
-            const promises = [];
-            const promiseTrace = [];
-            const extra = userMetadataToLoadFromPosts(state, posts);
-
-            if (extra?.userIds.length) {
-                promises.push(Client4.getProfilesByIds(extra.userIds));
-                promiseTrace.push('ids');
-            }
-
-            if (extra?.usernames.length) {
-                promises.push(Client4.getProfilesByUsernames(extra.usernames));
-                promiseTrace.push('usernames');
-            }
-
-            if (extra?.statuses.length) {
-                promises.push(Client4.getStatusesByIds(extra.statuses));
-                promiseTrace.push('statuses');
-            }
-
-            if (promises.length) {
-                const result = await Promise.all(promises);
-                result.forEach((p, index) => {
-                    if (p.length) {
-                        const type = promiseTrace[index];
-                        switch (type) {
-                        case 'statuses':
-                            data.push({
-                                type: UserTypes.RECEIVED_STATUSES,
-                                data: p,
-                            });
-                            break;
-                        default: {
-                            const {currentUserId} = state.entities.users;
-
-                            removeUserFromList(currentUserId, p);
-                            data.push({
-                                type: UserTypes.RECEIVED_PROFILES_LIST,
-                                data: p,
-                            });
-                            break;
-                        }
-                        }
-                    }
-                });
-            }
-        } catch (error) {
-            // do nothing
-        }
-
-        return {data};
-    };
-}
-
-function userMetadataToLoadFromPosts(state, posts = []) {
-    const {currentUserId, profiles, statuses} = state.entities.users;
-
-    // Profiles of users mentioned in the posts
-    const usernamesToLoad = getNeededAtMentionedUsernames(state, posts);
-
-    // Statuses and profiles of the users who made the posts
-    const userIdsToLoad = new Set();
-    const statusesToLoad = new Set();
-
-    posts.forEach((post) => {
-        const userId = post.user_id;
-
-        if (!statuses[userId]) {
-            statusesToLoad.add(userId);
-        }
-
-        if (userId === currentUserId) {
-            return;
-        }
-
-        if (!profiles[userId]) {
-            userIdsToLoad.add(userId);
-        }
-    });
-
-    return {
-        usernames: Array.from(usernamesToLoad),
-        userIds: Array.from(userIdsToLoad),
-        statuses: Array.from(statusesToLoad),
-    };
-}
-
-export function loadUnreadChannelPosts(channels, channelMembers) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        const currentChannelId = getCurrentChannelId(state);
-
-        const promises = [];
-        const promiseTrace = [];
-
-        const channelMembersByChannel = {};
-        channelMembers.forEach((member) => {
-            channelMembersByChannel[member.channel_id] = member;
-        });
-
-        channels.forEach((channel) => {
-            if (channel.id === currentChannelId || isArchivedChannel(channel)) {
-                return;
-            }
-
-            const isUnread = isUnreadChannel(channelMembersByChannel, channel);
-            if (!isUnread) {
-                return;
-            }
-
-            const postIds = getPostIdsInChannel(state, channel.id);
-
-            let promise;
-            const trace = {
-                channelId: channel.id,
-                since: false,
-            };
-            if (!postIds || !postIds.length) {
-                // Get the first page of posts if it appears we haven't gotten it yet, like the webapp
-                promise = Client4.getPosts(channel.id);
-            } else {
-                const since = getChannelSinceValue(state, channel.id, postIds);
-                promise = Client4.getPostsSince(channel.id, since);
-                trace.since = since;
-            }
-
-            promises.push(promise);
-            promiseTrace.push(trace);
-        });
-
-        let posts = [];
-        const actions = [];
-        if (promises.length) {
-            const results = await Promise.all(promises);
-            results.forEach((data, index) => {
-                const channelPosts = Object.values(data.posts);
-                if (channelPosts.length) {
-                    posts = posts.concat(channelPosts);
-
-                    const trace = promiseTrace[index];
-                    if (trace.since) {
-                        actions.push(receivedPostsSince(data, trace.channelId));
-                    } else {
-                        actions.push(receivedPostsInChannel(data, trace.channelId, true, data.prev_post_id === ''));
-                    }
-
-                    actions.push({
-                        type: ViewTypes.RECEIVED_POSTS_FOR_CHANNEL_AT_TIME,
-                        channelId: trace.channelId,
-                        time: Date.now(),
-                    });
-                }
-            });
-        }
-
-        console.log(`Fetched ${posts.length} posts from ${promises.length} unread channels`); //eslint-disable-line no-console
-        if (posts.length) {
-            // receivedPosts should be the first action dispatched as
-            // receivedPostsSince and receivedPostsInChannel reducers are
-            // dependent on it.
-            actions.unshift(receivedPosts({posts}));
-            const additional = await dispatch(getPostsAdditionalDataBatch(posts));
-            if (additional.data.length) {
-                actions.push(...additional.data);
-            }
-
-            dispatch(batchActions(actions));
-        }
-    };
-}

app/actions/views/post.test.js

@@ -1,186 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import configureStore from 'redux-mock-store';
-import thunk from 'redux-thunk';
-
-import {Client4} from '@mm-redux/client';
-import {PostTypes, UserTypes} from '@mm-redux/action_types';
-
-import * as PostSelectors from '@mm-redux/selectors/entities/posts';
-import * as ChannelUtils from '@mm-redux/utils/channel_utils';
-
-import {ViewTypes} from '@constants';
-import initialState from '@store/initial_state';
-
-import {loadUnreadChannelPosts} from '@actions/views/post';
-
-describe('Actions.Views.Post', () => {
-    const mockStore = configureStore([thunk]);
-
-    let store;
-    const currentChannelId = 'current-channel-id';
-    const storeObj = {
-        ...initialState,
-        entities: {
-            ...initialState.entities,
-            channels: {
-                ...initialState.entities.channels,
-                currentChannelId,
-            },
-        },
-    };
-
-    const channels = [
-        {id: 'channel-1'},
-        {id: 'channel-2'},
-        {id: 'channel-3'},
-    ];
-    const channelMembers = [];
-
-    beforeEach(() => {
-        ChannelUtils.isUnreadChannel = jest.fn().mockReturnValue(true);
-        ChannelUtils.isArchivedChannel = jest.fn().mockReturnValue(false);
-    });
-
-    test('loadUnreadChannelPosts does not dispatch actions if no unread channels', async () => {
-        ChannelUtils.isUnreadChannel = jest.fn().mockReturnValue(false);
-
-        store = mockStore(storeObj);
-        await store.dispatch(loadUnreadChannelPosts(channels, channelMembers));
-
-        const storeActions = store.getActions();
-        expect(storeActions).toStrictEqual([]);
-    });
-
-    test('loadUnreadChannelPosts does not dispatch actions for archived channels', async () => {
-        ChannelUtils.isArchivedChannel = jest.fn().mockReturnValue(true);
-        Client4.getPosts = jest.fn().mockResolvedValue({posts: ['post-1', 'post-2']});
-
-        store = mockStore(storeObj);
-        await store.dispatch(loadUnreadChannelPosts(channels, channelMembers));
-
-        const storeActions = store.getActions();
-        expect(storeActions).toStrictEqual([]);
-    });
-
-    test('loadUnreadChannelPosts does not dispatch actions for current channel', async () => {
-        Client4.getPosts = jest.fn().mockResolvedValue({posts: ['post-1', 'post-2']});
-
-        store = mockStore(storeObj);
-        await store.dispatch(loadUnreadChannelPosts([{id: currentChannelId}], channelMembers));
-
-        const storeActions = store.getActions();
-        expect(storeActions).toStrictEqual([]);
-    });
-
-    test('loadUnreadChannelPosts dispatches actions for unread channels with no postIds in channel', async () => {
-        Client4.getPosts = jest.fn().mockResolvedValue({posts: ['post-1', 'post-2']});
-
-        store = mockStore(storeObj);
-        await store.dispatch(loadUnreadChannelPosts(channels, channelMembers));
-
-        const actionTypes = store.getActions()[0].payload.map((action) => action.type);
-
-        // Actions dispatched:
-        // RECEIVED_POSTS once and first, with all channel posts combined.
-        // RECEIVED_POSTS_IN_CHANNEL and RECEIVED_POSTS_FOR_CHANNEL_AT_TIME for each channel.
-        expect(actionTypes.length).toBe((2 * channels.length) + 1);
-        expect(actionTypes[0]).toEqual(PostTypes.RECEIVED_POSTS);
-
-        const receivedPostsInChannelActions = actionTypes.filter((type) => type === PostTypes.RECEIVED_POSTS_IN_CHANNEL);
-        expect(receivedPostsInChannelActions.length).toBe(channels.length);
-
-        const receivedPostsForChannelAtTimeActions = actionTypes.filter((type) => type === ViewTypes.RECEIVED_POSTS_FOR_CHANNEL_AT_TIME);
-        expect(receivedPostsForChannelAtTimeActions.length).toBe(channels.length);
-    });
-
-    test('loadUnreadChannelPosts dispatches actions for unread channels with postIds in channel', async () => {
-        PostSelectors.getPostIdsInChannel = jest.fn().mockReturnValue(['post-id-in-channel']);
-        Client4.getPostsSince = jest.fn().mockResolvedValue({posts: ['post-1', 'post-2']});
-
-        const lastGetPosts = {};
-        channels.forEach((channel) => {
-            lastGetPosts[channel.id] = Date.now();
-        });
-        const lastConnectAt = Date.now() + 1000;
-        store = mockStore({
-            ...storeObj,
-            views: {
-                channel: {
-                    lastGetPosts,
-                },
-            },
-            websocket: {
-                lastConnectAt,
-            },
-        });
-        await store.dispatch(loadUnreadChannelPosts(channels, channelMembers));
-
-        const actionTypes = store.getActions()[0].payload.map((action) => action.type);
-
-        // Actions dispatched:
-        // RECEIVED_POSTS once and first, with all channel posts combined.
-        // RECEIVED_POSTS_SINCE and RECEIVED_POSTS_FOR_CHANNEL_AT_TIME for each channel.
-        expect(actionTypes.length).toBe((2 * channels.length) + 1);
-        expect(actionTypes[0]).toEqual(PostTypes.RECEIVED_POSTS);
-
-        const receivedPostsInChannelActions = actionTypes.filter((type) => type === PostTypes.RECEIVED_POSTS_SINCE);
-        expect(receivedPostsInChannelActions.length).toBe(channels.length);
-
-        const receivedPostsForChannelAtTimeActions = actionTypes.filter((type) => type === ViewTypes.RECEIVED_POSTS_FOR_CHANNEL_AT_TIME);
-        expect(receivedPostsForChannelAtTimeActions.length).toBe(channels.length);
-    });
-
-    test('loadUnreadChannelPosts dispatches additional actions for unread channels', async () => {
-        const posts = [{
-            user_id: 'user-id',
-            message: '@user post-1',
-        }];
-        PostSelectors.getPostIdsInChannel = jest.fn().mockReturnValue(['post-id-in-channel']);
-        Client4.getPostsSince = jest.fn().mockResolvedValue({posts});
-        Client4.getProfilesByIds = jest.fn().mockResolvedValue(['data']);
-        Client4.getProfilesByUsernames = jest.fn().mockResolvedValue(['data']);
-        Client4.getStatusesByIds = jest.fn().mockResolvedValue(['data']);
-
-        const lastGetPosts = {};
-        channels.forEach((channel) => {
-            lastGetPosts[channel.id] = Date.now();
-        });
-        const lastConnectAt = Date.now() + 1000;
-        store = mockStore({
-            ...storeObj,
-            views: {
-                channel: {
-                    lastGetPosts,
-                },
-            },
-            websocket: {
-                lastConnectAt,
-            },
-        });
-        await store.dispatch(loadUnreadChannelPosts(channels, channelMembers));
-
-        const actionTypes = store.getActions()[0].payload.map((action) => action.type);
-
-        // Actions dispatched:
-        // RECEIVED_POSTS once and first, with all channel posts combined.
-        // RECEIVED_POSTS_SINCE and RECEIVED_POSTS_FOR_CHANNEL_AT_TIME for each channel.
-        // RECEIVED_PROFILES_LIST twice, once for getProfilesByIds and once for getProfilesByUsernames
-        // RECEIVED_STATUSES for getStatusesByIds
-        expect(actionTypes.length).toBe((2 * channels.length) + 4);
-        expect(actionTypes[0]).toEqual(PostTypes.RECEIVED_POSTS);
-
-        const receivedPostsInChannelActions = actionTypes.filter((type) => type === PostTypes.RECEIVED_POSTS_SINCE);
-        expect(receivedPostsInChannelActions.length).toBe(channels.length);
-
-        const receivedPostsForChannelAtTimeActions = actionTypes.filter((type) => type === ViewTypes.RECEIVED_POSTS_FOR_CHANNEL_AT_TIME);
-        expect(receivedPostsForChannelAtTimeActions.length).toBe(channels.length);
-
-        const receivedProfiles = actionTypes.filter((type) => type === UserTypes.RECEIVED_PROFILES_LIST);
-        expect(receivedProfiles.length).toBe(2);
-
-        const receivedStatuses = actionTypes.filter((type) => type === UserTypes.RECEIVED_STATUSES);
-        expect(receivedStatuses.length).toBe(1);
-    });
-});

app/actions/views/root.js

@@ -1,24 +1,18 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {batchActions} from 'redux-batched-actions';
+import {GeneralTypes} from 'mattermost-redux/action_types';
+import {Client4} from 'mattermost-redux/client';
+import {General} from 'mattermost-redux/constants';
+import {fetchMyChannelsAndMembers} from 'mattermost-redux/actions/channels';
+import {getClientConfig, getDataRetentionPolicy, getLicenseConfig} from 'mattermost-redux/actions/general';
+import {receivedNewPost} from 'mattermost-redux/actions/posts';
+import {getMyTeams, getMyTeamMembers, selectTeam} from 'mattermost-redux/actions/teams';
 
-import {ChannelTypes, GeneralTypes, TeamTypes} from '@mm-redux/action_types';
-import {fetchMyChannelsAndMembers} from '@mm-redux/actions/channels';
-import {getDataRetentionPolicy} from '@mm-redux/actions/general';
-import {receivedNewPost} from '@mm-redux/actions/posts';
-import {getMyTeams, getMyTeamMembers} from '@mm-redux/actions/teams';
-import {Client4} from '@mm-redux/client';
-import {General} from '@mm-redux/constants';
-import EventEmitter from '@mm-redux/utils/event_emitter';
+import {ViewTypes} from 'app/constants';
+import {recordTime} from 'app/utils/segment';
 
-import {NavigationTypes, ViewTypes} from '@constants';
-import EphemeralStore from '@store/ephemeral_store';
-import initialState from '@store/initial_state';
-import {getStateForReset} from '@store/utils';
-import {recordTime} from '@utils/segment';
-
-import {markChannelViewedAndRead} from './channel';
+import {handleSelectChannel} from 'app/actions/views/channel';
 
 export function startDataCleanup() {
     return async (dispatch, getState) => {
@@ -32,36 +26,24 @@ export function startDataCleanup() {
 export function loadConfigAndLicense() {
     return async (dispatch, getState) => {
         const {currentUserId} = getState().entities.users;
+        const [configData, licenseData] = await Promise.all([
+            getClientConfig()(dispatch, getState),
+            getLicenseConfig()(dispatch, getState),
+        ]);
 
-        try {
-            const [config, license] = await Promise.all([
-                Client4.getClientConfigOld(),
-                Client4.getClientLicenseOld(),
-            ]);
+        const config = configData.data || {};
+        const license = licenseData.data || {};
 
-            const actions = [{
-                type: GeneralTypes.CLIENT_CONFIG_RECEIVED,
-                data: config,
-            }, {
-                type: GeneralTypes.CLIENT_LICENSE_RECEIVED,
-                data: license,
-            }];
-
-            if (currentUserId) {
-                if (config.DataRetentionEnableMessageDeletion && config.DataRetentionEnableMessageDeletion === 'true' &&
-                    license.IsLicensed === 'true' && license.DataRetention === 'true') {
-                    dispatch(getDataRetentionPolicy());
-                } else {
-                    actions.push({type: GeneralTypes.RECEIVED_DATA_RETENTION_POLICY, data: {}});
-                }
+        if (currentUserId) {
+            if (config.DataRetentionEnableMessageDeletion && config.DataRetentionEnableMessageDeletion === 'true' &&
+                license.IsLicensed === 'true' && license.DataRetention === 'true') {
+                getDataRetentionPolicy()(dispatch, getState);
+            } else {
+                dispatch({type: GeneralTypes.RECEIVED_DATA_RETENTION_POLICY, data: {}});
             }
-
-            dispatch(batchActions(actions, 'BATCH_LOAD_CONFIG_AND_LICENSE'));
-
-            return {config, license};
-        } catch (error) {
-            return {error};
         }
+
+        return {config, license};
     };
 }
 
@@ -97,63 +79,20 @@ export function loadFromPushNotification(notification) {
             await Promise.all(loading);
         }
 
-        dispatch(handleSelectTeamAndChannel(teamId, channelId));
-    };
-}
-
-export function handleSelectTeamAndChannel(teamId, channelId) {
-    return async (dispatch, getState) => {
-        const dt = Date.now();
-        const state = getState();
-        const {channels, currentChannelId, myMembers} = state.entities.channels;
-        const {currentTeamId} = state.entities.teams;
-        const channel = channels[channelId];
-        const member = myMembers[channelId];
-        const actions = [];
-
         // when the notification is from a team other than the current team
         if (teamId !== currentTeamId) {
-            actions.push({type: TeamTypes.SELECT_TEAM, data: teamId});
+            dispatch(selectTeam({id: teamId}));
         }
 
-        if (channel && currentChannelId !== channelId) {
-            actions.push({
-                type: ChannelTypes.SELECT_CHANNEL,
-                data: channelId,
-                extra: {
-                    channel,
-                    member,
-                    teamId: channel.team_id || currentTeamId,
-                },
-            });
-
-            dispatch(markChannelViewedAndRead(channelId));
-        }
-
-        if (actions.length) {
-            dispatch(batchActions(actions, 'BATCH_SELECT_TEAM_AND_CHANNEL'));
-        }
-
-        EphemeralStore.setStartFromNotification(false);
-
-        console.log('channel switch from push notification to', channel?.display_name, (Date.now() - dt), 'ms'); //eslint-disable-line
+        dispatch(handleSelectChannel(channelId, true));
     };
 }
 
 export function purgeOfflineStore() {
-    return (dispatch, getState) => {
-        const currentState = getState();
-
-        dispatch({
-            type: General.OFFLINE_STORE_PURGE,
-            state: getStateForReset(initialState, currentState),
-        });
-
-        EventEmitter.emit(NavigationTypes.RESTART_APP);
-    };
+    return {type: General.OFFLINE_STORE_PURGE};
 }
 
-// A non-optimistic version of the createPost action in app/mm-redux with the file handling
+// A non-optimistic version of the createPost action in mattermost-redux with the file handling
 // removed since it's not needed.
 export function createPostForNotificationReply(post) {
     return async (dispatch, getState) => {

app/actions/views/search.js

@@ -4,8 +4,10 @@
 import {ViewTypes} from 'app/constants';
 
 export function handleSearchDraftChanged(text) {
-    return {
-        type: ViewTypes.SEARCH_DRAFT_CHANGED,
-        text,
+    return async (dispatch, getState) => {
+        dispatch({
+            type: ViewTypes.SEARCH_DRAFT_CHANGED,
+            text,
+        }, getState);
     };
 }

app/actions/views/select_server.js

@@ -2,16 +2,18 @@
 // See LICENSE.txt for license information.
 
 import {batchActions} from 'redux-batched-actions';
-import {GeneralTypes} from '@mm-redux/action_types';
+import {GeneralTypes} from 'mattermost-redux/action_types';
 
 import {ViewTypes} from 'app/constants';
 
 export function handleServerUrlChanged(serverUrl) {
-    return batchActions([
-        {type: GeneralTypes.CLIENT_CONFIG_RESET},
-        {type: GeneralTypes.CLIENT_LICENSE_RESET},
-        {type: ViewTypes.SERVER_URL_CHANGED, serverUrl},
-    ], 'BATCH_SERVER_URL_CHANGED');
+    return async (dispatch, getState) => {
+        dispatch(batchActions([
+            {type: GeneralTypes.CLIENT_CONFIG_RESET},
+            {type: GeneralTypes.CLIENT_LICENSE_RESET},
+            {type: ViewTypes.SERVER_URL_CHANGED, serverUrl},
+        ]), getState);
+    };
 }
 
 export function setServerUrl(serverUrl) {

app/actions/views/select_server.test.js

@@ -5,7 +5,7 @@ import {batchActions} from 'redux-batched-actions';
 import configureStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 
-import {GeneralTypes} from '@mm-redux/action_types';
+import {GeneralTypes} from 'mattermost-redux/action_types';
 
 import {ViewTypes} from 'app/constants';
 
@@ -20,13 +20,13 @@ describe('Actions.Views.SelectServer', () => {
         store = mockStore({});
     });
 
-    test('handleServerUrlChanged', () => {
+    test('handleServerUrlChanged', async () => {
         const serverUrl = 'https://mattermost.example.com';
         const actions = batchActions([
             {type: GeneralTypes.CLIENT_CONFIG_RESET},
             {type: GeneralTypes.CLIENT_LICENSE_RESET},
             {type: ViewTypes.SERVER_URL_CHANGED, serverUrl},
-        ], 'BATCH_SERVER_URL_CHANGED');
+        ]);
 
         store.dispatch(handleServerUrlChanged(serverUrl));
         expect(store.getActions()).toEqual([actions]);

app/actions/views/select_team.js

@@ -1,13 +1,11 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {batchActions} from 'redux-batched-actions';
-
-import {ChannelTypes, TeamTypes} from '@mm-redux/action_types';
-import {getMyTeams} from '@mm-redux/actions/teams';
-import {RequestStatus} from '@mm-redux/constants';
-import {getConfig} from '@mm-redux/selectors/entities/general';
-import EventEmitter from '@mm-redux/utils/event_emitter';
+import {TeamTypes} from 'mattermost-redux/action_types';
+import {getMyTeams} from 'mattermost-redux/actions/teams';
+import {RequestStatus} from 'mattermost-redux/constants';
+import {getConfig} from 'mattermost-redux/selectors/entities/general';
+import EventEmitter from 'mattermost-redux/utils/event_emitter';
 
 import {NavigationTypes} from 'app/constants';
 import {selectFirstAvailableTeam} from 'app/utils/teams';
@@ -20,10 +18,7 @@ export function handleTeamChange(teamId) {
             return;
         }
 
-        dispatch(batchActions([
-            {type: TeamTypes.SELECT_TEAM, data: teamId},
-            {type: ChannelTypes.SELECT_CHANNEL, data: '', extra: {}},
-        ], 'BATCH_SWITCH_TEAM'));
+        dispatch({type: TeamTypes.SELECT_TEAM, data: teamId});
     };
 }
 

app/actions/views/thread.js

@@ -4,16 +4,12 @@
 import {ViewTypes} from 'app/constants';
 
 export function handleCommentDraftChanged(rootId, draft) {
-    return (dispatch, getState) => {
-        const state = getState();
-
-        if (state.views.thread.drafts[rootId]?.draft !== draft) {
-            dispatch({
-                type: ViewTypes.COMMENT_DRAFT_CHANGED,
-                rootId,
-                draft,
-            });
-        }
+    return async (dispatch, getState) => {
+        dispatch({
+            type: ViewTypes.COMMENT_DRAFT_CHANGED,
+            rootId,
+            draft,
+        }, getState);
     };
 }
 

app/actions/views/thread.test.js

@@ -17,16 +17,10 @@ describe('Actions.Views.Thread', () => {
     let store;
 
     beforeEach(() => {
-        store = mockStore({
-            views: {
-                thread: {
-                    drafts: {},
-                },
-            },
-        });
+        store = mockStore({});
     });
 
-    test('handleCommentDraftChanged', () => {
+    test('handleCommentDraftChanged', async () => {
         const rootId = '1234';
         const draft = 'draft1';
         const action = {
@@ -34,11 +28,11 @@ describe('Actions.Views.Thread', () => {
             rootId,
             draft,
         };
-        store.dispatch(handleCommentDraftChanged(rootId, draft));
+        await store.dispatch(handleCommentDraftChanged(rootId, draft));
         expect(store.getActions()).toEqual([action]);
     });
 
-    test('handleCommentDraftSelectionChanged', () => {
+    test('handleCommentDraftSelectionChanged', async () => {
         const rootId = '1234';
         const cursorPosition = 'position';
         const action = {
@@ -46,7 +40,7 @@ describe('Actions.Views.Thread', () => {
             rootId,
             cursorPosition,
         };
-        store.dispatch(handleCommentDraftSelectionChanged(rootId, cursorPosition));
+        await store.dispatch(handleCommentDraftSelectionChanged(rootId, cursorPosition));
         expect(store.getActions()).toEqual([action]);
     });
 });

app/actions/views/typing.js

@@ -1,14 +1,13 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {userTyping as wsUserTyping} from '@actions/websocket';
+import {userTyping as wsUserTyping} from 'mattermost-redux/actions/websocket';
 
 export function userTyping(channelId, rootId) {
     return async (dispatch, getState) => {
-        const state = getState();
-        const {websocket} = state;
+        const {websocket} = getState();
         if (websocket.connected) {
-            wsUserTyping(state, channelId, rootId);
+            wsUserTyping(channelId, rootId)(dispatch, getState);
         }
     };
 }

app/actions/views/user.js

@@ -1,243 +1,20 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import {batchActions} from 'redux-batched-actions';
-
-import {NavigationTypes} from 'app/constants';
-import {GeneralTypes, RoleTypes, UserTypes} from '@mm-redux/action_types';
-import {getDataRetentionPolicy} from '@mm-redux/actions/general';
-import * as HelperActions from '@mm-redux/actions/helpers';
-import {autoUpdateTimezone} from '@mm-redux/actions/timezone';
-import {Client4} from '@mm-redux/client';
-import {General} from '@mm-redux/constants';
-import EventEmitter from '@mm-redux/utils/event_emitter';
-import {getConfig, getLicense} from '@mm-redux/selectors/entities/general';
-import {isTimezoneEnabled} from '@mm-redux/selectors/entities/timezone';
-import {getCurrentUserId, getStatusForUserId} from '@mm-redux/selectors/entities/users';
-
-import {setAppCredentials} from 'app/init/credentials';
-import {setCSRFFromCookie} from '@utils/security';
-import {getDeviceTimezoneAsync} from '@utils/timezone';
-
-const HTTP_UNAUTHORIZED = 401;
-
-export function completeLogin(user, deviceToken) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        const config = getConfig(state);
-        const license = getLicense(state);
-        const token = Client4.getToken();
-        const url = Client4.getUrl();
-
-        setAppCredentials(deviceToken, user.id, token, url);
-
-        // Set timezone
-        const enableTimezone = isTimezoneEnabled(state);
-        if (enableTimezone) {
-            const timezone = await getDeviceTimezoneAsync();
-            dispatch(autoUpdateTimezone(timezone));
-        }
-
-        // Data retention
-        if (config.DataRetentionEnableMessageDeletion && config.DataRetentionEnableMessageDeletion === 'true' &&
-            license.IsLicensed === 'true' && license.DataRetention === 'true') {
-            dispatch(getDataRetentionPolicy());
-        } else {
-            dispatch({type: GeneralTypes.RECEIVED_DATA_RETENTION_POLICY, data: {}});
-        }
-    };
-}
-
-export function getMe() {
-    return async (dispatch) => {
-        try {
-            const data = {};
-            data.me = await Client4.getMe();
-
-            const actions = [{
-                type: UserTypes.RECEIVED_ME,
-                data: data.me,
-            }];
-
-            const roles = data.me.roles.split(' ');
-            data.roles = await Client4.getRolesByNames(roles);
-            if (data.roles.length) {
-                actions.push({
-                    type: RoleTypes.RECEIVED_ROLES,
-                    data: data.roles,
-                });
-            }
-
-            dispatch(batchActions(actions, 'BATCH_GET_ME'));
-            return {data};
-        } catch (error) {
-            return {error};
-        }
-    };
-}
-
-export function loadMe(user, deviceToken, skipDispatch = false) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        const data = {user};
-        const deviceId = state.entities?.general?.deviceToken;
-
-        try {
-            if (deviceId && !deviceToken && !skipDispatch) {
-                await Client4.attachDevice(deviceId);
-            }
-
-            if (!user) {
-                data.user = await Client4.getMe();
-            }
-        } catch (error) {
-            dispatch(forceLogoutIfNecessary(error));
-            return {error};
-        }
-
-        try {
-            Client4.setUserId(data.user.id);
-            Client4.setUserRoles(data.user.roles);
-
-            // Execute all other requests in parallel
-            const teamsRequest = Client4.getMyTeams();
-            const teamMembersRequest = Client4.getMyTeamMembers();
-            const teamUnreadRequest = Client4.getMyTeamUnreads();
-            const preferencesRequest = Client4.getMyPreferences();
-            const configRequest = Client4.getClientConfigOld();
-            const actions = [];
-
-            const [teams, teamMembers, teamUnreads, preferences, config] = await Promise.all([
-                teamsRequest,
-                teamMembersRequest,
-                teamUnreadRequest,
-                preferencesRequest,
-                configRequest,
-            ]);
-
-            data.teams = teams;
-            data.teamMembers = teamMembers;
-            data.teamUnreads = teamUnreads;
-            data.preferences = preferences;
-            data.config = config;
-            data.url = Client4.getUrl();
-
-            actions.push({
-                type: UserTypes.LOGIN,
-                data,
-            });
-
-            const rolesToLoad = new Set();
-            for (const role of data.user.roles.split(' ')) {
-                rolesToLoad.add(role);
-            }
-
-            for (const teamMember of teamMembers) {
-                for (const role of teamMember.roles.split(' ')) {
-                    rolesToLoad.add(role);
-                }
-            }
-            if (rolesToLoad.size > 0) {
-                data.roles = await Client4.getRolesByNames(Array.from(rolesToLoad));
-                if (data.roles.length) {
-                    actions.push({
-                        type: RoleTypes.RECEIVED_ROLES,
-                        data: data.roles,
-                    });
-                }
-            }
-
-            if (!skipDispatch) {
-                dispatch(batchActions(actions, 'BATCH_LOAD_ME'));
-            }
-        } catch (error) {
-            console.log('login error', error.stack); // eslint-disable-line no-console
-            return {error};
-        }
-
-        return {data};
-    };
-}
-
-export function login(loginId, password, mfaToken, ldapOnly = false) {
-    return async (dispatch, getState) => {
-        const state = getState();
-        const deviceToken = state.entities?.general?.deviceToken;
-        let user;
-
-        try {
-            user = await Client4.login(loginId, password, mfaToken, deviceToken, ldapOnly);
-            await setCSRFFromCookie(Client4.getUrl());
-        } catch (error) {
-            return {error};
-        }
-
-        const result = await dispatch(loadMe(user));
-
-        if (!result.error) {
-            dispatch(completeLogin(user, deviceToken));
-        }
-
-        return result;
-    };
-}
-
-export function ssoLogin(token) {
-    return async (dispatch) => {
-        Client4.setToken(token);
-        await setCSRFFromCookie(Client4.getUrl());
-        const result = await dispatch(loadMe());
-
-        if (!result.error) {
-            dispatch(completeLogin(result.data.user));
-        }
-
-        return result;
-    };
-}
-
-export function logout(skipServerLogout = false) {
-    return async () => {
-        if (!skipServerLogout) {
-            try {
-                Client4.logout();
-            } catch {
-                // Do nothing
-            }
-        }
-
-        EventEmitter.emit(NavigationTypes.NAVIGATION_RESET);
-        return {data: true};
-    };
-}
-
-export function forceLogoutIfNecessary(error) {
-    return async (dispatch) => {
-        if (error.status_code === HTTP_UNAUTHORIZED && error.url && !error.url.includes('/login')) {
-            dispatch(logout(true));
-            return true;
-        }
-
-        return false;
-    };
-}
+import {UserTypes} from 'mattermost-redux/action_types';
+import {General} from 'mattermost-redux/constants';
+import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
 
 export function setCurrentUserStatusOffline() {
     return (dispatch, getState) => {
-        const state = getState();
-        const currentUserId = getCurrentUserId(state);
-        const status = getStatusForUserId(state, currentUserId);
+        const currentUserId = getCurrentUserId(getState());
 
-        if (status !== General.OFFLINE) {
-            dispatch({
-                type: UserTypes.RECEIVED_STATUS,
-                data: {
-                    user_id: currentUserId,
-                    status: General.OFFLINE,
-                },
-            });
-        }
+        return dispatch({
+            type: UserTypes.RECEIVED_STATUS,
+            data: {
+                user_id: currentUserId,
+                status: General.OFFLINE,
+            },
+        });
     };
 }
-
-HelperActions.forceLogoutIfNecessary = forceLogoutIfNecessary;

app/actions/views/user.test.js

@@ -4,14 +4,14 @@
 import configureStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 
-import {UserTypes} from '@mm-redux/action_types';
-import {General} from '@mm-redux/constants';
+import {UserTypes} from 'mattermost-redux/action_types';
+import {General} from 'mattermost-redux/constants';
 
 import {setCurrentUserStatusOffline} from 'app/actions/views/user';
 
 const mockStore = configureStore([thunk]);
 
-jest.mock('@mm-redux/actions/users', () => ({
+jest.mock('mattermost-redux/actions/users', () => ({
     getStatus: (...args) => ({type: 'MOCK_GET_STATUS', args}),
     getStatusesByIds: (...args) => ({type: 'MOCK_GET_STATUS_BY_IDS', args}),
     startPeriodicStatusUpdates: () => ({type: 'MOCK_PERIODIC_STATUS_UPDATES'}),

app/client/websocket.ts

@@ -1,247 +0,0 @@
-// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
-// See LICENSE.txt for license information.
-
-import {Platform} from 'react-native';
-
-const MAX_WEBSOCKET_FAILS = 7;
-const MIN_WEBSOCKET_RETRY_TIME = 3000; // 3 sec
-
-const MAX_WEBSOCKET_RETRY_TIME = 300000; // 5 mins
-
-class WebSocketClient {
-    conn?: WebSocket;
-    connectionUrl: string;
-    token: string|null;
-    sequence: number;
-    connectFailCount: number;
-    eventCallback?: Function;
-    firstConnectCallback?: Function;
-    reconnectCallback?: Function;
-    errorCallback?: Function;
-    closeCallback?: Function;
-    connectingCallback?: Function;
-    stop: boolean;
-    connectionTimeout: any;
-
-    constructor() {
-        this.connectionUrl = '';
-        this.token = null;
-        this.sequence = 1;
-        this.connectFailCount = 0;
-        this.stop = false;
-    }
-
-    initialize(token: string|null, opts = {}) {
-        const defaults = {
-            forceConnection: true,
-            connectionUrl: this.connectionUrl,
-        };
-
-        const {connectionUrl, forceConnection, ...additionalOptions} = Object.assign({}, defaults, opts);
-
-        if (forceConnection) {
-            this.stop = false;
-        }
-
-        return new Promise((resolve, reject) => {
-            if (this.conn) {
-                resolve();
-                return;
-            }
-
-            if (connectionUrl == null) {
-                console.log('websocket must have connection url'); //eslint-disable-line no-console
-                reject(new Error('websocket must have connection url'));
-                return;
-            }
-
-            if (this.connectFailCount === 0) {
-                console.log('websocket connecting to ' + connectionUrl); //eslint-disable-line no-console
-            }
-
-            if (this.connectingCallback) {
-                this.connectingCallback();
-            }
-
-            const regex = /^(?:https?|wss?):(?:\/\/)?[^/]*/;
-            const captured = (regex).exec(connectionUrl);
-
-            let origin;
-            if (captured) {
-                origin = captured[0];
-
-                if (Platform.OS === 'android') {
-                    // this is done cause for android having the port 80 or 443 will fail the connection
-                    // the websocket will append them
-                    const split = origin.split(':');
-                    const port = split[2];
-                    if (port === '80' || port === '443') {
-                        origin = `${split[0]}:${split[1]}`;
-                    }
-                }
-            } else {
-                // If we're unable to set the origin header, the websocket won't connect, but the URL is likely malformed anyway
-                const errorMessage = 'websocket failed to parse origin from ' + connectionUrl;
-                console.warn(errorMessage); // eslint-disable-line no-console
-                reject(new Error(errorMessage));
-                return;
-            }
-
-            this.conn = new WebSocket(connectionUrl, [], {headers: {origin}, ...(additionalOptions || {})});
-            this.connectionUrl = connectionUrl;
-            this.token = token;
-
-            this.conn!.onopen = () => {
-                if (token) {
-                    // we check for the platform as a workaround until we fix on the server that further authentications
-                    // are ignored
-                    this.sendMessage('authentication_challenge', {token});
-                }
-
-                if (this.connectFailCount > 0) {
-                    console.log('websocket re-established connection'); //eslint-disable-line no-console
-                    if (this.reconnectCallback) {
-                        this.reconnectCallback();
-                    }
-                } else if (this.firstConnectCallback) {
-                    this.firstConnectCallback();
-                }
-
-                this.connectFailCount = 0;
-                resolve();
-            };
-
-            this.conn!.onclose = () => {
-                this.conn = undefined;
-                this.sequence = 1;
-
-                if (this.connectFailCount === 0) {
-                    console.log('websocket closed'); //eslint-disable-line no-console
-                }
-
-                this.connectFailCount++;
-
-                if (this.closeCallback) {
-                    this.closeCallback(this.connectFailCount);
-                }
-
-                let retryTime = MIN_WEBSOCKET_RETRY_TIME;
-
-                // If we've failed a bunch of connections then start backing off
-                if (this.connectFailCount > MAX_WEBSOCKET_FAILS) {
-                    retryTime = MIN_WEBSOCKET_RETRY_TIME * this.connectFailCount;
-                    if (retryTime > MAX_WEBSOCKET_RETRY_TIME) {
-                        retryTime = MAX_WEBSOCKET_RETRY_TIME;
-                    }
-                }
-
-                if (this.connectionTimeout) {
-                    clearTimeout(this.connectionTimeout);
-                }
-
-                this.connectionTimeout = setTimeout(
-                    () => {
-                        if (this.stop) {
-                            clearTimeout(this.connectionTimeout);
-                            return;
-                        }
-                        this.initialize(token, opts);
-                    },
-                    retryTime,
-                );
-            };
-
-            this.conn!.onerror = (evt: any) => {
-                if (this.connectFailCount <= 1) {
-                    console.log('websocket error'); //eslint-disable-line no-console
-                    console.log(evt); //eslint-disable-line no-console
-                }
-
-                if (this.errorCallback) {
-                    this.errorCallback(evt);
-                }
-            };
-
-            this.conn!.onmessage = (evt: any) => {
-                const msg = JSON.parse(evt.data);
-                if (msg.seq_reply) {
-                    if (msg.error) {
-                        console.warn(msg); //eslint-disable-line no-console
-                    }
-                } else if (this.eventCallback) {
-                    this.eventCallback(msg);
-                }
-            };
-        });
-    }
-
-    setConnectingCallback(callback: Function) {
-        this.connectingCallback = callback;
-    }
-
-    setEventCallback(callback: Function) {
-        this.eventCallback = callback;
-    }
-
-    setFirstConnectCallback(callback: Function) {
-        this.firstConnectCallback = callback;
-    }
-
-    setReconnectCallback(callback: Function) {
-        this.reconnectCallback = callback;
-    }
-
-    setErrorCallback(callback: Function) {
-        this.errorCallback = callback;
-    }
-
-    setCloseCallback(callback: Function) {
-        this.closeCallback = callback;
-    }
-
-    close(stop = false) {
-        this.stop = stop;
-        this.connectFailCount = 0;
-        this.sequence = 1;
-        if (this.conn && this.conn.readyState === WebSocket.OPEN) {
-            this.conn.onclose = () => {}; //eslint-disable-line no-empty-function
-            this.conn.close();
-            this.conn = undefined;
-            console.log('websocket closed'); //eslint-disable-line no-console
-        }
-    }
-
-    sendMessage(action: string, data: any) {
-        const msg = {
-            action,
-            seq: this.sequence++,
-            data,
-        };
-
-        if (this.conn && this.conn.readyState === WebSocket.OPEN) {
-            this.conn.send(JSON.stringify(msg));
-        } else if (!this.conn || this.conn.readyState === WebSocket.CLOSED) {
-            this.conn = undefined;
-            this.initialize(this.token);
-        }
-    }
-
-    userTyping(channelId: string, parentId: string) {
-        this.sendMessage('user_typing', {
-            channel_id: channelId,
-            parent_id: parentId,
-        });
-    }
-
-    getStatuses() {
-        this.sendMessage('get_statuses', null);
-    }
-
-    getStatusesByIds(userIds: string[]) {
-        this.sendMessage('get_statuses_by_ids', {
-            user_ids: userIds,
-        });
-    }
-}
-
-export default new WebSocketClient();

app/components/announcement_banner/announcement_banner.test.js

@@ -4,7 +4,7 @@
 import React from 'react';
 import {shallow} from 'enzyme';
 
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import AnnouncementBanner from './announcement_banner.js';
 

app/components/announcement_banner/index.js

@@ -3,8 +3,8 @@
 
 import {connect} from 'react-redux';
 
-import {getConfig, getLicense} from '@mm-redux/selectors/entities/general';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getConfig, getLicense} from 'mattermost-redux/selectors/entities/general';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import {isLandscape} from 'app/selectors/device';
 

app/components/at_mention/at_mention.js

@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 import {Clipboard, Text} from 'react-native';
 import {intlShape} from 'react-intl';
 
-import {displayUsername} from '@mm-redux/utils/user_utils';
+import {displayUsername} from 'mattermost-redux/utils/user_utils';
 
 import CustomPropTypes from 'app/constants/custom_prop_types';
 import mattermostManaged from 'app/mattermost_managed';
@@ -33,15 +33,18 @@ export default class AtMention extends React.PureComponent {
     constructor(props) {
         super(props);
 
-        const user = this.getUserDetailsFromMentionName();
+        const user = this.getUserDetailsFromMentionName(props);
         this.state = {
             user,
         };
     }
 
-    componentDidUpdate(prevProps) {
-        if (this.props.mentionName !== prevProps.mentionName || this.props.usersByUsername !== prevProps.usersByUsername) {
-            this.updateUsername();
+    componentWillReceiveProps(nextProps) {
+        if (nextProps.mentionName !== this.props.mentionName || nextProps.usersByUsername !== this.props.usersByUsername) {
+            const user = this.getUserDetailsFromMentionName(nextProps);
+            this.setState({
+                user,
+            });
         }
     }
 
@@ -56,13 +59,12 @@ export default class AtMention extends React.PureComponent {
         goToScreen(screen, title, passProps);
     };
 
-    getUserDetailsFromMentionName() {
-        const {usersByUsername} = this.props;
-        let mentionName = this.props.mentionName.toLowerCase();
+    getUserDetailsFromMentionName(props) {
+        let mentionName = props.mentionName.toLowerCase();
 
         while (mentionName.length > 0) {
-            if (usersByUsername.hasOwnProperty(mentionName)) {
-                return usersByUsername[mentionName];
+            if (props.usersByUsername.hasOwnProperty(mentionName)) {
+                return props.usersByUsername[mentionName];
             }
 
             // Repeatedly trim off trailing punctuation in case this is at the end of a sentence
@@ -109,13 +111,6 @@ export default class AtMention extends React.PureComponent {
         Clipboard.setString(`@${username}`);
     };
 
-    updateUsername = () => {
-        const user = this.getUserDetailsFromMentionName();
-        this.setState({
-            user,
-        });
-    }
-
     render() {
         const {isSearchResult, mentionName, mentionStyle, onPostPress, teammateNameDisplay, textStyle, mentionKeys} = this.props;
         const {user} = this.state;

app/components/at_mention/index.js

@@ -3,9 +3,9 @@
 
 import {connect} from 'react-redux';
 
-import {getUsersByUsername, getCurrentUserMentionKeys} from '@mm-redux/selectors/entities/users';
+import {getUsersByUsername, getCurrentUserMentionKeys} from 'mattermost-redux/selectors/entities/users';
 
-import {getTeammateNameDisplaySetting, getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTeammateNameDisplaySetting, getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import AtMention from './at_mention';
 

app/components/attachment_button/index.js

@@ -8,7 +8,6 @@ import {
     NativeModules,
     Platform,
     StyleSheet,
-    StatusBar,
 } from 'react-native';
 import RNFetchBlob from 'rn-fetch-blob';
 import DeviceInfo from 'react-native-device-info';
@@ -19,7 +18,7 @@ import DocumentPicker from 'react-native-document-picker';
 import ImagePicker from 'react-native-image-picker';
 import Permissions from 'react-native-permissions';
 
-import {lookupMimeType} from '@mm-redux/utils/file_utils';
+import {lookupMimeType} from 'mattermost-redux/utils/file_utils';
 
 import TouchableWithFeedback from 'app/components/touchable_with_feedback';
 import emmProvider from 'app/init/emm_provider';
@@ -179,7 +178,6 @@ export default class AttachmentButton extends PureComponent {
 
         if (hasCameraPermission) {
             ImagePicker.launchCamera(options, (response) => {
-                StatusBar.setHidden(false);
                 emmProvider.inBackgroundSince = null;
                 if (response.error || response.didCancel) {
                     return;
@@ -215,7 +213,6 @@ export default class AttachmentButton extends PureComponent {
 
         if (hasPhotoPermission) {
             ImagePicker.launchImageLibrary(options, (response) => {
-                StatusBar.setHidden(false);
                 emmProvider.inBackgroundSince = null;
                 if (response.error || response.didCancel) {
                     return;
@@ -530,4 +527,4 @@ const style = StyleSheet.create({
         alignItems: 'center',
         justifyContent: 'center',
     },
-});
+});

app/components/attachment_button/index.test.js

@@ -5,9 +5,9 @@ import React from 'react';
 import {shallow} from 'enzyme';
 
 import Permissions from 'react-native-permissions';
-import {Alert, StatusBar} from 'react-native';
+import {Alert} from 'react-native';
 
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import {VALID_MIME_TYPES} from 'app/screens/edit_profile/edit_profile';
 
@@ -15,8 +15,7 @@ import AttachmentButton from './index';
 
 jest.mock('react-intl');
 jest.mock('react-native-image-picker', () => ({
-    launchCamera: jest.fn().mockImplementation((options, callback) => callback({didCancel: true})),
-    launchImageLibrary: jest.fn().mockImplementation((options, callback) => callback({didCancel: true})),
+    launchCamera: jest.fn(),
 }));
 
 describe('AttachmentButton', () => {
@@ -105,32 +104,4 @@ describe('AttachmentButton', () => {
         expect(Alert.alert).toHaveBeenCalled();
         expect(hasPhotoPermission).toBe(false);
     });
-
-    test('should re-enable StatusBar after ImagePicker launchCamera finishes', async () => {
-        const wrapper = shallow(
-            <AttachmentButton {...baseProps}/>,
-            {context: {intl: {formatMessage}}},
-        );
-
-        const instance = wrapper.instance();
-        jest.spyOn(instance, 'hasPhotoPermission').mockReturnValue(true);
-        jest.spyOn(StatusBar, 'setHidden');
-
-        await instance.attachFileFromCamera();
-        expect(StatusBar.setHidden).toHaveBeenCalledWith(false);
-    });
-
-    test('should re-enable StatusBar after ImagePicker launchImageLibrary finishes', async () => {
-        const wrapper = shallow(
-            <AttachmentButton {...baseProps}/>,
-            {context: {intl: {formatMessage}}},
-        );
-
-        const instance = wrapper.instance();
-        jest.spyOn(instance, 'hasPhotoPermission').mockReturnValue(true);
-        jest.spyOn(StatusBar, 'setHidden');
-
-        await instance.attachFileFromLibrary();
-        expect(StatusBar.setHidden).toHaveBeenCalledWith(false);
-    });
-});
+});

app/components/autocomplete/at_mention/at_mention.js

@@ -5,7 +5,7 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {SectionList} from 'react-native';
 
-import {RequestStatus} from '@mm-redux/constants';
+import {RequestStatus} from 'mattermost-redux/constants';
 
 import {AT_MENTION_REGEX, AT_MENTION_SEARCH_REGEX} from 'app/constants/autocomplete';
 import AtMentionItem from 'app/components/autocomplete/at_mention_item';
@@ -37,7 +37,6 @@ export default class AtMention extends PureComponent {
         value: PropTypes.string,
         isLandscape: PropTypes.bool.isRequired,
         nestedScrollEnabled: PropTypes.bool,
-        useChannelMentions: PropTypes.bool.isRequired,
     };
 
     static defaultProps = {
@@ -101,7 +100,7 @@ export default class AtMention extends PureComponent {
                     });
                 }
 
-                if (this.props.useChannelMentions && this.checkSpecialMentions(matchTerm)) {
+                if (this.checkSpecialMentions(matchTerm)) {
                     sections.push({
                         id: t('suggestion.mention.special'),
                         defaultMessage: 'Special Mentions',

app/components/autocomplete/at_mention/index.js

@@ -4,10 +4,9 @@
 import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
-import {isMinimumServerVersion} from '@mm-redux/utils/helpers';
-import {autocompleteUsers} from '@mm-redux/actions/users';
-import {getCurrentChannelId, getDefaultChannel} from '@mm-redux/selectors/entities/channels';
-import {getCurrentTeamId} from '@mm-redux/selectors/entities/teams';
+import {autocompleteUsers} from 'mattermost-redux/actions/users';
+import {getCurrentChannelId, getDefaultChannel} from 'mattermost-redux/selectors/entities/channels';
+import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
 import {isLandscape} from 'app/selectors/device';
 
 import {
@@ -16,10 +15,7 @@ import {
     filterMembersInCurrentTeam,
     getMatchTermForAtMention,
 } from 'app/selectors/autocomplete';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
-
-import {haveIChannelPermission} from '@mm-redux/selectors/entities/roles';
-import {Permissions} from '@mm-redux/constants';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import AtMention from './at_mention';
 
@@ -27,18 +23,6 @@ function mapStateToProps(state, ownProps) {
     const {cursorPosition, isSearch} = ownProps;
     const currentChannelId = getCurrentChannelId(state);
 
-    let useChannelMentions = true;
-    if (isMinimumServerVersion(state.entities.general.serverVersion, 5, 22)) {
-        useChannelMentions = haveIChannelPermission(
-            state,
-            {
-                channel: currentChannelId,
-                permission: Permissions.USE_CHANNEL_MENTIONS,
-                default: true,
-            },
-        );
-    }
-
     const value = ownProps.value.substring(0, cursorPosition);
     const matchTerm = getMatchTermForAtMention(value, isSearch);
 
@@ -63,7 +47,6 @@ function mapStateToProps(state, ownProps) {
         requestStatus: state.requests.users.autocompleteUsers.status,
         theme: getTheme(state),
         isLandscape: isLandscape(state),
-        useChannelMentions,
     };
 }
 

app/components/autocomplete/at_mention_item/index.js

@@ -3,9 +3,9 @@
 
 import {connect} from 'react-redux';
 
-import {getCurrentUserId, getUser} from '@mm-redux/selectors/entities/users';
+import {getCurrentUserId, getUser} from 'mattermost-redux/selectors/entities/users';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import AtMentionItem from './at_mention_item';
 

app/components/autocomplete/autocomplete.js

@@ -9,7 +9,7 @@ import {
     View,
 } from 'react-native';
 
-import EventEmitter from '@mm-redux/utils/event_emitter';
+import EventEmitter from 'mattermost-redux/utils/event_emitter';
 
 import {DeviceTypes} from 'app/constants';
 import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';

app/components/autocomplete/autocomplete_divider/index.js

@@ -3,7 +3,7 @@
 
 import {connect} from 'react-redux';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import AutocompleteDivider from './autocomplete_divider';
 

app/components/autocomplete/channel_mention/channel_mention.js

@@ -5,9 +5,9 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {Platform, SectionList} from 'react-native';
 
-import {RequestStatus} from '@mm-redux/constants';
-import {isMinimumServerVersion} from '@mm-redux/utils/helpers';
-import {debounce} from '@mm-redux/actions/helpers';
+import {RequestStatus} from 'mattermost-redux/constants';
+import {isMinimumServerVersion} from 'mattermost-redux/utils/helpers';
+import {debounce} from 'mattermost-redux/actions/helpers';
 
 import {CHANNEL_MENTION_REGEX, CHANNEL_MENTION_SEARCH_REGEX} from 'app/constants/autocomplete';
 import AutocompleteSectionHeader from 'app/components/autocomplete/autocomplete_section_header';

app/components/autocomplete/channel_mention/index.js

@@ -4,9 +4,9 @@
 import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
-import {searchChannels, autocompleteChannelsForSearch} from '@mm-redux/actions/channels';
-import {getMyChannelMemberships} from '@mm-redux/selectors/entities/channels';
-import {getCurrentTeamId} from '@mm-redux/selectors/entities/teams';
+import {searchChannels, autocompleteChannelsForSearch} from 'mattermost-redux/actions/channels';
+import {getMyChannelMemberships} from 'mattermost-redux/selectors/entities/channels';
+import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
 import {isLandscape} from 'app/selectors/device';
 
 import {
@@ -17,7 +17,7 @@ import {
     filterDirectAndGroupMessages,
     getMatchTermForChannelMention,
 } from 'app/selectors/autocomplete';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import ChannelMention from './channel_mention';
 

app/components/autocomplete/channel_mention_item/channel_mention_item.js

@@ -7,7 +7,7 @@ import {
     Text,
 } from 'react-native';
 
-import {General} from '@mm-redux/constants';
+import {General} from 'mattermost-redux/constants';
 import AutocompleteDivider from 'app/components/autocomplete/autocomplete_divider';
 import {BotTag, GuestTag} from 'app/components/tag';
 import {paddingHorizontal as padding} from 'app/components/safe_area_view/iphone_x_spacing';

app/components/autocomplete/channel_mention_item/index.js

@@ -3,10 +3,10 @@
 
 import {connect} from 'react-redux';
 
-import {General} from '@mm-redux/constants';
-import {getChannel} from '@mm-redux/selectors/entities/channels';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
-import {getUser} from '@mm-redux/selectors/entities/users';
+import {General} from 'mattermost-redux/constants';
+import {getChannel} from 'mattermost-redux/selectors/entities/channels';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
+import {getUser} from 'mattermost-redux/selectors/entities/users';
 
 import {getChannelNameForSearchAutocomplete} from 'app/selectors/channel';
 import {isLandscape} from 'app/selectors/device';

app/components/autocomplete/date_suggestion/date_suggestion.js

@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import {CalendarList, LocaleConfig} from 'react-native-calendars';
 import {intlShape} from 'react-intl';
 
-import {memoizeResult} from '@mm-redux/utils/helpers';
+import {memoizeResult} from 'mattermost-redux/utils/helpers';
 
 import {DATE_MENTION_SEARCH_REGEX, ALL_SEARCH_FLAGS_REGEX} from 'app/constants/autocomplete';
 import {changeOpacity} from 'app/utils/theme';
@@ -45,15 +45,21 @@ export default class DateSuggestion extends PureComponent {
         this.setCalendarLocale();
     }
 
-    componentDidUpdate(prevProps) {
-        const {locale, matchTerm} = this.props;
+    componentWillReceiveProps(nextProps) {
+        const {matchTerm} = nextProps;
 
-        if ((matchTerm !== prevProps.matchTerm && matchTerm === null) || this.state.mentionComplete) {
-            this.resetComponent();
+        if ((matchTerm !== this.props.matchTerm && matchTerm === null) || this.state.mentionComplete) {
+            // if the term changes but is null or the mention has been completed we render this component as null
+            this.setState({
+                mentionComplete: false,
+                sections: [],
+            });
+
+            this.props.onResultCountChange(0);
         }
 
-        if (locale !== prevProps.locale) {
-            this.setCalendarLocale();
+        if (this.props.locale !== nextProps.locale) {
+            this.setCalendarLocale(nextProps);
         }
     }
 
@@ -74,20 +80,10 @@ export default class DateSuggestion extends PureComponent {
         this.setState({mentionComplete: true});
     };
 
-    resetComponent() {
-        this.setState({
-            mentionComplete: false,
-            sections: [],
-        });
-
-        this.props.onResultCountChange(0);
-    }
-
-    setCalendarLocale = () => {
-        const {locale} = this.props;
+    setCalendarLocale = (props = this.props) => {
         const {formatMessage} = this.context.intl;
 
-        LocaleConfig.locales[locale] = {
+        LocaleConfig.locales[props.locale] = {
             monthNames: formatMessage({
                 id: 'mobile.calendar.monthNames',
                 defaultMessage: 'January,February,March,April,May,June,July,August,September,October,November,December',
@@ -106,7 +102,7 @@ export default class DateSuggestion extends PureComponent {
             }).split(','),
         };
 
-        LocaleConfig.defaultLocale = locale;
+        LocaleConfig.defaultLocale = props.locale;
     };
 
     render() {
@@ -126,7 +122,6 @@ export default class DateSuggestion extends PureComponent {
             <CalendarList
                 style={styles.calList}
                 current={currentDate}
-                maxDate={currentDate}
                 pastScrollRange={24}
                 futureScrollRange={0}
                 scrollingEnabled={true}

app/components/autocomplete/date_suggestion/index.js

@@ -3,7 +3,7 @@
 
 import {connect} from 'react-redux';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import {makeGetMatchTermForDateMention} from 'app/selectors/autocomplete';
 import {getCurrentLocale} from 'app/selectors/i18n';

app/components/autocomplete/emoji_suggestion/emoji_suggestion.js

@@ -129,11 +129,7 @@ export default class EmojiSuggestion extends PureComponent {
 
             const emojiData = getEmojiByName(emoji);
             if (emojiData?.filename && !BuiltInEmojis.includes(emojiData.filename)) {
-                const codeArray = emojiData.filename.split('-');
-                const code = codeArray.reduce((acc, c) => {
-                    return acc + String.fromCodePoint(parseInt(c, 16));
-                }, '');
-                completedDraft = emojiPart.replace(EMOJI_REGEX_WITHOUT_PREFIX, `${code} `);
+                completedDraft = emojiPart.replace(EMOJI_REGEX_WITHOUT_PREFIX, String.fromCodePoint(parseInt(emojiData.filename, 16)));
             } else {
                 completedDraft = emojiPart.replace(EMOJI_REGEX_WITHOUT_PREFIX, `${prefix}${emoji}: `);
             }

app/components/autocomplete/emoji_suggestion/index.js

@@ -5,11 +5,11 @@ import {connect} from 'react-redux';
 import {createSelector} from 'reselect';
 import {bindActionCreators} from 'redux';
 
-import {getCustomEmojisByName} from '@mm-redux/selectors/entities/emojis';
-import {autocompleteCustomEmojis} from '@mm-redux/actions/emojis';
+import {getCustomEmojisByName} from 'mattermost-redux/selectors/entities/emojis';
+import {autocompleteCustomEmojis} from 'mattermost-redux/actions/emojis';
 
 import {addReactionToLatestPost} from 'app/actions/views/emoji';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 import {EmojiIndicesByAlias} from 'app/utils/emojis';
 
 import EmojiSuggestion from './emoji_suggestion';

app/components/autocomplete/index.js

@@ -3,7 +3,7 @@
 
 import {connect} from 'react-redux';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import {getDimensions} from 'app/selectors/device';
 

app/components/autocomplete/slash_suggestion/index.js

@@ -5,10 +5,10 @@ import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 import {createSelector} from 'reselect';
 
-import {getAutocompleteCommands} from '@mm-redux/actions/integrations';
-import {getAutocompleteCommandsList} from '@mm-redux/selectors/entities/integrations';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
-import {getCurrentTeamId} from '@mm-redux/selectors/entities/teams';
+import {getAutocompleteCommands} from 'mattermost-redux/actions/integrations';
+import {getAutocompleteCommandsList} from 'mattermost-redux/selectors/entities/integrations';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
+import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
 import {isLandscape} from 'app/selectors/device';
 
 import SlashSuggestion from './slash_suggestion';

app/components/autocomplete/slash_suggestion/slash_suggestion_item.js

@@ -51,7 +51,7 @@ export default class SlashSuggestionItem extends PureComponent {
 const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
     return {
         row: {
-            paddingVertical: 8,
+            height: 55,
             justifyContent: 'center',
             paddingHorizontal: 8,
             backgroundColor: theme.centerChannelBg,

app/components/autocomplete_selector/autocomplete_selector.js

@@ -7,7 +7,7 @@ import PropTypes from 'prop-types';
 import {intlShape} from 'react-intl';
 import Icon from 'react-native-vector-icons/FontAwesome';
 
-import {displayUsername} from '@mm-redux/utils/user_utils';
+import {displayUsername} from 'mattermost-redux/utils/user_utils';
 
 import FormattedText from 'app/components/formatted_text';
 import {paddingHorizontal as padding} from 'app/components/safe_area_view/iphone_x_spacing';

app/components/autocomplete_selector/index.js

@@ -4,7 +4,7 @@
 import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
-import {getTeammateNameDisplaySetting, getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTeammateNameDisplaySetting, getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import {setAutocompleteSelector} from 'app/actions/views/post';
 

app/components/channel_icon.js

@@ -8,7 +8,7 @@ import {
     View,
 } from 'react-native';
 
-import {General} from '@mm-redux/constants';
+import {General} from 'mattermost-redux/constants';
 
 import Icon from 'app/components/vector_icon';
 

app/components/channel_intro/channel_intro.js

@@ -9,8 +9,8 @@ import {
 } from 'react-native';
 import {injectIntl, intlShape} from 'react-intl';
 
-import {displayUsername} from '@mm-redux/utils/user_utils';
-import {General} from '@mm-redux/constants';
+import {getFullName} from 'mattermost-redux/utils/user_utils';
+import {General} from 'mattermost-redux/constants';
 
 import {goToScreen} from 'app/actions/navigation';
 import ProfilePicture from 'app/components/profile_picture';
@@ -30,7 +30,6 @@ class ChannelIntro extends PureComponent {
         intl: intlShape.isRequired,
         theme: PropTypes.object.isRequired,
         isLandscape: PropTypes.bool.isRequired,
-        teammateNameDisplay: PropTypes.string.isRequired,
     };
 
     static defaultProps = {
@@ -49,12 +48,11 @@ class ChannelIntro extends PureComponent {
     };
 
     getDisplayName = (member) => {
-        const {teammateNameDisplay} = this.props;
         if (!member) {
             return null;
         }
 
-        const displayName = displayUsername(member, teammateNameDisplay);
+        const displayName = getFullName(member);
 
         if (!displayName) {
             return member.username;
@@ -353,7 +351,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
             marginBottom: 12,
         },
         container: {
-            marginTop: 10,
+            marginTop: 60,
             marginHorizontal: 12,
             marginBottom: 12,
             overflow: 'hidden',

app/components/channel_intro/index.js

@@ -4,11 +4,11 @@
 import {connect} from 'react-redux';
 import {createSelector} from 'reselect';
 
-import {General} from '@mm-redux/constants';
-import {makeGetChannel} from '@mm-redux/selectors/entities/channels';
-import {getCurrentUserId, getUser, makeGetProfilesInChannel} from '@mm-redux/selectors/entities/users';
+import {General} from 'mattermost-redux/constants';
+import {makeGetChannel} from 'mattermost-redux/selectors/entities/channels';
+import {getCurrentUserId, getUser, makeGetProfilesInChannel} from 'mattermost-redux/selectors/entities/users';
 
-import {getTeammateNameDisplaySetting, getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 import {isLandscape} from 'app/selectors/device';
 import {getChannelMembersForDm} from 'app/selectors/channel';
 
@@ -49,7 +49,6 @@ function makeMapStateToProps() {
             currentChannelMembers,
             theme: getTheme(state),
             isLandscape: isLandscape(state),
-            teammateNameDisplay: getTeammateNameDisplaySetting(state),
         };
     };
 }

app/components/channel_link/index.js

@@ -5,10 +5,10 @@ import {connect} from 'react-redux';
 import {bindActionCreators} from 'redux';
 import {createSelector} from 'reselect';
 
-import {joinChannel} from '@mm-redux/actions/channels';
-import {getChannelsNameMapInCurrentTeam} from '@mm-redux/selectors/entities/channels';
-import {getCurrentTeamId} from '@mm-redux/selectors/entities/teams';
-import {getCurrentUserId} from '@mm-redux/selectors/entities/users';
+import {joinChannel} from 'mattermost-redux/actions/channels';
+import {getChannelsNameMapInCurrentTeam} from 'mattermost-redux/selectors/entities/channels';
+import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
+import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
 
 import {handleSelectChannel} from 'app/actions/views/channel';
 

app/components/channel_loader/channel_loader.js

@@ -11,7 +11,7 @@ import {
 } from 'react-native';
 import {ImageContent} from 'rn-placeholder';
 
-import EventEmitter from '@mm-redux/utils/event_emitter';
+import EventEmitter from 'mattermost-redux/utils/event_emitter';
 
 import CustomPropTypes from 'app/constants/custom_prop_types';
 import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';

app/components/channel_loader/channel_loader.test.js

@@ -4,12 +4,12 @@
 import React from 'react';
 import {shallow} from 'enzyme';
 
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import ChannelLoader from './channel_loader';
 
 jest.mock('rn-placeholder', () => ({
-    ImageContent: () => null,
+    ImageContent: () => {},
 }));
 
 describe('ChannelLoader', () => {

app/components/channel_loader/index.js

@@ -4,7 +4,7 @@
 import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import {handleSelectChannel, setChannelLoading} from 'app/actions/views/channel';
 

app/components/client_upgrade_listener/index.js

@@ -3,8 +3,8 @@
 import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
-import {logError} from '@mm-redux/actions/errors';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {logError} from 'mattermost-redux/actions/errors';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import {setLastUpgradeCheck} from 'app/actions/views/client_upgrade';
 import getClientUpgrade from 'app/selectors/client_upgrade';

app/components/combined_system_message/combined_system_message.js

@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import {intlShape} from 'react-intl';
 
-import {Posts} from '@mm-redux/constants';
+import {Posts} from 'mattermost-redux/constants';
 
 import {makeStyleSheetFromTheme} from 'app/utils/theme';
 import {t} from 'app/utils/i18n';

app/components/combined_system_message/index.js

@@ -4,10 +4,10 @@
 import {connect} from 'react-redux';
 import {bindActionCreators} from 'redux';
 
-import {getMissingProfilesByIds, getMissingProfilesByUsernames} from '@mm-redux/actions/users';
-import {Preferences} from '@mm-redux/constants';
-import {getBool} from '@mm-redux/selectors/entities/preferences';
-import {getCurrentUser, makeGetProfilesByIdsAndUsernames} from '@mm-redux/selectors/entities/users';
+import {getMissingProfilesByIds, getMissingProfilesByUsernames} from 'mattermost-redux/actions/users';
+import {Preferences} from 'mattermost-redux/constants';
+import {getBool} from 'mattermost-redux/selectors/entities/preferences';
+import {getCurrentUser, makeGetProfilesByIdsAndUsernames} from 'mattermost-redux/selectors/entities/users';
 
 import CombinedSystemMessage from './combined_system_message';
 

app/components/combined_system_message/last_users.js

@@ -6,7 +6,7 @@ import React from 'react';
 import {Text} from 'react-native';
 import {intlShape} from 'react-intl';
 
-import {Posts} from '@mm-redux/constants';
+import {Posts} from 'mattermost-redux/constants';
 
 import FormattedMarkdownText from 'app/components/formatted_markdown_text';
 import FormattedText from 'app/components/formatted_text';

app/components/combined_user_activity_post/index.js

@@ -3,7 +3,7 @@
 
 import {connect} from 'react-redux';
 
-import {makeGenerateCombinedPost} from '@mm-redux/utils/post_list';
+import {makeGenerateCombinedPost} from 'mattermost-redux/utils/post_list';
 
 import Post from 'app/components/post';
 

app/components/custom_list/channel_list_row/index.js

@@ -3,9 +3,9 @@
 
 import {connect} from 'react-redux';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
-import {makeGetChannel} from '@mm-redux/selectors/entities/channels';
+import {makeGetChannel} from 'mattermost-redux/selectors/entities/channels';
 import {isLandscape} from 'app/selectors/device';
 import ChannelListRow from './channel_list_row';
 

app/components/custom_list/index.test.js

@@ -5,7 +5,7 @@ import React from 'react';
 import {View} from 'react-native';
 import {shallow} from 'enzyme';
 
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import CustomList, {FLATLIST, SECTIONLIST} from './index';
 

app/components/custom_list/option_list_row/index.js

@@ -3,7 +3,7 @@
 
 import {connect} from 'react-redux';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 import {isLandscape} from 'app/selectors/device';
 import OptionListRow from './option_list_row';
 

app/components/custom_list/user_list_row/index.js

@@ -3,8 +3,8 @@
 
 import {connect} from 'react-redux';
 
-import {getTeammateNameDisplaySetting, getTheme} from '@mm-redux/selectors/entities/preferences';
-import {getCurrentUserId, getUser} from '@mm-redux/selectors/entities/users';
+import {getTeammateNameDisplaySetting, getTheme} from 'mattermost-redux/selectors/entities/preferences';
+import {getCurrentUserId, getUser} from 'mattermost-redux/selectors/entities/users';
 import {isLandscape} from 'app/selectors/device';
 import UserListRow from './user_list_row';
 

app/components/custom_list/user_list_row/user_list_row.js

@@ -9,7 +9,7 @@ import {
     View,
 } from 'react-native';
 
-import {displayUsername} from '@mm-redux/utils/user_utils';
+import {displayUsername} from 'mattermost-redux/utils/user_utils';
 
 import CustomListRow from 'app/components/custom_list/custom_list_row';
 import ProfilePicture from 'app/components/profile_picture';

app/components/custom_list/user_list_row/user_list_test.test.js

@@ -4,7 +4,7 @@
 import React from 'react';
 import {shallow} from 'enzyme';
 
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import UserListRow from './user_list_row';
 

app/components/edit_channel_info/__snapshots__/edit_channel_info.test.js.snap

@@ -15,6 +15,7 @@ exports[`EditChannelInfo should match snapshot 1`] = `
     onKeyboardDidShow={[Function]}
     style={
       Object {
+        "backgroundColor": "#ffffff",
         "flex": 1,
       }
     }
@@ -283,7 +284,7 @@ exports[`EditChannelInfo should match snapshot 1`] = `
             value="header"
           />
         </View>
-        <Connect(Autocomplete)
+        <ForwardRef(forwardConnectRef)
           cursorPosition={6}
           expandDown={true}
           maxHeight={200}

app/components/edit_channel_info/edit_channel_info.js

@@ -10,7 +10,7 @@ import {
 } from 'react-native';
 import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view';
 
-import {General} from '@mm-redux/constants';
+import {General} from 'mattermost-redux/constants';
 
 import Autocomplete from 'app/components/autocomplete';
 import ErrorText from 'app/components/error_text';
@@ -370,6 +370,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
     return {
         container: {
             flex: 1,
+            backgroundColor: theme.centerChannelBg,
         },
         scrollView: {
             flex: 1,

app/components/edit_channel_info/edit_channel_info.test.js

@@ -4,7 +4,7 @@
 import React from 'react';
 import {shallow} from 'enzyme';
 
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import Autocomplete from 'app/components/autocomplete';
 import EditChannelInfo from './edit_channel_info';

app/components/emoji/emoji.js

@@ -4,6 +4,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import {
+    Image,
     Platform,
     StyleSheet,
     Text,
@@ -11,6 +12,7 @@ import {
 import FastImage from 'react-native-fast-image';
 
 import CustomPropTypes from 'app/constants/custom_prop_types';
+import ImageCacheManager from 'app/utils/image_cache_manager';
 
 export default class Emoji extends React.PureComponent {
     static propTypes = {
@@ -48,15 +50,56 @@ export default class Emoji extends React.PureComponent {
         isCustomEmoji: false,
     };
 
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            imageUrl: null,
+        };
+    }
+
+    componentDidMount() {
+        const {displayTextOnly, emojiName, imageUrl} = this.props;
+        this.mounted = true;
+        if (!displayTextOnly && imageUrl) {
+            ImageCacheManager.cache(`emoji-${emojiName}`, imageUrl, this.setImageUrl);
+        }
+    }
+
+    componentWillReceiveProps(nextProps) {
+        const {displayTextOnly, emojiName, imageUrl} = nextProps;
+        if (emojiName !== this.props.emojiName && this.mounted) {
+            this.setState({
+                imageUrl: null,
+            });
+        }
+
+        if (!displayTextOnly && imageUrl &&
+                imageUrl !== this.props.imageUrl) {
+            ImageCacheManager.cache(`emoji-${emojiName}`, imageUrl, this.setImageUrl);
+        }
+    }
+
+    componentWillUnmount() {
+        this.mounted = false;
+    }
+
+    setImageUrl = (imageUrl) => {
+        if (this.mounted) {
+            this.setState({
+                imageUrl,
+            });
+        }
+    };
+
     render() {
         const {
-            customEmojiStyle,
-            displayTextOnly,
-            imageUrl,
             literal,
-            unicode,
             textStyle,
+            displayTextOnly,
+            customEmojiStyle,
         } = this.props;
+        const {imageUrl} = this.state;
 
         let size = this.props.size;
         let fontSize = size;
@@ -75,23 +118,28 @@ export default class Emoji extends React.PureComponent {
 
         // Android can't change the size of an image after its first render, so
         // force a new image to be rendered when the size changes
-        const key = Platform.OS === 'android' ? (`${imageUrl}-${height}-${width}`) : null;
+        const key = Platform.OS === 'android' ? (height + '-' + width) : null;
 
-        if (unicode && !imageUrl) {
-            const codeArray = unicode.split('-');
+        if (this.props.unicode && !this.props.imageUrl) {
+            const codeArray = this.props.unicode.split('-');
             const code = codeArray.reduce((acc, c) => {
                 return acc + String.fromCodePoint(parseInt(c, 16));
             }, '');
 
             return (
-                <Text style={[textStyle, {fontSize: size}]}>
+                <Text style={[this.props.textStyle, {fontSize: size}]}>
                     {code}
                 </Text>
             );
         }
 
         if (!imageUrl) {
-            return null;
+            return (
+                <Image
+                    key={key}
+                    style={{width, height}}
+                />
+            );
         }
 
         return (
@@ -100,7 +148,6 @@ export default class Emoji extends React.PureComponent {
                 style={[customEmojiStyle, {width, height}]}
                 source={{uri: imageUrl}}
                 onError={this.onError}
-                resizeMode={FastImage.resizeMode.contain}
             />
         );
     }

app/components/emoji/index.js

@@ -3,11 +3,11 @@
 
 import {connect} from 'react-redux';
 
-import {getCustomEmojisByName} from '@mm-redux/selectors/entities/emojis';
-import {getCurrentUserId} from '@mm-redux/selectors/entities/users';
-import {getConfig} from '@mm-redux/selectors/entities/general';
-import {Client4} from '@mm-redux/client';
-import {isMinimumServerVersion} from '@mm-redux/utils/helpers';
+import {getCustomEmojisByName} from 'mattermost-redux/selectors/entities/emojis';
+import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
+import {getConfig} from 'mattermost-redux/selectors/entities/general';
+import {Client4} from 'mattermost-redux/client';
+import {isMinimumServerVersion} from 'mattermost-redux/utils/helpers';
 
 import {BuiltInEmojis, EmojiIndicesByAlias, Emojis} from 'app/utils/emojis';
 

app/components/emoji_picker/emoji_picker.test.js

@@ -3,7 +3,7 @@
 
 import React from 'react';
 
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import {shallowWithIntl} from 'test/intl-test-helper';
 import {filterEmojiSearchInput} from './emoji_picker_base';

app/components/emoji_picker/index.js

@@ -5,10 +5,10 @@ import {connect} from 'react-redux';
 import {createSelector} from 'reselect';
 import {bindActionCreators} from 'redux';
 
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
-import {getCustomEmojisByName} from '@mm-redux/selectors/entities/emojis';
-import {getConfig} from '@mm-redux/selectors/entities/general';
-import {getCustomEmojis, searchCustomEmojis} from '@mm-redux/actions/emojis';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
+import {getCustomEmojisByName} from 'mattermost-redux/selectors/entities/emojis';
+import {getConfig} from 'mattermost-redux/selectors/entities/general';
+import {getCustomEmojis, searchCustomEmojis} from 'mattermost-redux/actions/emojis';
 
 import {incrementEmojiPickerPage} from 'app/actions/views/emoji';
 import {getDimensions, isLandscape} from 'app/selectors/device';

app/components/error_list/index.js

@@ -4,8 +4,8 @@
 import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
-import {getDisplayableErrors} from '@mm-redux/selectors/errors';
-import {dismissError, clearErrors} from '@mm-redux/actions/errors';
+import {getDisplayableErrors} from 'mattermost-redux/selectors/errors';
+import {dismissError, clearErrors} from 'mattermost-redux/actions/errors';
 
 import ErrorList from './error_list';
 

app/components/error_text/error_text.test.js

@@ -3,7 +3,7 @@
 
 import React from 'react';
 import {shallow} from 'enzyme';
-import Preferences from '@mm-redux/constants/preferences';
+import Preferences from 'mattermost-redux/constants/preferences';
 
 import ErrorText from './error_text.js';
 

app/components/error_text/index.js

@@ -2,7 +2,7 @@
 // See LICENSE.txt for license information.
 
 import {connect} from 'react-redux';
-import {getTheme} from '@mm-redux/selectors/entities/preferences';
+import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
 
 import ErrorText from './error_text.js';