@kernhq/module-billing 0.5.10 → 0.5.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kernhq/module-billing",
-  "version": "0.5.10",
+  "version": "0.5.12",
   "description": "Kern billing module: plans, entitlements, subscriptions and Stripe — the mechanism that lets any Kern instance sell seats on itself",
   "homepage": "https://github.com/KernAIO/module-billing#readme",
   "license": "AGPL-3.0-only",

package/src/client/admin/SubscriptionsAdmin.svelte

@@ -204,15 +204,17 @@ const planOptions = $derived([
   {:else}
     <!-- the table scrolls inside itself; the page body must never scroll sideways -->
     <div class="overflow-x-auto">
+      <!-- Seven columns, sized to fit the admin pane at a laptop width: this sat at eight and was
+           wider than the pane behind the second sidebar, so the revenue column and the row menu
+           lived off-screen with nothing to say so. Seats and storage share a cell. -->
       <Table
-        columns="minmax(150px,2fr) minmax(110px,1fr) minmax(104px,auto) minmax(68px,auto) minmax(84px,auto) minmax(96px,auto) minmax(84px,auto) 40px"
+        columns="minmax(100px,2fr) minmax(90px,1.2fr) minmax(104px,auto) minmax(112px,auto) minmax(80px,auto) minmax(72px,auto) 36px"
       >
         <TableHeader>
           <TableCell header>{t('admin_col_workspace')}</TableCell>
           <TableCell header>{t('admin_col_plan')}</TableCell>
           <TableCell header>{t('admin_col_status')}</TableCell>
-          <TableCell header end>{t('admin_col_seats')}</TableCell>
-          <TableCell header end>{t('admin_col_storage')}</TableCell>
+          <TableCell header end>{t('admin_col_usage')}</TableCell>
           <TableCell header>{t('admin_col_renews')}</TableCell>
           <TableCell header end>{t('admin_col_revenue')}</TableCell>
           <TableCell header end></TableCell>
@@ -227,13 +229,15 @@ const planOptions = $derived([
                 </span>
               </div>
             </TableCell>
-            <TableCell>
-              <div class="flex items-center gap-1.5">
+            <!-- The badge sits under the name, never beside it: side by side, one of the two was
+                 always the thing that got clipped ("Overrid", then "B…") in a column this narrow. -->
+            <TableCell class="min-w-0">
+              <div class="grid">
                 <span class="truncate">{row.planName ?? t('no_plan')}</span>
                 {#if row.overridden}
-                  <Badge tone="purple" title={t('admin_overridden_hint')}>
-                    {t('admin_overridden')}
-                  </Badge>
+                  <span class="mt-0.5">
+                    <Badge tone="purple" title={t('admin_overridden_hint')}>{t('admin_overridden')}</Badge>
+                  </span>
                 {/if}
               </div>
             </TableCell>
@@ -249,9 +253,8 @@ const planOptions = $derived([
             <TableCell end>
               {row.seatsPurchased > 0
                 ? `${nf.format(row.seatsUsed)}/${nf.format(row.seatsPurchased)}`
-                : nf.format(row.seatsUsed)}
+                : nf.format(row.seatsUsed)} · {formatBytes(row.storageBytes, locale)}
             </TableCell>
-            <TableCell end>{formatBytes(row.storageBytes, locale)}</TableCell>
             <TableCell>{day(row.currentPeriodEnd ?? row.trialEndsAt)}</TableCell>
             <TableCell end>
               {row.monthlyMinor > 0 ? formatMoney(row.monthlyMinor, row.currency, locale) : '—'}

package/src/client/i18n.ts

@@ -27,6 +27,7 @@ export const en: Record<string, Message> = {
   'billing.admin_col_renews': 'Renews',
   'billing.admin_col_revenue': 'Per month',
   'billing.admin_col_seats': 'Seats',
+  'billing.admin_col_usage': 'Seats · storage',
   'billing.admin_col_status': 'Status',
   'billing.admin_col_storage': 'Storage',
   'billing.admin_col_workspace': 'Workspace',
@@ -129,6 +130,12 @@ export const en: Record<string, Message> = {
   'billing.invoice_number': 'Invoice',
   'billing.invoice_view': 'View',
   'billing.invoice_pdf': 'PDF',
+  'billing.invoice_status': 'Status',
+  'billing.invoice_status_paid': 'Paid',
+  'billing.invoice_status_open': 'Awaiting payment',
+  'billing.invoice_status_uncollectible': 'Unpaid',
+  'billing.invoice_status_void': 'Void',
+  'billing.invoice_status_draft': 'Draft',
   'billing.invoices_empty': 'No invoices yet',
   'billing.invoices_empty_hint': 'An invoice appears here after the first payment.',
   'billing.invoices_section': 'Invoices',
@@ -191,6 +198,7 @@ const ar: Record<string, Message> = {
   'billing.admin_col_renews': 'التجديد',
   'billing.admin_col_revenue': 'شهرياً',
   'billing.admin_col_seats': 'المقاعد',
+  'billing.admin_col_usage': 'المقاعد · التخزين',
   'billing.admin_col_status': 'الحالة',
   'billing.admin_col_storage': 'التخزين',
   'billing.admin_col_workspace': 'مساحة العمل',
@@ -289,6 +297,12 @@ const ar: Record<string, Message> = {
   'billing.invoice_number': 'الفاتورة',
   'billing.invoice_view': 'عرض',
   'billing.invoice_pdf': 'PDF',
+  'billing.invoice_status': 'الحالة',
+  'billing.invoice_status_paid': 'مدفوعة',
+  'billing.invoice_status_open': 'بانتظار الدفع',
+  'billing.invoice_status_uncollectible': 'غير مدفوعة',
+  'billing.invoice_status_void': 'ملغاة',
+  'billing.invoice_status_draft': 'مسودة',
   'billing.invoices_empty': 'لا فواتير بعد',
   'billing.invoices_empty_hint': 'تظهر الفاتورة هنا بعد أول عملية دفع.',
   'billing.invoices_section': 'الفواتير',
@@ -350,6 +364,7 @@ const de: Record<string, Message> = {
   'billing.admin_col_renews': 'Verlängert am',
   'billing.admin_col_revenue': 'Pro Monat',
   'billing.admin_col_seats': 'Plätze',
+  'billing.admin_col_usage': 'Plätze · Speicher',
   'billing.admin_col_status': 'Status',
   'billing.admin_col_storage': 'Speicher',
   'billing.admin_col_workspace': 'Arbeitsbereich',
@@ -456,6 +471,12 @@ const de: Record<string, Message> = {
   'billing.invoice_number': 'Rechnung',
   'billing.invoice_view': 'Ansehen',
   'billing.invoice_pdf': 'PDF',
+  'billing.invoice_status': 'Status',
+  'billing.invoice_status_paid': 'Bezahlt',
+  'billing.invoice_status_open': 'Zahlung ausstehend',
+  'billing.invoice_status_uncollectible': 'Unbezahlt',
+  'billing.invoice_status_void': 'Storniert',
+  'billing.invoice_status_draft': 'Entwurf',
   'billing.invoices_empty': 'Noch keine Rechnungen',
   'billing.invoices_empty_hint': 'Nach der ersten Zahlung erscheint hier eine Rechnung.',
   'billing.invoices_section': 'Rechnungen',
@@ -516,6 +537,7 @@ const fa: Record<string, Message> = {
   'billing.admin_col_renews': 'تمدید',
   'billing.admin_col_revenue': 'ماهانه',
   'billing.admin_col_seats': 'کاربران',
+  'billing.admin_col_usage': 'کاربران · فضا',
   'billing.admin_col_status': 'وضعیت',
   'billing.admin_col_storage': 'فضای ذخیره‌سازی',
   'billing.admin_col_workspace': 'فضای کاری',
@@ -616,6 +638,12 @@ const fa: Record<string, Message> = {
   'billing.invoice_number': 'صورتحساب',
   'billing.invoice_view': 'نمایش',
   'billing.invoice_pdf': 'PDF',
+  'billing.invoice_status': 'وضعیت',
+  'billing.invoice_status_paid': 'پرداخت‌شده',
+  'billing.invoice_status_open': 'در انتظار پرداخت',
+  'billing.invoice_status_uncollectible': 'پرداخت‌نشده',
+  'billing.invoice_status_void': 'باطل‌شده',
+  'billing.invoice_status_draft': 'پیش‌نویس',
   'billing.invoices_empty': 'هنوز صورتحسابی نیست',
   'billing.invoices_empty_hint': 'پس از نخستین پرداخت، صورتحساب اینجا می‌آید.',
   'billing.invoices_section': 'صورتحساب‌ها',
@@ -673,6 +701,7 @@ const tr: Record<string, Message> = {
   'billing.admin_col_renews': 'Yenilenme',
   'billing.admin_col_revenue': 'Aylık',
   'billing.admin_col_seats': 'Kullanıcı',
+  'billing.admin_col_usage': 'Kullanıcı · depolama',
   'billing.admin_col_status': 'Durum',
   'billing.admin_col_storage': 'Depolama',
   'billing.admin_col_workspace': 'Çalışma alanı',
@@ -775,6 +804,12 @@ const tr: Record<string, Message> = {
   'billing.invoice_number': 'Fatura',
   'billing.invoice_view': 'Görüntüle',
   'billing.invoice_pdf': 'PDF',
+  'billing.invoice_status': 'Durum',
+  'billing.invoice_status_paid': 'Ödendi',
+  'billing.invoice_status_open': 'Ödeme bekleniyor',
+  'billing.invoice_status_uncollectible': 'Ödenmedi',
+  'billing.invoice_status_void': 'İptal edildi',
+  'billing.invoice_status_draft': 'Taslak',
   'billing.invoices_empty': 'Henüz fatura yok',
   'billing.invoices_empty_hint': 'İlk ödemeden sonra burada bir fatura görünür.',
   'billing.invoices_section': 'Faturalar',

package/src/client/settings/PlanSettings.svelte

@@ -57,6 +57,35 @@ const locale = $derived(messageLocale())
 /** Where Stripe sends the person back to, and where the portal returns them. */
 const returnPath = $derived(`/${slug}/settings/billing/plan`)
 
+/**
+ * Stripe's invoice statuses, said in words. An accountant reading the list needs to know which
+ * rows are still owed before they need the links; the list used to show number, date and amount
+ * and nothing about whether any of it had been paid.
+ */
+const INVOICE_TONE: Record<string, 'success' | 'warning' | 'danger' | 'grey'> = {
+  paid: 'success',
+  open: 'warning',
+  uncollectible: 'danger',
+  void: 'grey',
+  draft: 'grey',
+}
+function invoiceStatus(status: string): string {
+  switch (status) {
+    case 'paid':
+      return t('invoice_status_paid')
+    case 'open':
+      return t('invoice_status_open')
+    case 'uncollectible':
+      return t('invoice_status_uncollectible')
+    case 'void':
+      return t('invoice_status_void')
+    case 'draft':
+      return t('invoice_status_draft')
+    default:
+      return status
+  }
+}
+
 /**
  * What Stripe said on the way back, from `?checkout=`.
  *
@@ -501,10 +530,13 @@ function once(run: () => void) {
         />
       {:else}
         <div class="overflow-x-auto">
-          <Table columns="minmax(120px,1fr) minmax(120px,1fr) minmax(100px,auto) minmax(80px,auto)">
+          <Table
+            columns="minmax(120px,1fr) minmax(120px,1fr) minmax(96px,auto) minmax(100px,auto) minmax(80px,auto)"
+          >
             <TableHeader>
               <TableCell header>{t('invoice_number')}</TableCell>
               <TableCell header>{t('invoice_date')}</TableCell>
+              <TableCell header>{t('invoice_status')}</TableCell>
               <TableCell header end>{t('invoice_amount')}</TableCell>
               <TableCell header end></TableCell>
             </TableHeader>
@@ -512,6 +544,9 @@ function once(run: () => void) {
               <TableRow>
                 <TableCell>{inv.number ?? '—'}</TableCell>
                 <TableCell>{day(inv.createdAt)}</TableCell>
+                <TableCell>
+                  <Badge tone={INVOICE_TONE[inv.status] ?? 'grey'}>{invoiceStatus(inv.status)}</Badge>
+                </TableCell>
                 <TableCell end>{formatMoney(inv.totalMinor, inv.currency, locale)}</TableCell>
                 <TableCell end>
                   <!-- Both links Stripe gives us: the hosted page (pay, see the receipt) and the PDF