3 ms·
Yes, it's really important to have the frontend types generated directly from what the backend generated graphql schema specifies. We shouldn't have to type an
by crucialfelix 9y ago
Yes, it's really important to have the frontend types generated directly from what the backend generated graphql schema specifies. We shouldn't have to type anything at all.
I wrote an article about using apollo-codegen to generate all the Typescript types:
https://medium.com/@crucialfelix/bridging-the-server-client-gap-graphql-typescript-and-apollo-codegen-e5b54fa96ae2 https://medium.com/@crucialfelix/bridging-the-server-client-...
It's still a few steps too many, but it's getting there.
I'm about to write up the second article which deals with mutations. This lets me import only one type:
import { SetAptListOnWebProps } from "../mutations";
and then this.props.mutate is fully typed:
(property) mutate: (options: MutationOptions<{
apt: string;
listOnWeb: boolean;
}, {
setAptListOnWeb: {
apt: {
id: string;
listOnWeb: boolean;
__typename: "Apt";
};
__typename: "SetAptListOnWebPayload";
};
}>) => Promise<{
data: {
setAptListOnWeb: {
apt: {
id: string;
listOnWeb: boolean;
__typename: "Apt";
};
__typename: "SetAptListOnWebPayload";
};
};
errors?: GraphQLError[];
loading: boolean;
networkStatus: NetworkStatus;
stale: boolean;
}>
First type argument is the mutation input variables, the optional second is the shape of the optimistic response.