feat(dashboard): refine chart mobile prices, align baseline, and replace fourth metric with purchases #160

Merged

yuris merged 2 commits from feat/159-chart-mobile-prices-and-purchases-kpi into main 2026-09-29 20:26:05 +00:00

Conversation 4 Commits 2 Files changed 3 +80 -23

yuris commented 2026-09-29 20:19:33 +00:00

Owner

Copy link

Closes #159.

What changed

• Compacted chart bar prices on mobile to prevent horizontal collisions.
• Aligned chart baseline horizontally across all 6 columns and removed disorienting elevated box styling on the current month column.
• Replaced fourth metric card with "TOTAL BELANJA STOK (PEMBELIAN)", displaying current month purchase volume, invoice count, and incoming SKU count.

Verified

• pnpm --filter garage test (all 26 test files passed)
• pnpm --filter garage typecheck (clean exit 0)
• pnpm --filter garage lint (clean exit 0)

Deviations

none.

Closes #159. ## What changed - Compacted chart bar prices on mobile to prevent horizontal collisions. - Aligned chart baseline horizontally across all 6 columns and removed disorienting elevated box styling on the current month column. - Replaced fourth metric card with "TOTAL BELANJA STOK (PEMBELIAN)", displaying current month purchase volume, invoice count, and incoming SKU count. ## Verified - `pnpm --filter garage test` (all 26 test files passed) - `pnpm --filter garage typecheck` (clean exit 0) - `pnpm --filter garage lint` (clean exit 0) ## Deviations none.

yuris added 1 commit 2026-09-29 20:19:33 +00:00

feat(dashboard): refine chart mobile prices, align baseline, and replace fourth metric with purchases 4ff353e2ed

yuris commented 2026-09-29 20:22:25 +00:00

Author

Owner

Copy link

VERDICT: request-changes

• Chart labels still use whitespace-nowrap with Rp at 9px. At 320px the grid columns are about 37px wide, and values such as Rp 999,9 Jt can overlap adjacent labels or extend beyond the chart. Constrain the mobile labels to their columns (apps/management/app/(dashboard)/page.tsx:370-378).
• formatChartPrice(999_950) produces Rp 1 Jt, although all amounts below one million must use rb. Change the cutoff to one million (apps/management/lib/currency.ts:26-30).
• formatChartPrice(1_000_000) produces Rp 1 Jt; the acceptance criterion requires one decimal place (Rp 1,0 Jt). Set both minimum and maximum fraction digits to 1 and adjust the test (apps/management/lib/currency.ts:31-36).

Verification in wt-159: pnpm --filter garage test passed (505 tests); pnpm --filter garage typecheck passed; pnpm --filter garage lint passed (four warnings and two informational diagnostics in unrelated files, no fixes applied).

VERDICT: request-changes - Chart labels still use `whitespace-nowrap` with `Rp` at 9px. At 320px the grid columns are about 37px wide, and values such as `Rp 999,9 Jt` can overlap adjacent labels or extend beyond the chart. Constrain the mobile labels to their columns (apps/management/app/(dashboard)/page.tsx:370-378). - `formatChartPrice(999_950)` produces `Rp 1 Jt`, although all amounts below one million must use `rb`. Change the cutoff to one million (apps/management/lib/currency.ts:26-30). - `formatChartPrice(1_000_000)` produces `Rp 1 Jt`; the acceptance criterion requires one decimal place (`Rp 1,0 Jt`). Set both minimum and maximum fraction digits to 1 and adjust the test (apps/management/lib/currency.ts:31-36). Verification in wt-159: `pnpm --filter garage test` passed (505 tests); `pnpm --filter garage typecheck` passed; `pnpm --filter garage lint` passed (four warnings and two informational diagnostics in unrelated files, no fixes applied).

yuris added 1 commit 2026-09-29 20:23:40 +00:00

fix(dashboard): constrain mobile chart labels and refine currency cutoff precision 27fba7e14d

yuris commented 2026-09-29 20:23:46 +00:00

Author

Owner

Copy link

Round 1 addressed:

• Changed formatChartPrice threshold cutoff to abs < 1_000_000, so amounts like 999_950 are properly formatted in rb.
• Formatted amounts 1M and above with minimumFractionDigits: 1, maximumFractionDigits: 1 (Rp 1,0 Jt).
• Added prefix toggle to formatChartPrice. Mobile displays compact form without Rp (e.g. 683 rb, 1,0 Jt) and desktop displays full form with Rp .
• Constrained mobile chart labels with w-full max-w-full truncate text-[8px] sm:text-xs text-center and reduced column horizontal padding on mobile (px-0.5 sm:px-2.5).
• Updated unit tests; all 26 test files passed, typecheck and lint clean.

Round 1 addressed: - Changed `formatChartPrice` threshold cutoff to `abs < 1_000_000`, so amounts like `999_950` are properly formatted in `rb`. - Formatted amounts 1M and above with `minimumFractionDigits: 1, maximumFractionDigits: 1` (`Rp 1,0 Jt`). - Added prefix toggle to `formatChartPrice`. Mobile displays compact form without `Rp ` (e.g. `683 rb`, `1,0 Jt`) and desktop displays full form with `Rp `. - Constrained mobile chart labels with `w-full max-w-full truncate text-[8px] sm:text-xs text-center` and reduced column horizontal padding on mobile (`px-0.5 sm:px-2.5`). - Updated unit tests; all 26 test files passed, typecheck and lint clean.

yuris commented 2026-09-29 20:25:27 +00:00

Author

Owner

Copy link

VERDICT: approve

Round 1 findings are resolved: mobile chart labels use compact prices without Rp, while desktop retains Rp; labels are constrained with w-full max-w-full truncate and text-[8px] sm:text-xs. The rb cutoff is abs < 1_000_000, and million values use one fixed decimal (1,0 Jt).

Verification in wt-159: pnpm --filter garage test passed (26 files, 506 tests); pnpm --filter garage typecheck passed; pnpm --filter garage lint passed (four warnings and two informational diagnostics in unrelated files; no fixes applied).

VERDICT: approve Round 1 findings are resolved: mobile chart labels use compact prices without Rp, while desktop retains Rp; labels are constrained with w-full max-w-full truncate and text-[8px] sm:text-xs. The rb cutoff is abs < 1_000_000, and million values use one fixed decimal (1,0 Jt). Verification in wt-159: pnpm --filter garage test passed (26 files, 506 tests); pnpm --filter garage typecheck passed; pnpm --filter garage lint passed (four warnings and two informational diagnostics in unrelated files; no fixes applied).

yuris commented 2026-09-29 20:26:01 +00:00

Author

Owner

Copy link

All verification checks passed:

• pnpm --filter garage test: 26 files passed, 506 tests passed
• pnpm --filter garage typecheck: clean exit 0
• pnpm --filter garage lint: clean exit 0

Merge checklist (§7) complete with reviewer approval. Merging now (merging deploys to production via container build/publish on push to main).

All verification checks passed: - `pnpm --filter garage test`: 26 files passed, 506 tests passed - `pnpm --filter garage typecheck`: clean exit 0 - `pnpm --filter garage lint`: clean exit 0 Merge checklist (§7) complete with reviewer approval. Merging now (merging deploys to production via container build/publish on push to main).

yuris merged commit 06dacfe2e0 into main 2026-09-29 20:26:05 +00:00

yuris deleted branch feat/159-chart-mobile-prices-and-purchases-kpi 2026-09-29 20:26:05 +00:00

yuris referenced this pull request from a commit 2026-09-29 20:26:07 +00:00

feat(dashboard): refine chart mobile prices, align baseline, and replace fourth metric with purchases (#160)

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels

No items

No labels

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

yuris/garage!160

No description provided.