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 (
@@ -59,10 +73,7 @@ const PdfForm = ({ onSubmit, defaultValues = {} }) => { { - const parsed = parseInt(e.target.value, 10); - isNaN(parsed) ? setYear(year) : setYear(parsed); - }} + onChange={onYearChange} name="year" type="number" min={1900} @@ -87,12 +98,7 @@ const PdfForm = ({ onSubmit, defaultValues = {} }) => { min={1} value={currentPage} name="currentPage" - onChange={(e) => { - const parsed = parseInt(e.target.value, 10); - isNaN(parsed) - ? setCurrentPage(currentPage) - : setCurrentPage(parsed); - }} + onChange={onCurrentPageChange} />
@@ -106,7 +112,7 @@ const PdfForm = ({ onSubmit, defaultValues = {} }) => { /> - +
); }; 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 ( + <> + + {updated} + {updatePdfLoading && 'Loading...'} + {updateError} + + ); }; +EditPdf.propTypes = { uuid: string.isRequired }; + export default EditPdf; diff --git a/src/containers/ListPdfs.js b/src/containers/ListPdfs.js index 79e8fdb..5d0118e 100644 --- a/src/containers/ListPdfs.js +++ b/src/containers/ListPdfs.js @@ -7,7 +7,7 @@ import OrgLink from '../components/OrgLink'; const LIST_PDFS_QUERY = gql` query pdfs { - pdfs(limitToCurrentUser: false) { + pdfs(limit: 9999, limitToCurrentUser: false) { organization { name uuid diff --git a/src/containers/ManagePdfs.js b/src/containers/ManagePdfs.js index 34848d1..6ac838a 100644 --- a/src/containers/ManagePdfs.js +++ b/src/containers/ManagePdfs.js @@ -8,19 +8,19 @@ import ListPdfs from './ListPdfs'; const ADD_PDF = gql` mutation addPdf($input: PdfInput!) { - addPdf(input: $input) { + upsertPdf(input: $input) { uuid } } `; const ADD_PDF_OPTS = { - update(cache, { data: { addPdf } }) { + update(cache, { data: { upsertPdf } }) { cache.modify({ fields: { pdfs(existingPdfs = []) { const newPdfRef = cache.writeFragment({ - data: addPdf, + data: upsertPdf, fragment: gql` fragment NewPdf on Pdf { id @@ -53,7 +53,7 @@ const ManagePdfs = () => { ); } const error = addPdfError &&

{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 ( - +