Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
private _buildOperationFunctionalComponent(node: OperationDefinitionNode, documentVariableName: string, operationType: string, operationResultType: string, operationVariablesTypes: string): string {
const operationName: string = this.convertName(node.name.value);
const propsTypeName: string = this.convertName(operationName + 'Props');
const rendererSignature = toPascalCase(`${operationType}Renderer`) + `<${operationResultType}, ${operationVariablesTypes}>`;
const apolloStencilComponentTag = paramCase(`Apollo${operationType}`);
const componentName = this.convertName(`${operationName}Component`);
const propsVar = `
export type ${propsTypeName} = {
variables ?: ${operationVariablesTypes};
inlist ?: StencilApollo.${rendererSignature};
};
`;
const component = `
export const ${componentName} = (props: ${propsTypeName}, children: [StencilApollo.${rendererSignature}]) => (
<${apolloStencilComponentTag} ${operationType.toLowerCase()}={ ${documentVariableName} } { ...props } renderer={ children[0] } />
);
`;
.map(typeName => {
if (typeName.startsWith("__")) {
return "";
}
const pascalName = toPascalCase(typeName);
const type = allTypes[typeName];
let typeVal = "unknown";
if (isScalarType(type)) {
typeVal = `MockResolve<${tPrefix}Scalars['${typeName}']>;`;
} else if (isInterfaceType(type) || isUnionType(type)) {
typeVal = schema
.getPossibleTypes(type)
.map(t => `TypeMock<${tPrefix}${t.name}>`)
.join(" | ");
} else if (isObjectType(type)) {
typeVal = `TypeMock<${tPrefix}${pascalName}>`;
} else if (isEnumType(type)) {
typeVal = `MockResolve<${tPrefix}${pascalName}>`;
}
return `${typeName}?: ${typeVal}`;
});
private _buildHocProps(operationName: string, operationType: string): string {
const typeVariableName = this._externalImportPrefix + this.convertName(operationName + toPascalCase(operationType) + this._parsedConfig.operationResultSuffix);
const variablesVarName = this._externalImportPrefix + this.convertName(operationName + toPascalCase(operationType) + 'Variables');
const argType = operationType === 'mutation' ? 'MutateProps' : 'DataProps';
this.imports.add(this.getApolloReactCommonImport());
this.imports.add(this.getApolloReactHocImport());
return `ApolloReactHoc.${argType}<${typeVariableName}, ${variablesVarName}>`;
}
private _buildClassComponent(node: OperationDefinitionNode, documentVariableName: string, operationType: string, operationResultType: string, operationVariablesTypes: string): string {
const componentName: string = this.convertName(node.name.value + 'Component');
const apolloStencilComponentTag = paramCase(`Apollo${operationType}`);
const rendererSignature = toPascalCase(`${operationType}Renderer`);
return `
@Component({
tag: '${paramCase(`Apollo${toPascalCase(node.name.value)}`)}'
})
export class ${componentName} {
@Prop() renderer: import('stencil-apollo').${rendererSignature}<${operationResultType}, ${operationVariablesTypes}>;
@Prop() variables: ${operationVariablesTypes};
render() {
return <${apolloStencilComponentTag} ${operationType.toLowerCase()}={ ${documentVariableName} } variables={ this.variables } renderer={ this.renderer } />;
}
}
`;
}
private _buildHocProps(operationName: string, operationType: string): string {
const typeVariableName = this._externalImportPrefix + this.convertName(operationName + toPascalCase(operationType) + this._parsedConfig.operationResultSuffix);
const variablesVarName = this._externalImportPrefix + this.convertName(operationName + toPascalCase(operationType) + 'Variables');
const argType = operationType === 'mutation' ? 'MutateProps' : 'DataProps';
this.imports.add(this.getApolloReactCommonImport());
this.imports.add(this.getApolloReactHocImport());
return `ApolloReactHoc.${argType}<${typeVariableName}, ${variablesVarName}>`;
}
}
this._collectedOperations.push(node);
const documentVariableName = this.convertName(node, {
suffix: this.config.documentVariableSuffix,
prefix: this.config.documentVariablePrefix,
useTypesPrefix: false,
});
let documentString = '';
if (this.config.documentMode !== DocumentMode.external) {
documentString = `${this.config.noExport ? '' : 'export'} const ${documentVariableName}${this.config.documentMode === DocumentMode.documentNode ? ': DocumentNode' : ''} = ${this._gql(node)};`;
}
const operationType: string = toPascalCase(node.operation);
const operationTypeSuffix: string = this.config.dedupeOperationSuffix && node.name.value.toLowerCase().endsWith(node.operation) ? '' : operationType;
const operationResultType: string = this.convertName(node, {
suffix: operationTypeSuffix + this._parsedConfig.operationResultSuffix,
});
const operationVariablesTypes: string = this.convertName(node, {
suffix: operationTypeSuffix + 'Variables',
});
const additional = this.buildOperation(node, documentVariableName, operationType, operationResultType, operationVariablesTypes);
return [documentString, additional].filter(a => a).join('\n');
}
}
private _buildClassComponent(node: OperationDefinitionNode, documentVariableName: string, operationType: string, operationResultType: string, operationVariablesTypes: string): string {
const componentName: string = this.convertName(node.name.value + 'Component');
const apolloStencilComponentTag = paramCase(`Apollo${operationType}`);
const rendererSignature = toPascalCase(`${operationType}Renderer`);
return `
@Component({
tag: '${paramCase(`Apollo${toPascalCase(node.name.value)}`)}'
})
export class ${componentName} {
@Prop() renderer: import('stencil-apollo').${rendererSignature}<${operationResultType}, ${operationVariablesTypes}>;
@Prop() variables: ${operationVariablesTypes};
render() {
return <${apolloStencilComponentTag} ${operationType.toLowerCase()}={ ${documentVariableName} } variables={ this.variables } renderer={ this.renderer } />;
}
}
`;
}