Add mobile project icon thumbnails to picker

[arul28]

Summary

• Add a shared mobile project icon thumbnail resolver that emits 64px PNG data URLs from resolved project icons.
• Use the resolver for both Electron-hosted mobile summaries and the ADE CLI brain project catalog.
• Cover nativeImage thumbnailing, SVG rasterization fallback, and raw PNG fallback in project icon tests.

Verification

• npm --prefix apps/desktop exec vitest run src/main/services/projects/projectIconResolver.test.ts
• npm --prefix apps/desktop run typecheck
• npm --prefix apps/desktop run lint
• npm --prefix apps/desktop run build
• npm --prefix apps/ade-cli run typecheck
• env -u ADE_PROJECT_ROOT -u ADE_WORKSPACE_ROOT -u ADE_LANE_ID npm --prefix apps/ade-cli test
• npm --prefix apps/ade-cli run build
• node scripts/validate-docs.mjs

Summary by CodeRabbit

• Refactor
  • Improved mobile project icon resolution and caching with optimized thumbnail generation and in-memory caching (up to 64 entries) for better performance.

Greptile Summary

This PR extracts mobile project icon thumbnailing into a shared projectIconThumbnail.ts module consumed by both the Electron desktop host and the ADE CLI brain, replacing the inline 12-line snippet in main.ts with a single resolveMobileProjectIconDataUrl() call.

• New projectIconThumbnail.ts: implements a three-tier resolution chain (Electron nativeImage → macOS sips rasterizer → raw PNG data URL fallback), backed by a 64-entry LRU mtime+size-keyed cache whose key includes a \"native\"/\"headless\" context prefix to prevent cross-context cache pollution.
• main.ts: slimmed down to a one-liner delegate call; no behaviour change for desktop users.
• cli.ts: plugs resolveMobileProjectIconDataUrl() into the headless project catalog, giving mobile clients icon thumbnails even when connected to a standalone CLI brain.

Confidence Score: 5/5

Safe to merge — the change is a pure extraction/refactor with no new external dependencies and all error paths return null rather than throwing.

The new thumbnail module handles every failure path defensively (try/catch around nativeImage, sips, and file I/O; finally-block temp-dir cleanup), the LRU cache correctly distinguishes native vs. headless contexts, and the four new tests exercise the full resolution chain including the cache-isolation case. main.ts is a straightforward one-liner delegate with identical observable behaviour for desktop users.

No files require special attention. The previously flagged cross-package import in apps/ade-cli/src/cli.ts is a structural concern already on the team's radar.

Important Files Changed

Filename	Overview
apps/desktop/src/main/services/projects/projectIconThumbnail.ts	New shared thumbnail resolver with well-structured LRU cache (mtime+size keyed, native/headless context prefix), proper temp-dir cleanup in finally blocks, and bounded sips timeout. No bugs found.
apps/desktop/src/main/main.ts	Simplified to delegate to the new shared helper; previous inline nativeImage logic removed cleanly. No issues.
apps/ade-cli/src/cli.ts	Adds the new helper to the CLI project catalog; previously-flagged cross-package relative import remains but is a structural concern not a runtime bug in the current monorepo layout.
apps/desktop/src/main/services/projects/projectIconResolver.test.ts	Adds four well-targeted tests covering nativeImage path, SVG-via-sips rasterization, raw PNG fallback, and cross-context cache isolation. Test isolation is sound because each test uses a unique OS temp dir.
docs/features/project-home/README.md	Documentation updated to describe the new module and the sips fallback chain; accurate and consistent with the implementation.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
A["resolveMobileProjectIconDataUrl(projectRoot, options)"] --> B["resolveProjectIcon(projectRoot)"]
B -->|"no sourcePath"| Z1["return null"]
B -->|"sourcePath found"| C["fileSignature(sourcePath)"]
C --> D{"Cache hit?\n(key = context:sourcePath\nmtime+size match)"}
D -->|"yes"| E["LRU refresh\nreturn cached value"]
D -->|"no"| F["nativeImagePngDataUrl()\noptions.nativeImage?"]
F -->|"available & decodes"| G["nativeImage.resize(64x64).toDataURL()"]
G --> K["cache + return PNG data URL"]
F -->|"unavailable or empty"| H["sipsPngDataUrl()\ndefaultSipsRasterizer or override"]
H -->|"sips succeeds"| I["mkdtemp → sips → read → rmSync"]
I --> K
H -->|"sips fails / not macOS"| J{"icon.mimeType\n=== image/png?"}
J -->|"yes"| L["return icon.dataUrl (raw, unresized)"]
J -->|"no (SVG/ICO/WebP)"| Z2["return null"]
L --> K
K["setThumbnailCache(key, entry)"]

Loading

_{Reviews (2): Last reviewed commit: "Keep mobile icon thumbnail caches contex..." | Re-trigger Greptile}

[mintlify]

Preview deployment for your docs. Learn more about Mintlify Previews.

Project	Status	Preview	Updated (UTC)
ade-ac1c6011	🟢 Ready	View Preview	Jun 14, 2026, 11:31 PM

💡 Tip: Enable Workflows to automatically generate PRs for you.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
ade	Ignored	Preview	Jun 14, 2026 11:40pm

[coderabbitai]

📝 Walkthrough

Walkthrough

A new resolveMobileProjectIconDataUrl function is added to projectIconThumbnail.ts. It resolves a project icon into a mobile-friendly PNG data URL using three ordered strategies—nativeImage, sips, and raw PNG fallback—with an LRU-capped in-memory cache keyed by source path and file signature. The desktop main.ts and ADE CLI both switch to this new helper.

Changes

Mobile Project Icon Thumbnail Resolution

Layer / File(s)	Summary
Icon thumbnail resolver: types, cache, and resolution paths apps/desktop/src/main/services/projects/projectIconThumbnail.ts	New file introducing type shapes for NativeImage-like module, sips callback, cache entries, and the options bag; an LRU-capped in-memory cache with file-signature helpers; a default sips rasterizer using execFileSync; a nativeImage-based PNG data URL generator; a sips-based PNG data URL generator with temp-dir cleanup; and the exported resolveMobileProjectIconDataUrl resolver orchestrating all three paths.
Desktop and CLI wiring apps/desktop/src/main/main.ts, apps/ade-cli/src/cli.ts	main.ts removes inline resolveProjectIcon + resize logic from mobileProjectIconDataUrl, delegating entirely to resolveMobileProjectIconDataUrl. cli.ts adds resolveMobileProjectIconDataUrl to its dynamic imports and populates iconDataUrl on SyncMobileProjectSummary objects.
Tests for resolveMobileProjectIconDataUrl apps/desktop/src/main/services/projects/projectIconResolver.test.ts	Adds vi to the vitest import, imports resolveMobileProjectIconDataUrl with a PNG fixture and size constant, and appends three test cases covering nativeImage thumbnail, SVG-to-PNG rasterization via sips callback, and raw PNG fallback when rasterization is unavailable.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Suggested labels

desktop

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title 'Add mobile project icon thumbnails to picker' accurately and concisely summarizes the main change: introducing icon thumbnail resolution for mobile projects in the picker interface.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch ade/mobile-project-picker-icons-e900d975

---

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.}

[arul28]

@copilot review but do not make fixes