@next-feature/client 0.1.0-beta → 0.1.1

package/src/components/api-error-boundary.tsx

@@ -1,58 +1,58 @@
-'use client';
-
-import React, { Component, ErrorInfo, ReactNode } from 'react';
-import { ApiError } from '../lib/error';
-import { getErrorMessage } from '../lib/utils/error';
-
-interface Props {
-  children: ReactNode;
-  fallback?: (error: ApiError) => ReactNode;
-  onError?: (error: Error, errorInfo: ErrorInfo) => void;
-}
-
-interface State {
-  hasError: boolean;
-  error: Error | null;
-}
-
-export class ApiErrorBoundary extends Component<Props, State> {
-  constructor(props: Props) {
-    super(props);
-    this.state = { hasError: false, error: null };
-  }
-
-  static getDerivedStateFromError(error: Error): State {
-    return { hasError: true, error };
-  }
-
-  componentDidCatch(error: Error, errorInfo: ErrorInfo) {
-    console.error('ApiErrorBoundary caught error:', error, errorInfo);
-
-    if (this.props.onError) {
-      this.props.onError(error, errorInfo);
-    }
-  }
-
-  render() {
-    if (this.state.hasError && this.state.error) {
-      if (this.state.error instanceof ApiError && this.props.fallback) {
-        return this.props.fallback(this.state.error);
-      }
-
-      // Default error UI
-      return (
-        <div className="error-container">
-          <h2>Something went wrong</h2>
-          <p>{getErrorMessage(this.state.error)}</p>
-          <button
-            onClick={() => this.setState({ hasError: false, error: null })}
-          >
-            Try again
-          </button>
-        </div>
-      );
-    }
-
-    return this.props.children;
-  }
-}
+'use client';
+
+import React, { Component, ErrorInfo, ReactNode } from 'react';
+import { ApiError } from '../lib/error';
+import { getErrorMessage } from '../lib/utils/error';
+
+interface Props {
+  children: ReactNode;
+  fallback?: (error: ApiError) => ReactNode;
+  onError?: (error: Error, errorInfo: ErrorInfo) => void;
+}
+
+interface State {
+  hasError: boolean;
+  error: Error | null;
+}
+
+export class ApiErrorBoundary extends Component<Props, State> {
+  constructor(props: Props) {
+    super(props);
+    this.state = { hasError: false, error: null };
+  }
+
+  static getDerivedStateFromError(error: Error): State {
+    return { hasError: true, error };
+  }
+
+  componentDidCatch(error: Error, errorInfo: ErrorInfo) {
+    console.error('ApiErrorBoundary caught error:', error, errorInfo);
+
+    if (this.props.onError) {
+      this.props.onError(error, errorInfo);
+    }
+  }
+
+  render() {
+    if (this.state.hasError && this.state.error) {
+      if (this.state.error instanceof ApiError && this.props.fallback) {
+        return this.props.fallback(this.state.error);
+      }
+
+      // Default error UI
+      return (
+        <div className="error-container">
+          <h2>Something went wrong</h2>
+          <p>{getErrorMessage(this.state.error)}</p>
+          <button
+            onClick={() => this.setState({ hasError: false, error: null })}
+          >
+            Try again
+          </button>
+        </div>
+      );
+    }
+
+    return this.props.children;
+  }
+}

package/src/hooks/use-api-error.tsx

@@ -1,39 +1,39 @@
-'use client';
-
-import { useState, useCallback } from 'react';
-import { ApiError } from '../lib/error';
-import { getErrorMessage } from '../lib/utils/error';
-
-interface UseApiErrorResult {
-  error: ApiError | null;
-  setError: (error: ApiError | null) => void;
-  clearError: () => void;
-  handleError: (error: unknown) => void;
-  errorMessage: string | null;
-}
-
-export function useApiError(): UseApiErrorResult {
-  const [error, setError] = useState<ApiError | null>(null);
-
-  const clearError = useCallback(() => {
-    setError(null);
-  }, []);
-
-  const handleError = useCallback((err: unknown) => {
-    if (err instanceof ApiError) {
-      setError(err);
-    } else {
-      console.error('Non-API error:', err);
-    }
-  }, []);
-
-  const errorMessage = error ? getErrorMessage(error) : null;
-
-  return {
-    error,
-    setError,
-    clearError,
-    handleError,
-    errorMessage,
-  };
-}
+'use client';
+
+import { useState, useCallback } from 'react';
+import { ApiError } from '../lib/error';
+import { getErrorMessage } from '../lib/utils/error';
+
+interface UseApiErrorResult {
+  error: ApiError | null;
+  setError: (error: ApiError | null) => void;
+  clearError: () => void;
+  handleError: (error: unknown) => void;
+  errorMessage: string | null;
+}
+
+export function useApiError(): UseApiErrorResult {
+  const [error, setError] = useState<ApiError | null>(null);
+
+  const clearError = useCallback(() => {
+    setError(null);
+  }, []);
+
+  const handleError = useCallback((err: unknown) => {
+    if (err instanceof ApiError) {
+      setError(err);
+    } else {
+      console.error('Non-API error:', err);
+    }
+  }, []);
+
+  const errorMessage = error ? getErrorMessage(error) : null;
+
+  return {
+    error,
+    setError,
+    clearError,
+    handleError,
+    errorMessage,
+  };
+}

package/src/index.ts

@@ -1,6 +1,30 @@
-// Use this file to export React client components (e.g. those with 'use client' directive) or other non-server utilities
-export { ApiClient, type ApiClientConfig } from './lib/client';
-export { ApiError, ApiErrorBuilder, type ProblemDetail } from './lib/error';
-export * from './lib/types';
-export * from './lib/utils/error';
-export * from './lib/utils/helper';
+/**
+ * Client package exports
+ *
+ * This client package provides all necessary API client utilities.
+ * All implementations are self-contained and do not depend on external packages.
+ *
+ * CUSTOMIZATION:
+ * You can easily customize any part of the implementation:
+ *
+ * 1. For custom ApiClient/ApiError logic with interceptors:
+ *    - Run: npx nx g next-feature:client-config --projectName=<your-project>
+ *    - This creates lib/client/config.ts for centralized setup
+ *
+ * 2. For full custom implementations:
+ *    - Edit src/lib/client.ts to customize ApiClient behavior
+ *    - Edit src/lib/error.ts to customize error handling
+ *    - The changes are immediately reflected in all imports
+ *
+ * 3. For project-specific hooks/components:
+ *    - Import directly: import { useApiError } from './hooks/use-api-error'
+ *    - Customize src/hooks/use-api-error.tsx
+ *    - Customize src/components/api-error-boundary.tsx
+ */
+
+// Core API utilities
+export { ApiClient, type ApiClientConfig } from './lib/client';
+export { ApiError, ApiErrorBuilder, type ProblemDetail } from './lib/error';
+export * from './lib/types';
+export * from './lib/utils/error';
+export * from './lib/utils/helper';