feat(d28): #6 SMS credit review + low-balance upsell
New 'SMS balances' screen: every SMS client with its credit balance (the module's own sms_balance service field), lowest first so the ones about to run dry sit on top. Low = below sms.low_balance_threshold (dated setting, config over code); 'Low' is the default view = the upsell list. One click raises a top-up proforma (reuses the module renewal-quote path); client name links to the Modules tab where the balance is kept. Owner cockpit gains an 'SMS balance low' tile as the at-a- glance alert. Read-only report, no audit. Test locks parse/flag/sort. typecheck + web build clean. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>feat/client-detail-redesign
Thomas Joise
3 days ago
parent
5761544c74
commit
e83d70a4ff
@ -0,0 +1,104 @@
|
||||
import { useMemo, useState } from 'react'
|
||||
import { Link, useNavigate } from 'react-router-dom'
|
||||
import {
|
||||
Badge, Button, DataTable, EmptyState, ErrorState, FilterChips, Notice, PageHeader, Skeleton, Toolbar, useToast,
|
||||
} from '@sims/ui'
|
||||
import { getSmsBalances, generateModuleRenewalQuote, type SmsBalanceRow } from '../api'
|
||||
import { useData } from './Clients'
|
||||
|
||||
type Scope = 'low' | 'all' | 'unknown'
|
||||
|
||||
/**
|
||||
* SMS credit review (D28): every SMS client with its balance, lowest first, so the
|
||||
* ones about to run dry are at the top. "Low" (below the threshold) is the default
|
||||
* view — that's the upsell list. One click raises a top-up proforma; the client name
|
||||
* links to the Modules tab where the balance is recorded. Balances are entered by the
|
||||
* team (there is no SMS-gateway sync — deliberately kept simple).
|
||||
*/
|
||||
export function SmsBalances() {
|
||||
const nav = useNavigate()
|
||||
const toast = useToast()
|
||||
const [scope, setScope] = useState<Scope>('low')
|
||||
const [busy, setBusy] = useState<string | undefined>()
|
||||
const list = useData(getSmsBalances, [])
|
||||
|
||||
const raiseTopup = (r: SmsBalanceRow) => {
|
||||
if (busy !== undefined) return
|
||||
setBusy(r.cmId)
|
||||
generateModuleRenewalQuote(r.cmId)
|
||||
.then((doc) => { toast.ok('Top-up proforma created'); nav(`/documents/${doc.id}`) })
|
||||
.catch((e: Error) => { toast.err(e.message); setBusy(undefined) })
|
||||
}
|
||||
|
||||
const data = list.data
|
||||
const shown = useMemo(() => {
|
||||
const all = data?.rows ?? []
|
||||
if (scope === 'low') return all.filter((r) => r.low)
|
||||
if (scope === 'unknown') return all.filter((r) => r.balance === null)
|
||||
return all
|
||||
}, [data, scope])
|
||||
|
||||
return (
|
||||
<div className="wf-page">
|
||||
<PageHeader
|
||||
title="SMS balances"
|
||||
desc="SMS credits across every client, lowest first — spot who is about to run dry and raise a top-up before they do."
|
||||
/>
|
||||
{data !== undefined && data.lowCount > 0 && scope !== 'low' && (
|
||||
<Notice tone="warn">
|
||||
{data.lowCount} client{data.lowCount === 1 ? '' : 's'} below {data.threshold.toLocaleString('en-IN')} SMS — needs a top-up.
|
||||
</Notice>
|
||||
)}
|
||||
<Toolbar>
|
||||
<FilterChips
|
||||
chips={[
|
||||
{ key: 'low', label: 'Low', count: data?.lowCount ?? 0 },
|
||||
{ key: 'all', label: 'All', count: data?.total ?? 0 },
|
||||
{ key: 'unknown', label: 'Not recorded', count: data?.unknownCount ?? 0 },
|
||||
]}
|
||||
active={scope}
|
||||
onChange={(k) => setScope(k as Scope)}
|
||||
/>
|
||||
<span style={{ flex: 1 }} />
|
||||
{data !== undefined && <Badge>threshold {data.threshold.toLocaleString('en-IN')}</Badge>}
|
||||
</Toolbar>
|
||||
{list.error !== undefined ? <ErrorState message={list.error} onRetry={list.reload} />
|
||||
: data === undefined ? <Skeleton rows={6} />
|
||||
: shown.length === 0 ? (
|
||||
<EmptyState>
|
||||
{scope === 'low' ? 'No SMS client is below the low-balance threshold — all topped up.'
|
||||
: scope === 'unknown' ? 'Every SMS client has a balance recorded.'
|
||||
: 'No SMS clients yet.'}
|
||||
</EmptyState>
|
||||
) : (
|
||||
<DataTable
|
||||
columns={[
|
||||
{ key: 'client', label: 'Client' },
|
||||
{ key: 'balance', label: 'Balance', numeric: true },
|
||||
{ key: 'reseller', label: 'Reseller' },
|
||||
{ key: 'actions', label: '' },
|
||||
]}
|
||||
rowTone={(i) => (shown[i]!.low ? 'err' : undefined)}
|
||||
rows={shown.map((r) => ({
|
||||
client: <Link to={`/clients/${r.clientId}?tab=modules`}>{r.clientCode} · {r.clientName}</Link>,
|
||||
balance: r.balance === null
|
||||
? <span style={{ opacity: 0.55 }}>not recorded</span>
|
||||
: (
|
||||
<Badge tone={r.low ? 'red' : 'green'}>
|
||||
{r.balance.toLocaleString('en-IN')}
|
||||
</Badge>
|
||||
),
|
||||
reseller: r.reseller ?? '—',
|
||||
actions: (
|
||||
<span onClick={(e) => e.stopPropagation()}>
|
||||
<Button tone="primary" disabled={busy !== undefined} onClick={() => raiseTopup(r)}>
|
||||
{busy === r.cmId ? '…' : 'Top-up quote'}
|
||||
</Button>
|
||||
</span>
|
||||
),
|
||||
}))}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -0,0 +1,72 @@
|
||||
import type { DB } from './db'
|
||||
import { getNumberSetting } from './repos-reminders'
|
||||
|
||||
/**
|
||||
* SMS credit review (D28) — the "who is running low, who to top up" screen and its
|
||||
* count for the cockpit. Balance is the SMS module's OWN service field `sms_balance`
|
||||
* (config over code: the module declares the field; D26). We never invent a value —
|
||||
* blank or unparseable text shows as "unknown", not zero. Read-only: writes no audit.
|
||||
*/
|
||||
|
||||
export interface SmsBalanceRow {
|
||||
cmId: string; clientId: string; clientName: string; clientCode: string
|
||||
balanceText: string | null; balance: number | null; low: boolean
|
||||
reseller: string | null; status: string
|
||||
}
|
||||
export interface SmsBalances {
|
||||
rows: SmsBalanceRow[]; threshold: number
|
||||
total: number; lowCount: number; unknownCount: number
|
||||
}
|
||||
|
||||
/** Leading integer of a free-text balance ("82,000", "82000 sms" → 82000); null if none. */
|
||||
function parseBalance(text: string | null): number | null {
|
||||
if (text === null) return null
|
||||
const m = text.replace(/,/g, '').match(/-?\d+/)
|
||||
return m === null ? null : parseInt(m[0], 10)
|
||||
}
|
||||
|
||||
/** Low-balance count only — cheap enough for the cockpit tile without the full list. */
|
||||
export async function smsLowCount(db: DB): Promise<{ low: number; threshold: number }> {
|
||||
const b = await smsBalances(db)
|
||||
return { low: b.lowCount, threshold: b.threshold }
|
||||
}
|
||||
|
||||
export async function smsBalances(db: DB): Promise<SmsBalances> {
|
||||
const threshold = await getNumberSetting(db, 'sms.low_balance_threshold', 10000)
|
||||
const mod = await db.get<{ id: string }>(`SELECT id FROM module WHERE code='SMS'`)
|
||||
if (mod === undefined) return { rows: [], threshold, total: 0, lowCount: 0, unknownCount: 0 }
|
||||
const raw = await db.all<{
|
||||
cm_id: string; client_id: string; client_name: string; client_code: string
|
||||
field_values: string; status: string
|
||||
}>(
|
||||
`SELECT cm.id AS cm_id, cm.client_id, c.name AS client_name, c.code AS client_code,
|
||||
cm.field_values, cm.status
|
||||
FROM client_module cm JOIN client c ON c.id = cm.client_id
|
||||
WHERE cm.module_id = ? AND cm.active = 1`,
|
||||
mod.id,
|
||||
)
|
||||
const rows: SmsBalanceRow[] = raw.map((r) => {
|
||||
let fv: Record<string, unknown> = {}
|
||||
try { fv = JSON.parse(r.field_values) as Record<string, unknown> } catch { fv = {} }
|
||||
const balanceText = typeof fv.sms_balance === 'string' && fv.sms_balance.trim() !== '' ? fv.sms_balance.trim() : null
|
||||
const balance = parseBalance(balanceText)
|
||||
return {
|
||||
cmId: r.cm_id, clientId: r.client_id, clientName: r.client_name, clientCode: r.client_code,
|
||||
balanceText, balance, low: balance !== null && balance < threshold,
|
||||
reseller: typeof fv.reseller === 'string' && fv.reseller.trim() !== '' ? fv.reseller.trim() : null,
|
||||
status: r.status,
|
||||
}
|
||||
})
|
||||
// Lowest known balance first (the ones to act on); unknown balances sink to the bottom.
|
||||
rows.sort((a, b) => {
|
||||
if (a.balance === null && b.balance === null) return a.clientName.localeCompare(b.clientName)
|
||||
if (a.balance === null) return 1
|
||||
if (b.balance === null) return -1
|
||||
return a.balance - b.balance
|
||||
})
|
||||
return {
|
||||
rows, threshold, total: rows.length,
|
||||
lowCount: rows.filter((r) => r.low).length,
|
||||
unknownCount: rows.filter((r) => r.balance === null).length,
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,42 @@
|
||||
// apps/hq/test/sms-balances.test.ts — D28: SMS credit review + low-balance flag.
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { openDb } from '../src/db'
|
||||
import { seedIfEmpty } from '../src/seed'
|
||||
import { createClient } from '../src/repos-clients'
|
||||
import { createModule, assignModule, setModuleFieldValues } from '../src/repos-modules'
|
||||
import { setSetting } from '../src/repos-reminders'
|
||||
import { smsBalances } from '../src/repos-sms'
|
||||
|
||||
describe('smsBalances (D28)', () => {
|
||||
it('parses the sms_balance field, flags low, sorts lowest-first, unknown sinks', async () => {
|
||||
const db = openDb(':memory:'); await seedIfEmpty(db)
|
||||
// SMS module (with its sms_balance service field) comes from APEX import in prod; make it here.
|
||||
const sms = await createModule(db, 'u1', {
|
||||
code: 'SMS', name: 'SMS Alerts', sac: '998319', allowedKinds: ['yearly'],
|
||||
fieldSpec: [{ key: 'sms_balance', label: 'SMS balance', type: 'text' }],
|
||||
})
|
||||
await setSetting(db, 'u1', 'sms.low_balance_threshold', '10000')
|
||||
|
||||
const low = await createClient(db, 'u1', { name: 'Low Bank', stateCode: '32' })
|
||||
const high = await createClient(db, 'u1', { name: 'High Bank', stateCode: '32' })
|
||||
const blank = await createClient(db, 'u1', { name: 'Blank Bank', stateCode: '32' })
|
||||
const cmLow = await assignModule(db, 'u1', { clientId: low.id, moduleId: sms.id, kind: 'yearly' })
|
||||
const cmHigh = await assignModule(db, 'u1', { clientId: high.id, moduleId: sms.id, kind: 'yearly' })
|
||||
await assignModule(db, 'u1', { clientId: blank.id, moduleId: sms.id, kind: 'yearly' })
|
||||
await setModuleFieldValues(db, 'u1', cmLow.id, { sms_balance: '2,500' }) // comma-formatted, below threshold
|
||||
await setModuleFieldValues(db, 'u1', cmHigh.id, { sms_balance: '82000' }) // above threshold
|
||||
|
||||
const b = await smsBalances(db)
|
||||
expect(b.threshold).toBe(10000)
|
||||
expect(b.total).toBe(3)
|
||||
expect(b.lowCount).toBe(1)
|
||||
expect(b.unknownCount).toBe(1)
|
||||
// lowest known first, unknown last
|
||||
expect(b.rows[0]!.clientName).toBe('Low Bank')
|
||||
expect(b.rows[0]!.balance).toBe(2500)
|
||||
expect(b.rows[0]!.low).toBe(true)
|
||||
expect(b.rows[1]!.clientName).toBe('High Bank')
|
||||
expect(b.rows[1]!.low).toBe(false)
|
||||
expect(b.rows[2]!.balance).toBeNull() // blank → unknown, sunk to bottom
|
||||
})
|
||||
})
|
||||
Loading…
Reference in New Issue