@intrig/plugin-react 0.0.1 → 0.0.2-2

package/src/lib/templates/packageJson.template.ts

@@ -1,63 +0,0 @@
-import {jsonLiteral} from "@intrig/plugin-sdk";
-import * as path from "path";
-import * as fsx from "fs-extra";
-
-export function packageJsonTemplate() {
-  const packageJson = fsx.readJsonSync(path.resolve('..', '..', 'package.json'));
-  const json = jsonLiteral(path.resolve('package.json'))
-  return json`
-{
-  "name": "@intrig/generated",
-  "version": "d${Date.now()}",
-  "private": true,
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "scripts": {
-    "build": "swc src -d dist --copy-files --strip-leading-paths && tsc --emitDeclarationOnly"
-  },
-  "dependencies": {
-    "axios": "^1.7.7",
-    "date-fns": "^4.1.0",
-    "eventsource-parser": "^3.0.2",
-    "fast-xml-parser": "^4.5.0",
-    "immer": "^10.1.1",
-    "loglevel": "1.8.1",
-    "module-alias": "^2.2.2",
-    "zod": "^3.23.8"
-  },
-  "devDependencies": {
-    "@swc/cli": "^0.7.7",
-    "@swc/core": "^1.12.6",
-    "@types/node": "^24.0.4",
-    "typescript": "${packageJson.devDependencies.typescript ?? packageJson.dependencies.typescript}",
-    "react": "${packageJson.dependencies.react}",
-    "react-dom": "${packageJson.dependencies['react-dom']}"
-  },
-  "peerDependencies": {
-    "react": "^18.0.0 || ^19.0.0",
-    "react-dom": "^18.0.0 || ^19.0.0"
-  },
-  "_moduleAliases": {
-    "@intrig/react": "./src"
-  },
-  "type": "module",
-  "exports": {
-    ".": {
-      "import": "./src/index.js",
-      "require": "./src/index.js",
-      "types": "./src/index.d.ts"
-    },
-    "./*": {
-      "import": "./src/*.js",
-      "require": "./src/*.js",
-      "types": "./src/*.d.ts"
-    } 
-  },
-  "typesVersions": {
-    "*": {
-      "*": ["src/*"]
-    }
-  }
-}
-  `
-}

package/src/lib/templates/provider/__tests__/provider-templates.spec.ts

@@ -1,209 +0,0 @@
-import { reactProviderInterfacesTemplate } from '../interfaces.template';
-import { reactProviderReducerTemplate } from '../reducer.template';
-import { reactProviderAxiosConfigTemplate } from '../axios-config.template';
-import { reactIntrigProviderTemplate } from '../intrig-provider.template';
-import { reactIntrigProviderStubTemplate } from '../intrig-provider-stub.template';
-import { reactStatusTrapTemplate } from '../status-trap.template';
-import { reactProviderHooksTemplate } from '../hooks.template';
-import { reactProviderMainTemplate } from '../main.template';
-import * as ts from 'typescript';
-import * as path from 'path';
-import * as fs from 'fs';
-
-describe('Provider Templates', () => {
-  const mockPath = '/tmp/test-intrig';
-  const mockApisToSync = [
-    { id: 'api1', name: 'API One' },
-    { id: 'api2', name: 'API Two' }
-  ];
-
-  beforeAll(() => {
-    // Create test directory structure
-    if (!fs.existsSync(path.join(mockPath, 'src'))) {
-      fs.mkdirSync(path.join(mockPath, 'src'), { recursive: true });
-    }
-  });
-
-  afterAll(() => {
-    // Clean up test files
-    if (fs.existsSync(mockPath)) {
-      fs.rmSync(mockPath, { recursive: true, force: true });
-    }
-  });
-
-  function validateTypeScriptSyntax(code: string, filename: string): void {
-    const sourceFile = ts.createSourceFile(
-      filename,
-      code,
-      ts.ScriptTarget.Latest,
-      true,
-      ts.ScriptKind.TS
-    );
-
-    const diagnostics = ts.getPreEmitDiagnostics(
-      ts.createProgram([filename], {
-        noEmit: true,
-        skipLibCheck: true,
-        allowJs: false,
-        strict: false,
-      }, {
-        getSourceFile: (fileName) => fileName === filename ? sourceFile : undefined,
-        writeFile: () => { /* no-op for testing */ },
-        getCurrentDirectory: () => '',
-        getDirectories: () => [],
-        fileExists: () => true,
-        readFile: () => '',
-        getCanonicalFileName: (fileName) => fileName,
-        useCaseSensitiveFileNames: () => true,
-        getNewLine: () => '\n',
-      })
-    );
-
-    const syntaxErrors = diagnostics.filter(d => 
-      d.category === ts.DiagnosticCategory.Error &&
-      d.code >= 1000 && d.code < 2000 // Syntax error codes
-    );
-
-    if (syntaxErrors.length > 0) {
-      const errorMessages = syntaxErrors.map(d => 
-        `${d.messageText} (${d.code})`
-      ).join('\n');
-      throw new Error(`TypeScript syntax errors in ${filename}:\n${errorMessages}`);
-    }
-  }
-
-  describe('reactProviderInterfacesTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactProviderInterfacesTemplate(mockPath, mockApisToSync);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export interface DefaultConfigs');
-      expect(result.content).toContain('export interface IntrigProviderProps');
-      
-      validateTypeScriptSyntax(result.content, 'interfaces.ts');
-    });
-
-    it('should include all API configurations in config type', () => {
-      const result = reactProviderInterfacesTemplate(mockPath, mockApisToSync);
-      expect(result.content).toContain('api1?: DefaultConfigs');
-      expect(result.content).toContain('api2?: DefaultConfigs');
-    });
-  });
-
-  describe('reactProviderReducerTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactProviderReducerTemplate(mockPath);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export function requestReducer');
-      expect(result.content).toContain('function inferNetworkReason');
-      expect(result.content).toContain('function debounce');
-      
-      validateTypeScriptSyntax(result.content, 'reducer.ts');
-    });
-  });
-
-  describe('reactProviderAxiosConfigTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactProviderAxiosConfigTemplate(mockPath, mockApisToSync);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export function createAxiosInstance');
-      expect(result.content).toContain('export function createAxiosInstances');
-      
-      validateTypeScriptSyntax(result.content, 'axios-config.ts');
-    });
-
-    it('should include axios instances for all APIs', () => {
-      const result = reactProviderAxiosConfigTemplate(mockPath, mockApisToSync);
-      expect(result.content).toContain('api1: createAxiosInstance');
-      expect(result.content).toContain('api2: createAxiosInstance');
-    });
-  });
-
-  describe('reactIntrigProviderTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactIntrigProviderTemplate(mockPath, mockApisToSync);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export function IntrigProvider');
-      
-      validateTypeScriptSyntax(result.content, 'intrig-provider.tsx');
-    });
-  });
-
-  describe('reactIntrigProviderStubTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactIntrigProviderStubTemplate(mockPath, mockApisToSync);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export function IntrigProviderStub');
-      
-      validateTypeScriptSyntax(result.content, 'intrig-provider-stub.tsx');
-    });
-  });
-
-  describe('reactStatusTrapTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactStatusTrapTemplate(mockPath, mockApisToSync);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export function StatusTrap');
-      
-      validateTypeScriptSyntax(result.content, 'status-trap.tsx');
-    });
-  });
-
-  describe('reactProviderHooksTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactProviderHooksTemplate(mockPath);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export function useNetworkState');
-      expect(result.content).toContain('export function useTransitionCall');
-      expect(result.content).toContain('export function useCentralError');
-      expect(result.content).toContain('export function useCentralPendingState');
-      
-      validateTypeScriptSyntax(result.content, 'provider-hooks.ts');
-    });
-  });
-
-  describe('reactProviderMainTemplate', () => {
-    it('should generate syntactically valid TypeScript code', () => {
-      const result = reactProviderMainTemplate(mockPath, mockApisToSync);
-      expect(result).toBeDefined();
-      expect(result.content).toContain('export * from \'./interfaces\'');
-      expect(result.content).toContain('export * from \'./reducer\'');
-      expect(result.content).toContain('export * from \'./axios-config\'');
-      expect(result.content).toContain('export * from \'./intrig-provider\'');
-            expect(result.content).toContain('export * from \'./intrig-provider-stub\'');
-            expect(result.content).toContain('export * from \'./status-trap\'');
-      expect(result.content).toContain('export * from \'./provider-hooks\'');
-      
-      validateTypeScriptSyntax(result.content, 'intrig-provider.tsx');
-    });
-  });
-
-  describe('Generated files integration', () => {
-    it('should generate all files and maintain consistent exports', () => {
-      const interfaces = reactProviderInterfacesTemplate(mockPath, mockApisToSync);
-      const reducer = reactProviderReducerTemplate(mockPath);
-      const axiosConfig = reactProviderAxiosConfigTemplate(mockPath, mockApisToSync);
-      const provider = reactIntrigProviderTemplate(mockPath, mockApisToSync);
-            const providerStub = reactIntrigProviderStubTemplate(mockPath, mockApisToSync);
-            const statusTrap = reactStatusTrapTemplate(mockPath, mockApisToSync);
-      const hooks = reactProviderHooksTemplate(mockPath);
-      const main = reactProviderMainTemplate(mockPath, mockApisToSync);
-
-      // Verify all templates generate valid content
-      expect(interfaces.content).toBeTruthy();
-      expect(reducer.content).toBeTruthy();
-      expect(axiosConfig.content).toBeTruthy();
-      expect(provider.content).toBeTruthy();
-            expect(providerStub.content).toBeTruthy();
-            expect(statusTrap.content).toBeTruthy();
-      expect(hooks.content).toBeTruthy();
-      expect(main.content).toBeTruthy();
-
-      // Verify main template re-exports all modules
-      expect(main.content).toContain('IntrigProvider');
-      expect(main.content).toContain('useNetworkState');
-      expect(main.content).toContain('requestReducer');
-      expect(main.content).toContain('createAxiosInstance');
-      expect(main.content).toContain('DefaultConfigs');
-    });
-  });
-});

package/src/lib/templates/provider/axios-config.template.ts

@@ -1,49 +0,0 @@
-import {IntrigSourceConfig, typescript} from "@intrig/plugin-sdk";
-import * as path from 'path'
-
-export function providerAxiosConfigTemplate(apisToSync: IntrigSourceConfig[]) {
-  const axiosConfigs = apisToSync.map(a => `
-  ${a.id}: createAxiosInstance(configs.defaults, configs['${a.id}']),
-  `).join("\n");
-
-  const ts = typescript(path.resolve("src", "axios-config.ts"))
-  return ts`import axios, {
-  Axios,
-  AxiosResponse,
-  InternalAxiosRequestConfig,
-} from 'axios';
-import { DefaultConfigs } from './interfaces';
-
-export function createAxiosInstance(
-  defaultConfig?: DefaultConfigs,
-  config?: DefaultConfigs,
-) {
-  const axiosInstance = axios.create({
-    ...(defaultConfig ?? {}),
-    ...(config ?? {}),
-  });
-  
-  async function requestInterceptor(cfg: InternalAxiosRequestConfig) {
-    const intermediate = (await defaultConfig?.requestInterceptor?.(cfg)) ?? cfg;
-    return config?.requestInterceptor?.(intermediate) ?? intermediate;
-  }
-
-  async function responseInterceptor(cfg: AxiosResponse<any>) {
-    const intermediate = (await defaultConfig?.responseInterceptor?.(cfg)) ?? cfg;
-    return config?.responseInterceptor?.(intermediate) ?? intermediate;
-  }
-
-  axiosInstance.interceptors.request.use(requestInterceptor);
-  axiosInstance.interceptors.response.use(responseInterceptor, (error) => {
-    return Promise.reject(error);
-  });
-  return axiosInstance;
-}
-
-export function createAxiosInstances(configs: any): Record<string, Axios> {
-  return {
-    ${axiosConfigs}
-  };
-}
-  `
-}

package/src/lib/templates/provider/hooks.template.ts

@@ -1,240 +0,0 @@
-import {typescript} from "@intrig/plugin-sdk";
-import * as path from 'path'
-
-export function providerHooksTemplate() {
-  const ts = typescript(path.resolve("src", "provider-hooks.ts"))
-  return ts`import React, {
-  useCallback,
-  useContext,
-  useMemo,
-  useState,
-  useRef,
-} from 'react';
-import {
-  ErrorState,
-  ErrorWithContext,
-  isSuccess,
-  isError,
-  isPending,
-  NetworkState,
-  pending,
-  Progress,
-  init,
-} from './network-state';
-import {
-  AxiosProgressEvent,
-} from 'axios';
-import { ZodSchema } from 'zod';
-import logger from './logger';
-
-import { Context, RequestType, SchemaOf } from './intrig-context';
-import { NetworkStateProps } from './interfaces';
-import { debounce } from './reducer';
-
-/**
- * useNetworkState is a custom hook that manages the network state within the specified context.
- * It handles making network requests, dispatching appropriate states based on the request lifecycle,
- * and allows aborting ongoing requests.
- */
-export function useNetworkState<T>({
-  key,
-  operation,
-  source,
-  schema,
-  errorSchema,
-  debounceDelay: requestDebounceDelay,
-}: NetworkStateProps<T>): [
-  NetworkState<T>,
-  (request: RequestType) => void,
-  () => void,
-  (state: NetworkState<T>) => void,
-] {
-  const context = useContext(Context);
-
-  const [abortController, setAbortController] = useState<AbortController>();
-
-  const networkState = useMemo(() => {
-    logger.info(${"`Updating status ${key} ${operation} ${source}`"});
-    logger.debug("<=", context.state?.[${"`${source}:${operation}:${key}`"}])
-    return (
-      (context.state?.[${"`${source}:${operation}:${key}`"}] as NetworkState<T>) ??
-      init()
-    );
-  }, [JSON.stringify(context.state?.[${"`${source}:${operation}:${key}`"}])]);
-
-  const dispatch = useCallback(
-    (state: NetworkState<T>) => {
-      context.dispatch({ key, operation, source, state });
-    },
-    [key, operation, source, context.dispatch],
-  );
-
-  const debounceDelay = useMemo(() => {
-    return (
-      requestDebounceDelay ?? context.configs?.[source as keyof (typeof context)['configs']]?.debounceDelay ?? 0
-    );
-  }, [context.configs, requestDebounceDelay, source]);
-
-  const execute = useCallback(
-    async (request: RequestType) => {
-      logger.info(${"`Executing request ${key} ${operation} ${source}`"});
-      logger.debug("=>", request)
-
-      const abortController = new AbortController();
-      setAbortController(abortController);
-
-      const requestConfig: RequestType = {
-        ...request,
-        onUploadProgress(event: AxiosProgressEvent) {
-          dispatch(
-            pending({
-              type: 'upload',
-              loaded: event.loaded,
-              total: event.total,
-            }),
-          );
-          request.onUploadProgress?.(event);
-        },
-        onDownloadProgress(event: AxiosProgressEvent) {
-          dispatch(
-            pending({
-              type: 'download',
-              loaded: event.loaded,
-              total: event.total,
-            }),
-          );
-          request.onDownloadProgress?.(event);
-        },
-        signal: abortController.signal,
-      };
-
-      await context.execute(
-        requestConfig,
-        dispatch,
-        schema,
-        errorSchema as any,
-      );
-    },
-    [networkState, context.dispatch],
-  );
-
-  const deboundedExecute = useMemo(
-    () => debounce(execute, debounceDelay ?? 0),
-    [execute],
-  );
-
-  const clear = useCallback(() => {
-    logger.info(${"`Clearing request ${key} ${operation} ${source}`"});
-    dispatch(init());
-    setAbortController((abortController) => {
-      logger.info(${"`Aborting request ${key} ${operation} ${source}`"});
-      abortController?.abort();
-      return undefined;
-    });
-  }, [dispatch, abortController]);
-
-  return [networkState, deboundedExecute, clear, dispatch];
-}
-
-/**
- * A hook for making transient calls that can be aborted and validated against schemas.
- */
-export function useTransitionCall<T>({
-  schema,
-  errorSchema,
-}: {
-  schema?: SchemaOf<T>;
-  errorSchema?: SchemaOf<T>;
-}): [(request: RequestType) => Promise<T>, () => void] {
-  const ctx = useContext(Context);
-  const controller = useRef<AbortController | undefined>(undefined);
-
-  const call = useCallback(
-    async (request: RequestType) => {
-      controller.current?.abort();
-      const abort = new AbortController();
-      controller.current = abort;
-
-      return new Promise<T>((resolve, reject) => {
-        ctx.execute(
-          { ...request, signal: abort.signal },
-          (state) => {
-            if (isSuccess(state)) {
-              resolve(state.data as T);
-            } else if (isError(state)) {
-              reject(state.error);
-            }
-          },
-          schema,
-          errorSchema,
-        );
-      });
-    },
-    [ctx, schema, errorSchema],
-  );
-
-  const abort = useCallback(() => {
-    controller.current?.abort();
-  }, []);
-
-  return [call, abort];
-}
-
-/**
- * Handles central error extraction from the provided context.
- * It filters the state to retain error states and maps them to a structured error object with additional context information.
- * @return {Object[]} An array of objects representing the error states with context information such as source, operation, and key.
- */
-export function useCentralError() {
-  const ctx = useContext(Context);
-
-  return useMemo(() => {
-    return Object.entries(ctx.filteredState as Record<string, NetworkState>)
-      .filter(([, state]) => isError(state))
-      .map(([k, state]) => {
-        const [source, operation, key] = k.split(':');
-        return {
-          ...(state as ErrorState<unknown>),
-          source,
-          operation,
-          key,
-        } satisfies ErrorWithContext;
-      });
-  }, [ctx.filteredState]);
-}
-
-/**
- * Uses central pending state handling by aggregating pending states from context.
- * It calculates the overall progress of pending states if any, or returns an initial state otherwise.
- *
- * @return {NetworkState} The aggregated network state based on the pending states and their progress.
- */
-export function useCentralPendingState() {
-  const ctx = useContext(Context);
-
-  const result: NetworkState = useMemo(() => {
-    const pendingStates = Object.values(
-      ctx.filteredState as Record<string, NetworkState>,
-    ).filter(isPending);
-    if (!pendingStates.length) {
-      return init();
-    }
-
-    const progress = pendingStates
-      .filter((a) => a.progress)
-      .reduce(
-        (progress, current) => {
-          return {
-            total: progress.total + (current.progress?.total ?? 0),
-            loaded: progress.loaded + (current.progress?.loaded ?? 0),
-          };
-        },
-        { total: 0, loaded: 0 } satisfies Progress,
-      );
-    return pending(progress.total ? progress : undefined);
-  }, [ctx.filteredState]);
-
-  return result;
-}
-  `
-}

package/src/lib/templates/provider/interfaces.template.ts

@@ -1,72 +0,0 @@
-import {IntrigSourceConfig, typescript} from "@intrig/plugin-sdk";
-import * as path from 'path'
-
-export function providerInterfacesTemplate(apisToSync: IntrigSourceConfig[]) {
-  const configType = `{
-  defaults?: DefaultConfigs,
-  ${apisToSync.map(a => `${a.id}?: DefaultConfigs`).join(",\n  ")}
-  }`
-
-  const ts = typescript(path.resolve("src", "interfaces.ts"))
-  return ts`import {
-  CreateAxiosDefaults,
-  InternalAxiosRequestConfig,
-  AxiosResponse,
-} from 'axios';
-import {
-  IntrigHook,
-  NetworkState,
-} from './network-state';
-import { SchemaOf } from './intrig-context';
-
-export interface DefaultConfigs extends CreateAxiosDefaults {
-  debounceDelay?: number;
-  requestInterceptor?: (
-    config: InternalAxiosRequestConfig,
-  ) => Promise<InternalAxiosRequestConfig>;
-  responseInterceptor?: (
-    config: AxiosResponse<any>,
-  ) => Promise<AxiosResponse<any>>;
-}
-
-export interface IntrigProviderProps {
-  configs?: ${configType};
-  children: React.ReactNode;
-}
-
-export interface StubType {
-  <P, B, T>(
-    hook: IntrigHook<P, B, T>,
-    fn: (
-      params: P,
-      body: B,
-      dispatch: (state: NetworkState<T>) => void,
-    ) => Promise<void>,
-  ): void;
-}
-
-export type WithStubSupport<T> = T & {
-  stubs?: (stub: StubType) => void;
-};
-
-export interface IntrigProviderStubProps {
-  configs?: ${configType};
-  stubs?: (stub: StubType) => void;
-  children: React.ReactNode;
-}
-
-export interface StatusTrapProps {
-  type: 'pending' | 'error' | 'pending + error';
-  propagate?: boolean;
-}
-
-export interface NetworkStateProps<T> {
-  key: string;
-  operation: string;
-  source: string;
-  schema?: SchemaOf<T>;
-  errorSchema?: SchemaOf<any>;
-  debounceDelay?: number;
-}
-  `
-}