11

I'm using aws-appsync with the apollo-client and when I try to execute a mutation without providing all fields I get a warning like "Missing field x in {...}". Do I really need to provide all (including optional) fields? How can I handle this gracefully?

I wonder if this is the expected behaviour or wether I'm missing something obvious. I don't want to maintain the added complexity of having to pass all optional fields and having those fields stored in the database as null values. I figured since they are just warnings I 'll just ignore them but I found that the updates would be executed in the database, but then the inmemorycache cache would not always update. It would sometimes show the update and other times not.

import {compose, graphql} from "react-apollo";
import gql from "graphql-tag";
import React from "react";

export const EditCard = (props) => {
        const handleSave = () => {
            props.update({
                givenName :'someGivenName',
                //middleName omitted on purpose 
                familyName :'someFamilyName',
            });
        };
    return (
        <>...more stuff here...</>
    );
};

export const card = gql`
    fragment card on Identity{
        givenName
        middleName
        familyName
    }
`;

export const CardsGraphQL = gql`
    query GerCards {
        cards: listIdentitys(filter: {type: {eq: "CARD"}}) {
            items {
                ...card
            }
        }
    }
    ${card}
`;

export const UpdateCardGraphQL = gql`
    mutation UpdateCard($input: UpdateIdentityInput!) {
        updateObject: updateIdentity(input: $input) {
            ...card
        }
    }
    ${card}
`;


export const selectConfig = () => {
    return {
        options: {
            fetchPolicy: 'cache-and-network',
        },
        props: (props) => {
            return {
                cards: props.data.cards ? props.data.cards.items : [],
            };
        },
    };
};

export const updateConfig = (query) => {
    return {
        options: {
            update: (cache, {data: {updateObject}}) => {

                // Read query from cache
                const data = cache.readQuery({query});

                // Add updated object to the cache
                data.cards.items = data.cards.items.map(item => item.id === updateObject.id ? updateObject : item);

                //Overwrite the cache with the new results
                cache.writeQuery({query, data});

            },
        },
        props: (props) => {
            return {
                update: (input) => {
                    props.mutate({
                        variables: {input},
                        optimisticResponse: () => ({
                            updateObject: input,
                        }),
                    });
                },
            };
        },
    };
};

export default compose(
    graphql(CardsGraphQL, selectConfig),
    graphql(UpdateCardGraphQL, updateConfig(CardsGraphQL)))
(EditCard);



For GraphQL this mutation seems to run without problems and the result in the dynamoDB is what I expect:

{ givenName :'someGivenName', familyName :'someFamilyName' }

However the cache is not always updated with the mutation result and the apollo-client shows the warning:

"Missing field middleName in {..."

If I add the middleName field, the warning goes away and the cache updates correctly but the result in the dynamoDB is:

{ givenName :'someGivenName', middleName : null, familyName :'someFamilyName' }

This approach results in additional complexity in my client that I would like to avoid maintaining.

Does anyone else have this problem? How to solve this gracefully?

Any help is appreciated.

0 Answers0