From 7d45f3b2785b4e0e26747332629e9b5d091a743e Mon Sep 17 00:00:00 2001
From: Elyor Djalilov <elyor.djalilov@onlyoffice.com>
Date: Thu, 1 Feb 2024 18:22:12 +0500
Subject: [PATCH] fixed user sessions panel

---
 .../UserSessionsPanel/AllSessionsBlock.js     | 12 +++++++++--
 .../sub-components/RowView/SessionsRow.js     |  2 +-
 .../RowView/SessionsRowContent.js             | 21 ++++++++++++-------
 .../categories/security/sessions/index.js     |  5 ++++-
 .../client/src/store/SettingsSetupStore.js    |  9 ++++++++
 5 files changed, 38 insertions(+), 11 deletions(-)

diff --git a/packages/client/src/components/panels/UserSessionsPanel/AllSessionsBlock.js b/packages/client/src/components/panels/UserSessionsPanel/AllSessionsBlock.js
index 9e498d41b7..b9a0134ef4 100644
--- a/packages/client/src/components/panels/UserSessionsPanel/AllSessionsBlock.js
+++ b/packages/client/src/components/panels/UserSessionsPanel/AllSessionsBlock.js
@@ -19,12 +19,20 @@ const Wrapper = styled.div`
 `;
 
 const AllSessionsBlock = (props) => {
-  const { t, allSessions } = props;
+  const { t, allSessions, data } = props;
 
   const onLogoutClick = () => {
     console.log("Logout all sessions");
   };
 
+  const foundSession = allSessions.find(
+    (session) => session?.userId === data?.userId
+  );
+
+  const sessionsData = foundSession
+    ? foundSession.sessions.map((data) => data)
+    : [];
+
   return (
     <>
       <Wrapper>
@@ -39,7 +47,7 @@ const AllSessionsBlock = (props) => {
         />
       </Wrapper>
 
-      <RowWrapper t={t} sessionsData={allSessions} />
+      <RowWrapper t={t} sessionsData={sessionsData} />
     </>
   );
 };
diff --git a/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRow.js b/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRow.js
index bb529f5b2c..92a481e805 100644
--- a/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRow.js
+++ b/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRow.js
@@ -13,7 +13,7 @@ const SessionsRow = (props) => {
 
   return (
     <StyledRow
-      key={item.userId}
+      key={item.id}
       data={item}
       sectionWidth={sectionWidth}
       contextButtonSpacerWidth="0"
diff --git a/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRowContent.js b/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRowContent.js
index 3759057c22..11467de63c 100644
--- a/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRowContent.js
+++ b/packages/client/src/components/panels/UserSessionsPanel/sub-components/RowView/SessionsRowContent.js
@@ -1,3 +1,4 @@
+import { observer, inject } from "mobx-react";
 import { Text } from "@docspace/shared/components/text";
 import { Box } from "@docspace/shared/components/box";
 import { convertTime } from "@docspace/shared/utils/convertTime";
@@ -73,22 +74,22 @@ const StyledRowContent = styled(RowContent)`
 const SessionsRowContent = ({
   item,
   sectionWidth,
-  setSessionModalData,
+  setPlatformModalData,
   setLogoutDialogVisible,
 }) => {
-  const { date, platform, browser, country, city, userId } = item;
+  const { id, platform, browser, country, city, date } = item;
 
   const onClickDisable = () => {
     setLogoutDialogVisible(true);
-    setSessionModalData({
-      ...item,
+    setPlatformModalData({
+      id: item.id,
       platform: item.platform,
-      broser: item.browser,
+      browser: item.browser,
     });
   };
 
   const contentData = [
-    <Box key={userId} className="session-info-wrapper">
+    <Box key={id} className="session-info-wrapper">
       <Box className="session-content-wrapper">
         <Box className="main-row-content">
           <Text className="platform">{platform},</Text>
@@ -115,4 +116,10 @@ const SessionsRowContent = ({
   );
 };
 
-export default SessionsRowContent;
+export default inject(({ setup }) => {
+  const { setPlatformModalData } = setup;
+
+  return {
+    setPlatformModalData,
+  };
+})(observer(SessionsRowContent));
diff --git a/packages/client/src/pages/PortalSettings/categories/security/sessions/index.js b/packages/client/src/pages/PortalSettings/categories/security/sessions/index.js
index a92e2c40b5..a58e56311d 100644
--- a/packages/client/src/pages/PortalSettings/categories/security/sessions/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/security/sessions/index.js
@@ -89,6 +89,7 @@ const Sessions = ({
   setLogoutDialogVisible,
   setLogoutAllDialogVisible,
   sessionModalData,
+  platformModalData,
 }) => {
   const [isLoading, setIsLoading] = useState(false);
 
@@ -174,7 +175,7 @@ const Sessions = ({
         <LogoutSessionDialog
           t={t}
           visible={logoutDialogVisible}
-          data={sessionModalData}
+          data={platformModalData}
           isLoading={isLoading}
           onClose={() => setLogoutDialogVisible(false)}
           onRemoveSession={onClickRemoveSession}
@@ -213,6 +214,7 @@ export default inject(({ auth, setup, peopleStore }) => {
     setLogoutDialogVisible,
     setLogoutAllDialogVisible,
     sessionModalData,
+    platformModalData,
   } = setup;
 
   return {
@@ -230,6 +232,7 @@ export default inject(({ auth, setup, peopleStore }) => {
     setLogoutDialogVisible,
     setLogoutAllDialogVisible,
     sessionModalData,
+    platformModalData,
   };
 })(
   withTranslation(["Settings", "Profile", "Common", "ChangeUserStatusDialog"])(
diff --git a/packages/client/src/store/SettingsSetupStore.js b/packages/client/src/store/SettingsSetupStore.js
index 038ee95bbe..5f7b6248c4 100644
--- a/packages/client/src/store/SettingsSetupStore.js
+++ b/packages/client/src/store/SettingsSetupStore.js
@@ -82,6 +82,7 @@ class SettingsSetupStore {
   sessions = [];
   currentSession = [];
   sessionModalData = {};
+  platformModalData = {};
 
   constructor() {
     this.selectionStore = new SelectionStore(this);
@@ -541,6 +542,14 @@ class SettingsSetupStore {
       ...data,
     };
   };
+
+  setPlatformModalData = (data) => {
+    this.platformModalData = {
+      id: data.id,
+      platform: data.platform,
+      browser: data.browser,
+    };
+  };
 }
 
 export default SettingsSetupStore;