fix(ui): surface ship designer workflow by FennexFox · Pull Request #41 · FennexFox/TI_Engine_Charts

FennexFox · 2026-06-15T07:13:47Z

What changed

Replaced the compact icon-only Dry Mass Calculator affordance with a visible in-card Open Ship Designer / Edit Ship Design CTA.
Added Ship Designer card copy and status text that explain hull, armor, modules, dry mass, no-template state, and applied-design summary.
Kept the existing Dry Mass Calculator modal and dryMassCalcButton wiring instead of creating a second ship-design implementation.
Added browser verifier coverage for the promoted CTA, status summaries, localization, and modal-open/apply behavior.
Added the completed issue Make the existing Ship Designer discoverable as a core workflow #32 phase plan under docs/plan/issue_32/.

Why

First-time users were missing the existing Ship Designer workflow, and the previous emoji/icon-only control did not explain that hull, armor, modules, and dry-mass assumptions could be configured there.
Refs: Make the existing Ship Designer discoverable as a core workflow #32

How

Updated the source template, styles, dynamic UI state, and i18n mappings for the Ship Designer card.
Reused updateShipDesignerPanel() from modal rendering so language changes and modal rerenders preserve the player-facing CTA text.
Regenerated generated page output through the UI build flow.
Generated output / deployment impact:
- docs/index.html regenerated.
- docs/assets/js/ui/control_state.js regenerated.
- docs/assets/js/ui/dry_mass_calculator.js regenerated.
- No catalog output or GitHub Pages workflow changes.

Testing

Build / validation:
- npm run build
- npm run verify
- strict phase-plan validation for docs/plan/issue_32
Manual verification:
- Focused Playwright smoke against the built page for desktop and mobile Ship Designer card states.
- Confirmed default English card shows Open Ship Designer, assumption copy, no-template status, and dry mass.
- Confirmed the CTA opens/focuses the existing modal.
- Confirmed applying a named design shows Edit Ship Design, selected design name, and dry mass outside the modal.
- Confirmed Korean CTA/status/description localization.
Generated files:
- No generated files changed
- docs/index.html regenerated
- Catalog outputs regenerated
- GitHub Pages workflow affected

Risk / Rollback

Risk areas:
- Left-panel copy could crowd narrow viewports.
- Dynamic status copy could drift from modal state if future changes bypass updateShipDesignerPanel().
Rollback / mitigation:
- Browser verifier and focused smoke cover text CTA, modal open/apply, localization, and mobile containment.
- Revert this commit and rerun npm run build to restore generated output if needed.

Reviewer Checklist

Linked issue, investigation, or release item when applicable
README or docs updated if behavior or defaults changed
Generated output and deployment impact called out
Verification steps are specific enough to reproduce
Risk and rollback are concrete for shipped behavior

PR Classification (optional)

Justification:
This corrects discoverability for an existing Ship Designer workflow without adding a second designer implementation.

- replace the icon-only calculator affordance with a visible Ship Designer CTA - show hull, armor, modules, dry mass copy and applied-design summary - update browser verifier coverage and regenerated published assets Refs: #32

…elements

…module effects

chatgpt-codex-connector · 2026-06-15T08:54:36Z

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.

Copilot

Pull request overview

This PR promotes the existing Ship Designer / Dry Mass Calculator workflow to a prominent, in-card text CTA with clearer status/copy, while keeping the underlying modal implementation and adding browser verifier coverage to prevent regressions.

Changes:

Reworked the Ship Designer card UI so the primary entry point is a visible text CTA and the status includes dry mass and applied design summary.
Updated i18n/static text mappings and modal rerender behavior so CTA/status text stays correct across language changes.
Expanded browser verification to assert CTA placement, localization, and apply-flow behavior; documented the #32 phase plan in docs/plan/issue_32/.

Reviewed changes

Copilot reviewed 13 out of 14 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
tools/verify_drive_comparison_browser.mjs	Adds browser verifier assertions for the new Ship Designer CTA/status and localization behavior.
tools/drive_comparison_template.html	Updates Ship Designer card markup and (currently) inlines connection-line controls markup.
tools/drive_comparison_styles.css	Adjusts Ship Designer card styling for the new CTA/status layout.
tools/drive_comparison_i18n.py	Extends static English replacements / block replacements for new UI copy.
tools/drive_comparison_client/ui/dry_mass_calculator.js	Ensures modal rerenders refresh Ship Designer panel text via `updateShipDesignerPanel()`.
tools/drive_comparison_client/ui/control_state.js	Updates Ship Designer CTA/status copy and removes module-effects summary line output.
tools/drive_comparison_client/calc/filtering.js	Adjusts hidden-summary accounting scope (excludes alien rows).
docs/plan/issue_32/00-master-plan.md	Adds issue #32 implementation master plan documentation.
docs/plan/issue_32/01-ship-designer-entry.md	Adds phase plan for promoting Ship Designer entry point.
docs/plan/issue_32/02-verification.md	Adds phase plan for build + browser verification outcomes.
docs/assets/js/ui/dry_mass_calculator.js	Generated publish output reflecting source UI changes.
docs/assets/js/ui/control_state.js	Generated publish output reflecting source UI changes.
docs/assets/js/calc/filtering.js	Generated publish output reflecting source calc changes.

+            <div id="connectionLineControls" class="connection-line-controls" aria-label="연결선 표시">
+              <div class="connection-line-mode-label">연결선</div>
+              <div class="segmented compact connection-line-mode" role="radiogroup" aria-label="연결선 표시">
+                <label title="연결선을 숨깁니다." aria-label="끔: 연결선을 숨깁니다."><input type="radio" name="connectionLineMode" value="off" title="연결선을 숨깁니다.">끔</label>
+                <label title="드라이브 연구 선후관계가 확인되는 연결선만 표시합니다." aria-label="엄격: 드라이브 연구 선후관계가 확인되는 연결선만 표시합니다."><input type="radio" name="connectionLineMode" value="strict" title="드라이브 연구 선후관계가 확인되는 연결선만 표시합니다.">엄격</label>
+                <label title="드라이브 연구 연결선에 더해 반응로/전원 계통 진행선을 표시합니다." aria-label="계통: 드라이브 연구 연결선에 더해 반응로/전원 계통 진행선을 표시합니다."><input type="radio" name="connectionLineMode" value="lineage" title="드라이브 연구 연결선에 더해 반응로/전원 계통 진행선을 표시합니다." checked>계통</label>
+                <label title="넓은 계열 보조선까지 포함해 가능한 진행선을 모두 표시합니다." aria-label="전체: 넓은 계열 보조선까지 포함해 가능한 진행선을 모두 표시합니다."><input type="radio" name="connectionLineMode" value="all" title="넓은 계열 보조선까지 포함해 가능한 진행선을 모두 표시합니다.">전체</label>
+              </div>
+            </div>


FennexFox · 2026-06-15T09:22:19Z

I agree that duplicating runtime-rendered controls as pre-hydration placeholders adds maintenance burden.

For this PR, I think it is still acceptable as a short-term mitigation to reduce the pre-JS layout/content mismatch, but I agree it should not become the long-term pattern. The better direction is to replace these per-control static placeholders with a small loading app shell / loading screen, so static HTML does not need to mirror complex interactive controls.

I’ll track that separately and keep this PR scoped to the current Ship Designer / control-surface cleanup rather than expanding it into a broader boot/loading-state refactor.

fix(ui): surface ship designer workflow

7b6e225

- replace the icon-only calculator affordance with a visible Ship Designer CTA - show hull, armor, modules, dry mass copy and applied-design summary - update browser verifier coverage and regenerated published assets Refs: #32

FennexFox mentioned this pull request Jun 15, 2026

Make the existing Ship Designer discoverable as a core workflow #32

Closed

8 tasks

FennexFox self-assigned this Jun 15, 2026

FennexFox added 2 commits June 15, 2026 17:05

refactor(ui): remove redundant ship designer description and summary …

1a64270

…elements

feat(i18n): add Korean translations for connection line controls and …

b99c311

…module effects

FennexFox requested a review from Copilot June 15, 2026 08:54

FennexFox marked this pull request as ready for review June 15, 2026 08:54

Copilot started reviewing on behalf of FennexFox June 15, 2026 08:54 View session

Copilot AI reviewed Jun 15, 2026

View reviewed changes

FennexFox mentioned this pull request Jun 15, 2026

Replace static pre-hydration control placeholders with a loading app shell #42

Closed

6 tasks

FennexFox merged commit aa8bb76 into develop Jun 15, 2026
1 check passed

FennexFox deleted the issue_32 branch June 15, 2026 09:23

FennexFox added a commit that referenced this pull request Jun 16, 2026

fix(ui): surface ship designer workflow (#41)

663c89b

FennexFox mentioned this pull request Jun 16, 2026

feat(ui): improve chart setup and preset workflows #50

Merged

13 of 27 tasks

Navigation Menu

Uh oh!

fix(ui): surface ship designer workflow - #41

fix(ui): surface ship designer workflow#41
FennexFox merged 3 commits into
developfrom
issue_32

FennexFox commented Jun 15, 2026

Uh oh!

chatgpt-codex-connector Bot commented Jun 15, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

FennexFox commented Jun 15, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

FennexFox commented Jun 15, 2026

What changed

Why

How

Testing

Risk / Rollback

Reviewer Checklist

PR Classification (optional)

Uh oh!

chatgpt-codex-connector Bot commented Jun 15, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

FennexFox commented Jun 15, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants