Nested preload showing empty array.

[iyashpal]

🔥 Urgent help on this topic 🙏🏻

🙏🏻 I am having an issue with loading the nested relationships. I followed the same process guided in the documentation but seems it's not working.

Case 1

// SomeController.ts
const user = await User.query().where('id', 1)
      .preload('products', (productsQuery) => {
        productsQuery.preload('media')
      })

Response:

  "user": {
    "id": 1,
    "name": "Yash Pal",
    "email": "[email protected]",
    "remember_me_token": null,
    "created_at": "2022-05-16T11:10:24.164+05:30",
    "updated_at": "2022-05-16T11:10:24.164+05:30",
    "products": []
  }

Case 2 (wish lazy loading)

// SomeController.ts
const user = await User.query().where('id', 1).first()
// OR
const user = await User.find(1)

await user?.load('products', (builder) => {
  builder.preload('media')
})

Response

"user": {
    "id": 1,
    "name": "Yash Pal",
    "email": "[email protected]",
    "remember_me_token": null,
    "created_at": "2022-05-16T11:10:24.164+05:30",
    "updated_at": "2022-05-16T11:10:24.164+05:30",
    "products": [
      {
        "id": 1,
        "user_id": "1",
        "title": "Product 1",
        "description": "This is description",
        "created_at": "2022-05-16T11:11:34.209+05:30",
        "updated_at": "2022-05-16T11:11:34.209+05:30",
        "media": []
      },
      {
        "id": 2,
        "user_id": "1",
        "title": "Product 2",
        "description": "This is product 2 description...",
        "created_at": "2022-05-16T11:12:28.865+05:30",
        "updated_at": "2022-05-16T11:12:28.865+05:30",
        "media": []
      }
    ]
  }

[thetutlage]

What's the issue here?

• Case 2 says (Wish lazy loading). Is this you wish existed?
• In first case, you have shown a code example and its output? What is the expected output? What does your tables looks like? How are relationships defined on the model?

[iyashpal]

@thetutlage I would like to know how I can load nested relationships in both ways (preload & lazy loading). But I am more interested in the preload method. for the Case 1 expected response is there should be data in products array and each product contains media files I should also get the list of media files for each product but I am getting empty array. I have added an expected result for Case 1:

"user": {
    "id": 1,
    "name": "Yash Pal",
    "email": "[email protected]",
    "remember_me_token": null,
    "created_at": "2022-05-16T11:10:24.164+05:30",
    "updated_at": "2022-05-16T11:10:24.164+05:30",
    "products": [
        {
            "id": 1,
            "user_id": "1",
            "title": "Product 1",
            "description": "This is description",
            "created_at": "2022-05-16T11:11:34.209+05:30",
            "updated_at": "2022-05-16T11:11:34.209+05:30",
            "media": [
                {
                    "id": 1,
                    "product_id": "1",
                    "file_url": "https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1999&q=80",
                    "caption": "This is media caption",
                    "created_at": "2022-05-16T11:11:34.209+05:30",
                    "updated_at": "2022-05-16T11:11:34.209+05:30",
                },
                {
                    "id": 2,
                    "product_id": "1",
                    "file_url": "https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1999&q=80",
                    "caption": "This is media caption",
                    "created_at": "2022-05-16T11:11:34.209+05:30",
                    "updated_at": "2022-05-16T11:11:34.209+05:30",
                },
                {
                    "id": 3,
                    "product_id": "1",
                    "file_url": "https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1999&q=80",
                    "caption": "This is media caption",
                    "created_at": "2022-05-16T11:11:34.209+05:30",
                    "updated_at": "2022-05-16T11:11:34.209+05:30",
                },
                {
                    "id": 4,
                    "product_id": "1",
                    "file_url": "https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1999&q=80",
                    "caption": "This is media caption",
                    "created_at": "2022-05-16T11:11:34.209+05:30",
                    "updated_at": "2022-05-16T11:11:34.209+05:30",
                }
            ]
        },
        {
            "id": 2,
            "user_id": "1",
            "title": "Product 2",
            "description": "This is product 2 description...",
            "created_at": "2022-05-16T11:12:28.865+05:30",
            "updated_at": "2022-05-16T11:12:28.865+05:30",
            "media": [
                {
                    "id": 5,
                    "product_id": "2",
                    "file_url": "https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1999&q=80",
                    "caption": "This is media caption",
                    "created_at": "2022-05-16T11:11:34.209+05:30",
                    "updated_at": "2022-05-16T11:11:34.209+05:30",
                },
                {
                    "id": 6,
                    "product_id": "2",
                    "file_url": "https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1999&q=80",
                    "caption": "This is media caption",
                    "created_at": "2022-05-16T11:11:34.209+05:30",
                    "updated_at": "2022-05-16T11:11:34.209+05:30",
                },
                {
                    "id": 7,
                    "product_id": "2",
                    "file_url": "https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1999&q=80",
                    "caption": "This is media caption",
                    "created_at": "2022-05-16T11:11:34.209+05:30",
                    "updated_at": "2022-05-16T11:11:34.209+05:30",
                }
            ]
        }
    ]
}

Model - User.ts

import Product from './Product'
import { DateTime } from 'luxon'
import Hash from '@ioc:Adonis/Core/Hash'
import { column, beforeSave, BaseModel, hasMany, HasMany } from '@ioc:Adonis/Lucid/Orm'

export default class User extends BaseModel {
  @column({ isPrimary: true })
  public id: number

  @column()
  public name: string

  @column()
  public email: string

  @column({ serializeAs: null })
  public password: string

  @column()
  public rememberMeToken?: string

  @column.dateTime({ autoCreate: true })
  public createdAt: DateTime

  @column.dateTime({ autoCreate: true, autoUpdate: true })
  public updatedAt: DateTime

  @beforeSave()
  public static async hashPassword (user: User) {
    if (user.$dirty.password) {
      user.password = await Hash.make(user.password)
    }
  }

  @hasMany(() => Product)
  public products: HasMany<typeof Product>
}

Model - Product.ts

import User from './User'
import Media from './Media'
import { DateTime } from 'luxon'
import { BaseModel, BelongsTo, belongsTo, column, HasMany, hasMany } from '@ioc:Adonis/Lucid/Orm'

export default class Product extends BaseModel {
  @column({ isPrimary: true })
  public id: number

  @column()
  public userId: number

  @column()
  public title: string

  @column()
  public description: string

  @hasMany(() => Media)
  public media: HasMany<typeof Media>

  @belongsTo(() => User)
  public user: BelongsTo<typeof User>

  @column.dateTime({ autoCreate: true })
  public createdAt: DateTime

  @column.dateTime({ autoCreate: true, autoUpdate: true })
  public updatedAt: DateTime
}

Model - Media.ts

import Product from './Product'
import { DateTime } from 'luxon'
import { BaseModel, BelongsTo, belongsTo, column } from '@ioc:Adonis/Lucid/Orm'

export default class Media extends BaseModel {
  @column({ isPrimary: true })
  public id: number

  @column()
  public productId: number

  @column()
  public file_url: string

  @column()
  public caption: string

  @belongsTo(() => Product)
  public product: BelongsTo<typeof Product>

  @column.dateTime({ autoCreate: true })
  public createdAt: DateTime

  @column.dateTime({ autoCreate: true, autoUpdate: true })
  public updatedAt: DateTime
}

Controller - HomeController.ts

import User from 'App/Models/User'
import type { HttpContextContract } from '@ioc:Adonis/Core/HttpContext'

export default class HomeController {
  public async index ({ response }: HttpContextContract) {
    const user = await User.query().where('id', 1)
      .preload('products', (productsQuery) => {
        productsQuery.preload('media')
      }).first()

    return response.json({
      view: 'Welcome',
      user: user,
    })
  }
}

[iyashpal]

Okay, let me try it.

[iyashpal]

@thetutlage it worked. Thank you so much to look into this. You saved me another day.

[AmrMonier]

@thetutlage that actually saved me a lot of time, thank you

[MANTENN]

Why does this matter or knexjs is strict with the types?

[McSneaky]

@MANTENN It's database itself that doesn't like mixed types. There might be databases that allow mixed types, but most of them don't