mgv-backoffice 1.44.0 → 1.46.0

package/src/composables/useLatestRequest.ts

@@ -0,0 +1,81 @@
+import { getCurrentScope, onScopeDispose } from 'vue'
+
+/** One begun request: its abort signal and whether it is still the latest. */
+export interface LatestRequestToken {
+  /** Pass to fetch(); aborted as soon as a newer request begins (or on cancel). */
+  signal: AbortSignal
+  /**
+   * True while no newer begin() / cancel() has happened. Check it after every
+   * await before writing state, so a superseded response can never clobber
+   * the newer one's — and only the latest call clears its loading flag.
+   */
+  isLatest: () => boolean
+}
+
+/**
+ * "Latest request wins" guard for views that refetch on every filter change,
+ * poll, or Refresh click. Each `begin()` aborts the previous in-flight request
+ * on the wire and hands back a fresh AbortSignal plus an `isLatest()` check
+ * (a monotonic request id), so a slow, stale response that still lands can be
+ * dropped instead of racing the fresh one.
+ *
+ * `cancel()` aborts the in-flight request and invalidates it without starting
+ * a new one (e.g. the selection was cleared). When called inside a component
+ * setup / effect scope, the in-flight request is cancelled automatically on
+ * unmount.
+ *
+ * ```ts
+ * const latest = useLatestRequest()
+ * async function load() {
+ *   const req = latest.begin()
+ *   loading.value = true
+ *   try {
+ *     const res = await fetchThings(req.signal)
+ *     if (!req.isLatest()) return
+ *     rows.value = res
+ *   } catch (e) {
+ *     if (!req.isLatest() || isAbortError(e)) return
+ *     error.value = String(e)
+ *   } finally {
+ *     if (req.isLatest()) loading.value = false
+ *   }
+ * }
+ * ```
+ */
+export function useLatestRequest(): {
+  begin: () => LatestRequestToken
+  cancel: () => void
+} {
+  let seq = 0
+  let ctrl: AbortController | null = null
+
+  function begin(): LatestRequestToken {
+    const mine = ++seq
+    ctrl?.abort()
+    const c = new AbortController()
+    ctrl = c
+    return { signal: c.signal, isLatest: () => mine === seq }
+  }
+
+  function cancel(): void {
+    ++seq
+    ctrl?.abort()
+    ctrl = null
+  }
+
+  if (getCurrentScope()) onScopeDispose(cancel)
+
+  return { begin, cancel }
+}
+
+/**
+ * True for the rejection an aborted fetch() produces (a DOMException — or, in
+ * some runtimes, a plain Error — named "AbortError"). Superseded / cancelled
+ * requests should be swallowed silently rather than shown as an error.
+ */
+export function isAbortError(e: unknown): boolean {
+  return (
+    (typeof DOMException !== 'undefined' && e instanceof DOMException && e.name === 'AbortError') ||
+    (e instanceof Error && e.name === 'AbortError')
+  )
+}

package/src/index.ts

@@ -51,6 +51,7 @@ export { default as BaseFilterChip } from './components/BaseFilterChip.vue'
 export { default as BaseCredentialsForm } from './components/BaseCredentialsForm.vue'
 export { default as BasePillPickerModal } from './components/BasePillPickerModal.vue'
 export { default as BaseBarDistribution } from './components/BaseBarDistribution.vue'
+export { default as BaseGroupedChecklist } from './components/BaseGroupedChecklist.vue'
 export type { CredentialsView, CredentialsUpdate } from './components/BaseCredentialsForm.vue'
 
 // Components — third-party wrappers
@@ -85,6 +86,9 @@ export { useFieldClasses } from './composables/useFieldClasses'
 export type { FieldClasses } from './composables/useFieldClasses'
 export { usePolling } from './composables/usePolling'
 export type { UsePollingOptions } from './composables/usePolling'
+export { useLatestRequest, isAbortError } from './composables/useLatestRequest'
+export { useDirtyState, stableStringify } from './composables/useDirtyState'
+export type { LatestRequestToken } from './composables/useLatestRequest'
 
 // Enums
 export { AlertEnum } from './enums/AlertEnum'
@@ -111,6 +115,7 @@ export type { SpecField, SpecFieldType, SpecFieldValue } from './types/specField
 export type { StatBreakdownItem } from './types/statBreakdown'
 export type { PillPickerItem } from './types/pillPicker'
 export type { DistributionBar } from './types/distribution'
+export type { ChecklistGroup } from './types/checklist'
 
 // Utils
 export { getBaseColor, getBaseColorOf } from './utils/util'
@@ -138,6 +143,7 @@ export {
   fmtPrice,
   fmtPct,
   fmtUsd,
+  fmtMoney,
   fmtDuration,
   formatJson,
   stringifyValue,

package/src/types/checklist.ts

@@ -0,0 +1,6 @@
+/** One group of a BaseGroupedChecklist: a heading plus its selectable item ids. */
+export interface ChecklistGroup {
+  key: string
+  label: string
+  items: string[]
+}

package/src/utils/format.test.ts

@@ -8,6 +8,7 @@ import {
   fmtPrice,
   fmtPct,
   fmtUsd,
+  fmtMoney,
   fmtDuration,
   formatJson,
   stringifyValue,
@@ -262,3 +263,28 @@ describe('stringifyValue', () => {
     expect(stringifyValue(1n)).toBe('1')
   })
 })
+
+describe('fmtMoney', () => {
+  it('puts the minus before the currency and groups digits', () => {
+    expect(fmtMoney(-2.26)).toBe('-$2.26')
+    expect(fmtMoney(1234.5)).toBe(`$${(1234.5).toLocaleString(undefined, { minimumFractionDigits: 2 })}`)
+    expect(fmtMoney(0)).toBe('$0.00')
+  })
+
+  it('honours digits and currency', () => {
+    expect(fmtMoney(1.5, 3)).toBe('$1.500')
+    expect(fmtMoney(-3, 2, '€')).toBe('-€3.00')
+  })
+
+  it('does not sign a value that rounds to zero', () => {
+    expect(fmtMoney(-0.001)).toBe('$0.00')
+  })
+
+  it('renders an em-dash for missing input and accepts numeric strings', () => {
+    expect(fmtMoney(null)).toBe('—')
+    expect(fmtMoney(undefined)).toBe('—')
+    expect(fmtMoney('')).toBe('—')
+    expect(fmtMoney(NaN)).toBe('—')
+    expect(fmtMoney('-4.5')).toBe('-$4.50')
+  })
+})

package/src/utils/format.ts

@@ -111,6 +111,31 @@ export function fmtUsd(v: number): string {
   return `${sign}$${Math.abs(v).toFixed(2)}`
 }
 
+/**
+ * Format a money amount with the sign BEFORE the currency symbol ("-$2.26",
+ * never "$-2.26") and locale digit grouping ("$1,234.50"). Positive values
+ * carry no sign — prefix an explicit '+' where a gain should read signed.
+ * Renders an em-dash for null/undefined/non-finite input; accepts numeric
+ * strings so BigDecimal-as-string payloads pass through.
+ */
+export function fmtMoney(
+  n: number | string | null | undefined,
+  digits = 2,
+  currency = '$',
+): string {
+  if (n === null || n === undefined) return EM_DASH
+  if (typeof n === 'string' && n.trim() === '') return EM_DASH
+  const v = typeof n === 'string' ? Number(n) : n
+  if (!isFinite(v)) return EM_DASH
+  const abs = Math.abs(v).toLocaleString(undefined, {
+    minimumFractionDigits: digits,
+    maximumFractionDigits: digits,
+  })
+  // A value that rounds to zero ("-0.00") reads unsigned.
+  const negative = v < 0 && Number(Math.abs(v).toFixed(digits)) !== 0
+  return `${negative ? '-' : ''}${currency}${abs}`
+}
+
 /**
  * Format an ISO date string / epoch as a "Mon D, YYYY" calendar label
  * (en-US, e.g. "Jan 5, 2026"). Falls back to the raw value on parse