@stacksjs/defaults 0.75.230 → 0.75.233

package/resources/components/Dashboard/Commerce/CommerceCustomersDashboard.stx

@@ -6,6 +6,7 @@ import type {
 import { DashboardApiError, dashboardApi } from '../../../../functions/dashboard-api'
 import { pushToast } from '../../../../functions/toasts'
 import { formatCurrency, minorToInput } from '@stacksjs/commerce/money'
+import { pageControls } from '../../../../functions/dashboard-list'
 
 interface CustomerIndexResponse {
   records: CommerceCustomerRecord[]
@@ -243,13 +244,7 @@ async function deleteCustomer(): Promise<void> {
   }
 }
 
-function previousPage(): void {
-  page.set(Math.max(1, page() - 1))
-}
-
-function nextPage(): void {
-  page.set(Math.min(pageCount(), page() + 1))
-}
+const { previousPage, nextPage } = pageControls(page, pageCount)
 
 onMount(() => {
   void loadCustomers()

package/resources/components/Dashboard/Commerce/CommerceGiftCardDialog.stx

@@ -1,6 +1,7 @@
 <script client>
 import type { GiftCardRecord, GiftCardStatus } from '../../../../app/Actions/Dashboard/Commerce/gift-card-records'
 import { minorToInput, moneyInputError, moneyInputStep, parseMoneyInput } from '@stacksjs/commerce/money'
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 
 const open = useReactiveProp('open', false)
 const mode = useReactiveProp('mode', 'add')
@@ -148,10 +149,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const label = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${label.charAt(0).toUpperCase()}${label.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/CommerceGiftCardsDashboard.stx

@@ -7,6 +7,7 @@ import type {
 import { DashboardApiError, dashboardApi } from '../../../../functions/dashboard-api'
 import { pushToast } from '../../../../functions/toasts'
 import { minorToInput } from '@stacksjs/commerce/money'
+import { pageControls } from '../../../../functions/dashboard-list'
 
 interface GiftCardIndexResponse {
   records: GiftCardRecord[]
@@ -257,13 +258,7 @@ async function deleteGiftCard(): Promise<void> {
   }
 }
 
-function previousPage(): void {
-  page.set(Math.max(1, page() - 1))
-}
-
-function nextPage(): void {
-  page.set(Math.min(pageCount(), page() + 1))
-}
+const { previousPage, nextPage } = pageControls(page, pageCount)
 
 onMount(() => {
   void loadGiftCards()

package/resources/components/Dashboard/Commerce/CommerceManufacturerDialog.stx

@@ -1,5 +1,6 @@
 <script client>
 import type { ManufacturerRecord } from '../../../../app/Actions/Dashboard/Commerce/manufacturer-records'
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 
 const open = useReactiveProp('open', false)
 const mode = useReactiveProp('mode', 'add')
@@ -41,10 +42,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const label = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${label.charAt(0).toUpperCase()}${label.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/CommerceOrderDialog.stx

@@ -4,6 +4,7 @@ import type {
   OrderCustomerOption,
 } from '../../../../app/Actions/Dashboard/Commerce/commerce-order-records'
 import { minorToInput, moneyInputError, moneyInputStep, parseMoneyInput } from '@stacksjs/commerce/money'
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 
 const open = useReactiveProp('open', false)
 const mode = useReactiveProp('mode', 'add')
@@ -108,10 +109,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const fieldLabel = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${fieldLabel.charAt(0).toUpperCase()}${fieldLabel.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/CommerceOrdersDashboard.stx

@@ -7,6 +7,7 @@ import type {
 import { DashboardApiError, dashboardApi } from '../../../../functions/dashboard-api'
 import { pushToast } from '../../../../functions/toasts'
 import { formatCurrency, minorToInput } from '@stacksjs/commerce/money'
+import { pageControls } from '../../../../functions/dashboard-list'
 
 interface OrderIndexResponse {
   records: CommerceOrderRecord[]
@@ -284,13 +285,7 @@ async function deleteOrder(): Promise<void> {
   }
 }
 
-function previousPage(): void {
-  page.set(Math.max(1, page() - 1))
-}
-
-function nextPage(): void {
-  page.set(Math.min(pageCount(), page() + 1))
-}
+const { previousPage, nextPage } = pageControls(page, pageCount)
 
 onMount(() => {
   void loadOrders()

package/resources/components/Dashboard/Commerce/CommerceProductDialog.stx

@@ -1,4 +1,5 @@
 <script client>
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 import type {
   CommerceProductRecord,
   ProductOption,
@@ -108,10 +109,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const fieldLabel = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${fieldLabel.charAt(0).toUpperCase()}${fieldLabel.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/CommerceProductsDashboard.stx

@@ -8,6 +8,7 @@ import type {
 import { DashboardApiError, dashboardApi } from '../../../../functions/dashboard-api'
 import { pushToast } from '../../../../functions/toasts'
 import { minorToInput } from '@stacksjs/commerce/money'
+import { pageControls } from '../../../../functions/dashboard-list'
 
 interface ProductIndexResponse {
   records: CommerceProductRecord[]
@@ -259,13 +260,7 @@ async function deleteProduct(): Promise<void> {
   }
 }
 
-function previousPage(): void {
-  page.set(Math.max(1, page() - 1))
-}
-
-function nextPage(): void {
-  page.set(Math.min(pageCount(), page() + 1))
-}
+const { previousPage, nextPage } = pageControls(page, pageCount)
 
 onMount(() => {
   void loadProducts()

package/resources/components/Dashboard/Commerce/CommerceReviewEditDialog.stx

@@ -1,5 +1,6 @@
 <script client>
 import type { ReviewRecord } from '../../../../app/Actions/Dashboard/Commerce/review-records'
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 
 const open = useReactiveProp('open', false)
 const review = useReactiveProp('review', null as ReviewRecord | null)
@@ -42,10 +43,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const label = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${label.charAt(0).toUpperCase()}${label.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/CommerceTaxDialog.stx

@@ -1,5 +1,6 @@
 <script client>
 import type { TaxRateRecord } from '../../../../app/Actions/Dashboard/Commerce/tax-rate-records'
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 
 const open = useReactiveProp('open', false)
 const mode = useReactiveProp('mode', 'add')
@@ -59,10 +60,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const label = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${label.charAt(0).toUpperCase()}${label.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/CommerceUnitDialog.stx

@@ -1,4 +1,5 @@
 <script client>
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 import type {
   ProductUnitOption,
   ProductUnitRecord,
@@ -52,10 +53,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const label = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${label.charAt(0).toUpperCase()}${label.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/CommerceVariantDialog.stx

@@ -1,5 +1,6 @@
 <script client>
 import type { ProductVariantOption, ProductVariantRecord } from '../../../../app/Actions/Dashboard/Commerce/product-variant-records'
+import { formErrorMessages } from '../../../../functions/dashboard-form'
 
 const open = useReactiveProp('open', false)
 const mode = useReactiveProp('mode', 'add')
@@ -49,10 +50,7 @@ function submit(): void {
 }
 
 function errorMessages(): string[] {
-  return Object.entries(errors()).map(([field, message]) => {
-    const label = field.replace(/([a-z])([A-Z])/g, '$1 $2').replaceAll('_', ' ')
-    return `${label.charAt(0).toUpperCase()}${label.slice(1)}: ${message}`
-  })
+  return formErrorMessages(errors())
 }
 </script>
 

package/resources/components/Dashboard/Commerce/Delivery/CouriersDashboard.stx

@@ -1,5 +1,6 @@
 <script client>
 import { dashboardApi } from '../../../../../functions/dashboard-api'
+import { useRecordsDashboard } from '../../../../../functions/dashboard-list'
 import { pushToast } from '../../../../../functions/toasts'
 
 type CourierStatus = 'active' | 'on_delivery' | 'on_break'
@@ -34,21 +35,48 @@ interface CourierPayload {
   userId: number | null
 }
 
-const records = state<CourierRecord[]>([])
+function matchesQuery(records: CourierRecord[], query: string): CourierRecord[] {
+  return records.filter(record => [
+    record.name,
+    record.phone,
+    record.vehicle_number,
+    record.license,
+    record.status,
+    record.user?.name,
+    record.user?.email,
+  ].some(value => String(value || '').toLowerCase().includes(query)))
+}
+
+const {
+  records,
+  loading,
+  loadError,
+  search,
+  page,
+  perPage,
+  editorOpen,
+  editorMode,
+  editing,
+  saving,
+  editorError,
+  deleting,
+  deleteBusy,
+  deleteError,
+  filteredRecords,
+  paginatedRecords,
+  goToPage,
+  handleSearch,
+  openCreate,
+  openEdit,
+  closeEditor,
+  requestDelete,
+  closeDelete,
+  upsert,
+  remove,
+  clampPage,
+} = useRecordsDashboard<CourierRecord>({ filter: matchesQuery })
+
 const users = state<UserOption[]>([])
-const loading = state(true)
-const loadError = state('')
-const search = state('')
-const page = state(1)
-const perPage = state(10)
-const editorOpen = state(false)
-const editorMode = state<'create' | 'edit'>('create')
-const editing = state<CourierRecord | null>(null)
-const saving = state(false)
-const editorError = state('')
-const deleting = state<CourierRecord | null>(null)
-const deleteBusy = state(false)
-const deleteError = state('')
 
 function userFor(id?: number | null): UserOption | undefined {
   return id ? users().find(user => user.id === id) : undefined
@@ -61,26 +89,6 @@ function withUser(record: CourierRecord): CourierRecord {
   }
 }
 
-function filteredRecords(): CourierRecord[] {
-  const query = search().trim().toLowerCase()
-  if (!query)
-    return records()
-  return records().filter(record => [
-    record.name,
-    record.phone,
-    record.vehicle_number,
-    record.license,
-    record.status,
-    record.user?.name,
-    record.user?.email,
-  ].some(value => String(value || '').toLowerCase().includes(query)))
-}
-
-function paginatedRecords(): CourierRecord[] {
-  const start = (page() - 1) * perPage()
-  return filteredRecords().slice(start, start + perPage())
-}
-
 function statusCount(status: CourierStatus): number {
   return records().filter(record => record.status === status).length
 }
@@ -106,9 +114,7 @@ async function loadCouriers(): Promise<void> {
       throw new TypeError('Courier resources were not returned in the expected shape.')
     users.set(userData.users)
     records.set(courierData.map(withUser))
-    const lastPage = Math.max(1, Math.ceil(filteredRecords().length / perPage()))
-    if (page() > lastPage)
-      page.set(lastPage)
+    clampPage()
   }
   catch (error) {
     loadError.set(error instanceof Error ? error.message : String(error))
@@ -119,33 +125,6 @@ async function loadCouriers(): Promise<void> {
   }
 }
 
-function handleSearch(value: string): void {
-  search.set(value)
-  page.set(1)
-}
-
-function openCreate(): void {
-  editing.set(null)
-  editorMode.set('create')
-  editorError.set('')
-  editorOpen.set(true)
-}
-
-function openEdit(record: CourierRecord): void {
-  editing.set(record)
-  editorMode.set('edit')
-  editorError.set('')
-  editorOpen.set(true)
-}
-
-function closeEditor(): void {
-  if (saving())
-    return
-  editorOpen.set(false)
-  editing.set(null)
-  editorError.set('')
-}
-
 function setEditorError(message: string): void {
   editorError.set(message)
 }
@@ -165,14 +144,7 @@ async function saveCourier(payload: CourierPayload): Promise<void> {
       },
     )
     const hydrated = withUser(updated)
-    if (current) {
-      records.set(records().map(record => record.id === current.id ? hydrated : record))
-    }
-    else {
-      const nextRecords = [...records(), hydrated]
-      records.set(nextRecords)
-      page.set(Math.max(1, Math.ceil(nextRecords.length / perPage())))
-    }
+    upsert(hydrated, current)
     editorOpen.set(false)
     editing.set(null)
     pushToast('success', current ? 'Courier updated' : 'Courier added', { detail: hydrated.name })
@@ -185,18 +157,6 @@ async function saveCourier(payload: CourierPayload): Promise<void> {
   }
 }
 
-function requestDelete(record: CourierRecord): void {
-  deleting.set(record)
-  deleteError.set('')
-}
-
-function closeDelete(): void {
-  if (deleteBusy())
-    return
-  deleting.set(null)
-  deleteError.set('')
-}
-
 async function confirmDelete(): Promise<void> {
   const current = deleting()
   if (!current)
@@ -207,11 +167,8 @@ async function confirmDelete(): Promise<void> {
     await dashboardApi(`/api/dashboard/commerce/couriers/${current.id}`, {
       method: 'DELETE',
     })
-    records.set(records().filter(record => record.id !== current.id))
+    remove(current)
     deleting.set(null)
-    const lastPage = Math.max(1, Math.ceil(filteredRecords().length / perPage()))
-    if (page() > lastPage)
-      page.set(lastPage)
     pushToast('success', 'Courier deleted', { detail: current.name })
   }
   catch (error) {
@@ -222,10 +179,6 @@ async function confirmDelete(): Promise<void> {
   }
 }
 
-function goToPage(value: number): void {
-  page.set(value)
-}
-
 onMount(() => {
   void loadCouriers()
 })

package/resources/components/Dashboard/Commerce/Delivery/DeliveryRoutesDashboard.stx

@@ -1,5 +1,6 @@
 <script client>
 import { dashboardApi } from '../../../../../functions/dashboard-api'
+import { useRecordsDashboard } from '../../../../../functions/dashboard-list'
 import { pushToast } from '../../../../../functions/toasts'
 
 interface CourierRecord {
@@ -31,21 +32,48 @@ interface DeliveryRoutePayload {
   lastActive: number
 }
 
-const records = state<DeliveryRouteRecord[]>([])
+function matchesQuery(records: DeliveryRouteRecord[], query: string): DeliveryRouteRecord[] {
+  return records.filter(record => [
+    record.id,
+    record.courier,
+    record.courier_record?.name,
+    record.vehicle,
+    record.stops,
+    record.delivery_time,
+    record.total_distance,
+  ].some(value => String(value || '').toLowerCase().includes(query)))
+}
+
+const {
+  records,
+  loading,
+  loadError,
+  search,
+  page,
+  perPage,
+  editorOpen,
+  editorMode,
+  editing,
+  saving,
+  editorError,
+  deleting,
+  deleteBusy,
+  deleteError,
+  filteredRecords,
+  paginatedRecords,
+  goToPage,
+  handleSearch,
+  openCreate,
+  openEdit,
+  closeEditor,
+  requestDelete,
+  closeDelete,
+  upsert,
+  remove,
+  clampPage,
+} = useRecordsDashboard<DeliveryRouteRecord>({ filter: matchesQuery })
+
 const couriers = state<CourierRecord[]>([])
-const loading = state(true)
-const loadError = state('')
-const search = state('')
-const page = state(1)
-const perPage = state(10)
-const editorOpen = state(false)
-const editorMode = state<'create' | 'edit'>('create')
-const editing = state<DeliveryRouteRecord | null>(null)
-const saving = state(false)
-const editorError = state('')
-const deleting = state<DeliveryRouteRecord | null>(null)
-const deleteBusy = state(false)
-const deleteError = state('')
 
 function courierFor(id?: number | null): CourierRecord | undefined {
   return id ? couriers().find(courier => courier.id === id) : undefined
@@ -64,26 +92,6 @@ function routeTime(value: string | number): number {
   return new Date(String(value).replace(' ', 'T')).getTime()
 }
 
-function filteredRecords(): DeliveryRouteRecord[] {
-  const query = search().trim().toLowerCase()
-  if (!query)
-    return records()
-  return records().filter(record => [
-    record.id,
-    record.courier,
-    record.courier_record?.name,
-    record.vehicle,
-    record.stops,
-    record.delivery_time,
-    record.total_distance,
-  ].some(value => String(value || '').toLowerCase().includes(query)))
-}
-
-function paginatedRecords(): DeliveryRouteRecord[] {
-  const start = (page() - 1) * perPage()
-  return filteredRecords().slice(start, start + perPage())
-}
-
 function metricCards(): Array<{ label: string, value: string, detail: string }> {
   const totalStops = records().reduce((sum, record) => sum + record.stops, 0)
   const totalDistance = records().reduce((sum, record) => sum + record.total_distance, 0)
@@ -109,9 +117,7 @@ async function loadRoutes(): Promise<void> {
       throw new TypeError('Delivery route resources were not returned in the expected shape.')
     couriers.set(courierData)
     records.set(routeData.map(withCourier))
-    const lastPage = Math.max(1, Math.ceil(filteredRecords().length / perPage()))
-    if (page() > lastPage)
-      page.set(lastPage)
+    clampPage()
   }
   catch (error) {
     loadError.set(error instanceof Error ? error.message : String(error))
@@ -122,33 +128,6 @@ async function loadRoutes(): Promise<void> {
   }
 }
 
-function handleSearch(value: string): void {
-  search.set(value)
-  page.set(1)
-}
-
-function openCreate(): void {
-  editing.set(null)
-  editorMode.set('create')
-  editorError.set('')
-  editorOpen.set(true)
-}
-
-function openEdit(record: DeliveryRouteRecord): void {
-  editing.set(record)
-  editorMode.set('edit')
-  editorError.set('')
-  editorOpen.set(true)
-}
-
-function closeEditor(): void {
-  if (saving())
-    return
-  editorOpen.set(false)
-  editing.set(null)
-  editorError.set('')
-}
-
 function setEditorError(message: string): void {
   editorError.set(message)
 }
@@ -168,14 +147,7 @@ async function saveRoute(payload: DeliveryRoutePayload): Promise<void> {
       },
     )
     const hydrated = withCourier(updated)
-    if (current) {
-      records.set(records().map(record => record.id === current.id ? hydrated : record))
-    }
-    else {
-      const nextRecords = [...records(), hydrated]
-      records.set(nextRecords)
-      page.set(Math.max(1, Math.ceil(nextRecords.length / perPage())))
-    }
+    upsert(hydrated, current)
     editorOpen.set(false)
     editing.set(null)
     pushToast('success', current ? 'Delivery route updated' : 'Delivery route added', { detail: `Route #${hydrated.id}` })
@@ -188,18 +160,6 @@ async function saveRoute(payload: DeliveryRoutePayload): Promise<void> {
   }
 }
 
-function requestDelete(record: DeliveryRouteRecord): void {
-  deleting.set(record)
-  deleteError.set('')
-}
-
-function closeDelete(): void {
-  if (deleteBusy())
-    return
-  deleting.set(null)
-  deleteError.set('')
-}
-
 async function confirmDelete(): Promise<void> {
   const current = deleting()
   if (!current)
@@ -210,11 +170,9 @@ async function confirmDelete(): Promise<void> {
     await dashboardApi(`/api/dashboard/commerce/delivery-routes/${current.id}`, {
       method: 'DELETE',
     })
-    records.set(records().filter(record => record.id !== current.id))
+    remove(current)
     deleting.set(null)
-    const lastPage = Math.max(1, Math.ceil(filteredRecords().length / perPage()))
-    if (page() > lastPage)
-      page.set(lastPage)
+    clampPage()
     pushToast('success', 'Delivery route deleted', { detail: `Route #${current.id}` })
   }
   catch (error) {
@@ -225,10 +183,6 @@ async function confirmDelete(): Promise<void> {
   }
 }
 
-function goToPage(value: number): void {
-  page.set(value)
-}
-
 onMount(() => {
   void loadRoutes()
 })