feat(dynamic-import-handler): add "withDynamicImportHandler" to make …

…things easier

README.md

@@ -175,21 +175,19 @@ to open a lazy route, the attempt will fail with such error
 TypeError: Failed to fetch dynamically imported module: https://example.com/chunk-4XF37HCG.js
 ```
 
-There is a handy `function` based error handler `dynamicImportHandler` to handle such sitatuions
+There is a handy `withDynamicImportHandler` function to handle such sitatuions
 
 ```ts
 import {provideErrorHandlers, withFuncHandlers} from 'ng-error-handlers';
-import {dynamicImportHandler} from 'ng-error-handlers/dynamic-import-handler';
+import {withDynamicImportHandler} from 'ng-error-handlers/dynamic-import-handler';
 
 provideErrorHandlers(
-    withFuncHanders(dynamicImportHandler()),
+    withDynamicImportHandler(),
     // custom behaviour
-    withFuncHanders(dynamicImportHandler(dynamicImportError => console.log(dynamicImportError))),
+    withDynamicImportHandler(failedImport => alert(failedImport)),
 )
 ```
 
-**NOTE:** `dynamicImportHandler` is a handler creator, thus needs to be *called* to return `ErrorHandlerFn`.
-
 It takes one argument `callback` that will be executed once a dynamic import error occurs.
 If `callback` is not provided then the default behavior will be the current page reloading.
 

projects/ng-error-handlers/README.md

@@ -175,21 +175,19 @@ to open a lazy route, the attempt will fail with such error
 TypeError: Failed to fetch dynamically imported module: https://example.com/chunk-4XF37HCG.js
 ```
 
-There is a handy `function` based error handler `dynamicImportHandler` to handle such sitatuions
+There is a handy `withDynamicImportHandler` function to handle such sitatuions
 
 ```ts
 import {provideErrorHandlers, withFuncHandlers} from 'ng-error-handlers';
-import {dynamicImportHandler} from 'ng-error-handlers/dynamic-import-handler';
+import {withDynamicImportHandler} from 'ng-error-handlers/dynamic-import-handler';
 
 provideErrorHandlers(
-    withFuncHanders(dynamicImportHandler()),
+    withDynamicImportHandler(),
     // custom behaviour
-    withFuncHanders(dynamicImportHandler(dynamicImportError => console.log(dynamicImportError))),
+    withDynamicImportHandler(failedImport => alert(failedImport)),
 )
 ```
 
-**NOTE:** `dynamicImportHandler` is a handler creator, thus needs to be *called* to return `ErrorHandlerFn`.
-
 It takes one argument `callback` that will be executed once a dynamic import error occurs.
 If `callback` is not provided then the default behavior will be the current page reloading.
 

projects/ng-error-handlers/dynamic-import-handler/public-api.ts

@@ -1 +1,2 @@
 export * from "./dynamic-import-handler";
+export * from "./with-dynamic-import-handler";

projects/ng-error-handlers/dynamic-import-handler/with-dynamic-import-handler.ts

@@ -0,0 +1,29 @@
+import {
+    ERROR_HANDLERS,
+    ErrorHandlerFn,
+    ErrorHandlersFeature,
+    ErrorHandlersFeatureKind,
+    makeErrorHandlersFeature,
+} from "ng-error-handlers";
+import { dynamicImportHandler } from "./dynamic-import-handler";
+
+/**
+ * Provides an error handler that handles failed dynamic imports such as lazy components.
+ * @param callback A callback that will be executed when a dynamic import fails. If not provided
+ * then the page will be reloaded.
+ * @example
+ * provideErrorHandlers(
+ *      withDynamicImportHandler(), // with default behaviour (page reload)
+ *      withDynamicImportHandler(failedImport => alert(failedImport)), // with custom behaviour
+ */
+export function withDynamicImportHandler(
+    callback?: ErrorHandlerFn,
+): ErrorHandlersFeature<ErrorHandlersFeatureKind.FuncHandlers> {
+    return makeErrorHandlersFeature(ErrorHandlersFeatureKind.FuncHandlers, [
+        {
+            provide: ERROR_HANDLERS,
+            useFactory: () => dynamicImportHandler(callback),
+            multi: true,
+        },
+    ]);
+}