@intrig/plugin-react 0.0.1

package/src/lib/templates/source/controller/method/asyncFunctionHook.template.ts

@@ -0,0 +1,196 @@
+import {
+  camelCase,
+  generatePostfix,
+  pascalCase, ResourceDescriptor, RestData,
+  typescript,
+  Variable
+} from "@intrig/plugin-sdk";
+import * as path from 'path';
+import {InternalGeneratorContext} from "../../../../internal-types.js";
+
+function extractAsyncHookShape(response: string | undefined, requestBody: string | undefined, imports: Set<string>) {
+  if (response) {
+    if (requestBody) {
+      imports.add(`import { BinaryFunctionAsyncHook } from "@intrig/react"`);
+      return `BinaryFunctionAsyncHook<Params, RequestBody, Response>`;
+    } else {
+      imports.add(`import { UnaryFunctionAsyncHook } from "@intrig/react"`);
+      return `UnaryFunctionAsyncHook<Params, Response>`;
+    }
+  } else {
+    if (requestBody) {
+      imports.add(`import { BinaryProduceAsyncHook } from "@intrig/react"`);
+      return `BinaryProduceAsyncHook<Params, RequestBody>`;
+    } else {
+      imports.add(`import { UnaryProduceAsyncHook } from "@intrig/react"`);
+      return `UnaryProduceAsyncHook<Params>`;
+    }
+  }
+}
+
+function extractErrorParams(errorTypes: string[]) {
+  switch (errorTypes.length) {
+    case 0:
+      return `
+      export type _ErrorType = any
+      const errorSchema = z.any()`
+    case 1:
+      return `
+      export type _ErrorType = ${errorTypes[0]}
+      const errorSchema = ${errorTypes[0]}Schema`
+    default:
+      return `
+      export type _ErrorType = ${errorTypes.join(' | ')}
+      const errorSchema = z.union([${errorTypes.map(a => `${a}Schema`).join(', ')}])`
+  }
+}
+
+function extractParamDeconstruction(variables: Variable[], requestBody?: string) {
+  const isParamMandatory = variables?.some(a => a.in === 'path') || false;
+
+  if (requestBody) {
+    if (isParamMandatory) {
+      return {
+        paramExpression: 'data, p',
+        paramType: 'data: RequestBody, params: Params'
+      }
+    } else {
+      return {
+        paramExpression: 'data, p = {}',
+        paramType: 'data: RequestBody, params?: Params'
+      }
+    }
+  } else {
+    if (isParamMandatory) {
+      return {
+        paramExpression: 'p',
+        paramType: 'params: Params'
+      }
+    } else {
+      return {
+        paramExpression: 'p = {}',
+        paramType: 'params?: Params'
+      }
+    }
+  }
+}
+
+
+export async function asyncFunctionHookTemplate(
+  {source,
+    data: {
+      paths,
+      operationId,
+      response,
+      requestUrl,
+      variables,
+      requestBody,
+      contentType,
+      responseType,
+      errorResponses,
+      method
+    }
+  }: ResourceDescriptor<RestData>, ctx: InternalGeneratorContext) {
+  const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? generatePostfix(contentType, responseType) : ''
+  const ts = typescript(path.resolve('src', source, ...paths, camelCase(operationId), `use${pascalCase(operationId)}Async${postfix}.ts`));
+  ctx.getCounter(source)?.inc("Stateless Hooks")
+  const modifiedRequestUrl = `${requestUrl?.replace(/\{/g, "${")}`;
+  const imports = new Set<string>();
+
+  // Basic imports
+  imports.add(`import { z } from 'zod'`);
+  imports.add(`import { useCallback } from 'react'`);
+  imports.add(`import { useTransitionCall, encode, isError, isSuccess } from '@intrig/react'`);
+
+  // Hook signature type
+  const hookShape = extractAsyncHookShape(response, requestBody, imports);
+
+  // Add body/response param imports
+  if (requestBody) {
+    imports.add(`import { ${requestBody} as RequestBody, ${requestBody}Schema as requestBodySchema } from "@intrig/react/${source}/components/schemas/${requestBody}"`);
+  }
+
+  if (response) {
+    imports.add(`import { ${response} as Response, ${response}Schema as schema } from "@intrig/react/${source}/components/schemas/${response}"`);
+  }
+
+  imports.add(`import { ${pascalCase(operationId)}Params as Params } from './${pascalCase(operationId)}.params'`);
+
+  // Error types
+  const errorTypes = [...new Set(Object.values(errorResponses ?? {}).map((a) => a.response))];
+  errorTypes.forEach((ref) => imports.add(`import { ${ref}, ${ref}Schema } from "@intrig/react/${source}/components/schemas/${ref}"`));
+
+  // Error schema block
+  const errorSchemaBlock = extractErrorParams(errorTypes.map((a) => a as string));
+
+  // Param deconstruction
+  const { paramExpression, paramType } = extractParamDeconstruction(variables ?? [], requestBody);
+
+  const paramExplode = [
+    ...(variables?.filter((a) => a.in === 'path').map((a) => a.name) ?? []),
+    '...params',
+  ].join(',');
+
+  const finalRequestBodyBlock = requestBody ? `, data: encode(data, "${contentType}", requestBodySchema)` : '';
+
+  function responseTypePart() {
+    switch (responseType) {
+      case "application/octet-stream":
+        return `responseType: 'blob', adapter: 'fetch',`;
+      case "text/event-stream":
+        return `responseType: 'stream', adapter: 'fetch',`;
+    }
+    return ''
+  }
+
+  return ts`
+${[...imports].join('\n')}
+
+${!response ? `
+type Response = any;
+const schema = z.any();
+` : ''}
+
+${errorSchemaBlock}
+
+const operation = "${method.toUpperCase()} ${requestUrl}| ${contentType} -> ${responseType}";
+const source = "${source}";
+
+function use${pascalCase(operationId)}AsyncHook(): [(${paramType}) => Promise<Response>, () => void] {
+  const [call, abort] = useTransitionCall<Response>({
+    schema,
+    errorSchema
+  });
+
+  const doExecute = useCallback<(${paramType}) => Promise<Response>>(async (${paramExpression}) => {
+    const { ${paramExplode} } = p;
+
+    ${requestBody ? `
+    const validationResult = requestBodySchema.safeParse(data);
+    if (!validationResult.success) {
+      return Promise.reject(validationResult.error);
+    }
+    ` : ''}
+
+    return await call({
+      method: '${method}',
+      url: \`${modifiedRequestUrl}\`,
+      headers: {
+        ${contentType ? `"Content-Type": "${contentType}",` : ''}
+      },
+      params,
+      key: \`${"${source}: ${operation}"}\`,
+      source: '${source}'
+      ${requestBody ? finalRequestBodyBlock : ''},
+      ${(responseTypePart())}
+    });
+  }, [call]);
+
+  return [doExecute, abort];
+}
+
+use${pascalCase(operationId)}AsyncHook.key = \`${"${source}: ${operation}"}\`;
+
+export const use${pascalCase(operationId)}Async: ${hookShape} = use${pascalCase(operationId)}AsyncHook;
+  `;
+}

package/src/lib/templates/source/controller/method/clientIndex.template.ts

@@ -0,0 +1,38 @@
+import {
+  camelCase,
+  generatePostfix,
+  pascalCase,
+  ResourceDescriptor, RestData,
+  typescript
+} from "@intrig/plugin-sdk";
+import * as path from 'path'
+import {InternalGeneratorContext} from "../../../../internal-types.js"
+
+export async function clientIndexTemplate(descriptors: ResourceDescriptor<RestData>[], ctx: InternalGeneratorContext) {
+  const {source, data: {paths, operationId, responseType, contentType}} = descriptors[0]
+
+  ctx.getCounter(source)?.inc("Endpoints");
+
+  const ts = typescript(path.resolve('src', source, ...paths, camelCase(operationId), `client.ts`))
+
+  const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? generatePostfix(contentType, responseType) : ''
+
+  if (descriptors.length === 1) return ts`
+    export { use${pascalCase(operationId)} } from './use${pascalCase(operationId)}${postfix}'
+    export { use${pascalCase(operationId)}Async } from './use${pascalCase(operationId)}Async${postfix}'
+  `
+
+  const exports = descriptors
+    .map(({data: {contentType, responseType}}) => {
+      const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? generatePostfix(contentType, responseType) : ''
+      return `
+      export { use${pascalCase(operationId)} as use${pascalCase(operationId)}${postfix} } from './use${pascalCase(operationId)}${postfix}'
+      export { use${pascalCase(operationId)}Async as use${pascalCase(operationId)}Async${postfix} } from './use${pascalCase(operationId)}Async${postfix}'
+      `
+    })
+    .join('\n');
+
+  return ts`
+    ${exports}
+  `
+}

package/src/lib/templates/source/controller/method/download.template.ts

@@ -0,0 +1,256 @@
+import {
+  camelCase,
+  generatePostfix,
+  pascalCase,
+  ResourceDescriptor, RestData,
+  typescript, Variable
+} from "@intrig/plugin-sdk";
+import * as path from 'path';
+import * as mimeType from 'mime-types'
+import {InternalGeneratorContext} from "../../../../internal-types.js"
+
+function extractHookShapeAndOptionsShape(response: string | undefined, requestBody: string | undefined, imports: Set<string>) {
+  if (response) {
+    if (requestBody) {
+      imports.add(`import { BinaryFunctionHook, BinaryHookOptions } from "@intrig/react"`);
+      return {
+        hookShape: `BinaryFunctionHook<Params, RequestBody, Response>`,
+        optionsShape: `BinaryHookOptions<Params, RequestBody>`
+      };
+    } else {
+      imports.add(`import { UnaryFunctionHook, UnaryHookOptions } from "@intrig/react"`);
+      return {
+        hookShape: `UnaryFunctionHook<Params, Response>`,
+        optionsShape: `UnaryHookOptions<Params>`
+      };
+    }
+  } else {
+    if (requestBody) {
+      imports.add(`import { BinaryProduceHook, BinaryHookOptions } from "@intrig/react"`);
+      return {
+        hookShape: `BinaryProduceHook<Params, RequestBody>`,
+        optionsShape: `BinaryHookOptions<Params, RequestBody>`
+      };
+    } else {
+      imports.add(`import { UnaryProduceHook, UnaryHookOptions } from "@intrig/react"`);
+      return {
+        hookShape: `UnaryProduceHook<Params>`,
+        optionsShape: `UnaryHookOptions<Params>`
+      };
+    }
+  }
+}
+
+function extractParamDeconstruction(variables: Variable[] | undefined, requestBody: string | undefined) {
+  const isParamMandatory = variables?.some(a => a.in === 'path') || false;
+
+  if (requestBody) {
+    if (isParamMandatory) {
+      return {
+        paramExpression: 'data, p',
+        paramType: 'data: RequestBody, params: Params'
+      }
+    } else {
+      return {
+        paramExpression: 'data, p = {}',
+        paramType: 'data: RequestBody, params?: Params'
+      }
+    }
+  } else {
+    if (isParamMandatory) {
+      return {
+        paramExpression: 'p',
+        paramType: 'params: Params'
+      }
+    } else {
+      return {
+        paramExpression: 'p = {}',
+        paramType: 'params?: Params'
+      }
+    }
+  }
+}
+
+function extractErrorParams(errorTypes: string[]) {
+  switch (errorTypes.length) {
+    case 0:
+      return `
+      export type _ErrorType = any
+      const errorSchema = z.any()`
+    case 1:
+      return `
+      export type _ErrorType = ${errorTypes[0]}
+      const errorSchema = ${errorTypes[0]}Schema`
+    default:
+      return `
+      export type _ErrorType = ${errorTypes.join(' | ')}
+      const errorSchema = z.union([${errorTypes.map(a => `${a}Schema`).join(', ')}])`
+  }
+}
+
+
+export async function downloadHookTemplate({source,
+                                                  data: {
+                                                    paths,
+                                                    operationId,
+                                                    response,
+                                                    requestUrl,
+                                                    variables,
+                                                    requestBody,
+                                                    contentType,
+                                                    responseType,
+                                                    errorResponses,
+                                                    method
+                                                  }
+                                                }: ResourceDescriptor<RestData>, ctx: InternalGeneratorContext) {
+  const postfix = ctx.potentiallyConflictingDescriptors.includes(operationId) ? generatePostfix(contentType, responseType) : ''
+  const ts = typescript(path.resolve('src', source, ...paths, camelCase(operationId), `use${pascalCase(operationId)}${postfix}Download.ts`))
+  ctx.getCounter(source)?.inc("Download Hooks")
+
+  const modifiedRequestUrl = `${requestUrl?.replace(/\{/g, "${")}`
+
+  const imports = new Set<string>();
+  imports.add(`import { z } from 'zod'`)
+  imports.add(`import { useCallback, useEffect } from 'react'`)
+  imports.add(`import {useNetworkState, NetworkState, DispatchState, pending, success, error, init, successfulDispatch, validationError, encode, isSuccess, requestValidationError} from "@intrig/react"`)
+
+  const { hookShape, optionsShape } = extractHookShapeAndOptionsShape(response, requestBody, imports);
+
+  const { paramExpression, paramType } = extractParamDeconstruction(variables, requestBody);
+
+  if (requestBody) {
+    imports.add(`import { ${requestBody} as RequestBody, ${requestBody}Schema as requestBodySchema } from "@intrig/react/${source}/components/schemas/${requestBody}"`)
+  }
+
+  if (response) {
+    imports.add(`import { ${response} as Response, ${response}Schema as schema } from "@intrig/react/${source}/components/schemas/${response}"`)
+  }
+
+  imports.add(`import {${pascalCase(operationId)}Params as Params} from './${pascalCase(operationId)}.params'`)
+
+  const errorTypes = [...new Set(Object.values(errorResponses ?? {}).map(a => a.response))]
+  errorTypes.forEach(ref => imports.add(`import {${ref}, ${ref}Schema } from "@intrig/react/${source}/components/schemas/${ref}"`))
+
+  const paramExplode = [
+    ...variables?.filter(a => a.in === "path").map(a => a.name) ?? [],
+    "...params"
+  ].join(",")
+
+  const finalRequestBodyBlock = requestBody ? `,data: encode(data, "${contentType}", requestBodySchema)` : ''
+
+  function responseTypePart() {
+    switch (responseType) {
+      case "application/octet-stream":
+        return `responseType: 'blob', adapter: 'fetch',`;
+      case "text/event-stream":
+        return `responseType: 'stream', adapter: 'fetch',`;
+    }
+    return ''
+  }
+
+  return ts`
+    ${[...imports].join('\n')}
+
+    ${!response ? `
+    type Response = any;
+    const schema = z.any();
+    ` : ''}
+
+    ${extractErrorParams(errorTypes.map(a => a as string))}
+
+    const operation = "${method.toUpperCase()} ${requestUrl}| ${contentType} -> ${responseType}"
+    const source = "${source}"
+
+    function use${pascalCase(operationId)}Hook(options: ${optionsShape} = {}): [NetworkState<Response>, (${paramType}) => DispatchState<any>, () => void] {
+      let [state, dispatch, clear, dispatchState] = useNetworkState<Response>({
+        key: options?.key ?? 'default',
+        operation,
+        source,
+        schema,
+        errorSchema
+      });
+      
+      useEffect(() => {
+        if (isSuccess(state)) {
+          let a = document.createElement('a');
+          const ct =
+            state.headers?.['content-type'] ?? 'application/octet-stream';
+          let data: any = state.data;
+          if (ct.startsWith('application/json')) {
+            let data: any[];
+            if (ct.startsWith('application/json')) {
+              data = [JSON.stringify(state.data, null, 2)];
+            } else {
+              data = [state.data];
+            }
+          }
+          a.href = URL.createObjectURL(new Blob(Array.isArray(data) ? data : [data], {type: ct}));
+          const contentDisposition = state.headers?.['content-disposition'];
+          let filename = '${pascalCase(operationId)}.${mimeType.extension(contentType)}';
+          if (contentDisposition) {
+            const rx = /filename\\*=(?:UTF-8'')?([^;\\r\\n]+)|filename="?([^";\\r\\n]+)"?/i;
+            const m = contentDisposition.match(rx);
+            if (m && m[1]) {
+              filename = decodeURIComponent(m[1].replace(/\\+/g, ' '));
+            } else if (m && m[2]) {
+              filename = decodeURIComponent(m[2].replace(/\\+/g, ' '));
+            }
+          } 
+          a.download = filename;
+          document.body.appendChild(a);
+          a.click();
+          document.body.removeChild(a);
+          dispatchState(init())
+        }
+      }, [state])
+
+      let doExecute = useCallback<(${paramType}) => DispatchState<any>>((${paramExpression}) => {
+        let { ${paramExplode}} = p
+
+          ${requestBody ? `
+          const validationResult = requestBodySchema.safeParse(data);
+          if (!validationResult.success) {
+            dispatchState(error(requestValidationError(validationResult.error)));
+            return validationError(validationResult.error.errors);
+          }
+          ` : ``}
+
+          dispatch({
+            method: '${method}',
+            url: \`${modifiedRequestUrl}\`,
+            headers: {
+              ${contentType ? `"Content-Type": "${contentType}",` : ''}
+            },
+            params,
+            key: \`${"${source}: ${operation}"}\`,
+            source: '${source}'
+            ${requestBody ? finalRequestBodyBlock : ''},
+            ${(responseTypePart())}
+          })
+          return successfulDispatch();
+      }, [dispatch])
+      
+      useEffect(() => {
+        if (options.fetchOnMount) {
+          doExecute(${[requestBody ? `options.body!` : undefined, "options.params!"].filter(a => a).join(",")});
+        }
+
+        return () => {
+          if (options.clearOnUnmount) {
+            clear();
+          }
+        }
+      }, [])
+
+      return [
+        state,
+        doExecute,
+        clear
+      ]
+    }
+
+    use${pascalCase(operationId)}Hook.key = \`${"${source}: ${operation}"}\`
+
+    export const use${pascalCase(operationId)}Download: ${hookShape} = use${pascalCase(operationId)}Hook;
+  `
+}

package/src/lib/templates/source/controller/method/params.template.ts

@@ -0,0 +1,31 @@
+import {
+  camelCase,
+  decodeVariables,
+  pascalCase,
+  ResourceDescriptor,
+  RestData,
+  typescript
+} from "@intrig/plugin-sdk";
+import * as path from "path";
+import {InternalGeneratorContext} from "../../../../internal-types.js";
+
+export async function paramsTemplate({
+                                            source,
+                                            data: {paths, operationId, variables}
+                                          }: ResourceDescriptor<RestData>, ctx: InternalGeneratorContext) {
+  const ts = typescript(path.resolve('src', source, ...paths, camelCase(operationId), `${pascalCase(operationId)}.params.ts`))
+
+  const {variableImports, variableTypes} = decodeVariables(variables ?? [], source, "@intrig/react");
+
+  if (variableTypes.length === 0) return ts`
+  export type ${pascalCase(operationId)}Params = Record<string, any>
+  `
+
+  return ts`
+     ${variableImports}
+
+     export interface ${pascalCase(operationId)}Params extends Record<string, any> {
+      ${variableTypes}
+    }
+  `
+}