// React Imports
import { useState, useEffect } from 'react'

// MUI Imports
import Button from '@mui/material/Button'
import Drawer from '@mui/material/Drawer'
import IconButton from '@mui/material/IconButton'
import MenuItem from '@mui/material/MenuItem'
import Typography from '@mui/material/Typography'
import Divider from '@mui/material/Divider'
import Grid from '@mui/material/Grid2'
import Box from '@mui/material/Box'
import Switch from '@mui/material/Switch'
import FormControlLabel from '@mui/material/FormControlLabel'
import Chip from '@mui/material/Chip'
import InputAdornment from '@mui/material/InputAdornment'
import Avatar from '@mui/material/Avatar'
import Card from '@mui/material/Card'
import CardContent from '@mui/material/CardContent'
import FormHelperText from '@mui/material/FormHelperText'

// Third-party Imports
import { useForm, Controller } from 'react-hook-form'

// Component Imports
import CustomTextField from '@core/components/mui/TextField'

// Types - Updated to match the integrated voucher structure
export interface VoucherCatalogType {
  id: string
  name: string
  description?: string
  pointCost: number
  stock?: number
  isActive: boolean
  validUntil?: Date
  imageUrl?: string
  createdAt: Date
  updatedAt: Date
  // Voucher-specific fields
  code: string
  type: 'discount' | 'cashback' | 'free_shipping' | 'product'
  discountType?: 'fixed' | 'percent'
  discountValue?: number
  minPurchase?: number
  validFrom: string
}

export interface VoucherRequest {
  name: string
  description?: string
  pointCost: number
  stock?: number
  isActive: boolean
  validUntil?: Date
  imageUrl?: string
  code: string
  type: 'discount' | 'cashback' | 'free_shipping' | 'product'
  discountType?: 'fixed' | 'percent'
  discountValue?: number
  minPurchase?: number
  validFrom: string
  terms?: string
}

type Props = {
  open: boolean
  handleClose: () => void
  data?: VoucherCatalogType // Data voucher untuk edit (jika ada)
}

type FormValidateType = {
  name: string
  description: string
  pointCost: number
  stock: number | ''
  isActive: boolean
  validUntil: string
  imageUrl: string
  code: string
  type: 'discount' | 'cashback' | 'free_shipping' | 'product'
  discountType: 'fixed' | 'percent'
  discountValue: number | ''
  minPurchase: number | ''
  validFrom: string
  terms: string
  hasUnlimitedStock: boolean
  hasValidUntil: boolean
  hasMinPurchase: boolean
}

// Initial form data
const initialData: FormValidateType = {
  name: '',
  description: '',
  pointCost: 100,
  stock: '',
  isActive: true,
  validUntil: '',
  imageUrl: '',
  code: '',
  type: 'discount',
  discountType: 'fixed',
  discountValue: '',
  minPurchase: '',
  validFrom: new Date().toISOString().split('T')[0],
  terms: '',
  hasUnlimitedStock: false,
  hasValidUntil: false,
  hasMinPurchase: false
}

// Mock mutation hooks (replace with actual hooks)
const useVoucherMutation = () => {
  const createVoucher = {
    mutate: (data: VoucherRequest, options?: { onSuccess?: () => void }) => {
      console.log('Creating voucher:', data)
      setTimeout(() => options?.onSuccess?.(), 1000)
    }
  }

  const updateVoucher = {
    mutate: (data: { id: string; payload: VoucherRequest }, options?: { onSuccess?: () => void }) => {
      console.log('Updating voucher:', data)
      setTimeout(() => options?.onSuccess?.(), 1000)
    }
  }

  return { createVoucher, updateVoucher }
}

// Voucher types
const VOUCHER_TYPES = [
  { value: 'discount', label: 'Diskon', icon: 'tabler-percentage' },
  { value: 'cashback', label: 'Cashback', icon: 'tabler-cash' },
  { value: 'free_shipping', label: 'Gratis Ongkir', icon: 'tabler-truck-delivery' },
  { value: 'product', label: 'Produk Fisik', icon: 'tabler-package' }
]

// Discount types
const DISCOUNT_TYPES = [
  { value: 'fixed', label: 'Nilai Tetap (Rp)' },
  { value: 'percent', label: 'Persentase (%)' }
]

const AddEditVoucherDrawer = (props: Props) => {
  // Props
  const { open, handleClose, data } = props

  // States
  const [showMore, setShowMore] = useState(false)
  const [isSubmitting, setIsSubmitting] = useState(false)
  const [imagePreview, setImagePreview] = useState<string | null>(null)

  const { createVoucher, updateVoucher } = useVoucherMutation()

  // Determine if this is edit mode
  const isEditMode = Boolean(data?.id)

  // Hooks
  const {
    control,
    reset: resetForm,
    handleSubmit,
    watch,
    setValue,
    formState: { errors }
  } = useForm<FormValidateType>({
    defaultValues: initialData
  })

  const watchedImageUrl = watch('imageUrl')
  const watchedHasUnlimitedStock = watch('hasUnlimitedStock')
  const watchedHasValidUntil = watch('hasValidUntil')
  const watchedHasMinPurchase = watch('hasMinPurchase')
  const watchedStock = watch('stock')
  const watchedPointCost = watch('pointCost')
  const watchedType = watch('type')
  const watchedDiscountType = watch('discountType')
  const watchedDiscountValue = watch('discountValue')

  // Effect to populate form when editing
  useEffect(() => {
    if (isEditMode && data) {
      // Populate form with existing data
      const formData: FormValidateType = {
        name: data.name || '',
        description: data.description || '',
        pointCost: data.pointCost || 100,
        stock: data.stock ?? '',
        isActive: data.isActive ?? true,
        validUntil: data.validUntil ? new Date(data.validUntil).toISOString().split('T')[0] : '',
        imageUrl: data.imageUrl || '',
        code: data.code || '',
        type: data.type || 'discount',
        discountType: data.discountType || 'fixed',
        discountValue: data.discountValue ?? '',
        minPurchase: data.minPurchase ?? '',
        validFrom: data.validFrom
          ? new Date(data.validFrom).toISOString().split('T')[0]
          : new Date().toISOString().split('T')[0],
        terms: '',
        hasUnlimitedStock: data.stock === undefined || data.stock === null,
        hasValidUntil: Boolean(data.validUntil),
        hasMinPurchase: Boolean(data.minPurchase)
      }

      resetForm(formData)
      setShowMore(true) // Always show more for edit mode
      setImagePreview(data.imageUrl || null)
    } else {
      // Reset to initial data for add mode
      resetForm(initialData)
      setShowMore(false)
      setImagePreview(null)
    }
  }, [data, isEditMode, resetForm])

  // Handle image URL change
  useEffect(() => {
    if (watchedImageUrl) {
      setImagePreview(watchedImageUrl)
    } else {
      setImagePreview(null)
    }
  }, [watchedImageUrl])

  // Handle unlimited stock toggle
  useEffect(() => {
    if (watchedHasUnlimitedStock) {
      setValue('stock', '')
    }
  }, [watchedHasUnlimitedStock, setValue])

  // Handle valid until toggle
  useEffect(() => {
    if (!watchedHasValidUntil) {
      setValue('validUntil', '')
    }
  }, [watchedHasValidUntil, setValue])

  // Handle minimum purchase toggle
  useEffect(() => {
    if (!watchedHasMinPurchase) {
      setValue('minPurchase', '')
    }
  }, [watchedHasMinPurchase, setValue])

  // Auto-generate voucher code
  const generateVoucherCode = () => {
    const prefix = watchedType.toUpperCase()
    const randomSuffix = Math.random().toString(36).substring(2, 8).toUpperCase()
    return `${prefix}_${randomSuffix}`
  }

  const handleFormSubmit = async (formData: FormValidateType) => {
    try {
      setIsSubmitting(true)

      // Create VoucherRequest object
      const voucherRequest: VoucherRequest = {
        name: formData.name,
        description: formData.description || undefined,
        pointCost: formData.pointCost,
        stock: formData.hasUnlimitedStock ? undefined : (formData.stock as number) || undefined,
        isActive: formData.isActive,
        validUntil: formData.hasValidUntil && formData.validUntil ? new Date(formData.validUntil) : undefined,
        imageUrl: formData.imageUrl || undefined,
        code: formData.code,
        type: formData.type,
        discountType: ['discount', 'cashback'].includes(formData.type) ? formData.discountType : undefined,
        discountValue:
          ['discount', 'cashback'].includes(formData.type) && formData.discountValue
            ? Number(formData.discountValue)
            : undefined,
        minPurchase: formData.hasMinPurchase && formData.minPurchase ? Number(formData.minPurchase) : undefined,
        validFrom: formData.validFrom,
        terms: formData.terms || undefined
      }

      if (isEditMode && data?.id) {
        // Update existing voucher
        updateVoucher.mutate(
          { id: data.id, payload: voucherRequest },
          {
            onSuccess: () => {
              handleReset()
              handleClose()
            }
          }
        )
      } else {
        // Create new voucher
        createVoucher.mutate(voucherRequest, {
          onSuccess: () => {
            handleReset()
            handleClose()
          }
        })
      }
    } catch (error) {
      console.error('Error submitting voucher:', error)
      // Handle error (show toast, etc.)
    } finally {
      setIsSubmitting(false)
    }
  }

  const handleReset = () => {
    handleClose()
    resetForm(initialData)
    setShowMore(false)
    setImagePreview(null)
  }

  const formatPoints = (value: number) => {
    return value.toLocaleString('id-ID') + ' poin'
  }

  const formatCurrency = (value: number) => {
    return new Intl.NumberFormat('id-ID', {
      style: 'currency',
      currency: 'IDR'
    }).format(value)
  }

  const getStockDisplay = () => {
    if (watchedHasUnlimitedStock) return 'Unlimited'
    if (watchedStock === '' || watchedStock === 0) return 'Tidak ada stok'
    return `${watchedStock} item`
  }

  const getDiscountValueDisplay = () => {
    if (!watchedDiscountValue) return ''
    if (watchedDiscountType === 'percent') {
      return `${watchedDiscountValue}%`
    } else {
      return formatCurrency(Number(watchedDiscountValue))
    }
  }

  const shouldShowDiscountFields = ['discount', 'cashback'].includes(watchedType)

  return (
    <Drawer
      open={open}
      anchor='right'
      variant='temporary'
      onClose={handleReset}
      ModalProps={{ keepMounted: true }}
      sx={{
        '& .MuiDrawer-paper': {
          width: { xs: 300, sm: 400 },
          display: 'flex',
          flexDirection: 'column',
          height: '100%'
        }
      }}
    >
      {/* Sticky Header */}
      <Box
        sx={{
          position: 'sticky',
          top: 0,
          zIndex: 10,
          backgroundColor: 'background.paper',
          borderBottom: 1,
          borderColor: 'divider'
        }}
      >
        <div className='flex items-center justify-between plb-5 pli-6'>
          <Typography variant='h5'>{isEditMode ? 'Edit Voucher' : 'Tambah Voucher Baru'}</Typography>
          <IconButton size='small' onClick={handleReset}>
            <i className='tabler-x text-2xl text-textPrimary' />
          </IconButton>
        </div>
      </Box>

      {/* Scrollable Content */}
      <Box sx={{ flex: 1, overflowY: 'auto' }}>
        <form id='voucher-form' onSubmit={handleSubmit(handleFormSubmit)}>
          <div className='flex flex-col gap-6 p-6'>
            {/* Image Preview */}
            {imagePreview && (
              <Card variant='outlined' sx={{ mb: 2 }}>
                <CardContent sx={{ p: 2 }}>
                  <Typography variant='subtitle2' className='mb-2'>
                    Preview Gambar
                  </Typography>
                  <Avatar
                    src={imagePreview}
                    sx={{
                      width: 80,
                      height: 80,
                      mx: 'auto',
                      mb: 1
                    }}
                    variant='rounded'
                  >
                    <i className='tabler-ticket text-2xl' />
                  </Avatar>
                </CardContent>
              </Card>
            )}

            {/* Nama Voucher */}
            <div>
              <Typography variant='body2' className='mb-2'>
                Nama Voucher <span className='text-red-500'>*</span>
              </Typography>
              <Controller
                name='name'
                control={control}
                rules={{ required: 'Nama voucher wajib diisi' }}
                render={({ field }) => (
                  <CustomTextField
                    {...field}
                    fullWidth
                    placeholder='Masukkan nama voucher'
                    error={!!errors.name}
                    helperText={errors.name?.message}
                  />
                )}
              />
            </div>

            {/* Tipe Voucher */}
            <div>
              <Typography variant='body2' className='mb-2'>
                Tipe Voucher <span className='text-red-500'>*</span>
              </Typography>
              <Controller
                name='type'
                control={control}
                rules={{ required: 'Tipe voucher wajib dipilih' }}
                render={({ field }) => (
                  <CustomTextField {...field} select fullWidth error={!!errors.type} helperText={errors.type?.message}>
                    {VOUCHER_TYPES.map(type => (
                      <MenuItem key={type.value} value={type.value}>
                        <div className='flex items-center gap-2'>
                          <i className={type.icon} />
                          {type.label}
                        </div>
                      </MenuItem>
                    ))}
                  </CustomTextField>
                )}
              />
            </div>

            {/* Kode Voucher */}
            <div>
              <Typography variant='body2' className='mb-2'>
                Kode Voucher <span className='text-red-500'>*</span>
              </Typography>
              <Controller
                name='code'
                control={control}
                rules={{
                  required: 'Kode voucher wajib diisi',
                  pattern: {
                    value: /^[A-Z0-9_-]+$/,
                    message: 'Kode voucher hanya boleh menggunakan huruf besar, angka, underscore, dan strip'
                  }
                }}
                render={({ field }) => (
                  <CustomTextField
                    {...field}
                    fullWidth
                    placeholder='DISC50K'
                    error={!!errors.code}
                    helperText={errors.code?.message || 'Gunakan huruf besar, angka, _, dan - saja'}
                    InputProps={{
                      endAdornment: (
                        <InputAdornment position='end'>
                          <Button
                            variant='text'
                            size='small'
                            onClick={() => setValue('code', generateVoucherCode())}
                            sx={{ minWidth: 'auto', p: 1 }}
                          >
                            <i className='tabler-refresh text-lg' />
                          </Button>
                        </InputAdornment>
                      )
                    }}
                    onChange={e => field.onChange(e.target.value.toUpperCase())}
                  />
                )}
              />
            </div>

            {/* Discount Fields - Only show for discount and cashback */}
            {shouldShowDiscountFields && (
              <>
                {/* Tipe Diskon */}
                <div>
                  <Typography variant='body2' className='mb-2'>
                    Tipe Diskon <span className='text-red-500'>*</span>
                  </Typography>
                  <Controller
                    name='discountType'
                    control={control}
                    rules={{ required: shouldShowDiscountFields ? 'Tipe diskon wajib dipilih' : false }}
                    render={({ field }) => (
                      <CustomTextField
                        {...field}
                        select
                        fullWidth
                        error={!!errors.discountType}
                        helperText={errors.discountType?.message}
                      >
                        {DISCOUNT_TYPES.map(type => (
                          <MenuItem key={type.value} value={type.value}>
                            {type.label}
                          </MenuItem>
                        ))}
                      </CustomTextField>
                    )}
                  />
                </div>

                {/* Nilai Diskon */}
                <div>
                  <Typography variant='body2' className='mb-2'>
                    Nilai Diskon <span className='text-red-500'>*</span>
                  </Typography>
                  <Controller
                    name='discountValue'
                    control={control}
                    rules={{
                      required: shouldShowDiscountFields ? 'Nilai diskon wajib diisi' : false,
                      min: {
                        value: watchedDiscountType === 'percent' ? 1 : 1000,
                        message: watchedDiscountType === 'percent' ? 'Minimal 1%' : 'Minimal Rp 1.000'
                      },
                      max: {
                        value: watchedDiscountType === 'percent' ? 100 : 100,
                        message: 'Maksimal 100%'
                      }
                    }}
                    render={({ field }) => (
                      <CustomTextField
                        {...field}
                        fullWidth
                        type='number'
                        placeholder={watchedDiscountType === 'percent' ? '10' : '50000'}
                        error={!!errors.discountValue}
                        helperText={errors.discountValue?.message || getDiscountValueDisplay()}
                        InputProps={{
                          startAdornment: (
                            <InputAdornment position='start'>
                              {watchedDiscountType === 'percent' ? '%' : 'Rp'}
                            </InputAdornment>
                          )
                        }}
                        onChange={e => field.onChange(e.target.value ? Number(e.target.value) : '')}
                        value={field.value === '' ? '' : field.value}
                      />
                    )}
                  />
                </div>
              </>
            )}

            {/* Point Cost */}
            <div>
              <Typography variant='body2' className='mb-2'>
                Biaya Poin <span className='text-red-500'>*</span>
              </Typography>
              <Controller
                name='pointCost'
                control={control}
                rules={{
                  required: 'Biaya poin wajib diisi',
                  min: {
                    value: 1,
                    message: 'Biaya poin minimal 1'
                  }
                }}
                render={({ field }) => (
                  <CustomTextField
                    {...field}
                    fullWidth
                    type='number'
                    placeholder='100'
                    error={!!errors.pointCost}
                    helperText={errors.pointCost?.message || (field.value > 0 ? formatPoints(field.value) : '')}
                    InputProps={{
                      startAdornment: (
                        <InputAdornment position='start'>
                          <i className='tabler-star-filled text-warning' />
                        </InputAdornment>
                      )
                    }}
                    onChange={e => field.onChange(Number(e.target.value))}
                  />
                )}
              />
            </div>

            {/* Valid From */}
            <div>
              <Typography variant='body2' className='mb-2'>
                Berlaku Mulai <span className='text-red-500'>*</span>
              </Typography>
              <Controller
                name='validFrom'
                control={control}
                rules={{ required: 'Tanggal mulai berlaku wajib diisi' }}
                render={({ field }) => (
                  <CustomTextField
                    {...field}
                    fullWidth
                    type='date'
                    error={!!errors.validFrom}
                    helperText={errors.validFrom?.message}
                    InputLabelProps={{
                      shrink: true
                    }}
                  />
                )}
              />
            </div>

            {/* Minimum Purchase */}
            <div>
              <Typography variant='body2' className='mb-2'>
                Pembelian Minimum
              </Typography>
              <Controller
                name='hasMinPurchase'
                control={control}
                render={({ field }) => (
                  <FormControlLabel
                    control={<Switch checked={field.value} onChange={field.onChange} color='primary' />}
                    label='Memiliki syarat pembelian minimum'
                    className='mb-2'
                  />
                )}
              />
              {watchedHasMinPurchase && (
                <Controller
                  name='minPurchase'
                  control={control}
                  rules={{
                    required: watchedHasMinPurchase ? 'Minimal pembelian wajib diisi' : false,
                    min: {
                      value: 1000,
                      message: 'Minimal pembelian tidak boleh kurang dari Rp 1.000'
                    }
                  }}
                  render={({ field }) => (
                    <CustomTextField
                      {...field}
                      fullWidth
                      type='number'
                      placeholder='50000'
                      error={!!errors.minPurchase}
                      helperText={
                        errors.minPurchase?.message || (field.value ? formatCurrency(Number(field.value)) : '')
                      }
                      InputProps={{
                        startAdornment: <InputAdornment position='start'>Rp</InputAdornment>
                      }}
                      onChange={e => field.onChange(e.target.value ? Number(e.target.value) : '')}
                      value={field.value === '' ? '' : field.value}
                    />
                  )}
                />
              )}
            </div>

            {/* Stock Management */}
            <div>
              <Typography variant='body2' className='mb-2'>
                Manajemen Stok
              </Typography>
              <Controller
                name='hasUnlimitedStock'
                control={control}
                render={({ field }) => (
                  <FormControlLabel
                    control={<Switch checked={field.value} onChange={field.onChange} color='primary' />}
                    label='Stok Unlimited'
                    className='mb-2'
                  />
                )}
              />
              {!watchedHasUnlimitedStock && (
                <Controller
                  name='stock'
                  control={control}
                  rules={{
                    required: !watchedHasUnlimitedStock ? 'Jumlah stok wajib diisi' : false,
                    min: {
                      value: 0,
                      message: 'Stok tidak boleh negatif'
                    }
                  }}
                  render={({ field }) => (
                    <CustomTextField
                      {...field}
                      fullWidth
                      type='number'
                      placeholder='0'
                      error={!!errors.stock}
                      helperText={errors.stock?.message || getStockDisplay()}
                      InputProps={{
                        startAdornment: <InputAdornment position='start'>Qty</InputAdornment>
                      }}
                      onChange={e => field.onChange(e.target.value ? Number(e.target.value) : '')}
                      value={field.value === '' ? '' : field.value}
                    />
                  )}
                />
              )}
            </div>

            {/* Status Aktif */}
            <div>
              <Controller
                name='isActive'
                control={control}
                render={({ field }) => (
                  <FormControlLabel
                    control={<Switch checked={field.value} onChange={field.onChange} color='primary' />}
                    label='Voucher Aktif'
                  />
                )}
              />
            </div>

            {/* Tampilkan selengkapnya */}
            {!showMore && (
              <Button
                variant='text'
                color='primary'
                size='small'
                sx={{ textTransform: 'none', fontSize: '14px', p: 0, textAlign: 'left', width: '200px' }}
                onClick={() => setShowMore(true)}
              >
                + Tampilkan selengkapnya
              </Button>
            )}

            {/* Konten tambahan */}
            {showMore && (
              <>
                {/* Description */}
                <div>
                  <Typography variant='body2' className='mb-2'>
                    Deskripsi Voucher
                  </Typography>
                  <Controller
                    name='description'
                    control={control}
                    render={({ field }) => (
                      <CustomTextField
                        {...field}
                        fullWidth
                        placeholder='Deskripsi detail tentang voucher'
                        multiline
                        rows={3}
                      />
                    )}
                  />
                </div>

                {/* Image URL */}
                <div>
                  <Typography variant='body2' className='mb-2'>
                    URL Gambar
                  </Typography>
                  <Controller
                    name='imageUrl'
                    control={control}
                    render={({ field }) => (
                      <CustomTextField
                        {...field}
                        fullWidth
                        placeholder='https://example.com/image.jpg'
                        type='url'
                        InputProps={{
                          startAdornment: (
                            <InputAdornment position='start'>
                              <i className='tabler-photo' />
                            </InputAdornment>
                          )
                        }}
                      />
                    )}
                  />
                </div>

                {/* Valid Until */}
                <div>
                  <Typography variant='body2' className='mb-2'>
                    Masa Berlaku
                  </Typography>
                  <Controller
                    name='hasValidUntil'
                    control={control}
                    render={({ field }) => (
                      <FormControlLabel
                        control={<Switch checked={field.value} onChange={field.onChange} color='primary' />}
                        label='Memiliki batas waktu'
                        className='mb-2'
                      />
                    )}
                  />
                  {watchedHasValidUntil && (
                    <Controller
                      name='validUntil'
                      control={control}
                      rules={{
                        required: watchedHasValidUntil ? 'Tanggal kadaluarsa wajib diisi' : false
                      }}
                      render={({ field }) => (
                        <CustomTextField
                          {...field}
                          fullWidth
                          type='date'
                          error={!!errors.validUntil}
                          helperText={errors.validUntil?.message}
                          InputLabelProps={{
                            shrink: true
                          }}
                        />
                      )}
                    />
                  )}
                </div>

                {/* Terms & Conditions */}
                <div>
                  <Typography variant='body2' className='mb-2'>
                    Syarat & Ketentuan
                  </Typography>
                  <Controller
                    name='terms'
                    control={control}
                    render={({ field }) => (
                      <CustomTextField
                        {...field}
                        fullWidth
                        placeholder='Syarat dan ketentuan penggunaan voucher'
                        multiline
                        rows={3}
                      />
                    )}
                  />
                </div>

                {/* Sembunyikan */}
                <Button
                  variant='text'
                  color='primary'
                  size='small'
                  sx={{ textTransform: 'none', fontSize: '14px', p: 0, textAlign: 'left', width: '200px' }}
                  onClick={() => setShowMore(false)}
                >
                  - Sembunyikan
                </Button>
              </>
            )}
          </div>
        </form>
      </Box>

      {/* Sticky Footer */}
      <Box
        sx={{
          position: 'sticky',
          bottom: 0,
          zIndex: 10,
          backgroundColor: 'background.paper',
          borderTop: 1,
          borderColor: 'divider',
          p: 3
        }}
      >
        <div className='flex items-center gap-4'>
          <Button variant='contained' type='submit' form='voucher-form' disabled={isSubmitting}>
            {isSubmitting ? (isEditMode ? 'Mengupdate...' : 'Menyimpan...') : isEditMode ? 'Update' : 'Simpan'}
          </Button>
          <Button variant='outlined' color='error' onClick={handleReset} disabled={isSubmitting}>
            Batal
          </Button>
        </div>
      </Box>
    </Drawer>
  )
}

export default AddEditVoucherDrawer
