Describe the bug I'm getting the following error:

(node:18527) UnhandledPromiseRejectionWarning: Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.
    at resolveDispatcher (/Users/david/workspace/dongwon-api/node_modules/react/cjs/react.development.js:1465:13)
    at Object.useState (/Users/david/workspace/dongwon-api/node_modules/react/cjs/react.development.js:1496:20)
    at ae (/Users/david/workspace/dongwon-api/node_modules/styled-components/dist/styled-components.cjs.js:1:13232)
    at processChild (/Users/david/workspace/dongwon-api/node_modules/admin-bro/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)
    at resolve (/Users/david/workspace/dongwon-api/node_modules/admin-bro/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)
    at ReactDOMServerRenderer.render (/Users/david/workspace/dongwon-api/node_modules/admin-bro/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)
    at ReactDOMServerRenderer.read (/Users/david/workspace/dongwon-api/node_modules/admin-bro/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)
    at renderToString (/Users/david/workspace/dongwon-api/node_modules/admin-bro/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)
    at html (/Users/david/workspace/dongwon-api/node_modules/admin-bro/lib/frontend/login-template.js:73:53)
    at processTicksAndRejections (internal/process/task_queues.js:94:5)
    at async /Users/david/workspace/dongwon-api/node_modules/@admin-bro/express/lib/authentication/login.handler.js:19:23

Installed libraries and their versions

• [email protected]
• @admin-bro/[email protected]
• @admin-bro/[email protected]
• [email protected]
• [email protected]

To Reproduce Steps to reproduce the behavior:

1. Use buildAuthenticatedRouter to create AdminBro router.
2. Run the app & visit /admin

Additional context There's a closed issue about this matter, but I was not able to resolve this problem after removing node_modules or by adding react & react-dom as dependencies.

I'm attempting to render a property with a custom component, but it won't work and the console is showing me this error:

components.bundle.js:9 Uncaught ReferenceError: Component1 is not defined at components.bundle.js:9

I literally copy pasted the example from the docs to make sure i wasn't doing anything wrong, but it doesn't work.

Also I've seen that some places in the docs you use components: {} instead of component: {}

This is how im trying to do it: { resource: Voyage, options: { properties: { status: { component: { list: AdminBro.require('./city-content-in-list'), }, }, }, }, },

the component is a copy paste of your example in the docs.

What confuses me is that in your repo admin-bro-example-app you add a custom component to the article field, but you apply the component like this:

properties: { _id: { isVisible: false }, content: { type: 'richtext', }, published: { label: 'Published (custom render)', components: { list: AdminBro.require('../components/article-in-list') } } } What's the difference between those two? If i use components i get another error (Invariant Violation: Element type is invalid) apparently it got undefined?

Anyway i just dont understand why it doesn't work when I've followed the docs closely!

Describe the bug when I try to set up AdminBro for Nest.js + typeorm I am getting the next error: UnhandledPromiseRejectionWarning: NoResourceAdapterError: There are no adapters supporting one of the resource you provided.

Installed libraries and their versions "admin-bro": "^3.3.1", "admin-bro-expressjs": "^2.1.1", "admin-bro-typeorm": "^0.1.6-alpha.9", "express": "^4.17.1", "express-formidable": "^1.2.0", "@nestjs/common": "7.0.0", "@nestjs/core": "7.0.0", "@nestjs/platform-express": "7.0.0", "@nestjs/typeorm": "7.0.0",

To Reproduce Steps to reproduce the behavior: Create base nest.js application and put next: main.ts

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await setupAdminPanel(app);
  await app.listen(3000);
}
bootstrap();

token.entity.ts simple implementation

import AdminBro from "admin-bro";
import { Database, Resource } from '@admin-bro/typeorm';
import { validate } from 'class-validator'

AdminBro.registerAdapter({ Database, Resource });
Resource.validate = validate;

@Entity('token')
export class TokenEntity extends BaseEntity {
  @Column({ type: 'varchar' })
  accessToken: string;
}

Expected behavior Start server properly

Screenshots

AdminBroOptions with schema

import { INestApplication } from '@nestjs/common';
import AdminBro from 'admin-bro';
import * as AdminBroExpress from 'admin-bro-expressjs';
import { BaseEntity } from '../shared';

export async function setupAdminPanel(app: INestApplication): Promise<void> {
  const adminBro = new AdminBro({
    resources: [{ resource: TokenEntity, options: {} }],
    rootPath: '/admin',
  });

  const router = AdminBroExpress.buildRouter(adminBro);
  app.use(adminBro.options.rootPath, router);

}

Desktop:

• OS: macOS Catalina v10.15.7

Additional context If I set up empty resources: [], the Server and Admin panel start properly. Also, I tried to set up it by official documentation but I have the same error. Could you please, help me realize what is wrong?

Hi, I am using admin-bro-mongoose, with admin-bro.

if I have one of the fields as null value in my form, on clicking save it just doesn't update the record and reloads the page @wojtek-krysiak

Describe the bug I'm having an issue when trying to load the login page. On the server side I'm getting this error: `node:9956) UnhandledPromiseRejectionWarning: Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem. at resolveDispatcher (/home/tim/WebstormProjects/selkni/node_modules/admin-bro/node_modules/react/cjs/react.development.js:1465:13) at Object.useState (/home/tim/WebstormProjects/selkni/node_modules/admin-bro/node_modules/react/cjs/react.development.js:1496:20) at ae (/home/tim/WebstormProjects/selkni/node_modules/admin-bro/node_modules/styled-components/dist/styled-components.cjs.js:1:13232) at processChild (/home/tim/WebstormProjects/selkni/node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14) at resolve (/home/tim/WebstormProjects/selkni/node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5) at ReactDOMServerRenderer.render (/home/tim/WebstormProjects/selkni/node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22) at ReactDOMServerRenderer.read (/home/tim/WebstormProjects/selkni/node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29) at renderToString (/home/tim/WebstormProjects/selkni/node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27) at html (/home/tim/WebstormProjects/selkni/node_modules/admin-bro/lib/frontend/login-template.js:71:53) at processTicksAndRejections (internal/process/task_queues.js:93:5) (Use node --trace-warnings ... to show where the warning was created) (node:9956) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag --unhandled-rejections=strict (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1) `

Installed libraries and their versions

"@admin-bro/design-system": "^1.7.0",
"@admin-bro/express": "^3.0.1",
"@admin-bro/typeorm": "^1.3.0",
"@admin-bro/upload": "^1.0.0",
"react-dom": "=16.13.1",
"admin-bro": "^3.3.1",

Describe the bug

1. UI bug - placeholder and selected value in dropdown is shifted up:

2. after applying by clicking on "Apply changes" button - list is filtered and you see it in url change, but when you open filters drawer again, it looks like nothing is selected:

So to remove single filter you have to use "Reset" button to remove all filters or select some value in dropdown and fter that click on x to remove it and then "Apply changes".

Installed libraries and their versions I attached examples above from your demo website. it shows Admin: 6.1.3 & App: 2.0.0. Same problem for [email protected] on my project. If it helps - on [email protected] it works as expected:

To Reproduce Steps to reproduce the behavior:

1. Open your demo website.
2. Try to apply boolean or other dropdown filters.
3. See that applied filters not processed properly on dropdowns in filters drawer.

Expected behavior Applied filters should be visible in filters drawer.

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information if relevant):

• OS: macOS
• Browser: any browser, testyed with:
• • Chrome Version 104.0.5112.101 (Official Build) (arm64),
• • Safari Version 15.6 (17613.3.9.1.5),
• • Firefox 103.0.2 (64-bit)

admin bro looks great and is very promising, but i need 2 thing :

1. how do I get CRUD interfaces for many to many associations ?
2. how can i add i18n support ?

here's my code : const adminBroRequire = require('admin-bro'); const adminBroExpressjs = require('admin-bro-expressjs'); const adminBroSequelize = require('admin-bro-sequelizejs');

adminBroRequire.registerAdapter(adminBroSequelize); const db = require('./DB/models/models_DB_master'); const adminBro = new adminBroRequire({ databases: [db], rootPath: '/test', //... other adminBroOptions });

const adminBroRouter = adminBroExpressjs.buildRouter(adminBro) app.use(adminBro.options.rootPath, adminBroRouter)

I think this is the only feature that is not implemented by admin-bro team. Adding this would make it a fully fledged admin panel tool.

Does the Admin-bro team have a plan for adding that feature too ? thanks.

Hello dear SoftwareBrothers,

I have upgraded my Admin Bro to version 3 and set up file upload feature but when I would like to submit an article with a dropped image I get upload Errors. The same thing goes when I get back to the old version of admin bro and used the one that I wrote through components. I cannot figure out what's exactly going wrong.

this is the error I get when I submit an article with Image.

My Blog js

const AdminBro = require('admin-bro');
const { Blog } = require('../../models/Blog');
const { sort, timestamps } = require('../sort');
const uploadFeature = require('@admin-bro/upload');



/** @type {AdminBro.ResourceOptions} */
const options = {
    sort,
    properties: {
        ...timestamps,
        slug: {
            position: 0,
        },
        description: {
            isVisible: { list: false, edit: true, filter: false, show: true },
            position: 1,
            components: {
                edit: AdminBro.bundle('../components/custom-fonts.edit.tsx')
            }
        },
        tags: {
            isVisible: { list: false, edit: true, filter: true, show: true },
            position: 8
        },
        keywords: {
            isVisible: { list: false, edit: true, filter: true, show: true },
            position: 9,
            type: [String],
        },
        draftMode: {
            isVisible: { list: true, edit: true, filter: true, show: true }
        },
        _id: {
            isVisible: { list: false, edit: false, filter: false, show: false },
        },
    }
};

module.exports = {
    options,
    features: [
        uploadFeature({
            provider: { local: { bucket: 'public/uploads' } },
            properties: {
                key: 'uploadedFile.path',
                bucket: 'uploadedFile.folder',
                mimeType: 'uploadedFile.type',
                size: 'uploadedFile.size',
                filename: 'uploadedFile.filename',
                file: 'uploadFile',
            }
        })
    ],
    resource: Blog,
};

my app.js

app.use('/uploads', express.static('uploads'));

and I also made a directory by the name of upload on the root folder of my app.

so thankful for supporting this amazing admin panel.

Describe the problem feature solves Right now you can only select a single value to filter for in dropdowns.

Describe the solution you'd like It would be good to be able to select multiple values.

Describe alternatives you've considered Might be a duplicate of #438 ... ?

Acceptance criteria Being able to select multiple values in filter dropdowns, and being able to filter by those.

Now:

Enhancement:

Is it possible to rename the fields of the displayed tables?

Note: I would like to set special characters such as accents.

Installed libraries and their versions. "admin-bro": "^2.9.0", "admin-bro-expressjs": "^2.1.1", "admin-bro-typeorm": "^0.1.6-alpha.9",

Describe the problem feature solves The current version of react-select doesn't have the required prop available.

Describe the solution you'd like Please update to the latest version https://github.com/JedWatson/react-select/releases

Acceptance criteria

• [ ] Update react-select

Describe the problem feature solves

currently the api returns an non-standard object:

redirects.0._id: "63b063da2717f35fa82fa78a"
redirects.0.code: "UL7H"
redirects.0.redirectId: "63b063da2717f35fa82fa788"

Describe the solution you'd like Return the same json we all know and love :)

Describe alternatives you've considered N/A

Acceptance criteria Return simple json

Describe the problem feature solves importing custom components by path collides with other building tools, such as nx for monorepos, which makes me have to do things like this:

componentLoader.add(
    "LinkToBreatheAdmin",
    __dirname.includes("/dist/")
      ? __dirname.replace("/dist/", "/") + "/src/components/LinkToBreatheAdmin"
      : path.resolve(__dirname, "LinkToBreatheAdmin"),
  ),

and it breaks the imports as well

Describe the solution you'd like I'd like to simply do:

import MyBaseComp from "./MyComp"
export const componentLoader = new ComponentLoader()
export const MyComp = componentLoader.add("MyComp", MyBaseComp)

Describe alternatives you've considered Don't know really

Acceptance criteria See above

Bumps flat from 4.1.1 to 5.0.1.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Describe the problem feature solves isRequired does not fully encapsulate whether a property can have the value of null

Ideally, if isNullable is implemented, the ability to set a field to null can be added as well.

Describe the solution you'd like isNullable added to BaseProperty

Acceptance criteria Add isNullable to BaseProperty