import React from 'react';
import { fromUnixTime, formatDistanceToNow } from "date-fns";
import { formatInTimeZone } from 'date-fns-tz';
import superagent from 'superagent';

import * as ApiUtils from '../CloudApi/ApiUtils.js';
import constants, { DEFAULT_TIMEZONE } from '../CloudApi/Constants.js';
import BigShipperWrapper from './BigShipperWrapper.jsx';
import { Table, Statistic, Label, Message } from 'semantic-ui-react'
import BigShipmentsTable from './BigShipmentsTable.jsx';

export default class BigShipmentPickupQueue extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            shipments: []
        };
    }

    async componentDidMount() {
        this.setState({ loading: true });
        const res = await superagent.get(`/api/admin/shipper/shipments?status=WaitingForPickup`);
        console.log(res.body);
        this.setState({ shipments: res.body.items, loading: false });
    }

    render() {
        return (
            <BigShipperWrapper title="Shipments Waiting For Pickup" loading={this.state.loading}>
                <p>{this.state.shipments.length} items waiting for pickup</p>

                {this.state.shipments.length > 0 && <BigShipmentsTable shipments={this.state.shipments} />}
            </BigShipperWrapper>
        );
    }
}
