47 lines
1.2 KiB
TypeScript
47 lines
1.2 KiB
TypeScript
import { Cancion } from '@/types/types';
|
|
import { FormEvent, useState } from 'react';
|
|
import Checkbox from './Checkbox';
|
|
import InputLabel from './InputLabel';
|
|
import Modal from './Modal';
|
|
import PrimaryButton from './PrimaryButton';
|
|
|
|
export default function ModalRemoveCancion({
|
|
show,
|
|
cancion,
|
|
remove,
|
|
close,
|
|
}: {
|
|
show: boolean;
|
|
cancion: Cancion;
|
|
remove: (e: FormEvent) => void;
|
|
close: (arg0: boolean) => void;
|
|
}) {
|
|
const [checked, setcheked] = useState(false);
|
|
|
|
return (
|
|
<Modal
|
|
show={show}
|
|
onClose={() => close(false)}
|
|
closeable={true}
|
|
maxWidth="md"
|
|
>
|
|
<form onSubmit={remove} className="p-6">
|
|
<h2 className="mb-2 text-lg font-medium text-gray-900 dark:text-gray-100">
|
|
Eliminando Canción
|
|
</h2>
|
|
<hr />
|
|
<div className="mt-2 flex">
|
|
<Checkbox onChange={() => setcheked(!checked)} />
|
|
<InputLabel>Cancion a eliminar: {cancion.title}</InputLabel>
|
|
<hr className="mt-2" />
|
|
<div className="flex place-content-center">
|
|
<PrimaryButton className="mt-2" type="submit" disabled={!checked}>
|
|
Aceptar
|
|
</PrimaryButton>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</Modal>
|
|
);
|
|
}
|