From b1aaa20baf81e26e3cfda656613c71e005ee5975 Mon Sep 17 00:00:00 2001
From: gazizova-vlada <vlada.gazizova@onlyoffice.com>
Date: Fri, 17 Feb 2023 16:07:28 +0300
Subject: [PATCH] Web:Client:Adding an ellipsis to a long name in the info
 panel, adding the width of the name block as a percentage.

---
 .../components/panels/InvitePanel/StyledInvitePanel.js    | 8 ++++++++
 .../components/panels/InvitePanel/sub-components/Item.js  | 5 +++--
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/panels/InvitePanel/StyledInvitePanel.js b/packages/client/src/components/panels/InvitePanel/StyledInvitePanel.js
index 7d74ac4d14..47cc7d5fe6 100644
--- a/packages/client/src/components/panels/InvitePanel/StyledInvitePanel.js
+++ b/packages/client/src/components/panels/InvitePanel/StyledInvitePanel.js
@@ -225,6 +225,13 @@ const StyledToggleButton = styled(ToggleButton)`
   margin-top: -4px;
 `;
 
+const StyledText = styled(Text)`
+  flex-basis: 72%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`;
+
 export {
   StyledBlock,
   StyledHeading,
@@ -247,4 +254,5 @@ export {
   ScrollList,
   StyledAccessSelector,
   StyledToggleButton,
+  StyledText,
 };
diff --git a/packages/client/src/components/panels/InvitePanel/sub-components/Item.js b/packages/client/src/components/panels/InvitePanel/sub-components/Item.js
index e32f2d6358..c237eee544 100644
--- a/packages/client/src/components/panels/InvitePanel/sub-components/Item.js
+++ b/packages/client/src/components/panels/InvitePanel/sub-components/Item.js
@@ -16,6 +16,7 @@ import {
   StyledCrossIcon,
   StyledHelpButton,
   StyledDeleteIcon,
+  StyledText,
 } from "../StyledInvitePanel";
 
 const Item = ({
@@ -110,9 +111,9 @@ const Item = ({
 
   const displayBody = (
     <>
-      <Text {...textProps} noSelect>
+      <StyledText {...textProps} noSelect>
         {inputValue}
-      </Text>
+      </StyledText>
       {hasError ? (
         <>
           <StyledHelpButton