From 277d39328ee01e51c27d7ba043be8c6e2f9532a4 Mon Sep 17 00:00:00 2001 From: Hugo Costa Date: Mon, 30 Jan 2023 14:37:03 -0300 Subject: [PATCH 1/2] fix: embedded layout openning sidebar --- .../app/mentions-flextab/client/actionButton.ts | 1 + .../meteor/app/message-pin/client/actionButton.ts | 1 + .../app/message-star/client/actionButton.ts | 1 + apps/meteor/app/search/client/provider/result.js | 1 + .../client/components/UserCard/UserCard.tsx | 4 +++- .../message/toolbox/MessageActionMenu.tsx | 5 ++++- .../client/views/room/hooks/useGoToThreadList.ts | 4 ++-- .../useUserInfoActions/useUserInfoActions.ts | 5 ++++- .../views/room/providers/ToolboxProvider.tsx | 15 +++++++++------ 9 files changed, 26 insertions(+), 11 deletions(-) diff --git a/apps/meteor/app/mentions-flextab/client/actionButton.ts b/apps/meteor/app/mentions-flextab/client/actionButton.ts index aa39b619f3d4..05301f804fea 100644 --- a/apps/meteor/app/mentions-flextab/client/actionButton.ts +++ b/apps/meteor/app/mentions-flextab/client/actionButton.ts @@ -29,6 +29,7 @@ Meteor.startup(function () { name: Rooms.findOne({ _id: message.rid })?.name ?? '', }, { + ...FlowRouter.current().queryParams, jump: message._id, }, ); diff --git a/apps/meteor/app/message-pin/client/actionButton.ts b/apps/meteor/app/message-pin/client/actionButton.ts index a661ba0c0b7a..47265e28b590 100644 --- a/apps/meteor/app/message-pin/client/actionButton.ts +++ b/apps/meteor/app/message-pin/client/actionButton.ts @@ -86,6 +86,7 @@ Meteor.startup(function () { name: Rooms.findOne({ _id: message.rid })?.name ?? '', }, { + ...FlowRouter.current().queryParams, jump: message._id, }, ); diff --git a/apps/meteor/app/message-star/client/actionButton.ts b/apps/meteor/app/message-star/client/actionButton.ts index 8a37b39b3507..fc0546c7072b 100644 --- a/apps/meteor/app/message-star/client/actionButton.ts +++ b/apps/meteor/app/message-star/client/actionButton.ts @@ -86,6 +86,7 @@ Meteor.startup(function () { name: Rooms.findOne({ _id: message.rid })?.name ?? '', }, { + ...FlowRouter.current().queryParams, jump: message._id, }, ); diff --git a/apps/meteor/app/search/client/provider/result.js b/apps/meteor/app/search/client/provider/result.js index 804c808ce05e..a733b862fc55 100644 --- a/apps/meteor/app/search/client/provider/result.js +++ b/apps/meteor/app/search/client/provider/result.js @@ -31,6 +31,7 @@ Meteor.startup(function () { name: Rooms.findOne({ _id: message.rid }).name, }, { + ...FlowRouter.current().queryParams, jump: message._id, }, ); diff --git a/apps/meteor/client/components/UserCard/UserCard.tsx b/apps/meteor/client/components/UserCard/UserCard.tsx index e54ab6ae5731..140236f812b6 100644 --- a/apps/meteor/client/components/UserCard/UserCard.tsx +++ b/apps/meteor/client/components/UserCard/UserCard.tsx @@ -4,6 +4,7 @@ import { useTranslation } from '@rocket.chat/ui-contexts'; import type { ReactNode, ComponentProps, MouseEvent } from 'react'; import React, { forwardRef } from 'react'; +import { useEmbeddedLayout } from '../../hooks/useEmbeddedLayout'; import MarkdownText from '../MarkdownText'; import * as Status from '../UserStatus'; import UserAvatar from '../avatar/UserAvatar'; @@ -65,6 +66,7 @@ const UserCard = forwardRef(function UserCard( ref, ) { const t = useTranslation(); + const isLayoutEmbedded = useEmbeddedLayout(); return ( @@ -111,7 +113,7 @@ const UserCard = forwardRef(function UserCard( {typeof bio === 'string' ? : bio} )} - {!isLoading && open && {t('See_full_profile')}} + {!isLoading && open && !isLayoutEmbedded && {t('See_full_profile')}} {onClose && ( diff --git a/apps/meteor/client/components/message/toolbox/MessageActionMenu.tsx b/apps/meteor/client/components/message/toolbox/MessageActionMenu.tsx index 3772ea5351a7..a12bf6f49585 100644 --- a/apps/meteor/client/components/message/toolbox/MessageActionMenu.tsx +++ b/apps/meteor/client/components/message/toolbox/MessageActionMenu.tsx @@ -4,6 +4,7 @@ import type { ComponentProps, UIEvent, ReactElement } from 'react'; import React, { useState, Fragment, useRef } from 'react'; import type { MessageActionConfig } from '../../../../app/ui-utils/client/lib/MessageAction'; +import { useEmbeddedLayout } from '../../../hooks/useEmbeddedLayout'; import ToolboxDropdown from './ToolboxDropdown'; type MessageActionConfigOption = Omit & { @@ -19,6 +20,7 @@ export const MessageActionMenu = ({ options, ...props }: MessageActionMenuProps) const t = useTranslation(); const [visible, setVisible] = useState(false); + const isLayoutEmbedded = useEmbeddedLayout(); const groupOptions = options .map(({ color, ...option }) => ({ @@ -28,7 +30,8 @@ export const MessageActionMenu = ({ options, ...props }: MessageActionMenuProps) .reduce((acc, option) => { const group = option.variant ? option.variant : ''; acc[group] = acc[group] || []; - acc[group].push(option); + if (!(isLayoutEmbedded && option.id === 'reply-directly')) acc[group].push(option); + return acc; }, {} as { [key: string]: MessageActionConfigOption[] }) as { [key: string]: MessageActionConfigOption[]; diff --git a/apps/meteor/client/views/room/hooks/useGoToThreadList.ts b/apps/meteor/client/views/room/hooks/useGoToThreadList.ts index 4dd4071dabf2..b0677118d035 100644 --- a/apps/meteor/client/views/room/hooks/useGoToThreadList.ts +++ b/apps/meteor/client/views/room/hooks/useGoToThreadList.ts @@ -5,7 +5,7 @@ import { useRoom } from '../contexts/RoomContext'; export const useGoToThreadList = ({ replace = false }: { replace?: boolean } = {}): (() => void) => { const room = useRoom(); - const [routeName, { context, ...params } = { context: '' }] = useCurrentRoute(); + const [routeName, { context, ...params } = { context: '' }, queryParams] = useCurrentRoute(); if (!routeName) { throw new Error('Route name is not defined'); @@ -14,6 +14,6 @@ export const useGoToThreadList = ({ replace = false }: { replace?: boolean } = { const roomRoute = useRoute(routeName); const go = replace ? roomRoute.replace : roomRoute.push; return useMutableCallback(() => { - go({ rid: room._id, ...params, tab: 'thread' }); + go({ rid: room._id, ...params, tab: 'thread' }, queryParams); }); }; diff --git a/apps/meteor/client/views/room/hooks/useUserInfoActions/useUserInfoActions.ts b/apps/meteor/client/views/room/hooks/useUserInfoActions/useUserInfoActions.ts index 5b7be9e36432..13d59c85daa4 100644 --- a/apps/meteor/client/views/room/hooks/useUserInfoActions/useUserInfoActions.ts +++ b/apps/meteor/client/views/room/hooks/useUserInfoActions/useUserInfoActions.ts @@ -1,6 +1,7 @@ import type { IRoom, IUser } from '@rocket.chat/core-typings'; import { useMemo } from 'react'; +import { useEmbeddedLayout } from '../../../../hooks/useEmbeddedLayout'; import type { Action } from '../../../hooks/useActionSpread'; import { useBlockUserAction } from './actions/useBlockUserAction'; import { useCallAction } from './actions/useCallAction'; @@ -28,10 +29,11 @@ export const useUserInfoActions = ( const muteUserOption = useMuteUserAction(user, rid); const removeUserOption = useRemoveUserAction(user, rid, reload); const callOption = useCallAction(user); + const isLayoutEmbedded = useEmbeddedLayout(); return useMemo( () => ({ - ...(openDirectMessageOption && { openDirectMessage: openDirectMessageOption }), + ...(openDirectMessageOption && !isLayoutEmbedded && { openDirectMessage: openDirectMessageOption }), ...(callOption && { call: callOption }), ...(changeOwnerOption && { changeOwner: changeOwnerOption }), ...(changeLeaderOption && { changeLeader: changeLeaderOption }), @@ -51,6 +53,7 @@ export const useUserInfoActions = ( removeUserOption, callOption, blockUserOption, + isLayoutEmbedded, ], ); }; diff --git a/apps/meteor/client/views/room/providers/ToolboxProvider.tsx b/apps/meteor/client/views/room/providers/ToolboxProvider.tsx index da814af11939..7021005ffaf4 100644 --- a/apps/meteor/client/views/room/providers/ToolboxProvider.tsx +++ b/apps/meteor/client/views/room/providers/ToolboxProvider.tsx @@ -21,7 +21,7 @@ const ToolboxProvider = ({ children, room }: { children: ReactNode; room: IRoom }); const { listen, actions } = useToolboxActions(room); - const [routeName, params] = useCurrentRoute(); + const [routeName, params, queryStringParams] = useCurrentRoute(); const router = useRoute(routeName || ''); const tab = params?.tab; @@ -33,11 +33,14 @@ const ToolboxProvider = ({ children, room }: { children: ReactNode; room: IRoom ); const close = useMutableCallback(() => { - router.push({ - ...params, - tab: '', - context: '', - }); + router.push( + { + ...params, + tab: '', + context: '', + }, + queryStringParams, + ); }); const open = useMutableCallback((actionId: string, context?: string) => { From 55bcf6dbcd6361bc56f655b1cafd556d3e05cf41 Mon Sep 17 00:00:00 2001 From: Hugo Costa Date: Mon, 6 Feb 2023 16:02:17 -0300 Subject: [PATCH 2/2] fix: send query params to new method to jump to message --- apps/meteor/client/lib/utils/jumpToMessage.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/meteor/client/lib/utils/jumpToMessage.ts b/apps/meteor/client/lib/utils/jumpToMessage.ts index 4ade65112439..f80f6a224cb2 100644 --- a/apps/meteor/client/lib/utils/jumpToMessage.ts +++ b/apps/meteor/client/lib/utils/jumpToMessage.ts @@ -20,6 +20,7 @@ export const jumpToMessage = (message: IMessage) => { name: ChatRoom.findOne({ _id: message.rid })?.name ?? '', }, { + ...FlowRouter.current().queryParams, jump: message._id, }, );