Files
bodyshop/client/src/components/production-board-kanban/production-board-kanban.container.jsx

81 lines
2.3 KiB
JavaScript

import { useApolloClient, useQuery, useSubscription } from "@apollo/client";
import _ from "lodash";
import React, { useEffect, useState } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import {
QUERY_EXACT_JOB_IN_PRODUCTION,
QUERY_JOBS_IN_PRODUCTION,
SUBSCRIPTION_JOBS_IN_PRODUCTION,
} from "../../graphql/jobs.queries";
import { QUERY_KANBAN_SETTINGS } from "../../graphql/user.queries";
import {
selectBodyshop,
selectCurrentUser,
} from "../../redux/user/user.selectors";
import ProductionBoardKanbanComponent from "./production-board-kanban.component";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop,
currentUser: selectCurrentUser,
});
export function ProductionBoardKanbanContainer({ bodyshop, currentUser }) {
const { loading, data } = useQuery(QUERY_JOBS_IN_PRODUCTION);
const client = useApolloClient();
const [joblist, setJoblist] = useState([]);
const { data: updatedJobs } = useSubscription(
SUBSCRIPTION_JOBS_IN_PRODUCTION
);
useEffect(() => {
if (!(data && data.jobs)) return;
setJoblist(
data.jobs.map((j) => {
return { id: j.id, updated_at: j.updated_at };
})
);
}, [data]);
useEffect(() => {
if (!updatedJobs || joblist.length === 0) return;
const jobDiff = _.differenceWith(
updatedJobs.jobs,
joblist,
(a, b) => a.id === b.id && a.updated_at === b.updated_at
);
jobDiff.forEach((job) => {
getUpdatedJobData(job.id);
});
setJoblist(updatedJobs);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [updatedJobs]);
const getUpdatedJobData = async (jobId) => {
client.query({
query: QUERY_EXACT_JOB_IN_PRODUCTION,
variables: { id: jobId },
});
};
const { loading: associationSettingsLoading, data: associationSettings } =
useQuery(QUERY_KANBAN_SETTINGS, {
variables: { email: currentUser.email },
});
return (
<ProductionBoardKanbanComponent
loading={loading || associationSettingsLoading}
data={data ? data.jobs : []}
associationSettings={
associationSettings && associationSettings.associations[0]
? associationSettings.associations[0]
: null
}
/>
);
}
export default connect(mapStateToProps, null)(ProductionBoardKanbanContainer);