change structure dmenu

src/config/Pages.ts

@@ -122,8 +122,13 @@ export const Pages = {
     errors: "/access-logs/errors",
     permissions: "/access-logs/permissions",
   },
+  dmenu: {
     icons: {
-    list: "/icons/list",
+      list: "/dmenu/icons/list",
-    groupList: "/icons/group/list",
+      groupList: "/dmenu/icons/group/list",
+    },
+    warnings: {
+      list: "/dmenu/reports/list",
+    },
   },
 };

src/langs/fa.json

@@ -74,7 +74,10 @@
     "support": "پلن پشتیبانی",
     "feedback": "گزارش ها",
     "accessLogs": "لاگ‌های دسترسی",
-    "icons": "آیکون ها"
+    "icons": "آیکون ها",
+    "dmenu": "دی منو",
+    "groups_icon": "گروه های آیکون",
+    "reports": "گزارش ها"
   },
   "slider": {
     "new_slider": "اسلایدر جدید",

src/pages/dmenu/icon/GroupList.tsx

@@ -1,15 +1,15 @@
 import { type FC, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import Button from '../../components/Button'
+import Button from '../../../components/Button'
 import { Add } from 'iconsax-react'
 import CreateGroupIcon from './components/CreateGroupIcon'
-import { useGetGroupIcons, useDeleteGroupIcon } from './hooks/useIconData'
+import { useGetGroupIcons, useDeleteGroupIcon } from '../hooks/useIconData'
-import Td from '../../components/Td'
+import Td from '../../../components/Td'
-import Input from '../../components/Input'
+import Input from '../../../components/Input'
-import PageLoading from '../../components/PageLoading'
+import PageLoading from '../../../components/PageLoading'
-import TrashWithConfrim from '../../components/TrashWithConfrim'
+import TrashWithConfrim from '../../../components/TrashWithConfrim'
 import { toast } from 'react-toastify'
-import { ErrorType } from '../../helpers/types'
+import { ErrorType } from '../../../helpers/types'
 import { GroupIconType } from './types/Types'
 
 const GroupIconList: FC = () => {

src/pages/dmenu/icon/List.tsx

@@ -1,15 +1,15 @@
 import { useState, type FC } from 'react'
-import { useGetIcons, useDeleteIcon } from './hooks/useIconData'
+import { useGetIcons, useDeleteIcon } from '../hooks/useIconData'
 import { useTranslation } from 'react-i18next'
-import Button from '../../components/Button'
+import Button from '../../../components/Button'
 import { Add } from 'iconsax-react'
 import CreateIcon from './components/CreateIcon'
-import Td from '../../components/Td'
+import Td from '../../../components/Td'
-import Input from '../../components/Input'
+import Input from '../../../components/Input'
-import PageLoading from '../../components/PageLoading'
+import PageLoading from '../../../components/PageLoading'
-import TrashWithConfrim from '../../components/TrashWithConfrim'
+import TrashWithConfrim from '../../../components/TrashWithConfrim'
 import { toast } from 'react-toastify'
-import { ErrorType } from '../../helpers/types'
+import { ErrorType } from '../../../helpers/types'
 import { IconType } from './types/Types'
 import moment from 'moment-jalaali'
 

src/pages/dmenu/icon/components/CreateGroupIcon.tsx

@@ -1,15 +1,15 @@
 import { FC } from 'react'
 import { useTranslation } from 'react-i18next'
-import Button from '../../../components/Button'
+import Button from '../../../../components/Button'
-import DefaulModal from '../../../components/DefaulModal'
+import DefaulModal from '../../../../components/DefaulModal'
-import Input from '../../../components/Input'
+import Input from '../../../../components/Input'
 import { useFormik } from 'formik'
 import * as Yup from 'yup'
 import { toast } from 'react-toastify'
 import { TickCircle } from 'iconsax-react'
-import { useCreateGroupIcon } from '../hooks/useIconData'
+import { useCreateGroupIcon } from '../../hooks/useIconData'
 import { CreateGroupIconType } from '../types/Types'
-import { ErrorType } from '../../../helpers/types'
+import { ErrorType } from '../../../../helpers/types'
 
 interface CreateGroupIconProps {
     open: boolean

src/pages/dmenu/icon/components/CreateIcon.tsx

@@ -1,17 +1,17 @@
 import { FC, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import Button from '../../../components/Button'
+import Button from '../../../../components/Button'
-import DefaulModal from '../../../components/DefaulModal'
+import DefaulModal from '../../../../components/DefaulModal'
-import UploadBox from '../../../components/UploadBox'
+import UploadBox from '../../../../components/UploadBox'
-import Select from '../../../components/Select'
+import Select from '../../../../components/Select'
 import { useFormik } from 'formik'
 import * as Yup from 'yup'
 import { toast } from 'react-toastify'
 import { TickCircle } from 'iconsax-react'
-import { useCreateIcon, useGetGroupIcons } from '../hooks/useIconData'
+import { useCreateIcon, useGetGroupIcons } from '../../hooks/useIconData'
-import { useSingleUpload } from '../../service/hooks/useServiceData'
+import { useSingleUpload } from '../../../service/hooks/useServiceData'
 import { CreateIconType, GroupIconType } from '../types/Types'
-import { ErrorType } from '../../../helpers/types'
+import { ErrorType } from '../../../../helpers/types'
 
 interface CreateIconProps {
     open: boolean

src/pages/dmenu/icon/types/Types.ts

@@ -1,4 +1,4 @@
-import { IResponse } from "../../../types/response.types";
+import { IResponse } from "../../../../types/response.types";
 
 export type CreateGroupIconType = {
   name: string;

src/pages/dmenu/service/IconService.ts

@@ -4,7 +4,7 @@ import {
   CreateIconType,
   GroupIconsResponse,
   IconsResponse,
-} from "../types/Types";
+} from "../icon/types/Types";
 
 export const getIcons = async (): Promise<IconsResponse> => {
   const { data } = await axios.get("/admin/dmenu/icons");

src/router/Main.tsx

@@ -77,8 +77,9 @@ import AccessLogsList from '../pages/accessLogs/AccessLogsList'
 import AccessLogsStats from '../pages/accessLogs/AccessLogsStats'
 import ErrorLogs from '../pages/accessLogs/ErrorLogs'
 import PermissionLogs from '../pages/accessLogs/PermissionLogs'
-import IconsList from '../pages/icon/List.tsx'
+import IconsList from '../pages/dmenu/icon/List'
-import GroupIconList from '../pages/icon/GroupList'
+import GroupIconList from '../pages/dmenu/icon/GroupList'
+// import WarningsList from '../pages/dmenu/reports/List' // TODO: Create this component
 const MainRouter: FC = () => {
 
     const { hasSubMenu } = useSharedStore()
@@ -168,8 +169,9 @@ const MainRouter: FC = () => {
                             <Route path={Pages.accessLogs.errors} element={<ErrorLogs />} />
                             <Route path={Pages.accessLogs.permissions} element={<PermissionLogs />} />
 
-                            <Route path={Pages.icons.list} element={<IconsList />} />
+                            <Route path={Pages.dmenu.icons.list} element={<IconsList />} />
-                            <Route path={Pages.icons.groupList} element={<GroupIconList />} />
+                            <Route path={Pages.dmenu.icons.groupList} element={<GroupIconList />} />
+                            {/* <Route path={Pages.dmenu.warnings.list} element={<WarningsList />} /> */}
                         </Routes>
                     </div>
                 </div>

src/shared/SideBar.tsx

@@ -2,7 +2,7 @@ import { FC, useEffect } from 'react'
 import LogoImage from '../assets/images/logo.svg'
 import LogoSmall from '../assets/images/logo-small.svg'
 import { useTranslation } from 'react-i18next'
-import { Card, Code, CodeCircle, DocumentLike, DocumentText, Element3, Gallery, Headphone, Home2, Logout, Message, Messages3, Money3, NotificationStatus, People, Profile, Receipt21, Setting2, SmsTracking, Teacher, TicketDiscount, UserSquare, Activity, Icon } from 'iconsax-react'
+import { Card, Code, CodeCircle, DocumentLike, DocumentText, Element3, Gallery, Headphone, Home2, Logout, Message, Messages3, Money3, NotificationStatus, People, Profile, Receipt21, Setting2, SmsTracking, Teacher, TicketDiscount, UserSquare, Activity, Icon, Category, Warning2 } from 'iconsax-react'
 import SideBarItem from './SideBarItem'
 import { useLocation } from 'react-router-dom'
 import { Pages } from '../config/Pages'
@@ -19,12 +19,14 @@ import BlogSubMenu from './components/BlogSubMenu'
 import { useGetProfile } from '../pages/profile/hooks/useProfileData'
 import SupportSubMenu from './components/SupportSubMenu'
 import AccessLogsSubMenu from './components/AccessLogsSubMenu'
+import { useGetAdminPermissions } from '../pages/users/hooks/useUserData'
 const SideBar: FC = () => {
 
     const { t } = useTranslation('global')
     const { openSidebar, setOpenSidebar, hasSubMenu, setSubMenuName, setSubtMenu, subMenuName } = useSharedStore()
     const location = useLocation()
     const { data: profile } = useGetProfile()
+    const { data: adminPermissions } = useGetAdminPermissions()
     const isActive = (name: string) => {
         return location.pathname.includes(name)
     }
@@ -292,18 +294,51 @@ const SideBar: FC = () => {
                         />
                     </div>
 
+                    {
+                        adminPermissions?.data?.permissions?.some((permission: { name: string }) => permission.name === 'dmenu') &&
+                        <>
+                            <div className={clx(
+                                'mt-10 px-12 text-header text-sm font-normal',
+                                hasSubMenu && 'px-2 text-center'
+                            )}>
+                                {t('sidebar.dmenu')}
+                            </div>
+                            <div className='flex-1 flex flex-col justify-end'>
 
-
-                    <div className='flex-1 flex flex-col justify-end mt-14'>
                                 <div className='text-xs text-[#8C90A3]'>
                                     <SideBarItem
-                                icon={<Icon variant={isActive('icons') ? 'Bold' : 'Outline'} color={isActive('icons') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
+                                        icon={<Icon variant={isActive('icons/list') ? 'Bold' : 'Outline'} color={isActive('icons/list') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
                                         title={t('sidebar.icons')}
-                                isActive={isActive('icons')}
+                                        isActive={isActive('icons/list')}
-                                link={Pages.icons.list}
+                                        link={Pages.dmenu.icons.list}
                                         activeName='dmenu'
                                     />
                                 </div>
+
+                                <div className='text-xs text-[#8C90A3]'>
+                                    <SideBarItem
+                                        icon={<Category variant={isActive('group') ? 'Bold' : 'Outline'} color={isActive('group') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
+                                        title={t('sidebar.groups_icon')}
+                                        isActive={isActive('group')}
+                                        link={Pages.dmenu.icons.groupList}
+                                        activeName='dmenu'
+                                    />
+                                </div>
+
+                                <div className='text-xs text-[#8C90A3]'>
+                                    <SideBarItem
+                                        icon={<Warning2 variant={isActive('reports') ? 'Bold' : 'Outline'} color={isActive('reports') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
+                                        title={t('sidebar.reports')}
+                                        isActive={isActive('reports')}
+                                        link={Pages.dmenu.warnings.list}
+                                        activeName='dmenu'
+                                    />
+                                </div>
+                            </div>
+                        </>
+                    }
+
+                    <div className='flex-1 flex flex-col justify-end mt-14'>
                         <div className='text-xs text-[#8C90A3]'>
                             <SideBarItem
                                 icon={<Card variant={isActive('card') ? 'Bold' : 'Outline'} color={isActive('card') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
@@ -333,6 +368,7 @@ const SideBar: FC = () => {
                             />
                         </div>
                     </div>
+
                 </div>
             </div >