Drone Market ReactJS Deployment Plans

06_Request_Status_Detail

Component Structure

App
│───Header
└───Content
   └───Breadcrumb
   └───StatusDetail
      └───StatusDetailHeader
      └───StatusDetailInfo
      └───StatusDetailMap
         └───StatusDetailMapRoute
            └───DroneRoutes
            └───DroneLocationsLegends
            └───DroneLocationsETA
         └───StatusDetailFrontCamera
         └───StatusDetailBackCamera
   └───MissionGallery
└───Footer

PropTypes

-- StatusDetailInfo.jsx --
StatusDetailInfo.propTypes = {
  timeoflaunch: PropTypes.date.isRequired,
  timecompleted: PropTypes.date.isRequired,
  speed: PropTypes.number.isRequired,
  distance: PropTypes.number.isRequired,
  name: PropTypes.string.isRequired,
};

-- StatusDetailMapRoute.jsx --
StatusDetailMapRoute.propTypes = {
  routes: PropTypes.string.isRequired,
  dronelocation: PropTypes.string.isRequired,
  eta: PropTypes.string.isRequired,
};