Fix "in contacts" tooltip exceeding desired boundary

See [#4907][0].

[0]: https://github.com/signalapp/Signal-Desktop/pull/4907
This commit is contained in:
Will Golledge 2021-10-18 17:10:22 -05:00 committed by Evan Hahn
parent 54974b377a
commit 2cd02855fc
5 changed files with 65 additions and 4 deletions

View file

@ -9,15 +9,26 @@ import { LocalizerType } from '../types/Util';
type PropsType = {
className?: string;
tooltipContainerRef?: React.RefObject<HTMLElement>;
i18n: LocalizerType;
};
export const InContactsIcon = (props: PropsType): JSX.Element => {
const { className, i18n } = props;
const { className, i18n, tooltipContainerRef } = props;
/* eslint-disable jsx-a11y/no-noninteractive-tabindex */
return (
<Tooltip content={i18n('contactInAddressBook')}>
<Tooltip
content={i18n('contactInAddressBook')}
popperModifiers={[
{
name: 'preventOverflow',
options: {
boundary: tooltipContainerRef?.current || undefined,
},
},
]}
>
<span
aria-label={i18n('contactInAddressBook')}
className={classNames('module-in-contacts-icon__icon', className)}