MM-52797 : Drafts badge doesn't clear when parent message deleted and removed (#23636)

* yup * int * c * ok * Update posts.ts * actual change * a * Update actions.ts * ty * Update drafts_link.tsx * revert to old function name --------- Co-authored-by: Mattermost Build <build@mattermost.com>
2025-02-25 18:55:24 -06:00 · 2023-06-10 01:52:45 +05:30 · 2023-06-10 01:52:45 +05:30 · adb248497d
commit adb248497d
parent c0ee02356e
15 changed files with 129 additions and 125 deletions
--- a/webapp/channels/src/actions/post_actions.ts
+++ b/webapp/channels/src/actions/post_actions.ts
@ -299,6 +299,7 @@ export function markMostRecentPostInChannelAsUnread(channelId: string) {
    };
 }

+// Action called by DeletePostModal when the post is deleted
 export function deleteAndRemovePost(post: Post) {
    return async (dispatch: DispatchFunc, getState: GetStateFunc) => {
        const {error} = await dispatch(PostActions.deletePost(post));
--- a/webapp/channels/src/actions/views/drafts.ts
+++ b/webapp/channels/src/actions/views/drafts.ts
@ -37,6 +37,7 @@ type Draft = {
 */
 export function getDrafts(teamId: string) {
    const getLocalDrafts = makeGetDrafts(false);
+
    return async (dispatch: DispatchFunc, getState: GetStateFunc) => {
        const state = getState() as GlobalState;

--- a/webapp/channels/src/components/advanced_create_comment/advanced_create_comment.tsx
+++ b/webapp/channels/src/components/advanced_create_comment/advanced_create_comment.tsx
@ -4,17 +4,24 @@
 /* eslint-disable max-lines */

 import React from 'react';
-
-import {ModalData} from 'types/actions.js';
-
 import {isNil} from 'lodash';

+import {PreferenceType} from '@mattermost/types/preferences';
+import {Group, GroupSource} from '@mattermost/types/groups';
+import {ChannelMemberCountsByGroup} from '@mattermost/types/channels';
+import {Emoji} from '@mattermost/types/emojis';
+import {ServerError} from '@mattermost/types/errors';
+import {FileInfo} from '@mattermost/types/files';
+
+import {ActionResult} from 'mattermost-redux/types/actions';
 import {sortFileInfos} from 'mattermost-redux/utils/file_utils';

 import * as GlobalActions from 'actions/global_actions';

+import {PostDraft} from 'types/store/draft';
+import {ModalData} from 'types/actions';
+
 import Constants, {AdvancedTextEditor as AdvancedTextEditorConst, Locations, ModalIdentifiers, Preferences} from 'utils/constants';
-import {PreferenceType} from '@mattermost/types/preferences';
 import * as Keyboard from 'utils/keyboard';
 import * as UserAgent from 'utils/user_agent';
 import * as Utils from 'utils/utils';
@ -28,18 +35,6 @@ import {
    mentionsMinusSpecialMentionsInText,
 } from 'utils/post_utils';
 import {getTable, hasHtmlLink, formatMarkdownMessage, isGitHubCodeBlock, formatGithubCodePaste, isHttpProtocol, isHttpsProtocol} from 'utils/paste';
-
-import NotifyConfirmModal from 'components/notify_confirm_modal';
-import {FileUpload as FileUploadClass} from 'components/file_upload/file_upload';
-import PostDeletedModal from 'components/post_deleted_modal';
-import {PostDraft} from 'types/store/draft';
-import {Group, GroupSource} from '@mattermost/types/groups';
-import {ChannelMemberCountsByGroup} from '@mattermost/types/channels';
-import {FilePreviewInfo} from 'components/file_preview/file_preview';
-import {Emoji} from '@mattermost/types/emojis';
-import {ActionResult} from 'mattermost-redux/types/actions';
-import {ServerError} from '@mattermost/types/errors';
-import {FileInfo} from '@mattermost/types/files';
 import EmojiMap from 'utils/emoji_map';
 import {
    applyLinkMarkdown,
@ -47,10 +42,14 @@ import {
    applyMarkdown,
    ApplyMarkdownOptions,
 } from 'utils/markdown/apply_markdown';
-import AdvancedTextEditor from '../advanced_text_editor/advanced_text_editor';
-import {TextboxClass, TextboxElement} from '../textbox';

-import FileLimitStickyBanner from '../file_limit_sticky_banner';
+import NotifyConfirmModal from 'components/notify_confirm_modal';
+import {FileUpload as FileUploadClass} from 'components/file_upload/file_upload';
+import PostDeletedModal from 'components/post_deleted_modal';
+import {FilePreviewInfo} from 'components/file_preview/file_preview';
+import AdvancedTextEditor from 'components/advanced_text_editor/advanced_text_editor';
+import {TextboxClass, TextboxElement} from 'components/textbox';
+import FileLimitStickyBanner from 'components/file_limit_sticky_banner';

 const KeyCodes = Constants.KeyCodes;

@ -350,7 +349,7 @@ class AdvancedCreateComment extends React.PureComponent<Props, State> {
    };

    saveDraftOnUnmount = () => {
-        if (!this.isDraftEdited || !this.state.draft) {
+        if (!this.isDraftEdited || !this.state.draft || this.props.rootDeleted) {
            return;
        }

--- a/webapp/channels/src/components/drafts/channel_draft/channel_draft.tsx
+++ b/webapp/channels/src/components/drafts/channel_draft/channel_draft.tsx
@ -34,7 +34,7 @@ type Props = {
    type: 'channel' | 'thread';
    user: UserProfile;
    value: PostDraft;
-    isRemote: boolean;
+    isRemote?: boolean;
 }

 function ChannelDraft({
--- a/webapp/channels/src/components/drafts/draft_row.tsx
+++ b/webapp/channels/src/components/drafts/draft_row.tsx
@ -14,7 +14,7 @@ type Props = {
    status: UserStatus['status'];
    displayName: string;
    draft: Draft;
-    isRemote: boolean;
+    isRemote?: boolean;
 }

 function DraftRow({draft, user, status, displayName, isRemote}: Props) {
--- a/webapp/channels/src/components/drafts/drafts.tsx
+++ b/webapp/channels/src/components/drafts/drafts.tsx
@ -77,7 +77,7 @@ function Drafts({
                        key={d.key}
                        displayName={displayName}
                        draft={d}
-                        isRemote={draftRemotes[d.key]}
+                        isRemote={draftRemotes?.[d.key]}
                        user={user}
                        status={status}
                    />
--- a/webapp/channels/src/components/drafts/drafts_link/drafts_link.tsx
+++ b/webapp/channels/src/components/drafts/drafts_link/drafts_link.tsx
@ -1,56 +1,43 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.

-import React, {memo, useCallback, useEffect} from 'react';
+import React, {memo, useEffect} from 'react';
 import {useSelector, useDispatch} from 'react-redux';
 import {NavLink, useRouteMatch} from 'react-router-dom';
-import {useIntl} from 'react-intl';
+import {FormattedMessage} from 'react-intl';

 import {localDraftsAreEnabled, syncedDraftsAreAllowedAndEnabled} from 'mattermost-redux/selectors/entities/preferences';
 import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';

 import {getDrafts} from 'actions/views/drafts';
-import {closeRightHandSide} from 'actions/views/rhs';

 import {makeGetDraftsCount} from 'selectors/drafts';
-import {getIsRhsOpen, getRhsState} from 'selectors/rhs';
-
-import {RHSStates} from 'utils/constants';

 import ChannelMentionBadge from 'components/sidebar/sidebar_channel/channel_mention_badge';
+import DraftsTourTip from 'components/drafts/drafts_link/drafts_tour_tip/drafts_tour_tip';

 import './drafts_link.scss';

-import DraftsTourTip from './drafts_tour_tip/drafts_tour_tip';
-
 const getDraftsCount = makeGetDraftsCount();

 function DraftsLink() {
    const dispatch = useDispatch();
+
    const localDraftsEnabled = useSelector(localDraftsAreEnabled);
    const syncedDraftsAllowedAndEnabled = useSelector(syncedDraftsAreAllowedAndEnabled);
-    const {formatMessage} = useIntl();
-    const {url} = useRouteMatch();
-    const match = useRouteMatch('/:team/drafts');
    const count = useSelector(getDraftsCount);
    const teamId = useSelector(getCurrentTeamId);
-    const rhsOpen = useSelector(getIsRhsOpen);
-    const rhsState = useSelector(getRhsState);
+
+    const {url} = useRouteMatch();
+    const isDraftUrlMatch = useRouteMatch('/:team/drafts');

    useEffect(() => {
        if (syncedDraftsAllowedAndEnabled) {
            dispatch(getDrafts(teamId));
        }
-    }, [teamId, dispatch, syncedDraftsAllowedAndEnabled]);
+    }, [teamId, syncedDraftsAllowedAndEnabled]);

-    const openDrafts = useCallback((e) => {
-        e.stopPropagation();
-        if (rhsOpen && rhsState === RHSStates.EDIT_HISTORY) {
-            dispatch(closeRightHandSide());
-        }
-    }, [rhsOpen, rhsState]);
-
-    if (!localDraftsEnabled || (!count && !match)) {
+    if (!localDraftsEnabled || (!count && !isDraftUrlMatch)) {
        return null;
    }

@ -59,10 +46,9 @@ function DraftsLink() {
            <li
                className='SidebarChannel'
                tabIndex={-1}
-                id={'sidebar-drafts-button'}
+                id='sidebar-drafts-button'
            >
                <NavLink
-                    onClick={openDrafts}
                    to={`${url}/drafts`}
                    id='sidebarItem_drafts'
                    activeClassName='active'
@ -76,7 +62,10 @@ function DraftsLink() {
                    />
                    <div className='SidebarChannelLinkLabel_wrapper'>
                        <span className='SidebarChannelLinkLabel sidebar-item__name'>
-                            {formatMessage({id: 'drafts.sidebarLink', defaultMessage: 'Drafts'})}
+                            <FormattedMessage
+                                id='drafts.sidebarLink'
+                                defaultMessage='Drafts'
+                            />
                        </span>
                    </div>
                    {count > 0 && (
--- a/webapp/channels/src/components/drafts/thread_draft/thread_draft.tsx
+++ b/webapp/channels/src/components/drafts/thread_draft/thread_draft.tsx
@ -33,7 +33,7 @@ type Props = {
    type: 'channel' | 'thread';
    user: UserProfile;
    value: PostDraft;
-    isRemote: boolean;
+    isRemote?: boolean;
 }

 function ThreadDraft({
--- a/webapp/channels/src/components/post/actions.ts
+++ b/webapp/channels/src/components/post/actions.ts
@ -0,0 +1,34 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import {DispatchFunc} from 'mattermost-redux/types/actions';
+import {ExtendedPost, removePost} from 'mattermost-redux/actions/posts';
+
+import {isThreadOpen} from 'selectors/views/threads';
+import {getGlobalItem} from 'selectors/storage';
+
+import {removeDraft} from 'actions/views/drafts';
+import {closeRightHandSide} from 'actions/views/rhs';
+
+import {StoragePrefixes} from 'utils/constants';
+
+import {GlobalState} from 'types/store';
+
+/**
+ * This action is called when the deleted post which is shown as 'deleted' in the RHS is then removed from the channel manually.
+ * @param post Deleted post
+ */
+export function removePostCloseRHSDeleteDraft(post: ExtendedPost) {
+    return (dispatch: DispatchFunc, getState: () => GlobalState) => {
+        if (isThreadOpen(getState(), post.id)) {
+            dispatch(closeRightHandSide());
+        }
+
+        const draftKey = `${StoragePrefixes.COMMENT_DRAFT}${post.id}`;
+        if (getGlobalItem(getState(), draftKey, null)) {
+            dispatch(removeDraft(draftKey, post.channel_id, post.id));
+        }
+
+        return dispatch(removePost(post));
+    };
+}
--- a/webapp/channels/src/components/post/index.tsx
+++ b/webapp/channels/src/components/post/index.tsx
@ -4,10 +4,12 @@
 import {connect, ConnectedProps} from 'react-redux';
 import {AnyAction, bindActionCreators, Dispatch} from 'redux';

+import {Emoji} from '@mattermost/types/emojis';
+import {Post} from '@mattermost/types/posts';
+
 import {setActionsMenuInitialisationState} from 'mattermost-redux/actions/preferences';
 import {getConfig} from 'mattermost-redux/selectors/entities/general';
 import {getPost, makeGetCommentCountForPost, makeIsPostCommentMention, isPostAcknowledgementsEnabled, isPostPriorityEnabled, UserActivityPost} from 'mattermost-redux/selectors/entities/posts';
-
 import {
    get,
    getBool,
@ -15,11 +17,10 @@ import {
 } from 'mattermost-redux/selectors/entities/preferences';
 import {getCurrentTeam, getTeam, getTeamMemberships} from 'mattermost-redux/selectors/entities/teams';
 import {getCurrentUserId, getUser} from 'mattermost-redux/selectors/entities/users';
+import {getDirectTeammate} from 'mattermost-redux/selectors/entities/channels';
+import {General} from 'mattermost-redux/constants';

-import {Emoji} from '@mattermost/types/emojis';
-import {Post} from '@mattermost/types/posts';
 import {closeRightHandSide, selectPost, setRhsExpanded, selectPostCard, selectPostFromRightHandSideSearch} from 'actions/views/rhs';
-
 import {markPostAsUnread, emitShortcutReactToLastPostFrom} from 'actions/post_actions';

 import {getShortcutReactToLastPostEmittedFrom, getOneClickReactionEmojis} from 'selectors/emojis';
@ -32,17 +33,10 @@ import {GlobalState} from 'types/store';
 import {isArchivedChannel} from 'utils/channel_utils';
 import {areConsecutivePostsBySameUser, canDeletePost, shouldShowActionsMenu, shouldShowDotMenu} from 'utils/post_utils';
 import {Locations, Preferences, RHSStates} from 'utils/constants';
-
-import {ExtendedPost, removePost} from 'mattermost-redux/actions/posts';
-import {DispatchFunc, GetStateFunc} from 'mattermost-redux/types/actions';
-import {isThreadOpen} from 'selectors/views/threads';
-
-import {General} from 'mattermost-redux/constants';
-
 import {getDisplayNameByUser} from 'utils/utils';
-import {getDirectTeammate} from 'mattermost-redux/selectors/entities/channels';

 import PostComponent from './post_component';
+import {removePostCloseRHSDeleteDraft} from './actions';

 interface OwnProps {
    post?: Post | UserActivityPost;
@ -84,16 +78,6 @@ function isConsecutivePost(state: GlobalState, ownProps: OwnProps) {
    return consecutivePost;
 }

-function removePostAndCloseRHS(post: ExtendedPost) {
-    return (dispatch: DispatchFunc, getState: GetStateFunc) => {
-        const state = getState() as GlobalState;
-        if (isThreadOpen(state, post.id)) {
-            dispatch(closeRightHandSide());
-        }
-        return dispatch(removePost(post));
-    };
-}
-
 function makeMapStateToProps() {
    const isPostCommentMention = makeIsPostCommentMention();
    const getReplyCount = makeGetCommentCountForPost();
@ -242,7 +226,7 @@ function mapDispatchToProps(dispatch: Dispatch<AnyAction>) {
            selectPost,
            selectPostFromRightHandSideSearch,
            setRhsExpanded,
-            removePost: removePostAndCloseRHS,
+            removePost: removePostCloseRHSDeleteDraft,
            closeRightHandSide,
            selectPostCard,
        }, dispatch),
--- a/webapp/channels/src/components/post/post_component.tsx
+++ b/webapp/channels/src/components/post/post_component.tsx
@ -621,12 +621,10 @@ const PostComponent = (props: Props): JSX.Element => {
                            <PostOptions
                                {...props}
                                teamId={teamId}
-                                setActionsMenuInitialisationState={props.actions.setActionsMenuInitialisationState}
                                handleDropdownOpened={handleDropdownOpened}
                                handleCommentClick={handleCommentClick}
                                hover={hover || a11yActive}
                                removePost={props.actions.removePost}
-                                isSearchResultsItem={Boolean(isSearchResultItem)}
                                handleJumpClick={handleJumpClick}
                                isPostHeaderVisible={getPostHeaderVisible()}
                            />
--- a/webapp/channels/src/components/post/post_options.tsx
+++ b/webapp/channels/src/components/post/post_options.tsx
@ -29,7 +29,6 @@ type Props = {
    enableEmojiPicker?: boolean;
    isReadOnly?: boolean;
    channelIsArchived?: boolean;
-    setActionsMenuInitialisationState: (initializationState: Record<string, boolean>) => void;
    handleCommentClick?: (e: React.MouseEvent) => void;
    handleJumpClick?: (e: React.MouseEvent) => void;
    handleDropdownOpened?: (e: boolean) => void;
@ -42,7 +41,6 @@ type Props = {
    isMobileView: boolean;
    hasReplies?: boolean;
    isFirstReply?: boolean;
-    isSearchResultsItem?: boolean;
    canReply?: boolean;
    replyCount?: number;
    location: keyof typeof Locations;
@ -85,7 +83,9 @@ const PostOptions = (props: Props): JSX.Element => {
    const systemMessage = isSystemMessage(post);
    const isFromAutoResponder = fromAutoResponder(post);

-    const removePost = () => props.removePost(props.post);
+    function removePost() {
+        props.removePost(props.post);
+    }

    const toggleEmojiPicker = () => {
        setShowEmojiPicker(!showEmojiPicker);
--- a/webapp/channels/src/components/threading/thread_viewer/index.ts
+++ b/webapp/channels/src/components/threading/thread_viewer/index.ts
@ -12,7 +12,7 @@ import {getThread} from 'mattermost-redux/selectors/entities/threads';
 import {isCollapsedThreadsEnabled} from 'mattermost-redux/selectors/entities/preferences';
 import {appsEnabled} from 'mattermost-redux/selectors/entities/apps';

-import {removePost, getNewestPostThread, getPostThread} from 'mattermost-redux/actions/posts';
+import {getNewestPostThread, getPostThread} from 'mattermost-redux/actions/posts';
 import {getThread as fetchThread, updateThreadRead} from 'mattermost-redux/actions/threads';

 import {GenericAction} from 'mattermost-redux/types/actions';
@ -78,7 +78,6 @@ function mapDispatchToProps(dispatch: Dispatch<GenericAction>) {
            getNewestPostThread,
            getPostThread,
            getThread: fetchThread,
-            removePost,
            selectPostCard,
            updateThreadLastOpened,
            updateThreadRead,
--- a/webapp/channels/src/components/threading/thread_viewer/thread_viewer.tsx
+++ b/webapp/channels/src/components/threading/thread_viewer/thread_viewer.tsx
@ -5,7 +5,6 @@ import React, {HTMLAttributes} from 'react';
 import classNames from 'classnames';

 import {ActionFunc} from 'mattermost-redux/types/actions';
-import {ExtendedPost} from 'mattermost-redux/actions/posts';

 import deferComponentRender from 'components/deferComponentRender';
 import FileUploadOverlay from 'components/file_upload_overlay';
@ -31,7 +30,6 @@ export type Props = Attrs & {
    userThread?: UserThread | null;
    channel: Channel | null;
    selected: Post | FakePost;
-    previousRhsState?: string;
    currentUserId: string;
    currentTeamId: string;
    socketConnectionStatus: boolean;
@ -40,7 +38,6 @@ export type Props = Attrs & {
        getNewestPostThread: (rootId: string) => Promise<any>|ActionFunc;
        getPostThread: (rootId: string, fetchThreads: boolean) => Promise<any>|ActionFunc;
        getThread: (userId: string, teamId: string, threadId: string, extended: boolean) => Promise<any>|ActionFunc;
-        removePost: (post: ExtendedPost) => void;
        selectPostCard: (post: Post) => void;
        updateThreadLastOpened: (threadId: string, lastViewedAt: number) => unknown;
        updateThreadRead: (userId: string, teamId: string, threadId: string, timestamp: number) => unknown;
--- a/webapp/channels/src/packages/mattermost-redux/src/actions/posts.ts
+++ b/webapp/channels/src/packages/mattermost-redux/src/actions/posts.ts
@ -4,39 +4,39 @@
 import {AnyAction} from 'redux';
 import {batchActions} from 'redux-batched-actions';

-import {Client4, DEFAULT_LIMIT_AFTER, DEFAULT_LIMIT_BEFORE} from 'mattermost-redux/client';
-
-import {PostTypes, ChannelTypes, FileTypes, IntegrationTypes} from 'mattermost-redux/action_types';
-
-import {getCurrentChannelId, getMyChannelMember as getMyChannelMemberSelector} from 'mattermost-redux/selectors/entities/channels';
-import {getCustomEmojisByName as selectCustomEmojisByName} from 'mattermost-redux/selectors/entities/emojis';
-import * as Selectors from 'mattermost-redux/selectors/entities/posts';
-import {getCurrentUserId, getUsersByUsername} from 'mattermost-redux/selectors/entities/users';
-
-import {isCombinedUserActivityPost} from 'mattermost-redux/utils/post_list';
-
-import {ActionResult, DispatchFunc, GetStateFunc} from 'mattermost-redux/types/actions';
-
-import {getUnreadScrollPositionPreference, isCollapsedThreadsEnabled} from 'mattermost-redux/selectors/entities/preferences';
-
-import {General, Preferences, Posts} from '../constants';
 import {UserProfile} from '@mattermost/types/users';
 import {Reaction} from '@mattermost/types/reactions';
 import {Post, PostList, PostAcknowledgement} from '@mattermost/types/posts';
 import {GlobalState} from '@mattermost/types/store';
-import {ChannelUnread} from '@mattermost/types/channels';
+import {Channel, ChannelUnread} from '@mattermost/types/channels';
 import {FetchPaginatedThreadOptions} from '@mattermost/types/client4';

-import {getProfilesByIds, getProfilesByUsernames, getStatusesByIds} from './users';
+import {Client4, DEFAULT_LIMIT_AFTER, DEFAULT_LIMIT_BEFORE} from 'mattermost-redux/client';
+
+import {PostTypes, ChannelTypes, FileTypes, IntegrationTypes} from 'mattermost-redux/action_types';
+
+import {ActionResult, DispatchFunc, GetStateFunc} from 'mattermost-redux/types/actions';
+
+import {getCurrentChannelId, getMyChannelMember as getMyChannelMemberSelector} from 'mattermost-redux/selectors/entities/channels';
+import {getCustomEmojisByName as selectCustomEmojisByName} from 'mattermost-redux/selectors/entities/emojis';
+import * as PostSelectors from 'mattermost-redux/selectors/entities/posts';
+import {getCurrentUserId, getUsersByUsername} from 'mattermost-redux/selectors/entities/users';
+import {getUnreadScrollPositionPreference, isCollapsedThreadsEnabled} from 'mattermost-redux/selectors/entities/preferences';
+
+import {isCombinedUserActivityPost} from 'mattermost-redux/utils/post_list';
+
+import {General, Preferences, Posts} from 'mattermost-redux/constants';
+
+import {getProfilesByIds, getProfilesByUsernames, getStatusesByIds} from 'mattermost-redux/actions/users';
 import {
    deletePreferences,
    savePreferences,
-} from './preferences';
-import {bindClientFunc, forceLogoutIfNecessary} from './helpers';
+} from 'mattermost-redux/actions/preferences';
+import {bindClientFunc, forceLogoutIfNecessary} from 'mattermost-redux/actions/helpers';
 import {logError} from './errors';
-import {systemEmojis, getCustomEmojiByName, getCustomEmojisByName} from './emojis';
-import {selectChannel} from './channels';
-import {decrementThreadCounts} from './threads';
+import {systemEmojis, getCustomEmojiByName, getCustomEmojisByName} from 'mattermost-redux/actions/emojis';
+import {selectChannel} from 'mattermost-redux/actions/channels';
+import {decrementThreadCounts} from 'mattermost-redux/actions/threads';

 // receivedPost should be dispatched after a single post from the server. This typically happens when an existing post
 // is updated.
@ -174,7 +174,7 @@ export function createPost(post: Post, files: any[] = []) {
        const pendingPostId = post.pending_post_id || `${currentUserId}:${timestamp}`;
        let actions: AnyAction[] = [];

-        if (Selectors.isPostIdSending(state, pendingPostId)) {
+        if (PostSelectors.isPostIdSending(state, pendingPostId)) {
            return {data: true};
        }

@ -187,7 +187,7 @@ export function createPost(post: Post, files: any[] = []) {
        };

        if (post.root_id) {
-            newPost.reply_count = Selectors.getPostRepliesCount(state, post.root_id) + 1;
+            newPost.reply_count = PostSelectors.getPostRepliesCount(state, post.root_id) + 1;
        }

        // We are retrying a pending post that had files
@ -307,7 +307,7 @@ export function createPostImmediately(post: Post, files: any[] = []) {
        };

        if (post.root_id) {
-            newPost.reply_count = Selectors.getPostRepliesCount(state, post.root_id) + 1;
+            newPost.reply_count = PostSelectors.getPostRepliesCount(state, post.root_id) + 1;
        }

        if (files.length) {
@ -401,7 +401,7 @@ export function deletePost(post: ExtendedPost) {
        }
        if (delPost.type === Posts.POST_TYPES.COMBINED_USER_ACTIVITY && delPost.system_post_ids) {
            delPost.system_post_ids.forEach((systemPostId) => {
-                const systemPost = Selectors.getPost(state, systemPostId);
+                const systemPost = PostSelectors.getPost(state, systemPostId);
                if (systemPost) {
                    dispatch(deletePost(systemPost));
                }
@ -466,7 +466,7 @@ function getUnreadPostData(unreadChan: ChannelUnread, state: GlobalState) {
 export function setUnreadPost(userId: string, postId: string) {
    return async (dispatch: DispatchFunc, getState: GetStateFunc) => {
        let state = getState();
-        const post = Selectors.getPost(state, postId);
+        const post = PostSelectors.getPost(state, postId);
        let unreadChan;

        try {
@ -523,7 +523,7 @@ export function pinPost(postId: string) {
        ];

        const state = getState();
-        const post = Selectors.getPost(state, postId);
+        const post = PostSelectors.getPost(state, postId);
        if (post) {
            actions.push(
                receivedPost({
@ -544,6 +544,16 @@ export function pinPost(postId: string) {
    };
 }

+/**
+ * Decrements the pinned post count for a channel by 1
+ */
+export function decrementPinnedPostCount(channelId: Channel['id']) {
+    return {
+        type: ChannelTypes.DECREMENT_PINNED_POST_COUNT,
+        id: channelId,
+    };
+}
+
 export function unpinPost(postId: string) {
    return async (dispatch: DispatchFunc, getState: GetStateFunc) => {
        dispatch({type: PostTypes.EDIT_POST_REQUEST});
@ -565,7 +575,7 @@ export function unpinPost(postId: string) {
        ];

        const state = getState();
-        const post = Selectors.getPost(state, postId);
+        const post = PostSelectors.getPost(state, postId);
        if (post) {
            actions.push(
                receivedPost({
@ -573,10 +583,7 @@ export function unpinPost(postId: string) {
                    is_pinned: false,
                    update_at: Date.now(),
                }, isCollapsedThreadsEnabled(state)),
-                {
-                    type: ChannelTypes.DECREMENT_PINNED_POST_COUNT,
-                    id: post.channel_id,
-                },
+                decrementPinnedPostCount(post.channel_id),
            );
        }

@ -781,7 +788,7 @@ export function getPostThread(rootId: string, fetchThreads = true) {
 }

 export function getNewestPostThread(rootId: string) {
-    const getPostsForThread = Selectors.makeGetPostsForThread();
+    const getPostsForThread = PostSelectors.makeGetPostsForThread();

    return async (dispatch: DispatchFunc, getState: GetStateFunc) => {
        dispatch({type: PostTypes.GET_POST_THREAD_REQUEST});
@ -1016,7 +1023,7 @@ export function getThreadsForPosts(posts: Post[], fetchThreads = true) {
            if (!post.root_id) {
                return;
            }
-            const rootPost = Selectors.getPost(state, post.root_id);
+            const rootPost = PostSelectors.getPost(state, post.root_id);

            if (!rootPost) {
                rootsSet.add(post.root_id);
@ -1200,7 +1207,7 @@ export function removePost(post: ExtendedPost) {
        if (post.type === Posts.POST_TYPES.COMBINED_USER_ACTIVITY && post.system_post_ids) {
            const state = getState();
            for (const systemPostId of post.system_post_ids) {
-                const systemPost = Selectors.getPost(state, systemPostId);
+                const systemPost = PostSelectors.getPost(state, systemPostId);

                if (systemPost) {
                    dispatch(removePost(systemPost as any) as any);
@ -1209,12 +1216,7 @@ export function removePost(post: ExtendedPost) {
        } else {
            dispatch(postRemoved(post));
            if (post.is_pinned) {
-                dispatch(
-                    {
-                        type: ChannelTypes.DECREMENT_PINNED_POST_COUNT,
-                        id: post.channel_id,
-                    },
-                );
+                dispatch(decrementPinnedPostCount(post.channel_id));
            }
        }
        return {data: true};