import React, { useState, useEffect } from 'react';
import superagent from 'superagent';
import { Segment, Form, Button, Icon, Pagination } from 'semantic-ui-react';

import * as ApiUtils from '../CloudApi/ApiUtils.js';
import AnalyticsWrapper from './AnalyticsWrapper.jsx';

const FabricatorAnalytics = (props) => {
    const [report, setReport] = useState(null);
    const [loading, setLoading] = useState(false);

    const runReport = async (url) => {
        setLoading(true);
        try {
            const res = await superagent.get(url).accept('json');
            setReport(res.body);
        } catch (e) {
            console.log(e);
        }
        setLoading(false);
    }

    const runJobsReport = async () => {
        return runReport(`/api/admin/fabricator/jobs/report`);
    }

    const runOrdersReport = async () => {
        return runReport(`/api/admin/shop/orders/report`);
    }

    const runIPDReport = async () => {
        return runReport(`/api/admin/shop/orders/data`);
    }
    const runInventoryReport = async () => {
        return runReport(`/api/admin/inventory/report`);
    }

    return (
        <AnalyticsWrapper title={`Analytics (WIP)`} loading={loading}>    
            <Button onClick={runJobsReport}>Run Jobs Report</Button>
            <Button onClick={runOrdersReport}>Run Orders Report</Button>
            <Button onClick={runIPDReport}>Run Orders IPD Breakdown</Button>
            <Button onClick={runInventoryReport}>Run Inventory Report</Button>

            {report && (
                <pre>
                    {JSON.stringify(report, null, 2)}
                </pre>
            )}
        </AnalyticsWrapper>
    );
}

export default FabricatorAnalytics;
