* refactor: started with draft, done until new tabs for draft
* refactor: change the query and added the screen for draft
* added condition for fetching draft for channel delete or not
* refactor: added draft screen
* linter fixes
* Added draft post component
* added avatar and header display name for the draft post list
* added channel info component
* channel info completed
* proper naming
* added image file markdown acknowledgement support
* draft actions
* Fix the draft receiver in drafts
* separated send message handler
* Done with send drafts
* done with delete drafts
* change save to send draft
* handle lengthy message with show more button
* done with persistent message edit, send and delete drafts
* added alert for sending message
* added update at time for the drafts
* en.json extract fix
* Updated dependencies for useCallback
* refactor: added drafts list to animated list
* added swipeable component and delete conformation for drafts
* done with rendering of images in markdown for drafts
* en.json issue fixed
* fix en.json issue
* refactor: en.json fix
* addressed review comments
* updated image metadata handling code
* linter fixes
* added the empty draft screen
* linter fix
* style fix
* back button an android takes to the channel list page
* en.json fix
* draft actions theme compatible
* CSS fix for draft channel_info and avatar component
* removed the badge icon and change font style drafts
* fix send alert sender name for GMs
* updated snapshot
* added testId to the drafts components
* updated send draft test id
* clicking on draft takes to the channel
* Added toptip for draft tours
* intl extract
* Rebase to main and reverted local testing changes
* Added tooltip for drafts
* addressed review comments
* reset navigation when click on a draft in draft tabs
* fix the theme issue and navigation issue
* reverted back the draft click navigation changes
* observing draft when hitting back button
* removed the unwanted animiation
* updated regex for parsing markdown
* removed unnecessary checks and change folder name
* removed react memo and merge unwanted observes function
* removed unnecessary comments
* changed the name for observing and querying draft function
* removed memo from component level
* Text to FormattedText component
* Text to formatted text, change image name
* added confirmation modal for deleting draft from bottomsheet
* using common send_handler for both draft and post
* removed magic number for tooltip and bottomsheet
* renamed channel_info to draft_post_header
* text to formattedText for Edit drafts
* removed unnecessary changes
* minor fixes
* mounting draft only when there is draft
* map to reduce
* renamed SwipeableDraft to DraftSwipeAction
* name fixes
* isValidUrl to isParsableUrl and added test
* added test and addressed minor review comments
* added inline component for the duplicate code
* inlt fixes
* clearDraft is not optional
* optimised categories_list.tsx component
* Swipeable to ReanimatedSwipeable, TouchableWithoutFeedback to Pressable and folder name changes
* Added comment and disabled eslint rule for showing warning
* fixed component file name
* minor'
* Removed deprecated Animated createAnimatedComponent flatlist
* added test for missing protocol check
* import change for SwipeableMethod
* active tab for tablet view
* Updated the drafts icons
* Updated compass-icon version to v0.1.48
---------
Co-authored-by: Mattermost Build <build@mattermost.com>
(cherry picked from commit 84eded1bde)
Co-authored-by: Rajat Dabade <rajatdabade1997@gmail.com>
223 lines
7.7 KiB
TypeScript
223 lines
7.7 KiB
TypeScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
|
|
import {useCallback, useEffect, useMemo, useState} from 'react';
|
|
import {useIntl} from 'react-intl';
|
|
import {DeviceEventEmitter} from 'react-native';
|
|
|
|
import {getChannelTimezones} from '@actions/remote/channel';
|
|
import {executeCommand, handleGotoLocation} from '@actions/remote/command';
|
|
import {createPost} from '@actions/remote/post';
|
|
import {handleReactionToLatestPost} from '@actions/remote/reactions';
|
|
import {setStatus} from '@actions/remote/user';
|
|
import {handleCallsSlashCommand} from '@calls/actions';
|
|
import {Events, Screens} from '@constants';
|
|
import {NOTIFY_ALL_MEMBERS} from '@constants/post_draft';
|
|
import {useServerUrl} from '@context/server';
|
|
import DraftUploadManager from '@managers/draft_upload_manager';
|
|
import * as DraftUtils from '@utils/draft';
|
|
import {isReactionMatch} from '@utils/emoji/helpers';
|
|
import {getFullErrorMessage} from '@utils/errors';
|
|
import {preventDoubleTap} from '@utils/tap';
|
|
import {confirmOutOfOfficeDisabled} from '@utils/user';
|
|
|
|
import type CustomEmojiModel from '@typings/database/models/servers/custom_emoji';
|
|
|
|
type Props = {
|
|
value: string;
|
|
channelId: string;
|
|
rootId: string;
|
|
maxMessageLength: number;
|
|
files: FileInfo[];
|
|
customEmojis: CustomEmojiModel[];
|
|
enableConfirmNotificationsToChannel?: boolean;
|
|
useChannelMentions: boolean;
|
|
membersCount: number;
|
|
userIsOutOfOffice: boolean;
|
|
currentUserId: string;
|
|
channelType: ChannelType | undefined;
|
|
postPriority: PostPriority;
|
|
clearDraft: () => void;
|
|
}
|
|
|
|
export const useHandleSendMessage = ({
|
|
value,
|
|
channelId,
|
|
rootId,
|
|
files,
|
|
maxMessageLength,
|
|
customEmojis,
|
|
enableConfirmNotificationsToChannel,
|
|
useChannelMentions,
|
|
membersCount = 0,
|
|
userIsOutOfOffice,
|
|
currentUserId,
|
|
channelType,
|
|
postPriority,
|
|
clearDraft,
|
|
}: Props) => {
|
|
const intl = useIntl();
|
|
const serverUrl = useServerUrl();
|
|
const [sendingMessage, setSendingMessage] = useState(false);
|
|
const [channelTimezoneCount, setChannelTimezoneCount] = useState(0);
|
|
|
|
const canSend = useMemo(() => {
|
|
if (sendingMessage) {
|
|
return false;
|
|
}
|
|
|
|
const messageLength = value.trim().length;
|
|
|
|
if (messageLength > maxMessageLength) {
|
|
return false;
|
|
}
|
|
|
|
if (files.length) {
|
|
const loadingComplete = !files.some((file) => DraftUploadManager.isUploading(file.clientId!));
|
|
return loadingComplete;
|
|
}
|
|
|
|
return messageLength > 0;
|
|
}, [sendingMessage, value, files, maxMessageLength]);
|
|
|
|
const handleReaction = useCallback((emoji: string, add: boolean) => {
|
|
handleReactionToLatestPost(serverUrl, emoji, add, rootId);
|
|
clearDraft();
|
|
setSendingMessage(false);
|
|
}, [serverUrl, rootId, clearDraft]);
|
|
|
|
const doSubmitMessage = useCallback(() => {
|
|
const postFiles = files.filter((f) => !f.failed);
|
|
const post = {
|
|
user_id: currentUserId,
|
|
channel_id: channelId,
|
|
root_id: rootId,
|
|
message: value,
|
|
} as Post;
|
|
|
|
if (!rootId && (
|
|
postPriority.priority ||
|
|
postPriority.requested_ack ||
|
|
postPriority.persistent_notifications)
|
|
) {
|
|
post.metadata = {
|
|
priority: postPriority,
|
|
};
|
|
}
|
|
|
|
createPost(serverUrl, post, postFiles);
|
|
|
|
clearDraft();
|
|
setSendingMessage(false);
|
|
DeviceEventEmitter.emit(Events.POST_LIST_SCROLL_TO_BOTTOM, rootId ? Screens.THREAD : Screens.CHANNEL);
|
|
}, [files, currentUserId, channelId, rootId, value, postPriority, serverUrl, clearDraft]);
|
|
|
|
const showSendToAllOrChannelOrHereAlert = useCallback((calculatedMembersCount: number, atHere: boolean) => {
|
|
const notifyAllMessage = DraftUtils.buildChannelWideMentionMessage(intl, calculatedMembersCount, channelTimezoneCount, atHere);
|
|
const cancel = () => {
|
|
setSendingMessage(false);
|
|
};
|
|
|
|
DraftUtils.alertChannelWideMention(intl, notifyAllMessage, doSubmitMessage, cancel);
|
|
}, [intl, channelTimezoneCount, doSubmitMessage]);
|
|
|
|
const sendCommand = useCallback(async () => {
|
|
if (value.trim().startsWith('/call')) {
|
|
const {handled, error} = await handleCallsSlashCommand(value.trim(), serverUrl, channelId, channelType ?? '', rootId, currentUserId, intl);
|
|
if (handled) {
|
|
setSendingMessage(false);
|
|
clearDraft();
|
|
return;
|
|
}
|
|
if (error) {
|
|
setSendingMessage(false);
|
|
DraftUtils.alertSlashCommandFailed(intl, error);
|
|
return;
|
|
}
|
|
}
|
|
|
|
const status = DraftUtils.getStatusFromSlashCommand(value);
|
|
if (userIsOutOfOffice && status) {
|
|
const updateStatus = (newStatus: string) => {
|
|
setStatus(serverUrl, {
|
|
status: newStatus,
|
|
last_activity_at: Date.now(),
|
|
manual: true,
|
|
user_id: currentUserId,
|
|
});
|
|
};
|
|
confirmOutOfOfficeDisabled(intl, status, updateStatus);
|
|
setSendingMessage(false);
|
|
return;
|
|
}
|
|
|
|
const {data, error} = await executeCommand(serverUrl, intl, value, channelId, rootId);
|
|
setSendingMessage(false);
|
|
|
|
if (error) {
|
|
const errorMessage = getFullErrorMessage(error);
|
|
DraftUtils.alertSlashCommandFailed(intl, errorMessage);
|
|
return;
|
|
}
|
|
|
|
clearDraft();
|
|
|
|
if (data?.goto_location && !value.startsWith('/leave')) {
|
|
handleGotoLocation(serverUrl, intl, data.goto_location);
|
|
}
|
|
}, [value, userIsOutOfOffice, serverUrl, intl, channelId, rootId, clearDraft, channelType, currentUserId]);
|
|
|
|
const sendMessage = useCallback(() => {
|
|
const notificationsToChannel = enableConfirmNotificationsToChannel && useChannelMentions;
|
|
const toAllOrChannel = DraftUtils.textContainsAtAllAtChannel(value);
|
|
const toHere = DraftUtils.textContainsAtHere(value);
|
|
|
|
if (value.indexOf('/') === 0) {
|
|
sendCommand();
|
|
} else if (notificationsToChannel && membersCount > NOTIFY_ALL_MEMBERS && (toAllOrChannel || toHere)) {
|
|
showSendToAllOrChannelOrHereAlert(membersCount, toHere && !toAllOrChannel);
|
|
} else {
|
|
doSubmitMessage();
|
|
}
|
|
}, [enableConfirmNotificationsToChannel, useChannelMentions, value, membersCount, sendCommand, showSendToAllOrChannelOrHereAlert, doSubmitMessage]);
|
|
|
|
const handleSendMessage = useCallback(preventDoubleTap(() => {
|
|
if (!canSend) {
|
|
return;
|
|
}
|
|
|
|
setSendingMessage(true);
|
|
|
|
const match = isReactionMatch(value, customEmojis);
|
|
if (match && !files.length) {
|
|
handleReaction(match.emoji, match.add);
|
|
return;
|
|
}
|
|
|
|
const hasFailedAttachments = files.some((f) => f.failed);
|
|
if (hasFailedAttachments) {
|
|
const cancel = () => {
|
|
setSendingMessage(false);
|
|
};
|
|
const accept = () => {
|
|
// Files are filtered on doSubmitMessage
|
|
sendMessage();
|
|
};
|
|
|
|
DraftUtils.alertAttachmentFail(intl, accept, cancel);
|
|
} else {
|
|
sendMessage();
|
|
}
|
|
}), [canSend, value, handleReaction, files, sendMessage, customEmojis]);
|
|
|
|
useEffect(() => {
|
|
getChannelTimezones(serverUrl, channelId).then(({channelTimezones}) => {
|
|
setChannelTimezoneCount(channelTimezones?.length || 0);
|
|
});
|
|
}, [serverUrl, channelId]);
|
|
|
|
return {
|
|
handleSendMessage,
|
|
canSend,
|
|
};
|
|
};
|