Skip to content

Retile mode ts#237

Draft
Abasz wants to merge 5 commits into0.9.8-In-Developmentfrom
retile-mode-ts
Draft

Retile mode ts#237
Abasz wants to merge 5 commits into0.9.8-In-Developmentfrom
retile-mode-ts

Conversation

@Abasz
Copy link
Copy Markdown
Collaborator

@Abasz Abasz commented Apr 13, 2026

This is the continuation of #213

Technically this feature works (and the GUI works too) but there are things that are still missing:

  • Styling issues (retile button text)
  • I dont think we have the grid size change integrated into the settings
  • We have not removed the original settings table from the settings
  • Unit test coverage

DXCanas and others added 5 commits April 12, 2026 17:56
- Add GridOrientationConfig and GridConfig types to store/types.ts
- Add gridConfig defaults (landscape: 4x2, portrait: 2x4) to appState.ts
- Update test fixtures to include the new gridConfig property

Co-authored-by: Abasz <32517724+Abasz@users.noreply.github.com>
Add slotContent parameter to all metric template functions in
dashboardMetrics.ts and the simpleMetricFactory helper. Restructure
DashboardMetric render to use CSS classes (with-icon) instead of inline
styles, and move slot inside the icon/label div.
Add :host positioning to BatteryIcon.
Add :host grid-column span and slot support to DashboardForceCurve.
Update DashboardMetric tests for new class-based rendering.

Co-authored-by: Abasz <32517724+Abasz@users.noreply.github.com>
- Add retile/submit toggle button with active state styling.
- Add reset-to-default button (visible only in retile mode).
- Move settings dialog ownership to parent via open-settings event.
- Add toggleRetileMode and resetToDefault methods that dispatch
  custom events for PerformanceDashboard to handle.

Co-authored-by: Abasz <32517724+Abasz@users.noreply.github.com>
- Replace fixed grid layout with CSS custom properties (--grid-columns,
  --grid-rows) driven by gridConfig from app state.
- Add retile mode state management: local metrics copy on enter,
  save via changeGuiSetting on submit, reset-to-default support.
- Add metric controls (remove/replace dropdown) rendered as slot content.
- Add 'add tile' panel with available metrics filtered by remaining slots.
- Handle settings dialog and workout dialog from PerformanceDashboard.
- Use component factory pattern returning (slotContent) => TemplateResult
  to support both retile controls and normal rendering.

Co-authored-by: Abasz <32517724+Abasz@users.noreply.github.com>
- Make cursor:pointer and @click on distance/calories/timer tiles
  conditional on onWorkoutOpen being defined (not shown in retile mode)
- Add stopPropagation to retile controls to prevent parent click handler
  from intercepting dropdown interactions
- Increase retile select padding and min-width for larger click area
- Add z-index to retile controls for reliable click targeting
@Abasz Abasz added this to the 0.9.8 milestone Apr 13, 2026
@JaapvanEkris
Copy link
Copy Markdown
Owner

Is this PR considered complete now?

@Abasz Abasz marked this pull request as draft April 17, 2026 08:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants