Loading Store

File Information

• Path: store/loading.js
• Namespace: loading
• Purpose: Manages global loading overlay state and long-running API operation count

State

{
  isLoading: false,        // Controls global loading overlay visibility
  loadingText: 'Loading...', // Message shown in the loading overlay
  apiLongRunningCount: 0,  // Count of in-flight long-running API calls
}

Mutations

Mutation	Payload	Description
mutateLoading	boolean	Set isLoading directly
mutateLoadingText	string	Update the overlay message text
INCREMENT_API_LONG_RUNNING	—	Increment long-running API counter
DECREMENT_API_LONG_RUNNING	—	Decrement counter; floors at 0

Getters

Getter	Returns	Description
showApiLongRunningOverlay	boolean	true when apiLongRunningCount > 0

Usage

The isLoading / mutateLoading pair drives simple full-page loading overlays. The apiLongRunningCount counter is incremented before and decremented after slow API calls; the showApiLongRunningOverlay getter drives a secondary overlay that persists until all long-running calls complete (safe against race conditions when multiple calls are in flight).

// Show overlay for a slow operation
this.$store.commit('loading/INCREMENT_API_LONG_RUNNING')
await slowApiCall()
this.$store.commit('loading/DECREMENT_API_LONG_RUNNING')

// Check in template
// v-if="$store.getters['loading/showApiLongRunningOverlay']"

Related

• DAM Store - Primary application state
• Analytics Store - Analytics tracking state