feat: replaced AdminJS.bundle to ComponentLoader

package.json

@@ -24,7 +24,7 @@
     "adminjs": "^6.0.0"
   },
   "devDependencies": {
-    "@adminjs/design-system": "^3.1.0",
+    "@adminjs/design-system": "^3.1.8",
     "@adminjs/express": "^4.0.1",
     "@commitlint/cli": "^11.0.0",
     "@commitlint/config-conventional": "^11.0.0",
@@ -36,7 +36,7 @@
     "@types/xml2js": "^0.4.5",
     "@typescript-eslint/eslint-plugin": "^4.6.0",
     "@typescript-eslint/parser": "^4.6.0",
-    "adminjs": "^6.0.0",
+    "adminjs": "^6.8.7",
     "date-fns": "^2.16.1",
     "eslint": "^7.12.1",
     "eslint-config-prettier": "^6.15.0",
@@ -47,20 +47,20 @@
     "express-formidable": "^1.2.0",
     "express-session": "^1.17.2",
     "husky": "^4.3.0",
-    "jest": "^26.6.1",
+    "jest": "^29.5.0",
     "prettier": "^2.7.1",
     "semantic-release": "^17.2.2",
-    "ts-jest": "^26.4.3",
-    "ts-node": "^9.0.0",
-    "typescript": "^4.0.5"
+    "ts-jest": "^29.0.5",
+    "ts-node": "^10.9.1",
+    "typescript": "^5.0.2"
   },
   "dependencies": {
-    "@adminjs/mongoose": "^2.0.0",
-    "@types/mongoose": "^5.7.37",
+    "@adminjs/mongoose": "^3.0.3",
+    "@types/mongoose": "^5.11.97",
     "csvtojson": "^2.0.10",
-    "file-saver": "^2.0.2",
-    "json2csv": "^5.0.3",
-    "mongoose": "^5.10.11",
+    "file-saver": "^2.0.5",
+    "json2csv": "^6.0.0-alpha.2",
+    "mongoose": "^7.0.3",
     "xml": "^1.0.1",
     "xml2js": "^0.4.23"
   }

src/bundle-component.ts

@@ -0,0 +1,13 @@
+import path from 'path';
+
+import type { ComponentLoader } from 'adminjs';
+
+// const dirname = __dirname;
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+export const bundleComponent = (
+  loader: ComponentLoader,
+  componentName: string
+) => {
+  const componentPath = path.join(__dirname, `../components/${componentName}`);
+  return loader.add(componentName, componentPath);
+};

src/importExportFeature.ts

@@ -1,22 +1,33 @@
-import { buildFeature, FeatureType } from 'adminjs';
-import { bundleComponents } from './components/bundleComponents';
+import { buildFeature, FeatureType, ComponentLoader } from 'adminjs';
 import { postActionHandler } from './utils';
 import { exportHandler } from './export.handler';
 import { importHandler } from './import.handler';
+import { bundleComponent } from './bundle-component';
 
-const { EXPORT_COMPONENT, IMPORT_COMPONENT } = bundleComponents();
+type ImportExportFeatureOptions = {
+  /**
+   * Your ComponentLoader instance. It is required for the feature to add it's components.
+   */
+  componentLoader: ComponentLoader;
+};
+
+const importExportFeature = (
+  options: ImportExportFeatureOptions
+): FeatureType => {
+  const { componentLoader } = options;
+  const importComponent = bundleComponent(componentLoader, 'ImportComponent');
+  const exportComponent = bundleComponent(componentLoader, 'ExportComponent');
 
-const importExportFeature = (): FeatureType => {
   return buildFeature({
     actions: {
       export: {
         handler: postActionHandler(exportHandler),
-        component: EXPORT_COMPONENT,
+        component: exportComponent,
         actionType: 'resource',
       },
       import: {
         handler: postActionHandler(importHandler),
-        component: IMPORT_COMPONENT,
+        component: importComponent,
         actionType: 'resource',
       },
     },

src/index.ts

@@ -6,6 +6,4 @@
 
 import importExportFeature from './importExportFeature';
 
-export * from './components/bundleComponents';
-
 export default importExportFeature;

test/export-csv.test.ts

@@ -1,4 +1,4 @@
-import AdminJS from 'adminjs';
+import AdminJS, { ComponentLoader } from 'adminjs';
 import importExportFeature from '../src';
 import mongoose from 'mongoose';
 import MongooseAdapter from '@adminjs/mongoose';
@@ -12,6 +12,8 @@ const userSchema = new mongoose.Schema({
   name: String,
 });
 
+const componentLoader = new ComponentLoader()
+
 const User = mongoose.model('User', userSchema);
 AdminJS.registerAdapter(MongooseAdapter);
 
@@ -27,7 +29,7 @@ class API extends ApiClient {
 }
 
 describe('CSV Export', () => {
-  it.skip('should assert true is ok', async function () {
+  it.skip('should assert true is ok', async function() {
     const adminJs = new AdminJS({
       resources: [
         {
@@ -38,7 +40,7 @@ describe('CSV Export', () => {
               name: 'Users',
             },
           },
-          features: [importExportFeature()],
+          features: [importExportFeature({ componentLoader })],
         },
       ],
     });