@hperchec/scorpion-ui-template-default/src/models/User.js

Scorpion UI - Default template

/**
 * @vuepress
 * ---
 * title: User class
 * headline: User class
 * sidebarTitle: .User
 * sidebarDepth: 0 # To disable auto sidebar links
 * prev: false # Disable prev link
 * next: false # Disable prev link
 * ---
 */

import { Core, utils } from '@hperchec/scorpion-ui'

const Model = Core.context.support.model.Model
const { isNull } = utils

/**
 * @extends Model
 * @classdesc
 * > {@link ../ context}.{@link ./ models}.{@link # User}
 *
 * Class that represents a user
 */
export default class User extends Model {
  /**
   * A 'private' property will be auto-defined for each attribute
   * @private
   */
  _thumbnailURL
  _thumbnailBase64
  _lastLogin

  /**
   * Create a new User instance
   * @param {Object}      data - Data object
   * @param {number}      data.id - User id
   * @param {string|null} data.firstname - User firstname
   * @param {string|null} data.lastname - User lastname
   * @param {string}      data.email - User email
   * @param {string|null} data.thumbnail - User thumbnail filename
   * @param {string}      data.created_at - User creation date
   * @param {string|null} data.updated_at - User last update date
   * @param {string|null} data.email_verified_at - User email verification date
   * @param {string|null} data.last_login - User last login date
   */
  constructor (data) {
    super(data) // Call parent Model class constructor
    // Server API
    const ServerAPI = Core.service('api-manager').use('ServerAPI')
    // Process thumbnail
    this._thumbnailURL = this.id ? `${ServerAPI.options.baseURL}/users/${this.id}/thumbnail` : null
    this._thumbnailBase64 = null // Init to null
  }

  /**
   * Static attributes
   */

  /**
   * attributes
   * @category properties
   * @ignore
   * @type {Object}
   * @description
   * Default model attributes
   */
  static attributes = {
    /**
     * id
     * @alias User#id
     * @category properties
     * @type {number}
     * @default undefined
     * @description
     * User id accessor
     *
     * > Set in constructor from `data.id`
     */
    id: {
      type: Number,
      cast: (value) => Number(value)
    },
    /**
     * firstname
     * @alias User#firstname
     * @category properties
     * @type {string|null}
     * @default null
     * @description
     * User firstname accessor
     *
     * > Set in constructor from `data.firstname`
     */
    firstname: {
      type: String,
      nullable: true,
      default: null
    },
    /**
     * lastname
     * @alias User#lastname
     * @category properties
     * @type {string|null}
     * @default null
     * @description
     * User lastname accessor
     *
     * > Set in constructor from `data.lastname`
     */
    lastname: {
      type: String,
      nullable: true,
      default: null
    },
    /**
     * email
     * @alias User#email
     * @category properties
     * @type {string}
     * @default undefined
     * @description
     * User email accessor
     *
     * > Set in constructor from `data.email`
     */
    email: {
      type: String
    },
    /**
     * thumbnailFilename
     * @alias User#thumbnailFilename
     * @category properties
     * @type {string|null}
     * @default null
     * @description
     * User thumbnail filename accessor
     *
     * > Set in constructor from `data.thumbnail`
     */
    thumbnailFilename: {
      type: String,
      fromDataAttributeName: 'thumbnail',
      nullable: true,
      default: null
    },
    /**
     * createdAt
     * @alias User#createdAt
     * @category properties
     * @type {Date}
     * @default undefined
     * @description
     * User creation date accessor
     *
     * > Set in constructor from `data.created_at`
     */
    createdAt: {
      type: Date,
      cast: (value) => value ? new Date(value) : value
    },
    /**
     * updatedAt
     * @alias User#updatedAt
     * @category properties
     * @type {Date|null}
     * @default null
     * @description
     * User last update date accessor
     *
     * > Set in constructor from `data.created_at`
     */
    updatedAt: {
      type: Date,
      cast: (value) => value ? new Date(value) : value,
      nullable: true,
      default: null
    },
    /**
     * emailVerifiedAt
     * @alias User#emailVerifiedAt
     * @category properties
     * @type {Date|null}
     * @default null
     * @description
     * User email verification date accessor
     *
     * > Set in constructor from `data.email_verified_at`
     */
    emailVerifiedAt: {
      type: Date,
      cast: (value) => value ? new Date(value) : value,
      nullable: true,
      default: null
    },
    /**
     * lastlogin
     * @alias User#lastLogin
     * @category properties
     * @type {Date|null}
     * @default null
     * @description
     * User last login date accessor
     *
     * > Set in constructor from `data.last_login`
     */
    lastLogin: {
      type: Date,
      cast: (value) => value ? new Date(value) : value,
      nullable: true,
      default: null
    }
  }

  /**
   * Accessors & mutators
   */

  /**
   * User thumbnail URL accessor
   * @category properties
   * @readonly
   * @type {string|null}
   */
  get thumbnailURL () {
    return this._thumbnailURL
  }

  /**
   * User base64 thumbnail data accessor
   * @category properties
   * @readonly
   * @type {string|null}
   */
  get thumbnailBase64 () {
    // Lazy loading -> if this._thumbnailBase64 is null, load thumbnail from server
    if (isNull(this._thumbnailBase64)) {
      this.setThumbnailBase64()
    }
    return this._thumbnailBase64
  }

  /**
   * Methods
   */

  /**
   * setThumbnailBase64
   * @category async methods
   * @return {Promise}
   * @fulfil {void}
   * @description
   * Set base64 thumbnail data (async request: `[GET] <ServerAPIBaseURL>/users/<id>/thumbnail`)
   */
  async setThumbnailBase64 () {
    // Server API
    const ServerAPI = Core.service('api-manager').use('ServerAPI')
    // toDataURL function
    const toDataURL = async function (file) {
      return new Promise((resolve, reject) => {
        const reader = new FileReader()
        reader.onload = () => {
          resolve(reader.result)
        }
        reader.onerror = reject
        reader.readAsDataURL(file)
      })
    }
    const response = await ServerAPI.request('GET', this.thumbnailURL, { responseType: 'blob' })
    this._thumbnailBase64 = await toDataURL(response.data)
  }

  /**
   * fullName
   * @category methods
   * @return {string}
   * @description
   * Returns concatenated firstname and lastname with a white space
   */
  fullName () {
    return this.firstname + ' ' + this.lastname
  }
}