TelegramPWA/src/components/middle/message/SponsoredMessageContextMenuContainer.tsx
2024-11-27 20:34:08 +04:00

99 lines
2.5 KiB
TypeScript

import type { FC } from '../../../lib/teact/teact';
import React, { memo } from '../../../lib/teact/teact';
import { getActions } from '../../../global';
import type { ApiSponsoredMessage } from '../../../api/types';
import type { IAnchorPosition } from '../../../types';
import useLastCallback from '../../../hooks/useLastCallback';
import useShowTransition from '../../../hooks/useShowTransition';
import SponsoredMessageContextMenu from './SponsoredMessageContextMenu';
export type OwnProps = {
isOpen: boolean;
message: ApiSponsoredMessage;
anchor: IAnchorPosition;
triggerRef: React.RefObject<HTMLElement>;
shouldSkipAbout?: boolean;
onItemClick?: NoneToVoidFunction;
onClose: NoneToVoidFunction;
onCloseAnimationEnd: NoneToVoidFunction;
};
const SponsoredMessageContextMenuContainer: FC<OwnProps> = ({
isOpen,
message,
anchor,
triggerRef,
shouldSkipAbout,
onItemClick,
onClose,
onCloseAnimationEnd,
}) => {
const {
openAboutAdsModal,
showDialog,
reportSponsoredMessage,
hideSponsoredMessages,
} = getActions();
const { ref } = useShowTransition({
isOpen,
onCloseAnimationEnd,
});
const handleItemClick = useLastCallback(() => {
onItemClick?.();
onClose();
});
const handleAboutAdsOpen = useLastCallback(() => {
openAboutAdsModal({ chatId: message.chatId });
handleItemClick();
});
const handleSponsoredHide = useLastCallback(() => {
hideSponsoredMessages();
handleItemClick();
});
const handleSponsorInfo = useLastCallback(() => {
showDialog({
data: {
message: [message.sponsorInfo, message.additionalInfo].join('\n'),
},
});
handleItemClick();
});
const handleReportSponsoredMessage = useLastCallback(() => {
reportSponsoredMessage({ peerId: message.chatId, randomId: message.randomId });
handleItemClick();
});
if (!anchor) {
return undefined;
}
return (
<div ref={ref} className="ContextMenuContainer">
<SponsoredMessageContextMenu
isOpen={isOpen}
anchor={anchor}
triggerRef={triggerRef}
message={message}
shouldSkipAbout={shouldSkipAbout}
onClose={onClose}
onCloseAnimationEnd={onClose}
onAboutAdsClick={handleAboutAdsOpen}
onSponsoredHide={handleSponsoredHide}
onSponsorInfo={handleSponsorInfo}
onSponsoredReport={handleReportSponsoredMessage}
/>
</div>
);
};
export default memo(SponsoredMessageContextMenuContainer);