chore: change image output format from Webp to Avif

[stnguyen90]

What does this PR do?

Use AVIF over WebP because it results in a smaller file

Test Plan

Manual:

Related PRs and Issues

• WEBP images preview not working in 1.8.0 appwrite#10699

Have you read the Contributing Guidelines on issues?

Yes

Summary by CodeRabbit

• Improvements
  • Enhanced screenshot preview quality and performance in the sites grid view.

[railway-app]

This PR was not deployed automatically as @stnguyen90 does not have access to the Railway project.

In order to get automatic PR deploys, please add @stnguyen90 to your workspace on Railway.

[appwrite]

Console

Project ID: 688b7bf400350cbd60e9

Sites (1)

Site	Status	Logs	Preview	QR
console-stage 688b7cf6003b1842c9dc	Queued	View Logs	Preview URL

Tip

Cursor pagination performs better than offset pagination when loading further pages.

[coderabbitai]

Walkthrough

Replaces image preview output from ImageFormat.Webp to ImageFormat.Avif across multiple UI pages (sites grid, site card, storage bucket list, storage file page). Adds ImageFormat to imports where needed. No control flow, logic, or public API signatures were otherwise changed.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Changes are homogeneous (same parameter swap and import additions across several files). Review mainly for correct imports and no unintended regressions in preview requests.

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 pull request title "chore: change image output format from Webp to Avif" directly and accurately reflects the primary objective of the changeset. Across all four modified files (grid.svelte, siteCard.svelte, bucket page, and file page), the changes consistently implement a single, cohesive purpose: replacing ImageFormat.Webp with ImageFormat.Avif in image preview requests. The title is concise, specific enough to convey the main change without noise, and clearly communicates what a developer would find when reviewing the changeset.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch chore-avif-site-preview

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 4410dbf and 2dbdb5b.

📒 Files selected for processing (4)

• src/routes/(console)/project-[region]-[project]/sites/(components)/siteCard.svelte (1 hunks)
• src/routes/(console)/project-[region]-[project]/sites/grid.svelte (1 hunks)
• src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/+page.svelte (2 hunks)
• src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/file-[file]/+page.svelte (2 hunks)

🚧 Files skipped from review as they are similar to previous changes (1)

• src/routes/(console)/project-[region]-[project]/sites/grid.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). (2)

• GitHub Check: e2e
• GitHub Check: build

🔇 Additional comments (4)

src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/+page.svelte (2)

12-12: Import correctly updated.

The ImageFormat import has been properly added to support the AVIF output parameter.

---

48-61: AVIF output parameter properly added.

The implementation correctly adds the output: ImageFormat.Avif parameter to generate AVIF preview thumbnails for storage files. As noted in the siteCard.svelte review, ensure browser compatibility for your user base.

src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/file-[file]/+page.svelte (2)

38-38: Import correctly updated.

The ImageFormat import has been properly added to support the AVIF output parameter.

---

53-63: AVIF output parameter properly added.

The implementation correctly adds the output: ImageFormat.Avif parameter for file preview generation, consistent with the other files in this PR.

---

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