Web:Common:Article: add render with portal for mobile devices

This commit is contained in:
TimofeyBoyko 2022-11-22 12:16:53 +03:00
parent 9ae8273954
commit 91835c2b95

View File

@ -17,6 +17,7 @@ import ArticleProfile from "./sub-components/article-profile";
import ArticlePaymentAlert from "./sub-components/article-payment-alert"; import ArticlePaymentAlert from "./sub-components/article-payment-alert";
import { StyledArticle } from "./styled-article"; import { StyledArticle } from "./styled-article";
import HideArticleMenuButton from "./sub-components/article-hide-menu-button"; import HideArticleMenuButton from "./sub-components/article-hide-menu-button";
import Portal from "@docspace/components/portal";
const Article = ({ const Article = ({
showText, showText,
@ -107,7 +108,7 @@ const Article = ({
[setShowText] [setShowText]
); );
return ( const articleComponent = (
<> <>
<StyledArticle <StyledArticle
id={"article-container"} id={"article-container"}
@ -153,6 +154,20 @@ const Article = ({
) : null} ) : null}
</> </>
); );
const renderPortalArticle = () => {
const rootElement = document.getElementById("root");
return (
<Portal
element={articleComponent}
appendTo={rootElement}
visible={true}
/>
);
};
return isMobileOnly ? renderPortalArticle() : articleComponent;
}; };
Article.propTypes = { Article.propTypes = {