Skip to content

Instantly share code, notes, and snippets.

@w33ble
Created September 6, 2019 03:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save w33ble/c581bd7b6c93deebbc5e0f5d6059a28e to your computer and use it in GitHub Desktop.
Save w33ble/c581bd7b6c93deebbc5e0f5d6059a28e to your computer and use it in GitHub Desktop.
i can haz type?
import { createElement, Attributes, ComponentType } from 'react';
import PropTypes from 'prop-types';
import { graphql } from '@apollo/react-hoc';
import { GraphQLRequest } from 'apollo-boost';
interface Config {
name: string;
}
interface Props {
mutate: (data: any) => Promise<any>;
}
export default function withMutation(gql: GraphQLRequest, config: Config = { name: 'mutate' }) {
const { name, ...graphConfig } = config;
return (Component: ComponentType<any>) => {
const componentName = Component.displayName || Component.name || 'Component';
function QueryWrapper(props: Props): ComponentType {
const { mutate, ...restProps } = props;
// Error [1]
return createElement<Attributes>(Component, {
...restProps,
[name]: mutate,
});
}
QueryWrapper.displayName = `withMutation(${componentName})`;
QueryWrapper.propTypes = {
mutate: PropTypes.func.isRequired,
};
// Error [2]
return graphql(gql, graphConfig)(QueryWrapper);
};
}
/*
[1] Type 'ReactElement<Attributes, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>' is not assignable to type 'ComponentType<{}>'.
Type 'ReactElement<Attributes, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>' is not assignable to type 'FunctionComponent<{}>'.
Type 'ReactElement<Attributes, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)>' provides no match for the signature '(props: { children?: ReactNode; }, context?: any): ReactElement<any, string | ((props: any) => ReactElement<any, string | ... | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<...>)> | null'.ts(2322)
[2] Argument of type '{ (props: Props): ComponentType<{}>; displayName: string; propTypes: { mutate: Validator<(...args: any[]) => any>; }; }' is not assignable to parameter of type 'ComponentType<Partial<DataProps<{}, {}>> & Partial<MutateProps<{}, {}>>>'.
Type '{ (props: Props): ComponentType<{}>; displayName: string; propTypes: { mutate: Validator<(...args: any[]) => any>; }; }' is not assignable to type 'FunctionComponent<Partial<DataProps<{}, {}>> & Partial<MutateProps<{}, {}>>>'.
Types of parameters 'props' and 'props' are incompatible.
Type 'PropsWithChildren<Partial<DataProps<{}, {}>> & Partial<MutateProps<{}, {}>>>' is not assignable to type 'Props'.
Types of property 'mutate' are incompatible.
Type 'MutationFunction<{}, {}> | undefined' is not assignable to type '(data: any) => Promise<any>'.
Type 'undefined' is not assignable to type '(data: any) => Promise<any>'.ts(2345)
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment