chore: Move portals to the portals folder

apps/meteor/client/components/modal/ModalPortal.tsx → apps/meteor/client/portals/ModalPortal.tsx

@@ -2,16 +2,13 @@ import type { ReactElement, ReactNode } from 'react';
 import React, { memo, useEffect, useState } from 'react';
 import { createPortal } from 'react-dom';
 
-import { createAnchor } from '../../lib/utils/createAnchor';
-import { deleteAnchor } from '../../lib/utils/deleteAnchor';
+import { createAnchor } from '../lib/utils/createAnchor';
+import { deleteAnchor } from '../lib/utils/deleteAnchor';
 
 type ModalPortalProps = {
 	children?: ReactNode;
 };
 
-/**
- * @todo: move to portals folder
- */
 const ModalPortal = ({ children }: ModalPortalProps): ReactElement => {
 	const [modalRoot] = useState(() => createAnchor('modal-root'));
 	useEffect(() => (): void => deleteAnchor(modalRoot), [modalRoot]);

apps/meteor/client/components/TooltipPortal.tsx → apps/meteor/client/portals/TooltipPortal.tsx

@@ -6,7 +6,7 @@ import { createAnchor } from '../lib/utils/createAnchor';
 import { deleteAnchor } from '../lib/utils/deleteAnchor';
 
 const TooltipPortal: FC = ({ children }) => {
-	const [tooltipRoot] = useState(() => createAnchor('react-tooltip'));
+	const [tooltipRoot] = useState(() => createAnchor('tooltip-root'));
 	useEffect(() => (): void => deleteAnchor(tooltipRoot), [tooltipRoot]);
 	return <>{createPortal(children, tooltipRoot)}</>;
 };

apps/meteor/client/providers/TooltipProvider.tsx

@@ -4,7 +4,7 @@ import { TooltipContext } from '@rocket.chat/ui-contexts';
 import type { FC, ReactNode } from 'react';
 import React, { useEffect, useMemo, useRef, memo, useCallback, useState } from 'react';
 
-import TooltipPortal from '../components/TooltipPortal';
+import TooltipPortal from '../portals/TooltipPortal';
 
 const TooltipProvider: FC = ({ children }) => {
 	const lastAnchor = useRef<HTMLElement>();

apps/meteor/client/views/modal/ModalRegion.tsx

@@ -2,8 +2,8 @@ import { useModal, useCurrentModal } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import React, { lazy, useCallback } from 'react';
 
-import ModalBackdrop from '../../components/modal/ModalBackdrop';
-import ModalPortal from '../../components/modal/ModalPortal';
+import ModalBackdrop from '../../components/ModalBackdrop';
+import ModalPortal from '../../portals/ModalPortal';
 
 const FocusScope = lazy(() => import('react-aria').then((module) => ({ default: module.FocusScope })));