stream-chat-react
Version:
React components to create chat conversations or livestream style chat
20 lines (19 loc) • 1.2 kB
JavaScript
import React, { useCallback } from 'react';
import { useDialogIsOpen, useOpenedDialogCount } from './hooks';
import { Portal } from '../Portal/Portal';
import { useDialogManager } from '../../context';
export const DialogPortalDestination = () => {
const { dialogManager } = useDialogManager();
const openedDialogCount = useOpenedDialogCount();
if (!openedDialogCount)
return null;
return (React.createElement("div", { className: 'str-chat__dialog-overlay', "data-str-chat__portal-id": dialogManager.id, "data-testid": 'str-chat__dialog-overlay', onClick: () => dialogManager.closeAll(), style: {
'--str-chat__dialog-overlay-height': openedDialogCount > 0 ? '100%' : '0',
} }));
};
export const DialogPortalEntry = ({ children, dialogId, }) => {
const { dialogManager } = useDialogManager({ dialogId });
const dialogIsOpen = useDialogIsOpen(dialogId, dialogManager.id);
const getPortalDestination = useCallback(() => document.querySelector(`div[data-str-chat__portal-id="${dialogManager.id}"]`), [dialogManager.id]);
return (React.createElement(Portal, { getPortalDestination: getPortalDestination, isOpen: dialogIsOpen }, children));
};