Select Git revision
projectStatusDialog.js
Code owners
Assign users and groups as approvers for specific file changes. Learn more.
projectStatusDialog.js 2.48 KiB
import PropTypes from 'prop-types';
import { useState } from "react";
import { RadioButton } from "primereact/radiobutton";
import { Dialog } from 'primereact/dialog';
import { Button } from 'primereact/button';
export default function ProjectStatusDialog(props) {
const {
visible,
onSave,
onHide,
onCancel,
statusOptions
} = props
const [projectStatus, setProjectStatus] = useState('');
const Save = () => {
if (!onSave) return;
onSave(projectStatus);
}
const footer = (
<div >
<Button label="Save" className="p-button-primary p-mr-2" icon="pi pi-check" disabled={projectStatus==''} onClick={Save} data-testid="save-btn" />
<Button label="Cancel" className="act-btn-cancel mr-0" icon="pi pi-times" onClick={onCancel} />
</div>
);
return (
<Dialog header={`Update Project(s) Status`}
footer={footer} maximizable= {false}
visible={visible} maximized={false} position="center" style={{ width: '20vw' }}
onHide={onHide}
className="content_dlg">
<div style={{ width: '100%' }}>
<div className="p-fluid">
<div className="p-grid p-field" style={{ paddingLeft: '15px' }}>Select the status and click 'Save' to update.</div>
{statusOptions?.map((option) => {
return (
<div className="p-col-12 p-2 " style={{width: "100%"}} key={option.value} >
<RadioButton
inputId={option.value}
name={option.value}
value={option.value}
onChange={(e) => setProjectStatus(e.value)}
checked= {projectStatus === option.value}
/>
<label htmlFor={option.value} className='p-radiobutton-label' style={{textTransform: 'capitalize'}}>
{option.value}
</label>
</div>
)
})}
</div>
</div>
</Dialog>
);
}
ProjectStatusDialog.propTypes = {
visible: PropTypes.any,
onSave: PropTypes.func,
onHide: PropTypes.any,
onCancel: PropTypes.any,
statusOptions: PropTypes.shape({
map: PropTypes.func
})
}