'use client'

import PropTypes from 'prop-types'
import Button from '@mui/material/Button'
import TextField from '@mui/material/TextField'
import Dialog from '@mui/material/Dialog'
import DialogActions from '@mui/material/DialogActions'
import DialogContent from '@mui/material/DialogContent'
import DialogContentText from '@mui/material/DialogContentText'
import DialogTitle from '@mui/material/DialogTitle'
import LogoutCountdown from '../../session/logout-countdown.js'
import ListItems from './list-items.js'

export default function CreateForm({
  isOpen,
  setIsOpen,
  setError,
  setIsErrorAlertOpen,
  dialogText,
  title,
  label,
  hasMultiline = true,
  listItems,
  handleFormSubmit,
  countdownRef,
  setSelectValue
}) {
  const handleClose = () => {
    setIsOpen(false)
  }

  return (
    <>
      <Dialog
        open={isOpen}
        PaperProps={{
          component: 'form',
          onSubmit: handleFormSubmit,
        }}
        onClose={handleClose}
      >
        <DialogTitle>{title}</DialogTitle>
        <DialogContent sx={{color: 'white'}}>
          <DialogContentText sx={{color: 'white'}}>
            {dialogText}
          </DialogContentText>
          {listItems && listItems.length > 0 && (
            <ListItems
              items={listItems}
              selectLabel='Titre associé *'
              setSelectValue={setSelectValue}
            />
          )}
          <TextField
            autoFocus
            required
            fullWidth
            multiline={Boolean(hasMultiline)}
            mt={2}
            rows={4}
            id='content'
            name='content'
            label={label}
          />
        </DialogContent>
        <DialogActions>
          <Button variant='contained' color='success' onClick={handleClose}>Annuler</Button>
          <Button variant='contained' color='error' type='submit'>Valider</Button>
        </DialogActions>
      </Dialog>
      <LogoutCountdown ref={countdownRef} setError={setError} setIsErrorAlertOpen={setIsErrorAlertOpen} />
    </>
  )
}

CreateForm.propTypes = {
  isOpen: PropTypes.bool.isRequired,
  setIsOpen: PropTypes.func.isRequired,
  countdownRef: PropTypes.object,
  setError: PropTypes.func.isRequired,
  setIsErrorAlertOpen: PropTypes.func.isRequired,
  handleFormSubmit: PropTypes.func.isRequired,
  setSelectValue: PropTypes.func.isRequired,
  dialogText: PropTypes.string.isRequired,
  title: PropTypes.string.isRequired,
  label: PropTypes.string.isRequired,
  hasMultiline: PropTypes.bool,
  listItems: PropTypes.array.isRequired
}