From 30fd9238e686efe16192cfee4e6980a23848cfb9 Mon Sep 17 00:00:00 2001
From: Andrewakiv <danchyshy.andriy@gmail.com>
Date: Fri, 20 Dec 2024 12:56:59 +0200
Subject: [PATCH] separate page for statistics

---
 FrontEnd/src/pages/AdminPage/Menu/Menu.jsx    | 10 +++---
 .../UserProfilesTable/ProfilesStatistics.jsx  | 36 ++++++++++---------
 .../ProfilesStatistics.module.css             |  9 +++++
 FrontEnd/src/routes/AdminRouter.jsx           |  2 ++
 4 files changed, 36 insertions(+), 21 deletions(-)

diff --git a/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx b/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx
index 8bb537a7..1ab3aea1 100644
--- a/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx
+++ b/FrontEnd/src/pages/AdminPage/Menu/Menu.jsx
@@ -1,6 +1,5 @@
-import { NavLink, useLocation } from 'react-router-dom';
+import { NavLink } from 'react-router-dom';
 import { useAuth } from '../../../hooks';
-import ProfilesStatistics from '../UserProfilesTable/ProfilesStatistics';
 import css from './Menu.module.css';
 
 const MENU = [
@@ -24,6 +23,11 @@ const MENU = [
         title: 'Налаштування часу автоапруву',
         link: '/customadmin/automoderation/'
     },
+    {
+        id: 'am5',
+        title: 'Статистика компаній',
+        link: '/customadmin/statistics/'
+    },
 ];
 
 
@@ -43,7 +47,6 @@ const SUPERUSER_MENU = [
 
 function Menu() {
     const { isSuperUser } = useAuth();
-    const location = useLocation();
 
     return (
         <div className={css['menu-section']}>
@@ -56,7 +59,6 @@ function Menu() {
                     key={element.id} to={element.link}>{element.title}
                 </NavLink>
             ))}
-            {location.pathname === '/customadmin/profiles/' && <ProfilesStatistics />}
         </div>
     );
 }
diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx
index 7354b456..3a8a07ef 100644
--- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx
+++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.jsx
@@ -46,23 +46,25 @@ function ProfilesStatistics() {
   ) : error ? (
     <div className={css['error']}>Не вдалося отримати статистику компаній</div>
   ) : (
-    <Descriptions
-      title="Статистика компаній"
-      column={1}
-      bordered
-      size="small"
-      items={items.map((item) => ({
-        ...item,
-        label: (
-          <span className={css['description-item-label']}>{item.label}</span>
-        ),
-        children: (
-          <span className={css['description-item-content']}>
-            {item.children}
-          </span>
-        ),
-      }))}
-    />
+    <div className={css['statistics-container']}>
+      <Descriptions
+        title="Статистика компаній"
+        column={1}
+        bordered
+        size="small"
+        items={items.map((item) => ({
+          ...item,
+          label: (
+            <span className={css['description-item-label']}>{item.label}</span>
+          ),
+          children: (
+            <span className={css['description-item-content']}>
+              {item.children}
+            </span>
+          ),
+        }))}
+      />
+    </div>
   );
 }
 
diff --git a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css
index 4e2dcbb6..8c86f64c 100644
--- a/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css
+++ b/FrontEnd/src/pages/AdminPage/UserProfilesTable/ProfilesStatistics.module.css
@@ -1,3 +1,12 @@
+.statistics-container {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  padding: 30px;
+}
+
 .description-item-label {
   max-width: 150px;
 }
diff --git a/FrontEnd/src/routes/AdminRouter.jsx b/FrontEnd/src/routes/AdminRouter.jsx
index f0ce191b..f2fdaf3a 100644
--- a/FrontEnd/src/routes/AdminRouter.jsx
+++ b/FrontEnd/src/routes/AdminRouter.jsx
@@ -18,6 +18,7 @@ import ModerationEmail from '../pages/AdminPage/DetailView/ModerationEmail';
 import Contacts from '../pages/AdminPage/DetailView/Contacts';
 import AdminProfilePage from '../pages/AdminPage/AdminProfile/AdminProfilePage';
 import AdminRegistration from '../pages/AdminPage/AdminRegistration/AdminRegistration';
+import ProfilesStatistics from '../pages/AdminPage/UserProfilesTable/ProfilesStatistics';
 
 import customAdminTheme from '../pages/CustomThemes/customAdminTheme.js';
 import '../pages/AdminPage/AdminGlobal.css';
@@ -46,6 +47,7 @@ function AdminRouter() {
             )}
             <Route path="/contacts" element={<Contacts />} />
             <Route path="/admin-profile/*" element={<AdminProfilePage />} />
+            <Route path="/statistics" element={<ProfilesStatistics />} />
         </>
     ) : (
         <Route path="/customadmin/" />