[Bug]: Typeerror r.id is undefined

[charbelsako]

Contact Details

[email protected]

What happened?

I just created an authenticated route but every time I log in to see the data it shows the above error. keep in mind I can see other data just not this model (staticdata)

I expect it to show me a list of data that I requested

Bug prevalence

I'm the only person encountering it and it's consistent

AdminJS dependencies version

"@adminjs/express": "^6.0.1"
"@adminjs/mongoose": "^4.0.0"
"adminjs": "^7.3.0"

What browsers do you see the problem on?

Firefox

Relevant log output

Relevant code that's giving you issues

import React from 'react'
const MyInputComponent = function (props) {
  if (typeof props.record.params.data === 'string' || typeof props.record.params.data === 'number') {
    return (
      <p>
        <label>data:</label> {props.record.params.data}
      </p>
    )

  }
  const dataProperties = Object.keys(props.record.params).filter(key => key.startsWith("data."));
  return <>{dataProperties.map(key => <p key={key}>{key.toString()}: {props.record.params[key]}</p>)}</>
}

export default MyInputComponent

this is the component to show the list

import mongoose from 'mongoose'
import AdminJS from 'adminjs'
import AdminJSExpress from '@adminjs/express'
import express from 'express'
import * as AdminJSMongoose from '@adminjs/mongoose'
import { componentLoader } from './components.js'
import { StaticDataResource } from './resources/staticdata.resource.js'
import { config } from 'dotenv'
import { AdminJSUserResource } from './resources/adminjs-user.resource.js'
import { AdminJSUser } from './schema/adminjs-user.schema.js'
import bcrypt from "bcrypt";

config()

const PORT = process.env.PORT || 3000

AdminJS.registerAdapter({
  Resource: AdminJSMongoose.Resource,
  Database: AdminJSMongoose.Database,
})

const start = async () => {
  try {
    const mongooseDB = await mongoose.connect(
      `${process.env.DB_CONNECTION_STRING}`,
      {}
    )

    const user = await AdminJSUser.findOne({});
    if (!user) {
      await AdminJSUser.create({
        email: process.env.DEFAULT_LOGIN_EMAIL,
        encryptedPassword: await bcrypt.hash(
          `${process.env.DEFAULT_LOGIN_PASS}`,
          10
        ),
        role: "admin",
      });
    }

    const app = express()

    const admin = new AdminJS({
      databases: [mongooseDB],
      rootPath: '/admin',
      componentLoader,
      resources: [AdminJSUserResource, StaticDataResource],
    })
    // admin.initialize()
    admin.watch()

    const router = AdminJSExpress.buildAuthenticatedRouter(admin, {
      authenticate: async (email, password) => {
        const user = await AdminJSUser.findOne({ email });
        if (user) {
          const matched = await bcrypt.compare(password, user.encryptedPassword);
          if (matched) {
            return user;
          }
        }
        return false;
      },
      cookiePassword: `${process.env.COOKIE_PASSWORD}`,
    });
    app.use(admin.options.rootPath, router)

    app.listen(PORT, () => {
      console.log(
        `AdminJS started on http://localhost:${PORT}${admin.options.rootPath}`
      )
    })
  } catch (err) {
    console.error(err)
  }
}

start()

this is app.js and finally this is the component loader

import { fileURLToPath } from 'url';
import { dirname } from 'path';

const currentFileName = fileURLToPath(import.meta.url);
const componentDirectory = `${dirname(currentFileName)}/components`;

import { ComponentLoader } from 'adminjs'

const componentLoader = new ComponentLoader()
const Components = {
    ShowData: componentLoader.add('ShowData', `${componentDirectory}/show.jsx`),
    EditData: componentLoader.add('EditData', `${componentDirectory}/edit.jsx`),
    // other custom components
}

export { componentLoader, Components }