controllers/dashboard/successful_builds_controller.js

  1. import { Controller } from "@hotwired/stimulus"
  2. import { subscription } from "~/javascripts/store/mixins/subscription"
  4. /**
  5.  * @class Dashboard.SuccessfulBuildsController
  6.  * @classdesc Stimulus controller that populates the number of successful builds per build context.
  7.  * @extends Controller
  8.  **/
  9. export default class extends Controller {
  10.   static targets = [ "production", "deployPreview", "cms" ]
  11.   static values = {
  12.     loading: String,
  13.     storeId: String
  14.   }
  16.   /** 
  17.    * Subscribe to the store.
  18.    * 
  19.    * @instance
  20.    * @memberof Dashboard.SuccessfulBuildsController
  21.    **/
  22.   connect() {
  23.     subscription(this)
  24.     this.subscribe()
  26.     this.reconnect()
  27.   }
  29.   /** 
  30.    * Handles a repeated Turbo visit to the dashboard page.
  31.    * 
  32.    * @instance
  33.    * @memberof Dashboard.SuccessfulBuildsController
  34.    **/
  35.   reconnect() {
  36.     if (this.store("selectedDataVizData")) {
  37.       this.storeUpdated("selectedDataVizData", this.storeIdValue)
  38.     }
  39.   }
  41.   /** 
  42.    * Sets the text for the number of builds
  43.    * 
  44.    * @instance
  45.    * @memberof Dashboard.SuccessfulBuildsController
  46.    **/
  47.   updateSuccessfulBuildsValue(target, text, context) {
  48.     target.innerHTML = `${text} ${this.calculateNumberOfBuilds(context)}`
  49.   }
  51.   /** 
  52.    * Sets the text whilst waiting for the number of builds
  53.    * 
  54.    * @instance
  55.    * @memberof Dashboard.SuccessfulBuildsController
  56.    **/
  57.   loadingSuccessfulBuildsValue(target, text) {
  58.     target.innerHTML = `${text} ${this.loadingValue}`
  59.   }
  61.   /** 
  62.    * @instance
  63.    * @memberof Dashboard.SuccessfulBuildsController
  64.    **/
  65.   calculateNumberOfBuilds(context) {
  66.     return this.store("selectedDataVizData").reduce((acc , data) => {
  67.       return data.context === context ? acc + 1 : acc
  68.     }, 0)
  69.   }
  71.   /** 
  72.    * Triggered by the store whenever any store data changes. Controls whether the number of builds should
  73.    * be populated or display the loading indicator
  74.    * 
  75.    * @instance
  76.    * @memberof Dashboard.SuccessfulBuildsController
  77.    **/
  78.   storeUpdated(prop, storeId) {
  79.     if (this.store("fetchingDataVizData")) {
  80.       this.loadingSuccessfulBuildsValue(this.productionTarget, "Production")
  81.       this.loadingSuccessfulBuildsValue(this.deployPreviewTarget, "Deploy preview")
  82.       this.loadingSuccessfulBuildsValue(this.cmsTarget, "CMS")
  83.     }
  84.     if (prop === "selectedDataVizData" && storeId === this.storeIdValue) {
  85.       this.updateSuccessfulBuildsValue(this.productionTarget, "Production ...", "production")
  86.       this.updateSuccessfulBuildsValue(this.deployPreviewTarget, "Deploy preview ...", "deploy-preview")
  87.       this.updateSuccessfulBuildsValue(this.cmsTarget, "CMS ...", "cms")
  88.     }
  89.   }
  91.   /** 
  92.    * Unsubscribe from the store
  93.    * 
  94.    * @instance
  95.    * @memberof Dashboard.SuccessfulBuildsController
  96.    **/
  97.   disconnect() {
  98.     this.unsubscribe()
  99.   }
  100. }