Предыстория: я создаю приложение Shopify, используя React, NextJS и GraphQL. Функциональность заключается в добавлении дополнительного privateMetafield со значением для каждого выбранного продукта.
Проблема: я пытаюсь создать или обновить (если существует privateMetafield) с помощью Mutation с помощью React-Apollo. Я попытался запустить мутацию GraphQL в Insomnia (например, почтальон для GraphQL), и она работает. Но когда я добавляю его в свой код, я не получаю GraphQL для получения данных мутации. Вместо этого я получаю это сообщение об ошибке:
Unhandled Runtime Error
Error: GraphQL error: Variable $input of type PrivateMetafieldInput! was provided invalid value for privateMetafields (Field is not defined on PrivateMetafieldInput), namespace (Expected value to not be null), key (Expected value to not be null), valueInput (Expected value to not be null)
Insomnia Успешный тест GraphQL (каким он должен быть)
edit-products.js
...
import gql from 'graphql-tag';
import { Mutation } from 'react-apollo';
...
const UPDATE_EMISSION = gql`
mutation($input: PrivateMetafieldInput!) {
privateMetafieldUpsert(input: $input) {
privateMetafield {
namespace
key
value
}
}
}
`;
...
class EditEmission extends React.Component {
state = {
emission: '',
id: '',
showToast: false,
};
render() {
const { name, emission, id } = this.state;
return (
<Mutation
mutation={UPDATE_EMISSION}
>
{(handleSubmit, { error, data }) => {
const showError = error && (
<Banner status="critical">{error.message}</Banner>
);
const showToast = data && data.productUpdate && (
<Toast
content="Sucessfully updated"
onDismiss={() => this.setState({ showToast: false })}
/>
);
return (
<Frame>
... <Form>
<TextField
prefix="kg"
value={emission}
onChange={this.handleChange('emission')}
label="Set New Co2 Emission"
type="emission"
/>
...
<PageActions
primaryAction={[
{
content: 'Save',
onAction: () => {
const item = store.get('item');
const id = item.id;
const emissionVariableInput = {
owner: id,
privateMetafields: [
{
namespace: "Emission Co2",
key: "Co2",
valueInput: {
value: emission,
valueType: "INTEGER"
}
}
]
};
console.log(emissionVariableInput)
handleSubmit({
variables: { input: emissionVariableInput },
});
}
}
]}
secondaryActions={[
{
content: 'Remove emission'
}
]}
/>
</Form>
...
</Mutation>
);
}
handleChange = (field) => {
return (value) => this.setState({ [field]: value });
};
}
export default EditEmission;
Я получаю это в консоли, когда регистрирую selectionVariableInput, что выглядит правильно. Но почему данные не передаются должным образом в мутацию GraphQL и как это исправить?
Я ожидаю, что мутация GraphQL будет успешной, и создаю / обновляю privateMetafield, принадлежащий продукту.
Заранее спасибо!