pc_builder/app/controllers/components_controller.ts

import type { HttpContext } from '@adonisjs/core/http'
import { DateTime } from 'luxon'
import { storeComponentValidator } from '#validators/Components/store'
import { updateComponentValidator } from '#validators/Components/update'
import Component from '#models/component'
import ComponentType from '#models/component_type'

/**
 * Lucid's `serialize()` returns a loosely typed `ModelObject`
 * (`{ [key: string]: any }`). It is not structurally assignable to the
 * concrete prop shapes declared by the Vue pages (see
 * `inertia/pages/types/UITypes.ts`), which live in a separate TypeScript
 * project (the `inertia/**` tree is excluded from the backend tsconfig).
 * Since the controller fully controls which columns/relations are
 * preloaded and serialized, this cast documents that the runtime shape
 * matches what the page expects at this boundary.
 */
function asPageProp<T>(value: unknown): T {
  return value as T
}

export default class ComponentsController {
  async index({ inertia, auth }: HttpContext) {
    const user = await auth.authenticate()
    const components = await Component.query().preload('type').where('userId', user.id)
    return inertia.render('components/index', {
      components: asPageProp(components.map((c) => c.serialize())),
    })
  }

  async create({ inertia }: HttpContext) {
    const types = await ComponentType.all()
    return inertia.render('components/create', {
      types: asPageProp(types.map((t) => t.serialize())),
    })
  }

  async store({ request, response, auth }: HttpContext) {
    const user = await auth.authenticate()
    const { quantity, ...componentData } = await request.validateUsing(storeComponentValidator)
    await ComponentType.findOrFail(componentData.typeId)
    for (let i = 0; i < quantity; i++) {
      await Component.create({
        ...componentData,
        purchaseDate: DateTime.fromFormat(componentData.purchaseDate, 'yyyy-MM-dd'),
        userId: user.id,
      })
    }
    response.redirect('/components')
  }

  async show({ params, auth, inertia }: HttpContext) {
    const user = await auth.authenticate()
    const componentId = params.id
    const component = await Component.query()
      .preload('type')
      .where('userId', user.id)
      .andWhere('id', componentId)
      .firstOrFail()
    return inertia.render('components/show', { component: asPageProp(component.serialize()) })
  }

  async edit({ params, auth, inertia }: HttpContext) {
    const user = await auth.authenticate()
    const types = await ComponentType.all()
    const componentId = params.id
    const component = await Component.query()
      .preload('type')
      .where('userId', user.id)
      .andWhere('id', componentId)
      .firstOrFail()
    return inertia.render('components/edit', {
      component: asPageProp(component.serialize()),
      types: asPageProp(types.map((t) => t.serialize())),
    })
  }

  async update({ params, auth, request, response }: HttpContext) {
    const user = await auth.authenticate()
    const componentData = await request.validateUsing(updateComponentValidator)
    const component = await Component.query()
      .where('userId', user.id)
      .andWhere('id', params.id)
      .firstOrFail()
    component.merge({
      ...componentData,
      purchaseDate: DateTime.fromFormat(componentData.purchaseDate, 'yyyy-MM-dd'),
    })
    await component.save()
    return response.redirect('/components')
  }

  async destroy({ params, auth, response }: HttpContext) {
    const user = await auth.authenticate()
    const componentId = params.id
    const component = await Component.query()
      .where('userId', user.id)
      .andWhere('id', componentId)
      .firstOrFail()
    await component.delete()
    return response.redirect('/components')
  }
}