import * as React from "react" ; import LoadAction from "../../../classes/status/LoadAction" ; import StatusActionQueue from "../../../classes/status/StatusActionQueue" ; export default class LoadingQueue extends React . Component < { loadingQueue : StatusActionQueue < LoadAction > ; } , any > { public render ( ) { const queue = this . props . loadingQueue ; const elements = [ ] ; for ( const queueElement of queue ) { if ( queueElement . hasStatus ( ) ) { elements . push ( < li key = { queueElement . key } > < span className = "status-description" > { queueElement . description } < /span> < span className = "status-percent" > { queueElement . percent } % < /span> < span className = "status-absolute" > { queueElement . current } of { queueElement . max } < /span> < /li>); } else { elements . push ( < li key = { queueElement . key } > { queueElement . description } < /li>); } } return < ul className = "events" > { elements } < /ul>; } }