feat(planning): day-cell durations as "X t Y min (Z.ZZ timer)" + outlined icons#1602
Merged
Merged
Conversation
… with outlined icons Re-style the planning day-cell (#dayColumnTemplate) presentation: - Every duration now renders as "X t Y min (Z.ZZ timer)" via a new formatDuration() helper (pause, worked/netto, paid-out flex, flex balance). Planned pause/break and planned plan-hours render as "X t Y min" (no decimal). - Negative flex is shown in red. - Time-of-day stamps stay HH:mm (unchanged). - All cell icons switch to the thin Material Symbols Outlined style. - New translatable labels t/min/timer added to all 26 i18n dicts (da + en exact; other locales use interim English fallback pending native review). Includes unit tests for formatDuration and updates the planning e2e specs (dashboard-assert / dashboard-edit-a / dashboard-edit-b / c dashboard-edit-a) to the new cell text format. Design spec, plan, and mockup under docs/superpowers. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
There was a problem hiding this comment.
Pull request overview
This PR updates the time-planning dashboard day cell (#dayColumnTemplate) presentation to show duration values in a more readable hours+minutes format and switches the cell’s icons to Material Symbols Outlined, along with adding the necessary i18n keys and updating unit/e2e tests and supporting docs.
Changes:
- Added a
formatDuration()helper to format decimal-hour values asX t Y min (Z.ZZ timer)(with an option to omit the decimal part). - Updated the day-cell template to use
formatDuration()for planned breaks/plan-hours and actual totals (pause/worked/flex), and applied outlined Material Symbols icons. - Added
t/min/timertranslations across all locales and updated unit + Playwright e2e specs; added design/plan/mockup documentation underdocs/superpowers/.
Reviewed changes
Copilot reviewed 36 out of 36 changed files in this pull request and generated 6 comments.
Show a summary per file
| File | Description |
|---|---|
| eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-plannings-table/time-plannings-table.component.ts | Adds formatDuration() and uses existing timestamp formatting for HH:mm display. |
| eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-plannings-table/time-plannings-table.component.html | Rebinds day-cell duration rows to formatDuration() and switches icons to Material Symbols Outlined. |
| eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-plannings-table/time-plannings-table.component.spec.ts | Adds unit tests for formatDuration() and confirms HH:mm stamp behavior. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/da.ts | Adds t/min/timer keys (Danish confirmed). |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/enUS.ts | Adds t/min/timer keys (English confirmed). |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/bgBG.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/csCZ.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/deDE.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/elGR.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/esES.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/etET.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/fiFI.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/frFR.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/hrHR.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/huHU.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/isIS.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/itIT.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/ltLT.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/lvLV.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/nlNL.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/noNO.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/plPL.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/ptBR.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/ptPT.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/roRO.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/skSK.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/slSL.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/svSE.ts | Adds interim fallback t/min/timer keys. |
| eform-client/src/app/plugins/modules/time-planning-pn/i18n/ukUA.ts | Adds interim fallback t/min/timer keys. |
| eform-client/playwright/e2e/plugins/time-planning-pn/b/dashboard-assert.spec.ts | Updates dashboard assertions to new day-cell text expectations. |
| eform-client/playwright/e2e/plugins/time-planning-pn/b/dashboard-edit-a.spec.ts | Updates dashboard edit flow assertions to new day-cell text expectations. |
| eform-client/playwright/e2e/plugins/time-planning-pn/b/dashboard-edit-b.spec.ts | Updates dashboard edit flow assertions to new day-cell text expectations. |
| eform-client/playwright/e2e/plugins/time-planning-pn/c/dashboard-edit-a.spec.ts | Updates expected planned-hours/break strings to match new formatting. |
| docs/superpowers/specs/2026-06-09-planning-day-cell-presentation-design.md | Adds design spec documenting the new formatting + icon style. |
| docs/superpowers/plans/2026-06-09-planning-day-cell-presentation.md | Adds implementation plan and testing checklist for the change. |
| docs/superpowers/mockups/2026-06-09-planning-day-cell-mockup.html | Adds HTML mockup illustrating target UI. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <div class="plan-text" *ngIf="row.planningPrDayModels[col.field]?.paidOutFlex !== 0"> | ||
| <div> | ||
| <span id="flexBalanceToDate{{index}}_{{col.field}}" [matTooltip]="'PaidOutFlex' | translate "><mat-icon class="neutral-icon">payments</mat-icon>{{ row.planningPrDayModels[col.field]?.paidOutFlex }}</span> | ||
| <span id="flexBalanceToDate{{index}}_{{col.field}}" [matTooltip]="'PaidOutFlex' | translate "><mat-icon fontSet="material-symbols-outlined" class="neutral-icon">payments</mat-icon>{{ formatDuration(row.planningPrDayModels[col.field]?.paidOutFlex) }}</span> |
| <div class="comment" *ngIf="row.planningPrDayModels[col.field]?.commentOffice !== null && row.planningPrDayModels[col.field]?.commentOffice !== ''"> | ||
| <div> | ||
| <span id="commentOffice{{index}}_{{col.field}}"><mat-icon class="neutral-icon" [matTooltip]="'CommentOffice' | translate ">gite</mat-icon></span> | ||
| <span id="commentOffice{{index}}_{{col.field}}"><mat-icon fontSet="material-symbols-outlined" class="neutral-icon" [matTooltip]="'CommentOffice' | translate ">gite</mat-icon></span> |
The #plannedHours{index} element (no _col suffix) is the per-worker weekly
planned-hours total in the first column, which the day-cell restyle did NOT
change. Revert those inline assertions to the H:mm format ('53:15'/'52:55');
only the day-cell #plannedHours{index}_{col} span uses the new 'X t Y min' form.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
…inutes formatDuration computed the (Z.ZZ timer) decimal from the rounded total-minutes, which drifted by 0.01 from the stored value (58.36 h rendered as 58.37). Derive the decimal from the raw value so it matches the stored hours, while the X t Y min part keeps the rounded-minutes breakdown. Adds a regression test. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Re-styles the presentation of a single day cell in the planning view (
#dayColumnTemplate). Presentation-only — no model/data/cell-colour changes.X t Y min (Z.ZZ timer)via a newformatDuration()helper: pause total, worked/netto hours, paid-out flex, flex balance.X t Y min(no decimal).Translation
New
t/min/timerkeys in all 26 i18n dicts. Danish (t/min/timer) and English (h/min/hrs) confirmed; the other 24 locales use an interim English fallback pending native review.Tests
formatDuration(sub-hour, h+min, whole-hour, negative, no-decimal, zero/negative-zero, rounding carry, comma-string, null).b/dashboard-assert,b/dashboard-edit-a,b/dashboard-edit-b;c/dashboard-edit-adata fields adjusted — that spec asserts input values, not cell text). Shift time ranges and the export are untouched.Design spec, implementation plan, and an HTML mockup are under
docs/superpowers/.🤖 Generated with Claude Code