diff --git a/.jules/bolt.md b/.jules/bolt.md index 57daf471..1263f3bc 100644 --- a/.jules/bolt.md +++ b/.jules/bolt.md @@ -3,3 +3,9 @@ **Learning:** `Date.parse(value)` returns the timestamp primitive directly, while `new Date(value).getTime()` also constructs a `Date` object. Both use the same ECMAScript string-parsing semantics for these call sites. **Action:** In frequently executed paths that only need a timestamp primitive, prefer `Date.parse(value)`. Treat the allocation reduction as a bounded micro-optimization unless a committed benchmark establishes a larger runtime effect. + +## 2026-10-09 - `Math.max` array spread optimization with `useMemo` + +**Learning:** When using `Math.max(...array)` on potentially large arrays within React components, it triggers the spread operator on every render, which can lead to 'Maximum call stack size exceeded' for very large arrays, and recalculates unnecessarily. + +**Action:** In React components that render lists or depend on max value calculations from array props, use `.reduce()` instead of the spread operator to prevent call stack issues, and wrap the calculation with `useMemo` to prevent recalculation on every render. diff --git a/packages/web/src/app/dashboard/[orgSlug]/settings/members/page.tsx b/packages/web/src/app/dashboard/[orgSlug]/settings/members/page.tsx index 5d6ef680..bba5b871 100644 --- a/packages/web/src/app/dashboard/[orgSlug]/settings/members/page.tsx +++ b/packages/web/src/app/dashboard/[orgSlug]/settings/members/page.tsx @@ -83,7 +83,7 @@ function MembersTable({ const removeMember = useRemoveMember(orgSlug) const [errorByUser, setErrorByUser] = useState>({}) - const maxCost = Math.max(...members.map((m) => m.sevenDayCostUsd), 0) + const maxCost = members.reduce((max, m) => Math.max(max, m.sevenDayCostUsd), 0) const canChangeToOwner = currentRole === 'OWNER' const adminCount = members.filter( (m) => m.role === 'OWNER' || m.role === 'MANAGER' diff --git a/packages/web/src/components/dashboard/reports/delegation-insight.tsx b/packages/web/src/components/dashboard/reports/delegation-insight.tsx index ecb6b7c4..f3bb86f4 100644 --- a/packages/web/src/components/dashboard/reports/delegation-insight.tsx +++ b/packages/web/src/components/dashboard/reports/delegation-insight.tsx @@ -28,7 +28,7 @@ export function DelegationInsight({ insight, orgSlug }: DelegationInsightProps) ) } - const maxCount = Math.max(1, ...insight.topAgents.map((a) => a.callCount)) + const maxCount = insight.topAgents.reduce((max, a) => Math.max(max, a.callCount), 1) return (