diff --git a/src/components/PdfForm.js b/src/components/PdfForm.js index 790c189..7343d26 100644 --- a/src/components/PdfForm.js +++ b/src/components/PdfForm.js @@ -5,18 +5,29 @@ import { bool, func, number, shape, string } from 'prop-types'; import OrganizationSelector from '../containers/OrganizationSelector'; import UserSelector from '../containers/UserSelector'; +const onNumericChange = (currentValue, setter) => (e) => { + const parsed = parseInt(e.target.value, 10); + isNaN(parsed) ? setter(currentValue) : setter(parsed); +}; + const PdfForm = ({ onSubmit, defaultValues = {} }) => { const [organizationNameMatch, setOrganizationNameMatch] = useState( - defaultValues.organization && defaultValues.organization.name + defaultValues.organization && { + label: defaultValues.organization.name, + value: defaultValues.organization.uuid, + } ); const [organization, setOrganization] = useState( defaultValues.organization && defaultValues.organization.uuid ); const [userNameMatch, setUserNameMatch] = useState( - defaultValues.user && defaultValues.user.uuid + defaultValues.user && { + label: defaultValues.user.name, + value: defaultValues.user.uuid, + } ); const [user, setUser] = useState( - defaultValues.user && defaultValues.user.name + defaultValues.user && defaultValues.user.uuid ); const [year, setYear] = useState(defaultValues.year); const [url, setUrl] = useState(defaultValues.url); @@ -35,6 +46,9 @@ const PdfForm = ({ onSubmit, defaultValues = {} }) => { }); }; + const onYearChange = onNumericChange(year, setYear); + const onCurrentPageChange = onNumericChange(currentPage, setCurrentPage); + return (
); }; diff --git a/src/containers/EditPdf.js b/src/containers/EditPdf.js index 4effefb..049f601 100644 --- a/src/containers/EditPdf.js +++ b/src/containers/EditPdf.js @@ -1,11 +1,76 @@ import React from 'react'; +import { string } from 'prop-types'; import { useParams } from 'react-router-dom'; +import { gql, useMutation, useQuery } from '@apollo/client'; + +import PdfForm from '../components/PdfForm'; + +const GET_PDF = gql` + query getPdf($uuid: String) { + pdf(uuid: $uuid) { + organization { + name + uuid + } + user { + uuid + name + } + url + uuid + year + done + } + } +`; + +const UPDATE_PDF = gql` + mutation updatePdf($input: PdfInput!) { + upsertPdf(input: $input) { + uuid + } + } +`; + const EditPdf = () => { - const { pdfId } = useParams(); + const { uuid } = useParams(); + + const { loading, error, data } = useQuery(GET_PDF, { + variables: { uuid }, + }); + + const [ + updatePdf, + { loading: updatePdfLoading, error: updatePdfError, data: updatePdfData }, + ] = useMutation(UPDATE_PDF); - return <>{pdfId}>; + if (loading) return <>Loading...>; + + if (error) throw new Error('todo catch these?'); + + const updateError = updatePdfError &&{updatePdfError.message}
; + const updated = updatePdfData &&Updated PDF
; + + const onSubmit = (input) => { + updatePdf({ + variables: { + input: { ...input, uuid }, + }, + }); + }; + + return ( + <> +{addPdfError.message}
; - const created = addPdfData &&Added PDF {addPdfData.addPdf.uuid}
; + const created = addPdfData &&Added PDF {addPdfData.upsertPdf.uuid}
; const onSubmit = (input) => { addPdf({ diff --git a/src/containers/OrganizationSelector.js b/src/containers/OrganizationSelector.js index 5b3ab43..4893a92 100644 --- a/src/containers/OrganizationSelector.js +++ b/src/containers/OrganizationSelector.js @@ -33,12 +33,12 @@ const OrganizationSelector = ({ onOrgSelected, setValue, value }) => { debugger; } - const options = data.organizations.map(({ name, uuid }) => { - return { - label: name, - value: uuid, - }; - }); + const options = data.organizations + ? data.organizations.map(({ name, uuid }) => ({ + label: name, + value: uuid, + })) + : [value]; const handleInputChange = (inputValue) => { setValue(inputValue); @@ -52,6 +52,7 @@ const OrganizationSelector = ({ onOrgSelected, setValue, value }) => { return (