[Bug]: can not edit user record when having password feature

[weilitao]

Contact Details

No response

What happened?

I am using passwordsFeature. When I'd like to edit user's password, an error occurred:

Error: Component "PasswordEditComponent" has not been bundled, ensure it was added to your ComponentLoader instance (the one included in AdminJS options).

Bug prevalence

always

AdminJS dependencies version

7.0

What browsers do you see the problem on?

Safari, Microsoft Edge

Relevant log output

No response

Relevant code that's giving you issues

No response

[dziraf]

can you share your feature config and version?

[weilitao]

Hi,

My package.json:

  "dependencies": {
    "@adminjs/express": "^6.0.0",
    "@adminjs/mongoose": "^4.0.0",
    "@adminjs/passwords": "^4.0.0",
    "adminjs": "^7.0.0",
    "argon2": "^0.30.3",
    "connect-mongo": "^4.6.0",
    "dotenv": "^16.0.2",
    "express": "^4.18.1",
    "express-formidable": "^1.2.0",
    "express-session": "^1.17.3",
    "mongoose": "^6.10.1",
    "tslib": "^2.5.0",
    "underscore": "^1.13.6"
  },

And this is my feature configure:

admin.resource.js:

import argon2 from 'argon2';
import passwordsFeature from '@adminjs/passwords';
import menu from '../admin/menu.js';
import { AdminModel } from './index.js';
import { componentLoader } from './components.js';


export const AdminResource = {
  resource: AdminModel,
  options: {
    parent: menu.admin,
    listProperties: ['_id', 'email', 'role'],
    showProperties: ['_id', 'email', 'role'],
    editProperties: ['email', 'role', 'newPassword'],
    sort: {
      sortBy: 'email',
      direction: 'asc',
    },
    actions: {
      new: { isAccessible: ({ currentAdmin }) => currentAdmin.role === 'admin' },
      edit: { isAccessible: ({ currentAdmin }) => currentAdmin.role === 'admin' },
      delete: { isAccessible: ({ currentAdmin }) => currentAdmin.role === 'admin' },
      bulkDelete: { isAccessible: false },
    },
  },
  features: [
    passwordsFeature({
      componentLoader,
      properties: {
        password: 'newPassword',
        encryptedPassword: 'password',
      },
      hash: argon2.hash,
    }),
  ],
}

components.js

import { ComponentLoader } from 'adminjs';

const componentLoader = new ComponentLoader();
const Components = {};
export { componentLoader, Components };

[weilitao]

Hi, is there any solution?

[petrarug]

I have encountered the same error , setup seems to be correct but nothing really works .

[joekh36]

in the adminjsOptions add the componentLoader before the resources array for example: options = { defaultTheme: dark.id, availableThemes: [dark, light, noSidebar], componentLoader, resources = [ { resource: AdminModel, features: [ passwordsFeature({ componentLoader, properties: { password: 'newPassword', encryptedPassword: 'password', }, hash: argon2.hash, componentLoader, }), ], }]

[borgespro]

@joekh36 It worked for me. Thanks.

[nelsondominus]

Did anybody find a fix? This is killing me, the solution posted did not work :(