hamid zarghami
107 lines
4.2 KiB
TypeScript
107 lines
4.2 KiB
TypeScript
import { type FC, useEffect, useState } from 'react'
|
||
import { useGetSiteSetting, useUpdateSiteSetting } from './hooks/useSettingData'
|
||
import { SiteSettingPageEnum } from './enum/Enum'
|
||
import { useFormik } from 'formik'
|
||
import type { UpdateSiteSetting } from './types/Types'
|
||
import { toast } from 'react-toastify'
|
||
import { Pages } from '@/config/Pages'
|
||
import * as Yup from 'yup'
|
||
import { useNavigate } from 'react-router-dom'
|
||
import Button from '@/components/Button'
|
||
import TextEditor from '@/components/TextEditor'
|
||
import PageLoading from '@/components/PageLoading'
|
||
import Error from '@/components/Error'
|
||
import { TickCircle } from 'iconsax-react'
|
||
|
||
const PrivacyPage: FC = () => {
|
||
const navigate = useNavigate()
|
||
const { data: siteSetting, isLoading: siteSettingLoading, error: siteSettingError } = useGetSiteSetting(SiteSettingPageEnum.policyContent)
|
||
const updateSiteSettingMutation = useUpdateSiteSetting()
|
||
const [formData, setFormData] = useState<UpdateSiteSetting>({ policyContent: '' })
|
||
|
||
const formik = useFormik<UpdateSiteSetting>({
|
||
initialValues: formData,
|
||
validationSchema: Yup.object({
|
||
policyContent: Yup.string().required('حریم خصوصی الزامی است'),
|
||
}),
|
||
onSubmit: (values) => {
|
||
updateSiteSettingMutation.mutate(values, {
|
||
onSuccess: () => {
|
||
toast.success('حریم خصوصی با موفقیت ویرایش شد')
|
||
navigate(Pages.pages.privacy)
|
||
}
|
||
})
|
||
},
|
||
enableReinitialize: true
|
||
})
|
||
|
||
useEffect(() => {
|
||
if (siteSetting?.results?.siteSetting?.policyContent) {
|
||
const newData = { policyContent: siteSetting.results.siteSetting.policyContent }
|
||
setFormData(newData)
|
||
}
|
||
}, [siteSetting])
|
||
|
||
if (siteSettingLoading) {
|
||
return (
|
||
<div className="flex justify-center items-center min-h-[400px]">
|
||
<PageLoading />
|
||
</div>
|
||
)
|
||
}
|
||
|
||
if (siteSettingError) {
|
||
return (
|
||
<div className="flex justify-center items-center min-h-[400px]">
|
||
<Error errorText="خطا در بارگذاری اطلاعات حریم خصوصی" />
|
||
</div>
|
||
)
|
||
}
|
||
|
||
return (
|
||
<div className='mt-4'>
|
||
<div className='flex justify-between items-center'>
|
||
<div className='flex items-center gap-3'>
|
||
<h1>ویرایش حریم خصوصی</h1>
|
||
</div>
|
||
<div>
|
||
<Button
|
||
className='px-6'
|
||
onClick={() => formik.handleSubmit()}
|
||
isLoading={updateSiteSettingMutation.isPending}
|
||
disabled={!formik.isValid || updateSiteSettingMutation.isPending}
|
||
>
|
||
<div className='flex gap-2 items-center'>
|
||
<TickCircle size={16} color='#fff' />
|
||
<div>ذخیره تغییرات</div>
|
||
</div>
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
|
||
<div className='flex gap-6 xl:mt-8 mt-6'>
|
||
<div className='flex-1'>
|
||
<div className='bg-white rounded-lg shadow-sm border p-6'>
|
||
<div className='mb-4'>
|
||
<div className='mb-4'>
|
||
متن حریم خصوصی
|
||
</div>
|
||
<TextEditor
|
||
value={formik.values.policyContent || ''}
|
||
onChange={(value) => formik.setFieldValue('policyContent', value)}
|
||
placeholder='متن حریم خصوصی را وارد کنید...'
|
||
/>
|
||
{formik.touched.policyContent && formik.errors.policyContent && (
|
||
<div className='text-red-500 text-sm mt-12'>
|
||
{formik.errors.policyContent}
|
||
</div>
|
||
)}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default PrivacyPage |