Skip to content

feat: finalize CrudStore implementation, add entity layer to the app

Cynthia requested to merge cynthia/model-layer into vue-vite-dev

Last part of the CrudStore implementation, finalizing its implementation and link to the Undo/Redo store.

Introduces the foundations for defining entities (relying on object-oriented programming for this part), with a base class Entity handling generic work (and used within the CrudStore), and an Identifier class wrapping entity IDs, and handling the transition from local "fake" identifiers and real identifiers received from the server.

The idea for entities is to have each entity in its file (e.g. user.ts) which may export multiple entities when appropriate. For example, users can be modeled as follows:

import { Entity } from './base/entity'
import { Identifier } from './base/identifier'
import { APIMinimalUser, APIUser } from '@/ts/api/..?'

// Used when inside another object
export class MinimalUser extends Entity<APIMinimalUser> {
  constructor(
    id: Identifier,
    public username: string,
    public first_name: string,
    public last_name: string,
    ...
  ) {
    super(id)
  }

  getFullName() {
    return `${this.first_name} ${this.last_name}`
  }

  toJSON(): APIMinimalUser {
    return { id: this.id, ... }
  }

  static fromJSON(data: APIMinimalUser) {
    return new MinimalUser(
      new Identifier(data.id),
      ...
    )
  }
}

export class User extends Entity<APIUser> {
  constructor(
    id: Identifier,
    public username: string,
    public first_name: string,
    public last_name: string,
    public email: string,
    public role: string,
    ...
  ) {
    super(id)
  }

  getFullName() {
    return `${this.first_name} ${this.last_name}`
  }

  toJSON(): APIUser {
    return { id: this.id, ... }
  }

  static fromJSON(data: APIUser) {
    return new User(
      new Identifier(data.id),
      ...
    )
  }
}

Merge request reports