Files
bodyshop/client/src/components/job-totals-table/job-totals-table.container.jsx

40 lines
1.3 KiB
JavaScript

import { useQuery } from "@apollo/react-hooks";
import React, { useEffect, useState } from "react";
import { QUERY_JOB_FINANCIALS } from "../../graphql/jobs.queries";
import AlertComponent from "../alert/alert.component";
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
import JobTotalsTableComponent from "./job-totals-table.component";
import { CalculateJob } from "./job-totals.utility";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop
});
export function JobTotalsTableContainer({ jobId, bodyshop }) {
const { loading, error, data } = useQuery(QUERY_JOB_FINANCIALS, {
variables: { jobId: jobId }
});
const [totals, setTotals] = useState(null);
useEffect(() => {
if (!!data) {
setTotals(CalculateJob(data.jobs_by_pk, bodyshop.shoprates));
}
}, [data, setTotals, bodyshop.shoprates]);
if (loading) return <LoadingSpinner />;
if (error) return <AlertComponent message={error.message} type='error' />;
return (
<div>
<JobTotalsTableComponent totals={totals} />
</div>
);
}
export default connect(mapStateToProps, null)(JobTotalsTableContainer);