ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Composer / Embedded Message / Menu: Fix height

Browse Source
This commit is contained in:
Alexander Zinchuk 2024-09-11 02:07:12 +02:00
parent da6f094d41
commit ff72279f1c
2 changed files with 9 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/middle/message/MessageContextMenu.tsx
View File

@ -340,6 +340,7 @@ const MessageContextMenu: FC<OwnProps> = ({
getRootElement={getRootElement} getRootElement={getRootElement}
getMenuElement={getMenuElement} getMenuElement={getMenuElement}
getLayout={getLayout} getLayout={getLayout}
withMaxHeight
className={buildClassName( className={buildClassName(
'MessageContextMenu', 'fluid', withReactions && 'with-reactions', 'MessageContextMenu', 'fluid', withReactions && 'with-reactions',
)} )}

10
src/hooks/useMenuPosition.ts
View File

@ -23,6 +23,7 @@ interface DynamicPositionOptions {
getRootElement: () => HTMLElement | null; getRootElement: () => HTMLElement | null;
getMenuElement: () => HTMLElement | null; getMenuElement: () => HTMLElement | null;
getLayout?: () => Layout; getLayout?: () => Layout;
withMaxHeight?: boolean;
} }
export type MenuPositionOptions = export type MenuPositionOptions =
@ -122,6 +123,7 @@ function processDynamically(
getMenuElement, getMenuElement,
getTriggerElement, getTriggerElement,
getLayout, getLayout,
withMaxHeight,
}: DynamicPositionOptions, }: DynamicPositionOptions,
) { ) {
const triggerEl = getTriggerElement()!; const triggerEl = getTriggerElement()!;
@ -214,10 +216,14 @@ function processDynamically(
const transformOriginX = positionX === 'left' ? offsetX : menuRect.width + offsetX; const transformOriginX = positionX === 'left' ? offsetX : menuRect.width + offsetX;
const transformOriginY = positionY === 'bottom' ? menuRect.height + offsetY : offsetY; const transformOriginY = positionY === 'bottom' ? menuRect.height + offsetY : offsetY;
const menuMaxHeight = rootRect.height - MENU_POSITION_BOTTOM_MARGIN - (marginTop || 0);
const bubbleStyle = `max-height: ${menuMaxHeight}px;`;
const style = `left: ${left}px; top: ${top}px`; const style = `left: ${left}px; top: ${top}px`;
let bubbleStyle;
if (withMaxHeight) {
const menuMaxHeight = rootRect.height - MENU_POSITION_BOTTOM_MARGIN - (marginTop || 0);
bubbleStyle = `max-height: ${menuMaxHeight}px;`;
}
return { return {
positionX, positionX,
positionY, positionY,