File size: 1,712 Bytes
4304c6d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 |
'use client'
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import cn from 'classnames'
import s from './style.module.css'
import Modal from '@/app/components/base/modal'
import Button from '@/app/components/base/button'
import { AlertCircle } from '@/app/components/base/icons/src/vender/solid/alertsAndFeedback'
type Props = {
isShow: boolean
onHide: () => void
onRemove: () => void
text?: string
children?: JSX.Element
}
const DeleteConfirmModal: FC<Props> = ({
isShow,
onHide,
onRemove,
children,
text,
}) => {
const { t } = useTranslation()
if (!isShow)
return null
return (
<Modal
isShow={isShow}
onClose={onHide}
wrapperClassName='z-50'
className={cn(s.delModal, 'z-50')}
closable
>
<div onClick={(e) => {
e.stopPropagation()
e.stopPropagation()
e.nativeEvent.stopImmediatePropagation()
}}>
<div className={s.warningWrapper}>
<AlertCircle className='w-6 h-6 text-red-600' />
</div>
{text
? (
<div className='text-xl font-semibold text-gray-900 mb-3'>{text}</div>
)
: children}
<div className='flex gap-2 justify-end'>
<Button onClick={onHide}>{t('common.operation.cancel')}</Button>
<Button
type='warning'
onClick={onRemove}
className='border-red-700 border-[0.5px]'
>
{t('common.operation.sure')}
</Button>
</div>
</div>
</Modal>
)
}
export default React.memo(DeleteConfirmModal)
|