danak/danak-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

permission

Browse Source
This commit is contained in:
hamid zarghami
2026-07-26 08:45:44 +03:30
parent b60a38e21d
commit 185961c162
35 changed files with 764 additions and 497 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/helpers/permissions.ts
+56 -3
View File
@@ -145,6 +145,19 @@ export enum PermissionEnum {
TASK_PHASE_UPDATE = "task_phase_update", TASK_PHASE_UPDATE = "task_phase_update",
TASK_PHASE_DELETE = "task_phase_delete", TASK_PHASE_DELETE = "task_phase_delete",
TICKET_CATEGORIES_CREATE = "ticket_categories_create",
TICKET_CATEGORIES_READ = "ticket_categories_read",
TICKET_CATEGORIES_UPDATE = "ticket_categories_update",
TICKET_CATEGORIES_DELETE = "ticket_categories_delete",
TICKET_MASTERS_CREATE = "ticket_masters_create",
TICKET_MASTERS_READ = "ticket_masters_read",
TICKET_MASTERS_UPDATE = "ticket_masters_update",
TICKET_MASTERS_DELETE = "ticket_masters_delete",
VIEW_ALL_WORKSPACES = "view_all_workspaces",
VIEW_ALL_PROJECTS = "view_all_projects",
LOGS = "logs", LOGS = "logs",
MANAGE_SSO_CLIENTS = "manage_sso_clients", MANAGE_SSO_CLIENTS = "manage_sso_clients",
DMENU = "dmenu", DMENU = "dmenu",
@@ -153,12 +166,26 @@ export enum PermissionEnum {
DMAIL = "dmail", DMAIL = "dmail",
} }
const CRUD_ACTIONS = ["create", "read", "update", "delete"] as const; export type CrudAction = "create" | "read" | "update" | "delete";
const CRUD_ACTIONS: readonly CrudAction[] = ["create", "read", "update", "delete"];
export const CONTENT_PERMISSION_RESOURCES = ["blogs", "learnings", "advertisements", "announcements"] as const; export const CONTENT_PERMISSION_RESOURCES = ["blogs", "learnings", "advertisements", "announcements"] as const;
export const FINANCIAL_PERMISSION_RESOURCES = ["payments", "invoices", "transactions", "discounts", "bank_accounts"] as const; export const FINANCIAL_PERMISSION_RESOURCES = ["payments", "invoices", "transactions", "discounts", "bank_accounts"] as const;
export const SUPPORT_PERMISSION_RESOURCES = ["support_plan", "tickets"] as const; export const SUPPORT_PERMISSION_RESOURCES = [
export const TASK_MANAGER_PERMISSION_RESOURCES = ["workspace", "project", "task", "task_phase"] as const; "support_plan",
"tickets",
"ticket_categories",
"ticket_masters",
] as const;
export const TASK_MANAGER_PERMISSION_RESOURCES = [
"workspace",
"project",
"task",
"task_phase",
"view_all_workspaces",
"view_all_projects",
] as const;
export const USERS_SIDEBAR_PERMISSION_RESOURCES = ["admins"] as const; export const USERS_SIDEBAR_PERMISSION_RESOURCES = ["admins"] as const;
export const PRODUCT_PERMISSION_RESOURCES = ["dmenu", "dkala", "dpage", "dmail"] as const; export const PRODUCT_PERMISSION_RESOURCES = ["dmenu", "dkala", "dpage", "dmail"] as const;
@@ -180,6 +207,32 @@ export const hasPermission = (
return CRUD_ACTIONS.some((action) => names.includes(`${resourceOrPermission}_${action}`)); return CRUD_ACTIONS.some((action) => names.includes(`${resourceOrPermission}_${action}`));
}; };
export const hasActionPermission = (
permissions: PermissionEntry[] | undefined,
resource: string,
action: CrudAction,
): boolean => {
const names = getPermissionNames(permissions);
if (names.includes(resource)) {
return true;
}
return names.includes(`${resource}_${action}`);
};
export const canCreate = (permissions: PermissionEntry[] | undefined, resource: string) =>
hasActionPermission(permissions, resource, "create");
export const canRead = (permissions: PermissionEntry[] | undefined, resource: string) =>
hasActionPermission(permissions, resource, "read");
export const canUpdate = (permissions: PermissionEntry[] | undefined, resource: string) =>
hasActionPermission(permissions, resource, "update");
export const canDelete = (permissions: PermissionEntry[] | undefined, resource: string) =>
hasActionPermission(permissions, resource, "delete");
export const hasAnyPermission = ( export const hasAnyPermission = (
permissions: PermissionEntry[] | undefined, permissions: PermissionEntry[] | undefined,
resources: readonly string[], resources: readonly string[],
src/hooks/usePermissions.ts
+28
View File
@@ -0,0 +1,28 @@
import {
canCreate,
canDelete,
canRead,
canUpdate,
CrudAction,
hasActionPermission,
hasAnyPermission,
hasPermission,
} from "../helpers/permissions";
import { useGetAdminPermissions } from "../pages/users/hooks/useUserData";
export const usePermissions = () => {
const { data, isPending, isLoading } = useGetAdminPermissions();
const permissions = data?.data?.permissions;
return {
permissions,
isPending: isPending || isLoading,
can: (resource: string, action: CrudAction) => hasActionPermission(permissions, resource, action),
canCreate: (resource: string) => canCreate(permissions, resource),
canRead: (resource: string) => canRead(permissions, resource),
canUpdate: (resource: string) => canUpdate(permissions, resource),
canDelete: (resource: string) => canDelete(permissions, resource),
has: (resourceOrPermission: string) => hasPermission(permissions, resourceOrPermission),
hasAny: (resources: readonly string[]) => hasAnyPermission(permissions, resources),
};
};
src/pages/ads/AdsList.tsx
+23 -15
View File
@@ -14,6 +14,7 @@ import moment from 'moment-jalaali'
import ToggleStatusAds from './components/ToggleStatus' import ToggleStatusAds from './components/ToggleStatus'
import PageLoading from '../../components/PageLoading' import PageLoading from '../../components/PageLoading'
import Pagination from '../../components/Pagination' import Pagination from '../../components/Pagination'
import { usePermissions } from '../../hooks/usePermissions'
const AddList: FC = () => { const AddList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
@@ -23,6 +24,7 @@ const AddList: FC = () => {
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const getAds = useGetAdsList(page, search, isActive, since) const getAds = useGetAdsList(page, search, isActive, since)
const deleteAds = useDeleteAds() const deleteAds = useDeleteAds()
const { canCreate, canUpdate, canDelete } = usePermissions()
const handleDelete = (id: string) => { const handleDelete = (id: string) => {
deleteAds.mutate(id, { deleteAds.mutate(id, {
@@ -39,18 +41,20 @@ const AddList: FC = () => {
{t('ads.ads')} {t('ads.ads')}
</div> </div>
<Link to={Pages.ads.create}> {canCreate('advertisements') && (
<Button <Link to={Pages.ads.create}>
className='w-[172px]' <Button
> className='w-[172px]'
<div className='flex gap-2 items-center'> >
<Add size={20} color='white' /> <div className='flex gap-2 items-center'>
<div> <Add size={20} color='white' />
{t('ads.new_ads')} <div>
{t('ads.new_ads')}
</div>
</div> </div>
</div> </Button>
</Button> </Link>
</Link> )}
</div> </div>
<div className='mt-4'> <div className='mt-4'>
<div className='flex flex-col xl:flex-row justify-between items-center xl:items-end'> <div className='flex flex-col xl:flex-row justify-between items-center xl:items-end'>
@@ -130,10 +134,14 @@ const AddList: FC = () => {
</Td> </Td>
<Td text={''}> <Td text={''}>
<div className='flex gap-3'> <div className='flex gap-3'>
<Link to={Pages.ads.update + item.id}> {canUpdate('advertisements') && (
<Eye size={20} color='#8C90A3' /> <Link to={Pages.ads.update + item.id}>
</Link> <Eye size={20} color='#8C90A3' />
<Trash onClick={() => handleDelete(item.id)} size={20} color='#8C90A3' /> </Link>
)}
{canDelete('advertisements') && (
<Trash onClick={() => handleDelete(item.id)} size={20} color='#8C90A3' />
)}
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/annoncement/List.tsx
+31 -23
View File
@@ -11,6 +11,7 @@ import moment from 'moment-jalaali'
import Pagination from '../../components/Pagination' import Pagination from '../../components/Pagination'
import { toast } from '../../components/Toast'; import { toast } from '../../components/Toast';
import { ErrorType } from '../../helpers/types' import { ErrorType } from '../../helpers/types'
import { usePermissions } from '../../hooks/usePermissions'
const AnnouncementtList: FC = () => { const AnnouncementtList: FC = () => {
@@ -18,6 +19,7 @@ const AnnouncementtList: FC = () => {
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const getAnnoncements = useGetAnnoncements(page, '', '') const getAnnoncements = useGetAnnoncements(page, '', '')
const deleteAnnoncement = useDeleteAnnoncement() const deleteAnnoncement = useDeleteAnnoncement()
const { canCreate, canUpdate, canDelete } = usePermissions()
const handleDelete = (id: string) => { const handleDelete = (id: string) => {
deleteAnnoncement.mutate(id, { deleteAnnoncement.mutate(id, {
@@ -38,21 +40,23 @@ const AnnouncementtList: FC = () => {
<div> <div>
{t('announcement.announcements')} {t('announcement.announcements')}
</div> </div>
<div> {canCreate('announcements') && (
<Link to={Pages.announcement.create}> <div>
<Button <Link to={Pages.announcement.create}>
className='px-5' <Button
> className='px-5'
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('announcement.add_announcement')}</div> />
</div> <div>{t('announcement.add_announcement')}</div>
</Button> </div>
</Link> </Button>
</div> </Link>
</div>
)}
</div> </div>
@@ -88,17 +92,21 @@ const AnnouncementtList: FC = () => {
<Td text={moment(item.publishAt).format('jYYYY-jMM-jDD')} /> <Td text={moment(item.publishAt).format('jYYYY-jMM-jDD')} />
<Td text={''}> <Td text={''}>
<div className='flex gap-2'> <div className='flex gap-2'>
<Link to={Pages.announcement.detail + item.id}> {canUpdate('announcements') && (
<Edit <Link to={Pages.announcement.detail + item.id}>
<Edit
className='size-5'
color='#888'
/>
</Link>
)}
{canDelete('announcements') && (
<Trash
className='size-5' className='size-5'
color='#888' color='#888'
onClick={() => handleDelete(item.id)}
/> />
</Link> )}
<Trash
className='size-5'
color='#888'
onClick={() => handleDelete(item.id)}
/>
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/blog/BlogCategory.tsx
+65 -57
View File
@@ -17,6 +17,7 @@ import UploadBoxDraggble from '../../components/UploadBoxDraggble'
import { useSingleUpload } from '../service/hooks/useServiceData' import { useSingleUpload } from '../service/hooks/useServiceData'
import { toast } from '../../components/Toast'; import { toast } from '../../components/Toast';
import UpdateCategory from './components/UpdateCategory' import UpdateCategory from './components/UpdateCategory'
import { usePermissions } from '../../hooks/usePermissions'
const BlogCategory: FC = () => { const BlogCategory: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
@@ -25,6 +26,7 @@ const BlogCategory: FC = () => {
const singleUpload = useSingleUpload() const singleUpload = useSingleUpload()
const createBlogCategory = useCreateBlogCategory() const createBlogCategory = useCreateBlogCategory()
const deleteBlogCategory = useDeleteBlogCategory() const deleteBlogCategory = useDeleteBlogCategory()
const { canCreate, canUpdate, canDelete } = usePermissions()
const formik = useFormik<CreateBlogCategoryType>({ const formik = useFormik<CreateBlogCategoryType>({
initialValues: { initialValues: {
title: '', title: '',
@@ -102,15 +104,19 @@ const BlogCategory: FC = () => {
<Td text={moment(item.createdAt).format('jYYYY/jMM/jDD')} /> <Td text={moment(item.createdAt).format('jYYYY/jMM/jDD')} />
<Td text={t('')}> <Td text={t('')}>
<div className='flex gap-2 items-center'> <div className='flex gap-2 items-center'>
<UpdateCategory id={item.id} /> {canUpdate('blogs') && (
<Trash size={20} color='red' onClick={() => { <UpdateCategory id={item.id} />
deleteBlogCategory.mutateAsync(item.id, { )}
onSuccess: () => { {canDelete('blogs') && (
toast('دسته بندی با موفقیت حذف شد', 'success') <Trash size={20} color='red' onClick={() => {
getBlogCategories.refetch() deleteBlogCategory.mutateAsync(item.id, {
} onSuccess: () => {
}) toast('دسته بندی با موفقیت حذف شد', 'success')
}} /> getBlogCategories.refetch()
}
})
}} />
)}
</div> </div>
</Td> </Td>
</tr> </tr>
@@ -123,59 +129,61 @@ const BlogCategory: FC = () => {
</div> </div>
</div> </div>
</div> </div>
<div className='relative bg-white min-h-[calc(100vh-185px)] w-sidebar xl:block hidden py-10 px-5 h-fit rounded-3xl'> {canCreate('blogs') && (
<p className='text-md'>{t('blog.add_category')}</p> <div className='relative bg-white min-h-[calc(100vh-185px)] w-sidebar xl:block hidden py-10 px-5 h-fit rounded-3xl'>
<div className='text-sm flex items-center justify-between mt-4'> <p className='text-md'>{t('blog.add_category')}</p>
<p> <div className='text-sm flex items-center justify-between mt-4'>
{t('blog.category_status')} <p>
</p> {t('blog.category_status')}
<div className='flex gap-1 text-xs items-center text-description'> </p>
<div> <div className='flex gap-1 text-xs items-center text-description'>
{t('ads.deactive')} <div>
{t('ads.deactive')}
</div>
<SwitchComponent
active={formik.values.isActive}
onChange={(value) => formik.setFieldValue('isActive', value)}
/>
</div> </div>
<SwitchComponent </div>
active={formik.values.isActive}
onChange={(value) => formik.setFieldValue('isActive', value)} <div className='mt-6'>
<Input
label='عنوان'
{...formik.getFieldProps('title')}
error_text={formik.touched.title && formik.errors.title ? formik.errors.title : undefined}
/> />
</div> </div>
</div>
<div className='mt-6'> <div className='mt-6'>
<Input <Textarea
label='عنوان' label='توضیحات'
{...formik.getFieldProps('title')} {...formik.getFieldProps('description')}
error_text={formik.touched.title && formik.errors.title ? formik.errors.title : undefined} error_text={formik.touched.description && formik.errors.description ? formik.errors.description : undefined}
/> />
</div>
<div className='mt-6'>
<Textarea
label='توضیحات'
{...formik.getFieldProps('description')}
error_text={formik.touched.description && formik.errors.description ? formik.errors.description : undefined}
/>
</div>
<div className='mt-6'>
<UploadBoxDraggble
label='آپلود آیکون'
onChange={(file) => setFile(file[0])}
/>
</div>
<Button
className='w-[172px] absolute bottom-4 left-4'
onClick={() => formik.handleSubmit()}
isLoading={createBlogCategory.isPending || singleUpload.isPending}
>
<div className='flex gap-2 items-center'>
<TickCircle size={20} color='white' />
<div>
ذخیره
</div>
</div> </div>
</Button>
</div> <div className='mt-6'>
<UploadBoxDraggble
label='آپلود آیکون'
onChange={(file) => setFile(file[0])}
/>
</div>
<Button
className='w-[172px] absolute bottom-4 left-4'
onClick={() => formik.handleSubmit()}
isLoading={createBlogCategory.isPending || singleUpload.isPending}
>
<div className='flex gap-2 items-center'>
<TickCircle size={20} color='white' />
<div>
ذخیره
</div>
</div>
</Button>
</div>
)}
</div> </div>
</div> </div>
) )
src/pages/blog/BlogList.tsx
+32 -24
View File
@@ -11,6 +11,7 @@ import { BlogItemType } from './types/BlogTypes'
import moment from 'moment-jalaali' import moment from 'moment-jalaali'
import TrashWithConfrim from '../../components/TrashWithConfrim' import TrashWithConfrim from '../../components/TrashWithConfrim'
import Pagination from '../../components/Pagination' import Pagination from '../../components/Pagination'
import { usePermissions } from '../../hooks/usePermissions'
const BlogList: FC = () => { const BlogList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
@@ -18,6 +19,7 @@ const BlogList: FC = () => {
const [search, setSearch] = useState<string>('') const [search, setSearch] = useState<string>('')
const getBlogs = useGetBlogs(search, page); const getBlogs = useGetBlogs(search, page);
const deleteBlog = useDeleteBlog() const deleteBlog = useDeleteBlog()
const { canCreate, canUpdate, canDelete } = usePermissions()
return ( return (
<div className='mt-4 min-h-[500px]'> <div className='mt-4 min-h-[500px]'>
@@ -26,18 +28,20 @@ const BlogList: FC = () => {
{t('blog.blog')} {t('blog.blog')}
</div> </div>
<Link to={Pages.blog.create}> {canCreate('blogs') && (
<Button <Link to={Pages.blog.create}>
className='w-[172px]' <Button
> className='w-[172px]'
<div className='flex gap-2 items-center'> >
<Add size={20} color='white' /> <div className='flex gap-2 items-center'>
<div> <Add size={20} color='white' />
{t('blog.new_blog')} <div>
{t('blog.new_blog')}
</div>
</div> </div>
</div> </Button>
</Button> </Link>
</Link> )}
</div> </div>
@@ -139,19 +143,23 @@ const BlogList: FC = () => {
</Td> */} </Td> */}
<Td text={''}> <Td text={''}>
<div className='flex gap-2'> <div className='flex gap-2'>
<Link to={Pages.blog.detail + item.id}> {canUpdate('blogs') && (
<Eye size={20} color='#8C90A3' /> <Link to={Pages.blog.detail + item.id}>
</Link> <Eye size={20} color='#8C90A3' />
<TrashWithConfrim </Link>
onDelete={() => { )}
deleteBlog.mutate(item.id, { {canDelete('blogs') && (
onSuccess: () => { <TrashWithConfrim
getBlogs.refetch() onDelete={() => {
} deleteBlog.mutate(item.id, {
}) onSuccess: () => {
}} getBlogs.refetch()
isLoading={deleteBlog.isPending} }
/> })
}}
isLoading={deleteBlog.isPending}
/>
)}
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/cardBank/List.tsx
+22 -16
View File
@@ -8,10 +8,12 @@ import { Link } from 'react-router-dom'
import { Pages } from '../../config/Pages' import { Pages } from '../../config/Pages'
import Button from '../../components/Button' import Button from '../../components/Button'
import { Add, Eye } from 'iconsax-react' import { Add, Eye } from 'iconsax-react'
import { usePermissions } from '../../hooks/usePermissions'
const CardBankList: FC = () => { const CardBankList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate } = usePermissions()
const getCardBanks = useGetCardBanks() const getCardBanks = useGetCardBanks()
return ( return (
@@ -23,19 +25,21 @@ const CardBankList: FC = () => {
{t('cardBank.manage_banks')} {t('cardBank.manage_banks')}
</div> </div>
<div> <div>
<Link to={Pages.cardBank.create}> {canCreate('bank_accounts') &&
<Button <Link to={Pages.cardBank.create}>
className='px-5' <Button
> className='px-5'
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('cardBank.add_account')}</div> />
</div> <div>{t('cardBank.add_account')}</div>
</Button> </div>
</Link> </Button>
</Link>
}
</div> </div>
</div> </div>
{ {
@@ -63,9 +67,11 @@ const CardBankList: FC = () => {
<Td text={item.cardNumber} /> <Td text={item.cardNumber} />
<Td text={item.IBan} /> <Td text={item.IBan} />
<Td text={''}> <Td text={''}>
<Link to={Pages.cardBank.detail + item.id}> {canUpdate('bank_accounts') &&
<Eye size={20} color='#8C90A3' /> <Link to={Pages.cardBank.detail + item.id}>
</Link> <Eye size={20} color='#8C90A3' />
</Link>
}
</Td> </Td>
</tr> </tr>
) )
src/pages/criticisms/List.tsx
+5 -1
View File
@@ -9,9 +9,11 @@ import { CriticismsItemTypes } from './types/CriticismsTypes'
import moment from 'moment-jalaali' import moment from 'moment-jalaali'
import ModalConfrim from '../../components/ModalConfrim' import ModalConfrim from '../../components/ModalConfrim'
import Pagination from '../../components/Pagination' import Pagination from '../../components/Pagination'
import { usePermissions } from '../../hooks/usePermissions'
const CriticismsList: FC = () => { const CriticismsList: FC = () => {
const { canDelete } = usePermissions()
const [itemId, setItemId] = useState<string>('') const [itemId, setItemId] = useState<string>('')
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const [openConfrim, setOpenConfrim] = useState(false) const [openConfrim, setOpenConfrim] = useState(false)
@@ -69,7 +71,9 @@ const CriticismsList: FC = () => {
</Link> </Link>
</Td> </Td>
<Td text=''> <Td text=''>
<Trash onClick={() => handleDelete(item.id)} size={20} color='#8C90A3' className='cursor-pointer' /> {canDelete('criticisms') &&
<Trash onClick={() => handleDelete(item.id)} size={20} color='#8C90A3' className='cursor-pointer' />
}
</Td> </Td>
</tr> </tr>
) )
src/pages/customer/List.tsx
+23 -17
View File
@@ -8,11 +8,13 @@ import PageLoading from "../../components/PageLoading";
import Pagination from "../../components/Pagination"; import Pagination from "../../components/Pagination";
import Td from "../../components/Td"; import Td from "../../components/Td";
import { Pages } from "../../config/Pages"; import { Pages } from "../../config/Pages";
import { usePermissions } from "../../hooks/usePermissions";
import { useGetCustomers } from "./hooks/useCustomerData"; import { useGetCustomers } from "./hooks/useCustomerData";
import { CustomerItemType } from "./types/CustomerTypes"; import { CustomerItemType } from "./types/CustomerTypes";
const CustomerList: FC = () => { const CustomerList: FC = () => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canCreate, canUpdate } = usePermissions();
const [page, setPage] = useState(1); const [page, setPage] = useState(1);
const [limit, setLimit] = useState(10); const [limit, setLimit] = useState(10);
const [search, setSearch] = useState(""); const [search, setSearch] = useState("");
@@ -29,17 +31,19 @@ const CustomerList: FC = () => {
<div className="mt-4"> <div className="mt-4">
<div className="flex w-full justify-between items-center"> <div className="flex w-full justify-between items-center">
<div>{t("customer.customer_list")}</div> <div>{t("customer.customer_list")}</div>
<Link to={Pages.customer.create}> {canCreate("customers") && (
<Button className="px-5"> <Link to={Pages.customer.create}>
<div className="flex gap-2"> <Button className="px-5">
<Add <div className="flex gap-2">
className="size-5" <Add
color="#fff" className="size-5"
/> color="#fff"
<div>{t("customer.add_cutomer")}</div> />
</div> <div>{t("customer.add_cutomer")}</div>
</Button> </div>
</Link> </Button>
</Link>
)}
</div> </div>
<div className="flex justify-end items-center mt-12"> <div className="flex justify-end items-center mt-12">
@@ -92,12 +96,14 @@ const CustomerList: FC = () => {
</Link> </Link>
</Td> </Td>
<Td text={""}> <Td text={""}>
<Link to={Pages.customer.update + item.id}> {canUpdate("customers") && (
<Eye <Link to={Pages.customer.update + item.id}>
size={20} <Eye
color="#8C90A3" size={20}
/> color="#8C90A3"
</Link> />
</Link>
)}
</Td> </Td>
<Td text={""} /> <Td text={""} />
</tr> </tr>
src/pages/discounts/DiscountsList.tsx
+29 -21
View File
@@ -14,10 +14,12 @@ import PageLoading from '../../components/PageLoading'
import { NumberFormat } from '../../config/func' import { NumberFormat } from '../../config/func'
import { toast } from '../../components/Toast'; import { toast } from '../../components/Toast';
import { ErrorType } from '../../helpers/types' import { ErrorType } from '../../helpers/types'
import { usePermissions } from '../../hooks/usePermissions'
const DiscountList: FC = () => { const DiscountList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate, canDelete } = usePermissions()
const [search, setSearch] = useState<string>('') const [search, setSearch] = useState<string>('')
const getDiscounts = useGetDiscounts(search) const getDiscounts = useGetDiscounts(search)
const deleteDiscount = useDeleteDiscount() const deleteDiscount = useDeleteDiscount()
@@ -40,18 +42,20 @@ const DiscountList: FC = () => {
{t('discount.list')} {t('discount.list')}
</div> </div>
<Link to={Pages.discount.create}> {canCreate('discounts') &&
<Button <Link to={Pages.discount.create}>
className='w-[172px]' <Button
> className='w-[172px]'
<div className='flex gap-2 items-center'> >
<Add size={20} color='white' /> <div className='flex gap-2 items-center'>
<div> <Add size={20} color='white' />
{t('discount.add_new_discount')} <div>
{t('discount.add_new_discount')}
</div>
</div> </div>
</div> </Button>
</Button> </Link>
</Link> }
</div> </div>
@@ -114,17 +118,21 @@ const DiscountList: FC = () => {
</Td> </Td>
<Td text={t('')}> <Td text={t('')}>
<div className='flex gap-2 items-center'> <div className='flex gap-2 items-center'>
<Link {canUpdate('discounts') &&
to={Pages.discount.detail + item.id} <Link
> to={Pages.discount.detail + item.id}
<Edit size={20} color='#888888' /> >
</Link> <Edit size={20} color='#888888' />
</Link>
}
<Trash {canDelete('discounts') &&
size={20} <Trash
color='#888888' size={20}
onClick={() => handleDelete(item.id)} color='#888888'
/> onClick={() => handleDelete(item.id)}
/>
}
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/guide/List.tsx
+30 -22
View File
@@ -12,6 +12,7 @@ import Td from '../../components/Td'
import StatusWithText from '../../components/StatusWithText' import StatusWithText from '../../components/StatusWithText'
import TrashWithConfrim from '../../components/TrashWithConfrim' import TrashWithConfrim from '../../components/TrashWithConfrim'
import { useDeleteGuide } from './hooks/useGuideData' import { useDeleteGuide } from './hooks/useGuideData'
import { usePermissions } from '../../hooks/usePermissions'
type GuideItem = { type GuideItem = {
id: string; id: string;
@@ -24,6 +25,7 @@ type GuideItem = {
const List: FC = () => { const List: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate, canDelete } = usePermissions()
const { id } = useParams() const { id } = useParams()
const getGuides = useGetGuides(id || '') const getGuides = useGetGuides(id || '')
const deleteGuide = useDeleteGuide(id || '') const deleteGuide = useDeleteGuide(id || '')
@@ -36,21 +38,23 @@ const List: FC = () => {
<div> <div>
{t('guide.list_guide')} {t('guide.list_guide')}
</div> </div>
<div> {canCreate('services') && (
<Link to={Pages.services.guide + id + '/create'}> <div>
<Button <Link to={Pages.services.guide + id + '/create'}>
className='px-5' <Button
> className='px-5'
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('guide.submit_guide')}</div> />
</div> <div>{t('guide.submit_guide')}</div>
</Button> </div>
</Link> </Button>
</div> </Link>
</div>
)}
</div> </div>
{ {
@@ -85,13 +89,17 @@ const List: FC = () => {
</Td> </Td>
<Td text=''> <Td text=''>
<div className='flex items-center gap-2'> <div className='flex items-center gap-2'>
<Link to={Pages.services.guide + id + '/' + item.id}> {canUpdate('services') && (
<Eye size={20} color='#8C90A3' /> <Link to={Pages.services.guide + id + '/' + item.id}>
</Link> <Eye size={20} color='#8C90A3' />
<TrashWithConfrim </Link>
onDelete={() => deleteGuide.mutate(item.id)} )}
isLoading={deleteGuide.isPending} {canDelete('services') && (
/> <TrashWithConfrim
onDelete={() => deleteGuide.mutate(item.id)}
isLoading={deleteGuide.isPending}
/>
)}
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/learning/Category.tsx
+5 -1
View File
@@ -6,6 +6,7 @@ import Pagination from '../../components/Pagination'
import { useGetCategory } from './hooks/useLearningData' import { useGetCategory } from './hooks/useLearningData'
import { CategoryLearningType } from './types/LearningTypes' import { CategoryLearningType } from './types/LearningTypes'
import CreateCategory from './components/CreateCategory' import CreateCategory from './components/CreateCategory'
import { usePermissions } from '../../hooks/usePermissions'
const LearningCategory: FC = () => { const LearningCategory: FC = () => {
@@ -13,6 +14,7 @@ const LearningCategory: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const getCategory = useGetCategory() const getCategory = useGetCategory()
const { canCreate } = usePermissions()
return ( return (
<div className='mt-4'> <div className='mt-4'>
@@ -65,7 +67,9 @@ const LearningCategory: FC = () => {
</div> </div>
</div> </div>
<CreateCategory /> {canCreate('learnings') && (
<CreateCategory />
)}
</div> </div>
</div> </div>
) )
src/pages/learning/List.tsx
+19 -15
View File
@@ -9,11 +9,13 @@ import PageLoading from '../../components/PageLoading'
import Td from '../../components/Td' import Td from '../../components/Td'
import { LearningItemType } from './types/LearningTypes' import { LearningItemType } from './types/LearningTypes'
import Pagination from '../../components/Pagination' import Pagination from '../../components/Pagination'
import { usePermissions } from '../../hooks/usePermissions'
const LearningList: FC = () => { const LearningList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const getLearning = useGetLearning(page) const getLearning = useGetLearning(page)
const { canCreate } = usePermissions()
return ( return (
<div className='mt-4'> <div className='mt-4'>
@@ -21,21 +23,23 @@ const LearningList: FC = () => {
<div> <div>
{t('learning.list_learning')} {t('learning.list_learning')}
</div> </div>
<div> {canCreate('learnings') && (
<Link to={Pages.learning.create}> <div>
<Button <Link to={Pages.learning.create}>
className='px-5' <Button
> className='px-5'
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('learning.submit_learning')}</div> />
</div> <div>{t('learning.submit_learning')}</div>
</Button> </div>
</Link> </Button>
</div> </Link>
</div>
)}
</div> </div>
{ {
src/pages/payment/List.tsx
+3 -1
View File
@@ -10,10 +10,12 @@ import Pagination from '../../components/Pagination'
import moment from 'moment-jalaali' import moment from 'moment-jalaali'
import Accept from './components/Accept' import Accept from './components/Accept'
import Reject from './components/Reject' import Reject from './components/Reject'
import { usePermissions } from '../../hooks/usePermissions'
const PaymentList: FC = () => { const PaymentList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canUpdate } = usePermissions()
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const [pageGateWay, setPageGateWay] = useState<number>(1) const [pageGateWay, setPageGateWay] = useState<number>(1)
const [activeTab, setActiveTab] = useState<PaymentStatusType>('GATEWAY') const [activeTab, setActiveTab] = useState<PaymentStatusType>('GATEWAY')
@@ -140,7 +142,7 @@ const PaymentList: FC = () => {
<Td text={t(`payment.${item.status}`)} /> <Td text={t(`payment.${item.status}`)} />
<Td text={''}> <Td text={''}>
{ {
item.status === 'PENDING' && item.status === 'PENDING' && canUpdate('payments') &&
<Fragment> <Fragment>
<div className='flex gap-2'> <div className='flex gap-2'>
<Accept <Accept
src/pages/receipts/List.tsx
+13 -7
View File
@@ -17,10 +17,12 @@ import { Pages } from '../../config/Pages'
import TrashWithConfrim from '../../components/TrashWithConfrim' import TrashWithConfrim from '../../components/TrashWithConfrim'
import { ErrorType } from '../../helpers/types' import { ErrorType } from '../../helpers/types'
import { toast } from '../../components/Toast'; import { toast } from '../../components/Toast';
import { usePermissions } from '../../hooks/usePermissions'
const ReceiptsList: FC = () => { const ReceiptsList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canUpdate, canDelete } = usePermissions()
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const [searchParams] = useSearchParams() const [searchParams] = useSearchParams()
const [activeTab, setActiveTab] = useState<InvoiceStatus>('PENDING') const [activeTab, setActiveTab] = useState<InvoiceStatus>('PENDING')
@@ -177,13 +179,17 @@ const ReceiptsList: FC = () => {
</Td> </Td>
<Td text={''}> <Td text={''}>
<div className='flex gap-2'> <div className='flex gap-2'>
<Link to={Pages.receipts.detail + item.id}> {canUpdate('invoices') &&
<Edit size={20} color='#888' /> <Link to={Pages.receipts.detail + item.id}>
</Link> <Edit size={20} color='#888' />
<TrashWithConfrim </Link>
onDelete={() => handleDeleteInvoice(item.id)} }
isLoading={deleteInvoice.isPending} {canDelete('invoices') &&
/> <TrashWithConfrim
onDelete={() => handleDeleteInvoice(item.id)}
isLoading={deleteInvoice.isPending}
/>
}
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/reseller/List.tsx
+15 -11
View File
@@ -8,10 +8,12 @@ import { useGetResellers } from './hooks/useResellerData'
import PageLoading from '../../components/PageLoading' import PageLoading from '../../components/PageLoading'
import Td from '../../components/Td' import Td from '../../components/Td'
import { ResellerItemType } from './types/Types' import { ResellerItemType } from './types/Types'
import { usePermissions } from '../../hooks/usePermissions'
const ResellerList: FC = () => { const ResellerList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate } = usePermissions()
const getReseller = useGetResellers() const getReseller = useGetResellers()
return ( return (
@@ -21,18 +23,20 @@ const ResellerList: FC = () => {
{t('reseller.list')} {t('reseller.list')}
</div> </div>
<Link to={Pages.reseller.create}> {canCreate('reseller') && (
<Button <Link to={Pages.reseller.create}>
className='w-[172px]' <Button
> className='w-[172px]'
<div className='flex gap-2 items-center'> >
<Add size={20} color='white' /> <div className='flex gap-2 items-center'>
<div> <Add size={20} color='white' />
{t('reseller.add_new')} <div>
{t('reseller.add_new')}
</div>
</div> </div>
</div> </Button>
</Button> </Link>
</Link> )}
</div> </div>
{ {
src/pages/service/Category.tsx
+13 -7
View File
@@ -11,11 +11,13 @@ import StatusCategory from './components/StatusCategory'
import Pagination from '../../components/Pagination' import Pagination from '../../components/Pagination'
import UpdateCategory from './components/UpdateCategory' import UpdateCategory from './components/UpdateCategory'
import { Trash } from 'iconsax-react' import { Trash } from 'iconsax-react'
import { usePermissions } from '../../hooks/usePermissions'
const Category: FC = () => { const Category: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate, canDelete } = usePermissions()
const [search, setSearch] = useState<string>('') const [search, setSearch] = useState<string>('')
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const [isActive, setIsActive] = useState<'active' | 'deactive' | ''>('') const [isActive, setIsActive] = useState<'active' | 'deactive' | ''>('')
@@ -102,12 +104,16 @@ const Category: FC = () => {
</Td> </Td>
<Td text={''}> <Td text={''}>
<div className='flex gap-2'> <div className='flex gap-2'>
<UpdateCategory refetch={() => getCategory.refetch()} id={item.id} /> {canUpdate('services') && (
<Trash <UpdateCategory refetch={() => getCategory.refetch()} id={item.id} />
size={20} )}
color='#888888' {canDelete('services') && (
onClick={() => handleDelete(item.id)} <Trash
/> size={20}
color='#888888'
onClick={() => handleDelete(item.id)}
/>
)}
</div> </div>
</Td> </Td>
</tr> </tr>
@@ -130,7 +136,7 @@ const Category: FC = () => {
</div> </div>
</div> </div>
<CreateCategory /> {canCreate('services') && <CreateCategory />}
</div> </div>
</div> </div>
) )
src/pages/service/List.tsx
+36 -28
View File
@@ -15,10 +15,12 @@ import Pagination from '../../components/Pagination'
import ToggleStatusService from './components/ToggleStatusService' import ToggleStatusService from './components/ToggleStatusService'
import CheckBoxComponent from '../../components/CheckBoxComponent' import CheckBoxComponent from '../../components/CheckBoxComponent'
import ToggleSliderService from './components/ToggleSliderService' import ToggleSliderService from './components/ToggleSliderService'
import { usePermissions } from '../../hooks/usePermissions'
const ListService: FC = () => { const ListService: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate } = usePermissions()
const [category, setCategory] = useState<string>('') const [category, setCategory] = useState<string>('')
const [status, setstatus] = useState<'ACTIVE' | 'IN_ACTIVE' | ''>('') const [status, setstatus] = useState<'ACTIVE' | 'IN_ACTIVE' | ''>('')
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
@@ -33,21 +35,23 @@ const ListService: FC = () => {
<div> <div>
{t('service.list_service')} {t('service.list_service')}
</div> </div>
<div> {canCreate('services') && (
<Link to={Pages.services.add}> <div>
<Button <Link to={Pages.services.add}>
className='px-5' <Button
> className='px-5'
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('service.submit_service')}</div> />
</div> <div>{t('service.submit_service')}</div>
</Button> </div>
</Link> </Button>
</div> </Link>
</div>
)}
</div> </div>
<div className='flex justify-between items-center mt-12'> <div className='flex justify-between items-center mt-12'>
@@ -134,16 +138,18 @@ const ListService: FC = () => {
<Td text=''> <Td text=''>
{ {
item.subscriptionCount === 0 ? item.subscriptionCount === 0 ?
<Link to={Pages.services.plan + item.id}> (canCreate('services') &&
<Button <Link to={Pages.services.plan + item.id}>
className='h-8 bg-transparent border border-black text-black text-xs' <Button
> className='h-8 bg-transparent border border-black text-black text-xs'
<div className='flex gap-2 items-center'> >
<Add size={20} color='black' /> <div className='flex gap-2 items-center'>
<div>{t('service.add_plan')}</div> <Add size={20} color='black' />
</div> <div>{t('service.add_plan')}</div>
</Button> </div>
</Link> </Button>
</Link>
)
: :
<Link to={Pages.services.plan + item.id} className='flex gap-1 text-sm text-[#0047FF]'> <Link to={Pages.services.plan + item.id} className='flex gap-1 text-sm text-[#0047FF]'>
<div>{item.subscriptionCount}</div> <div>{item.subscriptionCount}</div>
@@ -164,9 +170,11 @@ const ListService: FC = () => {
/> />
</Td> </Td>
<Td text={''}> <Td text={''}>
<Link to={Pages.services.update + item.id}> {canUpdate('services') && (
<Eye size={20} color='#8C90A3' /> <Link to={Pages.services.update + item.id}>
</Link> <Eye size={20} color='#8C90A3' />
</Link>
)}
</Td> </Td>
<Td text={''}> <Td text={''}>
<Link to={Pages.services.guide + item.id}> <Link to={Pages.services.guide + item.id}>
src/pages/service/Plans.tsx
+8 -4
View File
@@ -9,11 +9,13 @@ import { PlanItemType } from './types/ServiceTypes'
import ToggleStatusPlan from './components/ToggleStatusPlan' import ToggleStatusPlan from './components/ToggleStatusPlan'
import EditPlan from './components/EditPlan' import EditPlan from './components/EditPlan'
import { NumberFormat } from '../../config/func' import { NumberFormat } from '../../config/func'
import { usePermissions } from '../../hooks/usePermissions'
const Plans: FC = () => { const Plans: FC = () => {
const { id } = useParams() const { id } = useParams()
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate } = usePermissions()
const getPlans = useGetPlans(id) const getPlans = useGetPlans(id)
return ( return (
@@ -27,7 +29,7 @@ const Plans: FC = () => {
<div> <div>
{t('plan.plans_list') + ' ' + getPlans.data?.data?.service?.name} {t('plan.plans_list') + ' ' + getPlans.data?.data?.service?.name}
</div> </div>
<CreatePlan /> {canCreate('services') && <CreatePlan />}
</div> </div>
<div className='relative overflow-x-auto rounded-3xl mt-9 w-full'> <div className='relative overflow-x-auto rounded-3xl mt-9 w-full'>
@@ -54,9 +56,11 @@ const Plans: FC = () => {
<ToggleStatusPlan defaultActive={item.isActive} id={item.id} /> <ToggleStatusPlan defaultActive={item.isActive} id={item.id} />
</Td> </Td>
<Td text=''> <Td text=''>
<EditPlan {canUpdate('services') && (
id={item.id} <EditPlan
/> id={item.id}
/>
)}
</Td> </Td>
</tr> </tr>
)) ))
src/pages/slider/List.tsx
+32 -24
View File
@@ -11,11 +11,13 @@ import PageLoading from '../../components/PageLoading'
import { toast } from '../../components/Toast'; import { toast } from '../../components/Toast';
import { ErrorType } from '../../helpers/types' import { ErrorType } from '../../helpers/types'
import TrashWithConfrim from '../../components/TrashWithConfrim' import TrashWithConfrim from '../../components/TrashWithConfrim'
import { usePermissions } from '../../hooks/usePermissions'
const SliderList: FC = () => { const SliderList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { data: sliders, isPending, refetch } = useGetSliders() const { data: sliders, isPending, refetch } = useGetSliders()
const deleteSlider = useDeleteSlider() const deleteSlider = useDeleteSlider()
const { canCreate, canUpdate, canDelete } = usePermissions()
const handleDelete = (id: string) => { const handleDelete = (id: string) => {
deleteSlider.mutate(id, { deleteSlider.mutate(id, {
@@ -35,21 +37,23 @@ const SliderList: FC = () => {
<div> <div>
{t('slider.list_slider')} {t('slider.list_slider')}
</div> </div>
<div> {canCreate('blogs') && (
<Link to={Pages.sliders.create}> <div>
<Button <Link to={Pages.sliders.create}>
className='px-5' <Button
> className='px-5'
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('slider.submit_slider')}</div> />
</div> <div>{t('slider.submit_slider')}</div>
</Button> </div>
</Link> </Button>
</div> </Link>
</div>
)}
</div> </div>
{ {
@@ -80,16 +84,20 @@ const SliderList: FC = () => {
<Td text={item.isActive ? t('slider.active') : t('slider.inactive')} /> <Td text={item.isActive ? t('slider.active') : t('slider.inactive')} />
<Td text={''}> <Td text={''}>
<div className='flex gap-2'> <div className='flex gap-2'>
<Link to={Pages.sliders.detail + item.id}> {canUpdate('blogs') && (
<Edit <Link to={Pages.sliders.detail + item.id}>
className='size-5' <Edit
color='#888' className='size-5'
color='#888'
/>
</Link>
)}
{canDelete('blogs') && (
<TrashWithConfrim
onDelete={() => handleDelete(item.id)}
isLoading={deleteSlider.isPending}
/> />
</Link> )}
<TrashWithConfrim
onDelete={() => handleDelete(item.id)}
isLoading={deleteSlider.isPending}
/>
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/subscriptions/List.tsx
+8 -4
View File
@@ -13,10 +13,12 @@ import { ServiceItemType } from '../service/types/ServiceTypes'
import TrashWithConfrim from '../../components/TrashWithConfrim' import TrashWithConfrim from '../../components/TrashWithConfrim'
import { ErrorType } from '../../helpers/types' import { ErrorType } from '../../helpers/types'
import { toast } from '../../components/Toast'; import { toast } from '../../components/Toast';
import { usePermissions } from '../../hooks/usePermissions'
const SubscriptionsList: FC = () => { const SubscriptionsList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canDelete } = usePermissions()
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const [status, setStatus] = useState<string>('') const [status, setStatus] = useState<string>('')
const [serviceId, setServiceId] = useState<string>('') const [serviceId, setServiceId] = useState<string>('')
@@ -199,10 +201,12 @@ const SubscriptionsList: FC = () => {
</div> </div>
</Td> </Td>
<Td text=''> <Td text=''>
<TrashWithConfrim {canDelete('customers') && (
onDelete={() => handleDelete(item.id)} <TrashWithConfrim
isLoading={isPending} onDelete={() => handleDelete(item.id)}
/> isLoading={isPending}
/>
)}
</Td> </Td>
</tr> </tr>
))} ))}
src/pages/support/List.tsx
+23 -15
View File
@@ -8,9 +8,11 @@ import { Link } from 'react-router-dom'
import { Pages } from '../../config/Pages' import { Pages } from '../../config/Pages'
import Delete from './components/Delete' import Delete from './components/Delete'
import Button from '../../components/Button' import Button from '../../components/Button'
import { usePermissions } from '../../hooks/usePermissions'
const SupportList: FC = () => { const SupportList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate, canDelete } = usePermissions()
const { data, refetch } = useGetPlans() const { data, refetch } = useGetPlans()
return ( return (
@@ -20,18 +22,20 @@ const SupportList: FC = () => {
{t('support.plans')} {t('support.plans')}
</div> </div>
<Link to={Pages.support.create}> {canCreate('support_plan') &&
<Button <Link to={Pages.support.create}>
className='w-fit px-6' <Button
> className='w-fit px-6'
<div className='flex gap-2 items-center'> >
<Add size={20} color='white' /> <div className='flex gap-2 items-center'>
<div> <Add size={20} color='white' />
{t('support.new_plan')} <div>
{t('support.new_plan')}
</div>
</div> </div>
</div> </Button>
</Button> </Link>
</Link> }
</div> </div>
<div className='relative overflow-x-auto rounded-3xl mt-9 w-full'> <div className='relative overflow-x-auto rounded-3xl mt-9 w-full'>
@@ -65,10 +69,14 @@ const SupportList: FC = () => {
</Td> </Td>
<Td text={''}> <Td text={''}>
<div className='flex items-center gap-2'> <div className='flex items-center gap-2'>
<Link to={Pages.support.detail + item.id}> {canUpdate('support_plan') &&
<Edit size={20} color='#8C90A3' /> <Link to={Pages.support.detail + item.id}>
</Link> <Edit size={20} color='#8C90A3' />
<Delete id={item.id} refetch={refetch} /> </Link>
}
{canDelete('support_plan') &&
<Delete id={item.id} refetch={refetch} />
}
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/taskmanager/components/AddNewColumn.tsx
+6
View File
@@ -8,6 +8,7 @@ import { clx } from "../../../helpers/utils";
import { useCreateTaskPhase } from "../task-phase/hooks/useTaskPhaseData"; import { useCreateTaskPhase } from "../task-phase/hooks/useTaskPhaseData";
import type { TaskPhaseItemType } from "../task-phase/types/TaskPhaseTypes"; import type { TaskPhaseItemType } from "../task-phase/types/TaskPhaseTypes";
import { LABEL_COLOR_OPTIONS } from "./task-detail/labels/constants"; import { LABEL_COLOR_OPTIONS } from "./task-detail/labels/constants";
import { usePermissions } from "../../../hooks/usePermissions";
const DEFAULT_COLUMN_COLOR = "#4F46E5"; const DEFAULT_COLUMN_COLOR = "#4F46E5";
@@ -19,6 +20,7 @@ type Props = {
const AddNewColumn: FC<Props> = ({ projectId, nextOrder, onColumnCreated }) => { const AddNewColumn: FC<Props> = ({ projectId, nextOrder, onColumnCreated }) => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canCreate } = usePermissions();
const colorInputRef = useRef<HTMLInputElement>(null); const colorInputRef = useRef<HTMLInputElement>(null);
const createTaskPhase = useCreateTaskPhase(); const createTaskPhase = useCreateTaskPhase();
@@ -57,6 +59,10 @@ const AddNewColumn: FC<Props> = ({ projectId, nextOrder, onColumnCreated }) => {
); );
}; };
if (!canCreate("task_phase")) {
return null;
}
if (!isAdding) { if (!isAdding) {
return ( return (
<button <button
src/pages/taskmanager/components/Column.tsx
+45 -41
View File
@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
import { toast } from '../../../components/Toast'; import { toast } from '../../../components/Toast';
import ModalConfrim from "../../../components/ModalConfrim"; import ModalConfrim from "../../../components/ModalConfrim";
import { ErrorType } from "../../../helpers/types"; import { ErrorType } from "../../../helpers/types";
import { usePermissions } from "../../../hooks/usePermissions";
import { useCreateTask, useGetTasksByTaskPhase } from "../task/hooks/useTaskData"; import { useCreateTask, useGetTasksByTaskPhase } from "../task/hooks/useTaskData";
import type { TaskItemType } from "../task/types/TaskTypes"; import type { TaskItemType } from "../task/types/TaskTypes";
import { mapTaskItemToTask } from "../task/utils/mapTaskItemToTask"; import { mapTaskItemToTask } from "../task/utils/mapTaskItemToTask";
@@ -37,6 +38,7 @@ const Column: FC<Props> = ({
onColumnTitleUpdated, onColumnTitleUpdated,
}) => { }) => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canCreate } = usePermissions();
const deleteTaskPhase = useDeleteTaskPhase(); const deleteTaskPhase = useDeleteTaskPhase();
const updateTaskPhase = useUpdateTaskPhase(); const updateTaskPhase = useUpdateTaskPhase();
const createTask = useCreateTask(); const createTask = useCreateTask();
@@ -314,48 +316,50 @@ const Column: FC<Props> = ({
)} )}
</Droppable> </Droppable>
{isAdding ? ( {canCreate("task") && (
<div className="mt-3 sm:mt-4 xl:mt-5 shrink-0 flex flex-col gap-3"> isAdding ? (
<input <div className="mt-3 sm:mt-4 xl:mt-5 shrink-0 flex flex-col gap-3">
type="text" <input
value={title} type="text"
onChange={(e) => setTitle(e.target.value)} value={title}
onKeyDown={(e) => { onChange={(e) => setTitle(e.target.value)}
if (e.key === "Enter") handleCreateTask(); onKeyDown={(e) => {
}} if (e.key === "Enter") handleCreateTask();
placeholder={t("taskmanager.task_title")} }}
className="w-full bg-white rounded-lg px-3 py-2.5 text-sm outline-none" placeholder={t("taskmanager.task_title")}
autoFocus className="w-full bg-white rounded-lg px-3 py-2.5 text-sm outline-none"
/> autoFocus
<div className="flex items-center gap-2"> />
<button <div className="flex items-center gap-2">
type="button" <button
onClick={handleCreateTask} type="button"
disabled={!title.trim() || createTask.isPending} onClick={handleCreateTask}
className="flex items-center gap-2 bg-black text-white text-[13px] rounded-full px-4 py-2 cursor-pointer disabled:opacity-50" disabled={!title.trim() || createTask.isPending}
> className="flex items-center gap-2 bg-black text-white text-[13px] rounded-full px-4 py-2 cursor-pointer disabled:opacity-50"
<span>{t("taskmanager.add_task")}</span> >
<Add size={18} color="white" /> <span>{t("taskmanager.add_task")}</span>
</button> <Add size={18} color="white" />
<button </button>
type="button" <button
onClick={resetTaskForm} type="button"
className="cursor-pointer" onClick={resetTaskForm}
aria-label={t("cancel")} className="cursor-pointer"
> aria-label={t("cancel")}
<CloseCircle size={22} color="#888888" variant="Bold" /> >
</button> <CloseCircle size={22} color="#888888" variant="Bold" />
</button>
</div>
</div> </div>
</div> ) : (
) : ( <button
<button type="button"
type="button" onClick={() => setIsAdding(true)}
onClick={() => setIsAdding(true)} className="mt-3 sm:mt-4 xl:mt-5 flex gap-2 items-center shrink-0 cursor-pointer"
className="mt-3 sm:mt-4 xl:mt-5 flex gap-2 items-center shrink-0 cursor-pointer" >
> <AddCircle size={18} color="#888888" />
<AddCircle size={18} color="#888888" /> <span className="text-description text-[13px] mt-0.5">{t("taskmanager.add_new_task")}</span>
<span className="text-description text-[13px] mt-0.5">{t("taskmanager.add_new_task")}</span> </button>
</button> )
)} )}
</div> </div>
); );
src/pages/taskmanager/components/ColumnMenu.tsx
+26 -20
View File
@@ -2,6 +2,7 @@ import { Popover, PopoverButton, PopoverPanel } from "@headlessui/react";
import { More } from "iconsax-react"; import { More } from "iconsax-react";
import { FC } from "react"; import { FC } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { usePermissions } from "../../../hooks/usePermissions";
type Props = { type Props = {
onEdit: () => void; onEdit: () => void;
@@ -10,6 +11,7 @@ type Props = {
const ColumnMenu: FC<Props> = ({ onEdit, onDelete }) => { const ColumnMenu: FC<Props> = ({ onEdit, onDelete }) => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canUpdate, canDelete } = usePermissions();
return ( return (
<Popover className="relative"> <Popover className="relative">
@@ -26,26 +28,30 @@ const ColumnMenu: FC<Props> = ({ onEdit, onDelete }) => {
anchor="bottom start" anchor="bottom start"
className="z-20 mt-1 min-w-[120px] rounded-xl bg-white shadow-md border border-border py-1 text-sm" className="z-20 mt-1 min-w-[120px] rounded-xl bg-white shadow-md border border-border py-1 text-sm"
> >
<button {canUpdate("task_phase") && (
type="button" <button
onClick={() => { type="button"
close(); onClick={() => {
onEdit(); close();
}} onEdit();
className="w-full px-4 py-2.5 text-right hover:bg-black/5 transition-colors" }}
> className="w-full px-4 py-2.5 text-right hover:bg-black/5 transition-colors"
{t("taskmanager.edit_column")} >
</button> {t("taskmanager.edit_column")}
<button </button>
type="button" )}
onClick={() => { {canDelete("task_phase") && (
close(); <button
onDelete(); type="button"
}} onClick={() => {
className="w-full px-4 py-2.5 text-right text-red-500 hover:bg-red-50 transition-colors" close();
> onDelete();
{t("taskmanager.delete_column")} }}
</button> className="w-full px-4 py-2.5 text-right text-red-500 hover:bg-red-50 transition-colors"
>
{t("taskmanager.delete_column")}
</button>
)}
</PopoverPanel> </PopoverPanel>
</> </>
)} )}
src/pages/taskmanager/components/task-detail/TaskDetailHeader.tsx
+3 -1
View File
@@ -3,6 +3,7 @@ import { ArrowDown2, CloseCircle, Paintbucket } from "iconsax-react";
import { type FC } from "react"; import { type FC } from "react";
import TrashWithConfrim from "../../../../components/TrashWithConfrim"; import TrashWithConfrim from "../../../../components/TrashWithConfrim";
import { clx } from "../../../../helpers/utils"; import { clx } from "../../../../helpers/utils";
import { usePermissions } from "../../../../hooks/usePermissions";
import type { Column } from "../../types"; import type { Column } from "../../types";
import TaskDetailCoverColorPopover from "./cover/TaskDetailCoverColorPopover"; import TaskDetailCoverColorPopover from "./cover/TaskDetailCoverColorPopover";
@@ -31,6 +32,7 @@ const TaskDetailHeader: FC<Props> = ({
onDelete, onDelete,
isDeleting, isDeleting,
}) => { }) => {
const { canDelete } = usePermissions();
const selectedColumn = columns.find((column) => column.id === selectedPhaseId); const selectedColumn = columns.find((column) => column.id === selectedPhaseId);
return ( return (
@@ -99,7 +101,7 @@ const TaskDetailHeader: FC<Props> = ({
)} )}
</Popover> </Popover>
{onDelete ? ( {onDelete && canDelete("task") ? (
<div className="size-8 rounded-full bg-white/60 flex items-center justify-center"> <div className="size-8 rounded-full bg-white/60 flex items-center justify-center">
<TrashWithConfrim onDelete={onDelete} isLoading={isDeleting} color="#FF0000" /> <TrashWithConfrim onDelete={onDelete} isLoading={isDeleting} color="#FF0000" />
</div> </div>
src/pages/taskmanager/project/components/ProjectCardMenu.tsx
+20 -14
View File
@@ -2,6 +2,7 @@ import { Popover, PopoverButton, PopoverPanel } from "@headlessui/react";
import { More } from "iconsax-react"; import { More } from "iconsax-react";
import { FC } from "react"; import { FC } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { usePermissions } from "../../../../hooks/usePermissions";
type Props = { type Props = {
onEdit: () => void; onEdit: () => void;
@@ -10,6 +11,7 @@ type Props = {
const ProjectCardMenu: FC<Props> = ({ onEdit, onDelete }) => { const ProjectCardMenu: FC<Props> = ({ onEdit, onDelete }) => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canUpdate, canDelete } = usePermissions();
return ( return (
<Popover className="relative"> <Popover className="relative">
@@ -21,20 +23,24 @@ const ProjectCardMenu: FC<Props> = ({ onEdit, onDelete }) => {
anchor="bottom start" anchor="bottom start"
className="z-20 mt-1 min-w-[120px] rounded-xl bg-white shadow-md border border-border py-1 text-sm" className="z-20 mt-1 min-w-[120px] rounded-xl bg-white shadow-md border border-border py-1 text-sm"
> >
<button {canUpdate("project") && (
type="button" <button
onClick={onEdit} type="button"
className="w-full px-4 py-2.5 text-right hover:bg-[#F4F5F9] transition-colors" onClick={onEdit}
> className="w-full px-4 py-2.5 text-right hover:bg-[#F4F5F9] transition-colors"
{t("edit")} >
</button> {t("edit")}
<button </button>
type="button" )}
onClick={onDelete} {canDelete("project") && (
className="w-full px-4 py-2.5 text-right text-red-500 hover:bg-red-50 transition-colors" <button
> type="button"
{t("taskmanager.delete_project")} onClick={onDelete}
</button> className="w-full px-4 py-2.5 text-right text-red-500 hover:bg-red-50 transition-colors"
>
{t("taskmanager.delete_project")}
</button>
)}
</PopoverPanel> </PopoverPanel>
</Popover> </Popover>
); );
src/pages/taskmanager/project/components/ProjectListHeader.tsx
+16 -12
View File
@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import Button from "../../../../components/Button"; import Button from "../../../../components/Button";
import { Pages } from "../../../../config/Pages"; import { Pages } from "../../../../config/Pages";
import { usePermissions } from "../../../../hooks/usePermissions";
type Props = { type Props = {
title: string; title: string;
@@ -13,6 +14,7 @@ type Props = {
const ProjectListHeader: FC<Props> = ({ title, workspaceId, onSettingsClick }) => { const ProjectListHeader: FC<Props> = ({ title, workspaceId, onSettingsClick }) => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canCreate } = usePermissions();
const createProjectLink = workspaceId ? `${Pages.taskmanager.createProject}?workspaceId=${workspaceId}` : Pages.taskmanager.createProject; const createProjectLink = workspaceId ? `${Pages.taskmanager.createProject}?workspaceId=${workspaceId}` : Pages.taskmanager.createProject;
const navigate = useNavigate(); const navigate = useNavigate();
return ( return (
@@ -31,18 +33,20 @@ const ProjectListHeader: FC<Props> = ({ title, workspaceId, onSettingsClick }) =
<span>برگشت</span> <span>برگشت</span>
</Button> </Button>
<Link to={createProjectLink}> {canCreate("project") && (
<Button <Link to={createProjectLink}>
onClick={onSettingsClick} <Button
className="flex items-center gap-2 whitespace-nowrap px-4" onClick={onSettingsClick}
> className="flex items-center gap-2 whitespace-nowrap px-4"
<Add >
size={18} <Add
color="white" size={18}
/> color="white"
<span>{t("taskmanager.new_project")}</span> />
</Button> <span>{t("taskmanager.new_project")}</span>
</Link> </Button>
</Link>
)}
</div> </div>
</div> </div>
); );
src/pages/taskmanager/workspace/List.tsx
+29 -21
View File
@@ -11,9 +11,11 @@ import { Pages } from "../../../config/Pages";
import { ErrorType } from "../../../helpers/types"; import { ErrorType } from "../../../helpers/types";
import { useDeleteWorkspace, useGetWorkspaces } from "./hooks/useWorkspaceData"; import { useDeleteWorkspace, useGetWorkspaces } from "./hooks/useWorkspaceData";
import { WorkspaceItemType } from "./types/WorkspaceTypes"; import { WorkspaceItemType } from "./types/WorkspaceTypes";
import { usePermissions } from "../../../hooks/usePermissions";
const WorkspaceList: FC = () => { const WorkspaceList: FC = () => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canCreate, canUpdate, canDelete } = usePermissions();
const getWorkspaces = useGetWorkspaces(); const getWorkspaces = useGetWorkspaces();
const deleteWorkspace = useDeleteWorkspace(); const deleteWorkspace = useDeleteWorkspace();
const [deleteTarget, setDeleteTarget] = useState<WorkspaceItemType | null>(null); const [deleteTarget, setDeleteTarget] = useState<WorkspaceItemType | null>(null);
@@ -38,17 +40,19 @@ const WorkspaceList: FC = () => {
<div className="mt-4"> <div className="mt-4">
<div className="flex w-full justify-between items-center"> <div className="flex w-full justify-between items-center">
<div>{t("taskmanager.workspace_list")}</div> <div>{t("taskmanager.workspace_list")}</div>
<Link to={Pages.taskmanager.createWorkspace}> {canCreate("workspace") && (
<Button className="px-5"> <Link to={Pages.taskmanager.createWorkspace}>
<div className="flex gap-2"> <Button className="px-5">
<Add <div className="flex gap-2">
className="size-5" <Add
color="#fff" className="size-5"
/> color="#fff"
<div>{t("taskmanager.new_workspace")}</div> />
</div> <div>{t("taskmanager.new_workspace")}</div>
</Button> </div>
</Link> </Button>
</Link>
)}
</div> </div>
{getWorkspaces.isPending ? ( {getWorkspaces.isPending ? (
@@ -92,18 +96,22 @@ const WorkspaceList: FC = () => {
</Td> </Td>
<Td text=""> <Td text="">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Link to={Pages.taskmanager.updateWorkspace + item.id}> {canUpdate("workspace") && (
<Edit <Link to={Pages.taskmanager.updateWorkspace + item.id}>
<Edit
size={20}
color="#8C90A3"
/>
</Link>
)}
{canDelete("workspace") && (
<Trash
onClick={() => setDeleteTarget(item)}
color="#888"
size={20} size={20}
color="#8C90A3" className="cursor-pointer"
/> />
</Link> )}
<Trash
onClick={() => setDeleteTarget(item)}
color="#888"
size={20}
className="cursor-pointer"
/>
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/ticket/Category.tsx
+4
View File
@@ -14,10 +14,12 @@ import { useCreateCategory, useGetCategories } from './hooks/useTicketData'
import Textarea from '../../components/Textarea' import Textarea from '../../components/Textarea'
import { ErrorType } from '../../helpers/types' import { ErrorType } from '../../helpers/types'
import { toast } from '../../components/Toast'; import { toast } from '../../components/Toast';
import { usePermissions } from '../../hooks/usePermissions'
const TicketCategory: FC = () => { const TicketCategory: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate } = usePermissions()
const getGroups = useGetGroups() const getGroups = useGetGroups()
const createCategory = useCreateCategory() const createCategory = useCreateCategory()
const getCategories = useGetCategories() const getCategories = useGetCategories()
@@ -100,6 +102,7 @@ const TicketCategory: FC = () => {
</div> </div>
</div> </div>
{canCreate('ticket_categories') &&
<div className='bg-white w-sidebar xl:block hidden py-10 px-5 h-fit rounded-3xl'> <div className='bg-white w-sidebar xl:block hidden py-10 px-5 h-fit rounded-3xl'>
<div className='text-sm'> <div className='text-sm'>
{t('ticket.add_category')} {t('ticket.add_category')}
@@ -187,6 +190,7 @@ const TicketCategory: FC = () => {
</div> </div>
</div> */} </div> */}
</div> </div>
}
</div> </div>
</div> </div>
) )
src/pages/ticket/masters/List.tsx
+22 -16
View File
@@ -11,9 +11,11 @@ import { Pages } from "../../../config/Pages";
import { ErrorType } from "../../../helpers/types"; import { ErrorType } from "../../../helpers/types";
import { useDeleteMaster, useGetMasters } from "../hooks/useTicketData"; import { useDeleteMaster, useGetMasters } from "../hooks/useTicketData";
import { TicketMasterItemType } from "../types/TicketTypes"; import { TicketMasterItemType } from "../types/TicketTypes";
import { usePermissions } from "../../../hooks/usePermissions";
const TicketMastersList: FC = () => { const TicketMastersList: FC = () => {
const { t } = useTranslation("global"); const { t } = useTranslation("global");
const { canCreate, canDelete } = usePermissions();
const getMasters = useGetMasters(); const getMasters = useGetMasters();
const deleteMaster = useDeleteMaster(); const deleteMaster = useDeleteMaster();
@@ -35,17 +37,19 @@ const TicketMastersList: FC = () => {
<div className="flex w-full justify-between items-center"> <div className="flex w-full justify-between items-center">
<div>{t("ticket.masters")}</div> <div>{t("ticket.masters")}</div>
<div> <div>
<Link to={Pages.ticket.mastersCreate}> {canCreate("ticket_masters") && (
<Button className="px-5"> <Link to={Pages.ticket.mastersCreate}>
<div className="flex gap-2"> <Button className="px-5">
<Add <div className="flex gap-2">
className="size-5" <Add
color="#fff" className="size-5"
/> color="#fff"
<div>{t("ticket.add_master")}</div> />
</div> <div>{t("ticket.add_master")}</div>
</Button> </div>
</Link> </Button>
</Link>
)}
</div> </div>
</div> </div>
@@ -74,11 +78,13 @@ const TicketMastersList: FC = () => {
{/* <Link to={Pages.ticket.mastersUpdate + item.id}> {/* <Link to={Pages.ticket.mastersUpdate + item.id}>
<Edit size={20} color="#8C90A3" /> <Edit size={20} color="#8C90A3" />
</Link> */} </Link> */}
<TrashWithConfrim {canDelete("ticket_masters") && (
onDelete={() => handleDelete(item.id)} <TrashWithConfrim
isLoading={deleteMaster.isPending} onDelete={() => handleDelete(item.id)}
color="#8C90A3" isLoading={deleteMaster.isPending}
/> color="#8C90A3"
/>
)}
</div> </div>
</Td> </Td>
</tr> </tr>
src/pages/users/GroupList.tsx
+18 -14
View File
@@ -7,11 +7,13 @@ import { Pages } from '../../config/Pages'
import { Add } from 'iconsax-react' import { Add } from 'iconsax-react'
import Td from '../../components/Td' import Td from '../../components/Td'
import { GroupItemType } from './types/UserTypes' import { GroupItemType } from './types/UserTypes'
import { usePermissions } from '../../hooks/usePermissions'
const GroupList: FC = () => { const GroupList: FC = () => {
const { t } = useTranslation('global') const { t } = useTranslation('global')
const navigate = useNavigate() const navigate = useNavigate()
const { canCreate } = usePermissions()
const getGroups = useGetGroups() const getGroups = useGetGroups()
return ( return (
@@ -20,20 +22,22 @@ const GroupList: FC = () => {
<div> <div>
{t('user.groups')} {t('user.groups')}
</div> </div>
<div> {canCreate('admins') && (
<Button <div>
className='px-5' <Button
onClick={() => navigate(Pages.users.groupList)} className='px-5'
> onClick={() => navigate(Pages.users.groupList)}
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('user.group_add')}</div> />
</div> <div>{t('user.group_add')}</div>
</Button> </div>
</div> </Button>
</div>
)}
</div> </div>
<div className='relative overflow-x-auto rounded-3xl mt-9 w-full'> <div className='relative overflow-x-auto rounded-3xl mt-9 w-full'>
src/pages/users/List.tsx
+31 -23
View File
@@ -13,10 +13,12 @@ import { toast } from '../../components/Toast';
import { ErrorType } from '../../helpers/types' import { ErrorType } from '../../helpers/types'
import Pagination from '../../components/Pagination' import Pagination from '../../components/Pagination'
import TrashWithConfrim from '../../components/TrashWithConfrim' import TrashWithConfrim from '../../components/TrashWithConfrim'
import { usePermissions } from '../../hooks/usePermissions'
const UsersList: FC = () => { const UsersList: FC = () => {
const navigate = useNavigate() const navigate = useNavigate()
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate, canDelete } = usePermissions()
const [page, setPage] = useState<number>(1) const [page, setPage] = useState<number>(1)
const [search, setSearch] = useState<string>('') const [search, setSearch] = useState<string>('')
const getUsers = useGetUsers(search, undefined, page) const getUsers = useGetUsers(search, undefined, page)
@@ -40,20 +42,22 @@ const UsersList: FC = () => {
<div> <div>
{t('user.users_list')} {t('user.users_list')}
</div> </div>
<div> {canCreate('admins') && (
<Button <div>
className='px-5' <Button
onClick={() => navigate(Pages.users.create)} className='px-5'
> onClick={() => navigate(Pages.users.create)}
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('user.add_user')}</div> />
</div> <div>{t('user.add_user')}</div>
</Button> </div>
</div> </Button>
</div>
)}
</div> </div>
<div className='flex justify-between items-center mt-12'> <div className='flex justify-between items-center mt-12'>
@@ -103,16 +107,20 @@ const UsersList: FC = () => {
</Td> </Td>
<Td text={''}> <Td text={''}>
<div className='flex gap-2'> <div className='flex gap-2'>
<Link to={Pages.users.detail + item.id}> {canUpdate('admins') && (
<Eye size={20} color='#8C90A3' /> <Link to={Pages.users.detail + item.id}>
</Link> <Eye size={20} color='#8C90A3' />
</Link>
)}
<TrashWithConfrim {canDelete('admins') && (
size={20} <TrashWithConfrim
color='#8C90A3' size={20}
onDelete={() => handleDeleteUser(item.id)} color='#8C90A3'
isLoading={deleteUser.isPending} onDelete={() => handleDeleteUser(item.id)}
/> isLoading={deleteUser.isPending}
/>
)}
</div> </div>
</Td> </Td>
<Td text={''} /> <Td text={''} />
src/pages/users/RolesList.tsx
+23 -17
View File
@@ -8,11 +8,13 @@ import { Link, useNavigate } from 'react-router-dom'
import { Pages } from '../../config/Pages' import { Pages } from '../../config/Pages'
import { useGetRoles } from './hooks/useUserData' import { useGetRoles } from './hooks/useUserData'
import { RoleItemType } from './types/UserTypes' import { RoleItemType } from './types/UserTypes'
import { usePermissions } from '../../hooks/usePermissions'
const RolesList: FC = () => { const RolesList: FC = () => {
const navigate = useNavigate() const navigate = useNavigate()
const { t } = useTranslation('global') const { t } = useTranslation('global')
const { canCreate, canUpdate } = usePermissions()
const [search, setSearch] = useState<string>('') const [search, setSearch] = useState<string>('')
const getRoles = useGetRoles(search) const getRoles = useGetRoles(search)
@@ -23,20 +25,22 @@ const RolesList: FC = () => {
<div> <div>
{t('user.roles_list')} {t('user.roles_list')}
</div> </div>
<div> {canCreate('admins') && (
<Button <div>
className='px-5' <Button
onClick={() => navigate(Pages.users.roleCreate)} className='px-5'
> onClick={() => navigate(Pages.users.roleCreate)}
<div className='flex gap-2'> >
<Add <div className='flex gap-2'>
className='size-5' <Add
color='#fff' className='size-5'
/> color='#fff'
<div>{t('user.add_role')}</div> />
</div> <div>{t('user.add_role')}</div>
</Button> </div>
</div> </Button>
</div>
)}
</div> </div>
<div className='flex justify-end items-center mt-12'> <div className='flex justify-end items-center mt-12'>
@@ -69,9 +73,11 @@ const RolesList: FC = () => {
<Td text={item.userCount + ''} /> <Td text={item.userCount + ''} />
<Td text={item.isAdmin ? t('yes') : t('no')} /> <Td text={item.isAdmin ? t('yes') : t('no')} />
<Td text={''}> <Td text={''}>
<Link to={Pages.users.roleUpdate + item.id}> {canUpdate('admins') && (
<Eye size={20} color='#8C90A3' /> <Link to={Pages.users.roleUpdate + item.id}>
</Link> <Eye size={20} color='#8C90A3' />
</Link>
)}
</Td> </Td>
</tr> </tr>
) )
src/shared/components/SupportSubMenu.tsx
+2 -2
View File
@@ -39,13 +39,13 @@ const SupportSubMenu: FC = () => {
title={t("submenu.ticket_category")} title={t("submenu.ticket_category")}
isActive={isActive("/tickets/category")} isActive={isActive("/tickets/category")}
link={Pages.ticket.category} link={Pages.ticket.category}
activeName="tickets" activeName="ticket_categories"
/> />
<SubMenuItem <SubMenuItem
title={t("submenu.ticket_masters")} title={t("submenu.ticket_masters")}
isActive={isActive("/tickets/masters")} isActive={isActive("/tickets/masters")}
link={Pages.ticket.masters} link={Pages.ticket.masters}
activeName="tickets" activeName="ticket_masters"
/> />
</div> </div>
</div> </div>