From 0d5f7943e5482e410bc3b7b8bb5216171fefd1fc Mon Sep 17 00:00:00 2001 From: Martin Schoeler Date: Sat, 23 Nov 2024 01:17:12 -0300 Subject: [PATCH] chore: remove meteor.startup from unstar-message (#34018) Co-authored-by: Tasso --- .../message/hooks/useStarMessageMutation.ts | 3 ++ .../message/hooks/useUnstarMessageMutation.ts | 33 +++++++++++++++ .../message/toolbar/MessageToolbar.tsx | 2 + .../message/toolbar/useStarMessageAction.ts | 2 +- .../message/toolbar/useUnstarMessageAction.ts | 40 +++++++++++++++++++ .../lib/mutationEffects/starredMessage.ts | 4 -- .../client/startup/actionButtons/index.ts | 1 - .../startup/actionButtons/unstarMessage.ts | 39 ------------------ 8 files changed, 79 insertions(+), 45 deletions(-) create mode 100644 apps/meteor/client/components/message/hooks/useUnstarMessageMutation.ts create mode 100644 apps/meteor/client/components/message/toolbar/useUnstarMessageAction.ts delete mode 100644 apps/meteor/client/startup/actionButtons/unstarMessage.ts diff --git a/apps/meteor/client/components/message/hooks/useStarMessageMutation.ts b/apps/meteor/client/components/message/hooks/useStarMessageMutation.ts index ba76fb59d029..da73b73eacd6 100644 --- a/apps/meteor/client/components/message/hooks/useStarMessageMutation.ts +++ b/apps/meteor/client/components/message/hooks/useStarMessageMutation.ts @@ -1,11 +1,13 @@ import type { IMessage } from '@rocket.chat/core-typings'; import { useToastMessageDispatch, useEndpoint } from '@rocket.chat/ui-contexts'; import { useQueryClient, useMutation } from '@tanstack/react-query'; +import { useTranslation } from 'react-i18next'; import { toggleStarredMessage } from '../../../lib/mutationEffects/starredMessage'; import { roomsQueryKeys } from '../../../lib/queryKeys'; export const useStarMessageMutation = () => { + const { t } = useTranslation(); const dispatchToastMessage = useToastMessageDispatch(); const queryClient = useQueryClient(); @@ -18,6 +20,7 @@ export const useStarMessageMutation = () => { }, onSuccess: (_data, message) => { toggleStarredMessage(message, true); + dispatchToastMessage({ type: 'success', message: t('Message_has_been_starred') }); }, onError: (error) => { dispatchToastMessage({ type: 'error', message: error }); diff --git a/apps/meteor/client/components/message/hooks/useUnstarMessageMutation.ts b/apps/meteor/client/components/message/hooks/useUnstarMessageMutation.ts new file mode 100644 index 000000000000..7cb29fd0bc3f --- /dev/null +++ b/apps/meteor/client/components/message/hooks/useUnstarMessageMutation.ts @@ -0,0 +1,33 @@ +import type { IMessage } from '@rocket.chat/core-typings'; +import { useToastMessageDispatch, useEndpoint } from '@rocket.chat/ui-contexts'; +import { useQueryClient, useMutation } from '@tanstack/react-query'; +import { useTranslation } from 'react-i18next'; + +import { toggleStarredMessage } from '../../../lib/mutationEffects/starredMessage'; +import { roomsQueryKeys } from '../../../lib/queryKeys'; + +export const useUnstarMessageMutation = () => { + const { t } = useTranslation(); + const dispatchToastMessage = useToastMessageDispatch(); + + const queryClient = useQueryClient(); + + const unstarMessage = useEndpoint('POST', '/v1/chat.unStarMessage'); + + return useMutation({ + mutationFn: async (message: IMessage) => { + await unstarMessage({ messageId: message._id }); + }, + onSuccess: (_data, message) => { + toggleStarredMessage(message, false); + dispatchToastMessage({ type: 'success', message: t('Message_has_been_unstarred') }); + }, + onError: (error) => { + dispatchToastMessage({ type: 'error', message: error }); + }, + onSettled: (_data, _error, message) => { + queryClient.invalidateQueries(roomsQueryKeys.starredMessages(message.rid)); + queryClient.invalidateQueries(roomsQueryKeys.messageActions(message.rid, message._id)); + }, + }); +}; diff --git a/apps/meteor/client/components/message/toolbar/MessageToolbar.tsx b/apps/meteor/client/components/message/toolbar/MessageToolbar.tsx index f29e701f6272..ac51c07a8e7e 100644 --- a/apps/meteor/client/components/message/toolbar/MessageToolbar.tsx +++ b/apps/meteor/client/components/message/toolbar/MessageToolbar.tsx @@ -12,6 +12,7 @@ import MessageActionMenu from './MessageActionMenu'; import MessageToolbarStarsActionMenu from './MessageToolbarStarsActionMenu'; import { useNewDiscussionMessageAction } from './useNewDiscussionMessageAction'; import { useStarMessageAction } from './useStarMessageAction'; +import { useUnstarMessageAction } from './useUnstarMessageAction'; import { useWebDAVMessageAction } from './useWebDAVMessageAction'; import type { MessageActionContext } from '../../../../app/ui-utils/client/lib/MessageAction'; import { MessageAction } from '../../../../app/ui-utils/client/lib/MessageAction'; @@ -90,6 +91,7 @@ const MessageToolbar = ({ useWebDAVMessageAction(); useNewDiscussionMessageAction(); useStarMessageAction(message, { room, user }); + useUnstarMessageAction(message, { room, user }); const actionsQueryResult = useQuery({ queryKey: roomsQueryKeys.messageActionsWithParameters(room._id, message), diff --git a/apps/meteor/client/components/message/toolbar/useStarMessageAction.ts b/apps/meteor/client/components/message/toolbar/useStarMessageAction.ts index bf52a3653a0f..829a94db9aa8 100644 --- a/apps/meteor/client/components/message/toolbar/useStarMessageAction.ts +++ b/apps/meteor/client/components/message/toolbar/useStarMessageAction.ts @@ -16,7 +16,7 @@ export const useStarMessageAction = (message: IMessage, { room, user }: { room: return; } - if (Array.isArray(message.starred) && message.starred.find((star) => star._id === user?._id)) { + if (Array.isArray(message.starred) && message.starred.some((star) => star._id === user?._id)) { return; } diff --git a/apps/meteor/client/components/message/toolbar/useUnstarMessageAction.ts b/apps/meteor/client/components/message/toolbar/useUnstarMessageAction.ts new file mode 100644 index 000000000000..851ce1ae4115 --- /dev/null +++ b/apps/meteor/client/components/message/toolbar/useUnstarMessageAction.ts @@ -0,0 +1,40 @@ +import type { IMessage, IRoom, IUser } from '@rocket.chat/core-typings'; +import { isOmnichannelRoom } from '@rocket.chat/core-typings'; +import { useSetting } from '@rocket.chat/ui-contexts'; +import { useEffect } from 'react'; + +import { MessageAction } from '../../../../app/ui-utils/client/lib/MessageAction'; +import { useUnstarMessageMutation } from '../hooks/useUnstarMessageMutation'; + +export const useUnstarMessageAction = (message: IMessage, { room, user }: { room: IRoom; user: IUser | undefined }) => { + const allowStarring = useSetting('Message_AllowStarring'); + + const { mutateAsync: unstarMessage } = useUnstarMessageMutation(); + + useEffect(() => { + if (!allowStarring || isOmnichannelRoom(room)) { + return; + } + + if (!Array.isArray(message.starred) || message.starred.every((star) => star._id !== user?._id)) { + return; + } + + MessageAction.addButton({ + id: 'unstar-message', + icon: 'star', + label: 'Unstar_Message', + type: 'interaction', + context: ['starred', 'message', 'message-mobile', 'threads', 'federated', 'videoconf', 'videoconf-threads'], + async action() { + await unstarMessage(message); + }, + order: 3, + group: 'menu', + }); + + return () => { + MessageAction.removeButton('unstar-message'); + }; + }, [allowStarring, message, room, unstarMessage, user?._id]); +}; diff --git a/apps/meteor/client/lib/mutationEffects/starredMessage.ts b/apps/meteor/client/lib/mutationEffects/starredMessage.ts index dcaa092fc627..45bd772415a8 100644 --- a/apps/meteor/client/lib/mutationEffects/starredMessage.ts +++ b/apps/meteor/client/lib/mutationEffects/starredMessage.ts @@ -2,8 +2,6 @@ import type { IMessage } from '@rocket.chat/core-typings'; import { Meteor } from 'meteor/meteor'; import { Messages } from '../../../app/models/client'; -import { t } from '../../../app/utils/lib/i18n'; -import { dispatchToastMessage } from '../toast'; export const toggleStarredMessage = (message: IMessage, starred: boolean) => { const uid = Meteor.userId()!; @@ -17,7 +15,6 @@ export const toggleStarredMessage = (message: IMessage, starred: boolean) => { }, }, ); - dispatchToastMessage({ type: 'success', message: t('Message_has_been_starred') }); return; } @@ -29,5 +26,4 @@ export const toggleStarredMessage = (message: IMessage, starred: boolean) => { }, }, ); - dispatchToastMessage({ type: 'success', message: t('Message_has_been_unstarred') }); }; diff --git a/apps/meteor/client/startup/actionButtons/index.ts b/apps/meteor/client/startup/actionButtons/index.ts index d91e1923cdd2..3b8e8c1407eb 100644 --- a/apps/meteor/client/startup/actionButtons/index.ts +++ b/apps/meteor/client/startup/actionButtons/index.ts @@ -6,4 +6,3 @@ import './permalinkPinned'; import './permalinkStar'; import './pinMessage'; import './unpinMessage'; -import './unstarMessage'; diff --git a/apps/meteor/client/startup/actionButtons/unstarMessage.ts b/apps/meteor/client/startup/actionButtons/unstarMessage.ts deleted file mode 100644 index 5a99428d7ba8..000000000000 --- a/apps/meteor/client/startup/actionButtons/unstarMessage.ts +++ /dev/null @@ -1,39 +0,0 @@ -import { Meteor } from 'meteor/meteor'; - -import { settings } from '../../../app/settings/client'; -import { MessageAction } from '../../../app/ui-utils/client'; -import { sdk } from '../../../app/utils/client/lib/SDKClient'; -import { toggleStarredMessage } from '../../lib/mutationEffects/starredMessage'; -import { queryClient } from '../../lib/queryClient'; -import { roomsQueryKeys } from '../../lib/queryKeys'; -import { dispatchToastMessage } from '../../lib/toast'; - -Meteor.startup(() => { - MessageAction.addButton({ - id: 'unstar-message', - icon: 'star', - label: 'Unstar_Message', - type: 'interaction', - context: ['starred', 'message', 'message-mobile', 'threads', 'federated', 'videoconf', 'videoconf-threads'], - async action(_, { message }) { - try { - await sdk.rest.post('/v1/chat.unStarMessage', { messageId: message._id }); - toggleStarredMessage(message, false); - } catch (error) { - dispatchToastMessage({ type: 'error', message: error }); - } finally { - queryClient.invalidateQueries(roomsQueryKeys.starredMessages(message.rid)); - queryClient.invalidateQueries(roomsQueryKeys.messageActions(message.rid, message._id)); - } - }, - condition({ message, subscription, user }) { - if (subscription == null && settings.get('Message_AllowStarring')) { - return false; - } - - return Boolean(message.starred?.find((star: any) => star._id === user?._id)); - }, - order: 3, - group: 'menu', - }); -});