PLT-6215 Major post list refactor (#6501)

* Major post list refactor

* Fix post and thread deletion

* Fix preferences not selecting correctly

* Fix military time displaying

* Fix UP key for editing posts

* Fix ESLint error

* Various fixes and updates per feedback

* Fix for permalink view

* Revert to old scrolling method and various fixes

* Add floating timestamp, new message indicator, scroll arrows

* Update post loading for focus mode and add visibility limit

* Fix pinning posts and a react warning

* Add loading UI updates from Asaad

* Fix refreshing loop

* Temporarily bump post visibility limit

* Update infinite scrolling

* Remove infinite scrolling

.eslintrc.json

@@ -251,7 +251,6 @@
  "react/self-closing-comp": 2,
  "react/sort-comp": 0,
  "react/style-prop-object": 2,
- "require-await": 2,
  "require-yield": 2,
  "rest-spread-spacing": [2, "never"],
  "semi": [2, "always"],

actions/file_actions.jsx

@@ -1,25 +1,24 @@
 // Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-import * as AsyncClient from 'utils/async_client.jsx';
-import Client from 'client/web_client.jsx';
+import store from 'stores/redux_store.jsx';
+const dispatch = store.dispatch;
+const getState = store.getState;
+import {uploadFile as uploadFileRedux} from 'mattermost-redux/actions/files';
 
 export function uploadFile(file, name, channelId, clientId, success, error) {
- Client.uploadFile(
- file,
- name,
- channelId,
- clientId,
+ const fileFormData = new FormData();
+ fileFormData.append('files', file, name);
+ fileFormData.append('channel_id', channelId);
+ fileFormData.append('client_ids', clientId);
+
+ uploadFileRedux(channelId, null, [clientId], fileFormData)(dispatch, getState).then(
  (data) => {
- if (success) {
+ if (data && success) {
  success(data);
- }
- },
- (err) => {
- AsyncClient.dispatchError(err, 'uploadFile');
-
- if (error) {
- error(err);
+ } else if (data == null && error) {
+ const serverError = getState().requests.files.uploadFiles.error;
+ error({id: serverError.server_error_id, ...serverError});
  }
  }
  );

actions/global_actions.jsx

@@ -4,14 +4,13 @@
 import AppDispatcher from 'dispatcher/app_dispatcher.jsx';
 
 import ChannelStore from 'stores/channel_store.jsx';
-import PostStore from 'stores/post_store.jsx';
 import UserStore from 'stores/user_store.jsx';
 import BrowserStore from 'stores/browser_store.jsx';
 import ErrorStore from 'stores/error_store.jsx';
 import TeamStore from 'stores/team_store.jsx';
 import SearchStore from 'stores/search_store.jsx';
 
-import {handleNewPost, loadPosts, loadPostsBefore, loadPostsAfter} from 'actions/post_actions.jsx';
+import {handleNewPost} from 'actions/post_actions.jsx';
 import {loadProfilesForSidebar} from 'actions/user_actions.jsx';
 import {loadChannelsForCurrentUser} from 'actions/channel_actions.jsx';
 import {stopPeriodicStatusUpdates} from 'actions/status_actions.jsx';
@@ -59,7 +58,6 @@ export function emitChannelClickEvent(channel) {
  getMyChannelMemberPromise.then(() => {
  getChannelStats(chan.id)(dispatch, getState);
  viewChannel(chan.id, oldChannelId)(dispatch, getState);
- loadPosts(chan.id);
 
  // Mark previous and next channel as read
  ChannelStore.resetCounts([chan.id, oldChannelId]);
@@ -106,10 +104,15 @@ export function doFocusPost(channelId, postId, data) {
  channelId,
  post_list: data
  });
+
+ dispatch({
+ type: ActionTypes.RECEIVED_FOCUSED_POST,
+ data: postId,
+ channelId
+ });
+
  loadChannelsForCurrentUser();
  getChannelStats(channelId)(dispatch, getState);
- loadPostsBefore(postId, 0, Constants.POST_FOCUS_CONTEXT_RADIUS, true);
- loadPostsAfter(postId, 0, Constants.POST_FOCUS_CONTEXT_RADIUS, true);
 }
 
 export function emitPostFocusEvent(postId, onSuccess) {
@@ -148,8 +151,10 @@ export function emitCloseRightHandSide() {
  SearchStore.storeSearchResults(null, false, false);
  SearchStore.emitSearchChange();
 
- PostStore.storeSelectedPostId(null);
- PostStore.emitSelectedPostChange(false, false);
+ dispatch({
+ type: ActionTypes.SELECT_POST,
+ postId: ''
+ });
 }
 
 export function emitPostFocusRightHandSideFromSearch(post, isMentionSearch) {
@@ -188,29 +193,6 @@ export function emitLeaveTeam() {
  removeUserFromTeam(TeamStore.getCurrentId(), UserStore.getCurrentId())(dispatch, getState);
 }
 
-export function emitLoadMorePostsEvent() {
- const id = ChannelStore.getCurrentId();
- loadMorePostsTop(id, false);
-}
-
-export function emitLoadMorePostsFocusedTopEvent() {
- const id = PostStore.getFocusedPostId();
- loadMorePostsTop(id, true);
-}
-
-export function loadMorePostsTop(id, isFocusPost) {
- const earliestPostId = PostStore.getEarliestPostFromPage(id).id;
- if (PostStore.requestVisibilityIncrease(id, Constants.POST_CHUNK_SIZE)) {
- loadPostsBefore(earliestPostId, 0, Constants.POST_CHUNK_SIZE, isFocusPost);
- }
-}
-
-export function emitLoadMorePostsFocusedBottomEvent() {
- const id = PostStore.getFocusedPostId();
- const latestPostId = PostStore.getLatestPost(id).id;
- loadPostsAfter(latestPostId, 0, Constants.POST_CHUNK_SIZE, Boolean(id));
-}
-
 export function emitUserPostedEvent(post) {
  AppDispatcher.handleServerAction({
  type: ActionTypes.CREATE_POST,
@@ -225,13 +207,6 @@ export function emitUserCommentedEvent(post) {
  });
 }
 
-export function emitPostDeletedEvent(post) {
- AppDispatcher.handleServerAction({
- type: ActionTypes.POST_DELETED,
- post
- });
-}
-
 export function showDeletePostModal(post, commentCount = 0) {
  AppDispatcher.handleViewAction({
  type: ActionTypes.TOGGLE_DELETE_POST_MODAL,
@@ -421,11 +396,6 @@ export function loadDefaultLocale() {
  return newLocalizationSelected(locale);
 }
 
-export function viewLoggedIn() {
- // Clear pending posts (shouldn't have pending posts if we are loading)
- PostStore.clearPendingPosts();
-}
-
 let lastTimeTypingSent = 0;
 export function emitLocalUserTypingEvent(channelId, parentId) {
  const t = Date.now();