In progress update job mutation. Unknown how to have this use an input object.

This commit is contained in:
Patrick Fic
2019-12-12 22:06:35 -08:00
parent 9d74cc19c9
commit 36e8449383
6 changed files with 24 additions and 10 deletions

View File

@@ -1,9 +1,12 @@
import React, { useState } from "react"; import React, { useState } from "react";
import AlertComponent from "../alert/alert.component"; import AlertComponent from "../alert/alert.component";
import { Form, Input, Row, Col, Button } from "antd"; import { Form, Input, Row, Col, Button } from "antd";
import { UPDATE_JOB } from "../../graphql/jobs.queries";
import { useMutation } from "@apollo/react-hooks";
function JobTombstone({ job, ...otherProps }) { function JobTombstone({ job, ...otherProps }) {
const [jobContext, setJobContext] = useState(job); const [jobContext, setJobContext] = useState(job);
const [mutationUpdateJob] = useMutation(UPDATE_JOB);
if (!job) { if (!job) {
return ( return (
@@ -20,6 +23,10 @@ function JobTombstone({ job, ...otherProps }) {
otherProps.form.validateFieldsAndScroll((err, values) => { otherProps.form.validateFieldsAndScroll((err, values) => {
if (!err) { if (!err) {
console.log("Received values of form: ", values); console.log("Received values of form: ", values);
mutationUpdateJob({
variables: { jobId: jobContext.id, job: JSON.stringify(values) }
}).then(r => console.log("result", r));
} }
}); });
}; };
@@ -27,10 +34,8 @@ function JobTombstone({ job, ...otherProps }) {
const handleChange = event => { const handleChange = event => {
const { name, value } = event.target; const { name, value } = event.target;
setJobContext({ ...jobContext, [name]: value }); setJobContext({ ...jobContext, [name]: value });
console.log("jobContext", jobContext);
}; };
console.log("#DEBUG", job);
const { getFieldDecorator } = otherProps.form; const { getFieldDecorator } = otherProps.form;
return ( return (
<Form onSubmit={handleSubmit}> <Form onSubmit={handleSubmit}>

View File

@@ -3,6 +3,7 @@ import { useQuery } from "react-apollo";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import { GET_CURRENT_USER } from "../../graphql/local.queries"; import { GET_CURRENT_USER } from "../../graphql/local.queries";
import { Icon } from "antd"; import { Icon } from "antd";
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
export default function ManageSignInButton() { export default function ManageSignInButton() {
const { const {
@@ -11,9 +12,9 @@ export default function ManageSignInButton() {
data: { currentUser } data: { currentUser }
} = useQuery(GET_CURRENT_USER); } = useQuery(GET_CURRENT_USER);
if (loading) return "MSI Loading"; if (loading) return <LoadingSpinner />;
if (error) return error.message; if (error) return error.message;
console.log("currentUser", currentUser);
return currentUser ? ( return currentUser ? (
<div> <div>
{" "} {" "}

View File

@@ -9,9 +9,9 @@ export default class SignOut extends Component {
signOut = async () => { signOut = async () => {
try { try {
await firebase.auth().signOut(); await firebase.auth().signOut();
this.setState({ // this.setState({
redirect: true // redirect: true
}); // });
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }

View File

@@ -103,3 +103,13 @@ export const GET_JOB_BY_PK = gql`
} }
} }
`; `;
export const UPDATE_JOB = gql`
mutation UPDATE_JOB($jobId: uuid!, $job: json!) {
update_jobs(where: { id: { _eq: $jobId } }, _set: $job) {
returning {
id
}
}
}
`;

View File

@@ -15,10 +15,8 @@ function JobsDetailPage({ match }) {
if (loading) return <SpinComponent />; if (loading) return <SpinComponent />;
if (error) return <AlertComponent message={error.message} type="error" />; if (error) return <AlertComponent message={error.message} type="error" />;
console.log("routes", match);
return ( return (
<div> <div>
<Breadcrumb />
<JobTombstone job={data.jobs_by_pk} /> <JobTombstone job={data.jobs_by_pk} />
</div> </div>
); );

View File

@@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import { Typography } from "antd"; import { Typography } from "antd";
import HeaderContainer from "../../components/header/header.component"; import HeaderContainer from "../../components/header/header.container";
export default function Unauthorized() { export default function Unauthorized() {
return ( return (