Fix plan image caching

[FyreByrd]

Summary by CodeRabbit

• Refactor
  • Optimized the image loading mechanism in the plans section to improve performance and support multiple application versions with different image asset structures.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

The pull request refactors image import logic in src/routes/plans/+page.svelte, replacing the asset() function-based approach with version-conditional dynamic glob imports. If programVersion < 12.0, images are imported from /src/gen-assets/illustrations; otherwise, from /src/gen-assets/plans (excluding JSON files). Image source references are updated to use the new glob-based retrieval.

Changes

Cohort / File(s)	Summary
Image Import Refactoring src/routes/plans/+page.svelte	Removed asset import; replaced static image folder logic with version-conditional dynamic glob imports; updated all image source references from asset(...) to glob-mapped lookups

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

• Verify glob import syntax and correctness for both version branches (< 12.0 and >= 12.0)
• Confirm image path transformation from /.../plan.image.file to ./${plan.image.file} resolves correctly
• Test conditional logic to ensure correct glob mapping is loaded based on programVersion

Possibly related PRs

• #893: Modifies the same file's image path resolution logic; switching from static to asset-based approach (inverse direction of this PR's refactoring)

Suggested reviewers

• davidmoore1

Poem

🐰 Images dance in globs today,
No more assets lead the way!
Version checks guide the migration,
Dynamic paths—a fresh foundation! ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'Fix plan image caching' directly relates to the main change: replacing static image folder logic with version-conditional dynamic glob imports to improve image caching behavior.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix/plan-images

---

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

[coderabbitai]

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

src/routes/plans/+page.svelte (1)

128-132: Use nullish coalescing operator for missing images.

The {#if plan.image} guard only checks if the image object exists, not whether the file is present in imageFolder. If plan.image.file doesn't match an imported file, src becomes undefined. Use the pattern already applied in Sidebar.svelte (line 275):

src={imageFolder[`./${plan.image.file}`] ?? ''}

This gracefully handles missing images by using an empty string fallback.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between a761d2a and ad6776c.

📒 Files selected for processing (1)

• src/routes/plans/+page.svelte (4 hunks)

🧰 Additional context used

🧠 Learnings (2)

📚 Learning: 2025-07-04T18:51:27.821Z

Learnt from: chrisvire
Repo: sillsdev/appbuilder-pwa PR: 845
File: src/routes/text/+page.svelte:3-3
Timestamp: 2025-07-04T18:51:27.821Z
Learning: In SvelteKit 2.12 and Svelte 5, `$app/stores` was deprecated in favor of `$app/state`. When migrating from Svelte 4 to Svelte 5, imports should be changed from `import { page } from '$app/stores';` to `import { page } from '$app/state';`. This change aligns with Svelte 5's reactivity model and provides more granular control over state updates.

Applied to files:

• src/routes/plans/+page.svelte

📚 Learning: 2025-07-04T18:51:27.821Z

Learnt from: chrisvire
Repo: sillsdev/appbuilder-pwa PR: 845
File: src/routes/text/+page.svelte:3-3
Timestamp: 2025-07-04T18:51:27.821Z
Learning: In Svelte 5, the `page` store is imported from `$app/state` instead of `$app/stores`. This is part of the migration from Svelte 4 to Svelte 5 where `$app/stores` is being deprecated in favor of `$app/state`.

Applied to files:

• src/routes/plans/+page.svelte

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: test