diff --git a/src/pages/learning/Category.tsx b/src/pages/learning/Category.tsx index 9b60ee4..97b0877 100644 --- a/src/pages/learning/Category.tsx +++ b/src/pages/learning/Category.tsx @@ -1,16 +1,45 @@ import { type FC, useState } from 'react' // import { useTranslation } from 'react-i18next' -import Td from '../../components/Td' -import DefaultTableSkeleton from '../../components/DefaultTableSkeleton' -import Pagination from '../../components/Pagination' -import { useGetCategory } from './hooks/useLearningData' +import Table from '../../components/Table' +import TrashWithConfrim from '../../components/TrashWithConfrim' +import { type ColumnType } from '../../components/types/TableTypes' +import { useGetCategory, useDeleteCategory } from './hooks/useLearningData' import { type CategoryLearningType } from './hooks/useLearningData' import CreateCategory from './components/CreateCategory' +import { toast } from 'react-toastify' +import { extractErrorMessage } from '../../config/func' const LearningCategory: FC = () => { const [page, setPage] = useState(1) const getCategory = useGetCategory() + const { mutate, isPending } = useDeleteCategory() + + const handleDelete = (id: string | number) => { + mutate(id, { + onError: (error) => { + toast.error(extractErrorMessage(error)) + }, + }) + } + + const columns: ColumnType[] = [ + { + title: 'عنوان', + key: 'name', + }, + { + title: '', + key: 'action', + render: (item) => ( + handleDelete(item.id)} + isloading={isPending} + colorIcon='red' + /> + ), + }, + ] return (
@@ -20,46 +49,18 @@ const LearningCategory: FC = () => {
-
- { - getCategory.isPending ? -
- -
- : -
- - - - - - - { - getCategory.data?.data?.categories?.map((item: CategoryLearningType) => { - return ( - - - ) - }) - } - -
- -
- -
-
- -
-
- } - - + + columns={columns} + data={getCategory.data?.data?.categories} + isLoading={getCategory.isPending} + pagination={{ + currentPage: page, + totalPages: getCategory.data?.data?.pager?.totalPages || 1, + onPageChange: setPage, + }} + noDataMessage="هیچ دسته‌بندی یافت نشد" + />
diff --git a/src/pages/learning/components/CreateCategory.tsx b/src/pages/learning/components/CreateCategory.tsx index c3778ee..d93faed 100644 --- a/src/pages/learning/components/CreateCategory.tsx +++ b/src/pages/learning/components/CreateCategory.tsx @@ -13,7 +13,6 @@ import { extractErrorMessage } from '@/config/func' const CreateCategory: FC = () => { // const { t } = useTranslation('global') - const t = (key: string) => key; // Mock translation function const createCategory = useCreateCategory() const getCategory = useGetCategory() @@ -22,7 +21,7 @@ const CreateCategory: FC = () => { name: '' }, validationSchema: Yup.object({ - name: Yup.string().required(t('errors.required')), + name: Yup.string().required('این فیلد اجباری است'), }), onSubmit: (values) => { diff --git a/src/pages/learning/hooks/useLearningData.ts b/src/pages/learning/hooks/useLearningData.ts index 9a1e824..f5e3f17 100644 --- a/src/pages/learning/hooks/useLearningData.ts +++ b/src/pages/learning/hooks/useLearningData.ts @@ -1,4 +1,5 @@ import { useMutation, useQuery } from "@tanstack/react-query"; +import { useQueryClient } from "@tanstack/react-query"; import * as api from "../service/LearningService"; import type { CreateCategoryLearningType, @@ -23,6 +24,16 @@ export const useCreateCategory = () => { }); }; +export const useDeleteCategory = () => { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: (id: string | number) => api.deleteCategory(id), + onSuccess: () => { + queryClient.invalidateQueries({ queryKey: ["learning-category"] }); + }, + }); +}; + export const useCreateLearning = () => { return useMutation({ mutationFn: (variables: CreateLearningType) => diff --git a/src/pages/learning/service/LearningService.ts b/src/pages/learning/service/LearningService.ts index b37d3fa..48fe58d 100644 --- a/src/pages/learning/service/LearningService.ts +++ b/src/pages/learning/service/LearningService.ts @@ -14,6 +14,11 @@ export const createCategory = async (params: CreateCategoryLearningType) => { return data; }; +export const deleteCategory = async (id: string | number) => { + const { data } = await axios.delete(`/admin/learnings/category/${id}`); + return data; +}; + export const CreateLearning = async (params: CreateLearningType) => { const { data } = await axios.post(`/admin/learnings`, params); return data;