SpeciesFileGroup/taxonworks

View on GitHub
app/javascript/vue/tasks/observation_matrices/dashboard/components/shared/extendButton.js

Summary

Maintainability
A
1 hr
Test Coverage
import { ObservationMatrix, ObservationMatrixRowItem } from '@/routes/endpoints'
import { sortArray } from '@/helpers/arrays'
import { OTU, OBSERVATION_MATRIX_ROW_SINGLE } from '@/constants/index.js'
import ModalComponent from '@/components/ui/Modal.vue'
import SpinnerComponent from '@/components/ui/VSpinner.vue'
import PinComponent from '@/components/ui/Button/ButtonPinned.vue'

export default {
  components: {
    ModalComponent,
    SpinnerComponent,
    PinComponent
  },

  props: {
    otuIds: {
      type: Array,
      required: true,
      default: () => []
    }
  },

  emits: ['onCreate'],

  data() {
    return {
      isLoading: false,
      showModal: false,
      observationMatrices: [],
      matrixObservationRows: [],
      matrix: undefined
    }
  },

  computed: {
    matrixWithRows() {
      return sortArray(
        this.observationMatrices.filter((matrix) =>
          this.isAlreadyInMatrix(matrix.id)
        ),
        'name'
      )
    },

    matrixWithoutRows() {
      return sortArray(
        this.observationMatrices.filter(
          (matrix) => !this.isAlreadyInMatrix(matrix.id)
        ),
        'name'
      )
    }
  },

  watch: {
    showModal: {
      handler(newVal) {
        if (newVal) {
          this.isLoading = true
          ObservationMatrix.all().then((response) => {
            this.observationMatrices = sortArray(response.body, 'name', true)
            this.isLoading = false
          })
        }
      },
      immediate: true
    }
  },

  methods: {
    addRows(matrixId) {
      const promises = []
      const data = this.otuIds.map((id) => ({
        observation_matrix_id: matrixId,
        observation_object_id: id,
        observation_object_type: OTU,
        type: OBSERVATION_MATRIX_ROW_SINGLE
      }))

      data.forEach((row) => {
        if (
          !this.matrixObservationRows.find(
            (item) =>
              row.otu_id === item.otu_id &&
              item.observation_matrix_id === row.observation_matrix_id
          )
        ) {
          promises.push(
            ObservationMatrixRowItem.create({
              observation_matrix_row_item: row
            })
          )
        }
      })

      Promise.allSettled(promises).then(() => {
        if (promises.length) {
          TW.workbench.alert.create(
            'Rows was successfully added to matrix.',
            'notice'
          )
        }
        this.$emit('onCreate', { matrixId, otuIds: this.otuIds })
        this.closeModal()
      })
    },

    closeModal() {
      this.showModal = false
    },

    isAlreadyInMatrix(matrixId) {
      const matrixRows = this.matrixObservationRows.filter(
        (row) => row.observation_matrix_id === matrixId
      )

      return matrixRows.length === this.otuIds.length
    }
  }
}