I, as the user should be able to close out the job site once it is finished. The delete button at the bottom each card will allow the user to be able to delete or (close out) a job site.
Acceptance Criteria
This is the wireframe of the new job site card with edit and delete on it.
Dependecies
28 API calls must be created and tested
29 Wouldn't hurt to get the create and edit work.
Dev Notes
import React from 'react';
import PropTypes from 'prop-types';
import Button from 'react-bootstrap/Button';
import Card from 'react-bootstrap/Card';
import Link from 'next/link';
import { deleteEquipment } from '../api/equipData';
function EquipmentCard({ equipmentObj, onUpdate }) {
// FOR DELETE, WE NEED TO REMOVE THE EQUIPMENT AND HAVE THE VIEW RERENDER,
// SO WE PASS THE FUNCTION FROM THE PARENT THAT GETS THE Equipment
const deleteThisEquipment = () => {
if (window.confirm(Delete ${equipmentObj.name}?)) {
deleteEquipment(equipmentObj.firebaseKey).then(() => onUpdate());
}
};
return (
<Card style={{ width: '16rem', margin: '10px' }}>
<Card.Img variant="top" src={equipmentObj.image} style={{ height: '200px', objectFit: 'cover' }} />
{equipmentObj.name}{equipmentObj.size}{equipmentObj.location}
{/* DYNAMIC LINK TO VIEW THE EQUIPMENT DETAILS */}
{/* DYNAMIC LINK TO EDIT THE EQUIPMENT DETAILS */}
);
}
EquipmentCard.propTypes = {
equipmentObj: PropTypes.shape({
firebaseKey: PropTypes.string,
name: PropTypes.string,
size: PropTypes.string,
image: PropTypes.string,
location: PropTypes.string,
}).isRequired,
onUpdate: PropTypes.func.isRequired,
};
export default EquipmentCard;
User Story
I, as the user should be able to close out the job site once it is finished. The delete button at the bottom each card will allow the user to be able to delete or (close out) a job site.
Acceptance Criteria
This is the wireframe of the new job site card with edit and delete on it.
Dependecies
28 API calls must be created and tested
29 Wouldn't hurt to get the create and edit work.
Dev Notes
import React from 'react'; import PropTypes from 'prop-types'; import Button from 'react-bootstrap/Button'; import Card from 'react-bootstrap/Card'; import Link from 'next/link'; import { deleteEquipment } from '../api/equipData';
function EquipmentCard({ equipmentObj, onUpdate }) { // FOR DELETE, WE NEED TO REMOVE THE EQUIPMENT AND HAVE THE VIEW RERENDER, // SO WE PASS THE FUNCTION FROM THE PARENT THAT GETS THE Equipment const deleteThisEquipment = () => { if (window.confirm(
Delete ${equipmentObj.name}?
)) { deleteEquipment(equipmentObj.firebaseKey).then(() => onUpdate()); } }; return ( <Card style={{ width: '16rem', margin: '10px' }}> <Card.Img variant="top" src={equipmentObj.image} style={{ height: '200px', objectFit: 'cover' }} />