CONV-087: Render target format cards

[menvil]

CONV-087 — Render Target Format Cards

Renders the target-format choices as clickable cards built from view models.

Changes

• Add targetFormatCards computed property mapping availableTargets (ConverterTarget) to TargetFormatCardViewModel.
• Format step Blade now renders a responsive grid of clickable cards (file icon + label + description) with wire:click="selectTargetFormat(...)". No hardcoded cards. Selection handler lands in CONV-091.

Tests

• PNG renders Convert PNG to heading + JPG/WEBP/PDF cards with descriptions and a clickable selectTargetFormat('jpg') button.
• targetFormatCards exposes TargetFormatCardViewModel instances.

composer test (185), composer lint, npm run build all pass.

🤖 Generated with Claude Code

---

Summary by cubic

Implements CONV-087 by rendering target format options as clickable cards built from view models in the format step. Replaces hardcoded options with a responsive grid showing icons, labels, and descriptions.

• New Features
  • Added targetFormatCards computed property mapping availableTargets (ConverterTarget) to TargetFormatCardViewModel.
  • Updated Blade to render a responsive grid of buttons with <x-file-icon>, label, and description; clicking calls selectTargetFormat('<format>').
  • Added tests for PNG that assert the heading, card labels/descriptions, the wire:click handler, and that targetFormatCards exposes TargetFormatCardViewModel instances.

^{Written for commit 42e08fa. Summary will update on new commits.}

[coderabbitai]

Important

Review skipped

Auto reviews are limited based on label configuration.

🏷️ Required labels (at least one) (1)

• release

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 839b6f63-9454-4642-a491-79afc988e329

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feature/CONV-087-render-target-format-cards

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}