Optimize marketing navbar logo image

[sabraman]

Summary

• replace the marketing navbar logo's raw img tag with Astro's Image component
• preserve the existing artwork by using app-icon.png in apps/marketing/src/assets, which lets Astro optimize delivery for the rendered 28x28 size
• mark the above-the-fold logo as priority

Validation

• bun fmt
• bun lint
• bun typecheck

---

Note

Low Risk
Low risk: swaps a static navbar logo <img> for Astro’s optimized Image component with explicit dimensions and priority, affecting only marketing layout rendering.

Overview
Updates the marketing layout navbar logo to use Astro’s Image component instead of a raw <img>, sourcing app-icon.png from src/assets so the image can be optimized for the rendered 28x28 size.

Marks the above-the-fold logo as priority to improve initial paint/loading behavior.

^{Reviewed by Cursor Bugbot for commit 51aae21. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Optimize marketing navbar logo using Astro Image component

Replaces the plain <img src="/icon.png"> tag in Layout.astro with the astro:assets <Image> component, using a local app-icon.png asset at explicit 28x28 dimensions and priority loading. This enables Astro's built-in image optimization for the nav logo.

^{Macroscope summarized 51aae21.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. 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: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: a35d517d-9613-43a3-97ff-b7ef4a40c89c

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

---

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

[macroscopeapp]

🟠 High layouts/Layout.astro:36

The priority prop on the Image component is not a valid Astro prop. Astro's Image component from astro:assets uses loading="eager" for priority loading, not priority. The priority attribute is passed through to the HTML as a custom data attribute that browsers ignore, so the intended eager loading behavior does not occur.

            src="/icon.png"
            alt="T3"
            width={28}
            height={28}
-            priority
+            loading="eager"
            class="nav-icon"

🤖 Copy this AI Prompt to have your agent fix this:

In file apps/marketing/src/layouts/Layout.astro around lines 36-43:

The `priority` prop on the `Image` component is not a valid Astro prop. Astro's Image component from `astro:assets` uses `loading="eager"` for priority loading, not `priority`. The `priority` attribute is passed through to the HTML as a custom data attribute that browsers ignore, so the intended eager loading behavior does not occur.

[sabraman]

Astro 6 does support priority on astro:assets Image. It maps to eager loading, sync decoding, and high fetch priority for above-the-fold images, so I'm keeping that as-is.

I verified this against the current Astro docs before updating the branch.

[macroscopeapp]

Sorry, I'm unable to act on this request because you do not have permissions within this repository.

[macroscopeapp]

🟠 High layouts/Layout.astro:3

Line 3 imports icon.png (~1.1 MB) instead of the intended apple-touch-icon.png (~2.9 KB) from public/. The PR description explicitly states the goal is to use the smaller asset, but the code still references the large file, so the ~99.7% size reduction is not achieved.

-import navIcon from "../assets/icon.png";
+import navIcon from "../../public/apple-touch-icon.png";

🤖 Copy this AI Prompt to have your agent fix this:

In file apps/marketing/src/layouts/Layout.astro around line 3:

Line 3 imports `icon.png` (~1.1 MB) instead of the intended `apple-touch-icon.png` (~2.9 KB) from `public/`. The PR description explicitly states the goal is to use the smaller asset, but the code still references the large file, so the ~99.7% size reduction is not achieved.

[macroscopeapp]

Approvability

Verdict: Needs human review

3 blocking correctness issues found. Multiple unresolved review comments identify substantive issues including a potentially broken import path, invalid Astro props, and wrong image asset being used. These bugs should be addressed before merging.

^{You can customize Macroscope's approvability policy. Learn more.}

[macroscopeapp]

🔴 Critical layouts/Layout.astro:3

The import path ../../../assets/prod/black-ios-1024.png resolves to apps/assets/prod/black-ios-1024.png, which does not exist. The actual asset is at assets/prod/black-ios-1024.png. This causes a build failure when Astro attempts to resolve the image import.

Suggested change

	import navIcon from "../assets/app-icon.png";
	import navIcon from "../../../../assets/prod/black-ios-1024.png";

🤖 Copy this AI Prompt to have your agent fix this:

In file apps/marketing/src/layouts/Layout.astro around line 3:

The import path `../../../assets/prod/black-ios-1024.png` resolves to `apps/assets/prod/black-ios-1024.png`, which does not exist. The actual asset is at `assets/prod/black-ios-1024.png`. This causes a build failure when Astro attempts to resolve the image import.

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 51aae21. Configure here.}

[cursor]

Wrong image asset used for navbar logo

Medium Severity

The navIcon import in Layout.astro uses app-icon.png, the padded icon, instead of the unpadded icon.png previously displayed. Despite a confirmed fix, the import was not updated, and src/assets lacks the correct unpadded asset, causing the navbar to show the wrong artwork.

 

^{Reviewed by Cursor Bugbot for commit 51aae21. Configure here.}