sul-dlss/argo

View on GitHub
app/javascript/controllers/registration_item_row_controller.js

Summary

Maintainability
A
0 mins
Test Coverage
import { Controller } from '@hotwired/stimulus'

export default class extends Controller {
  static targets = ['barcode', 'catalogRecordId', 'sourceId', 'label']
  static values = {
    csv: Boolean
  }

  connect () {
    // These validations need to be run after values are pasted in, unless the form was loaded in CSV mode
    if (!this.csvValue) {
      this.validateCatalogRecordId()
      this.validateSourceId()
      this.validateBarcode()
      this.validateLabel()
    }
  }

  // Mark any duplicate sourceIds as invalid
  validateSourceId (event) {
    const field = this.sourceIdTarget
    const currentSourceId = field.value
    if (currentSourceId === '') { return }

    if (field.validity.patternMismatch) {
      field.classList.toggle('invalid', !field.validity.valid)
    } else if (this.isDuplicateSourceId(currentSourceId)) {
      this.setValidation(field, 'Duplicate source ID on this form')
      field.classList.add('invalid')
    } else {
      this.clearValidation(field) // all other checks passed

      // Check to see if this is unique in SDR
      fetch(`/registration/source_id?source_id=${currentSourceId}`)
        .then(response => response.json())
        .then((data) => {
          if (data) {
            this.setValidation(field, 'Duplicate source ID')
          } else {
            this.clearValidation(field)
          }
          field.classList.toggle('invalid', !field.validity.valid)
        })
    }
  }

  validateBarcode () {
    const field = this.barcodeTarget
    if (field.validity.patternMismatch) {
      field.classList.toggle('invalid', !field.validity.valid)
    } else {
      this.clearValidation(field)
    }
  }

  // Check that catalog record ID exists.
  validateCatalogRecordId () {
    const field = this.catalogRecordIdTarget
    const currentCatalogRecordId = field.value
    if (currentCatalogRecordId === '') { return }

    if (field.validity.patternMismatch) {
      field.classList.toggle('invalid', !field.validity.valid)
    } else {
      // Only check if the format is valid
      this.clearValidation(field)

      // Check to see if this is unique in SDR
      fetch(`/registration/catalog_record_id?catalog_record_id=${currentCatalogRecordId}`)
        .then(response => {
          if (response.ok) {
            return response.json()
          }
          throw new Error('Cannot check catalog record ID. Try again later.')
        })
        .then((data) => {
          if (!data) {
            this.setValidation(field, 'Not found in catalog')
          }
          field.classList.toggle('invalid', !field.validity.valid)
        })
        .catch((error) => {
          this.setValidation(field, error.message)
        })
    }
  }

  validateLabel () {
    const field = this.labelTarget
    if (this.catalogRecordIdTarget.value === '') {
      field.required = true
    } else {
      field.required = false
      field.classList.toggle('invalid', false)
    }
  }

  setValidation (field, msg) {
    field.setCustomValidity(msg)
    field.reportValidity()
  }

  clearValidation (field) {
    this.setValidation(field, '')
  }

  isDuplicateSourceId (currentSourceId) {
    // Find all of the sourceId nodes on the page
    const nodes = document.querySelectorAll('[data-registration-target="sourceId"]')
    const existingSourceIds = Array.from(nodes).map((target) => target.value)
    const matching = existingSourceIds.filter((elem) => elem === currentSourceId)
    return matching.length > 1
  }
}