Drop preview image fallback

[prxt6529]

Summary by CodeRabbit

• Bug Fixes
  • Improved IPFS URL resolution for preview images and promotional videos to ensure more reliable and consistent loading from distributed content gateways.
  • Enhanced image rendering throughout drop previews with robust fallback support, allowing images to gracefully display alternatives when primary sources fail to load, improving experience during network issues.

[coderabbitai]

Warning

Rate limit exceeded

@prxt6529 has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 53 minutes and 30 seconds before requesting another review.

To keep reviews running without waiting, you can enable usage-based add-on for your organization. This allows additional reviews beyond the hourly cap. Account admins can enable it under billing.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 20cf97fb-e4a0-4bfb-8585-4beb387b55c6

📥 Commits

Reviewing files that changed from the base of the PR and between 5f34dbf and 1281237.

📒 Files selected for processing (1)

• __tests__/components/waves/drop/WaveDropAdditionalInfo.test.tsx

📝 Walkthrough

Walkthrough

The PR refactors IPFS URL resolution in drop-related components and helpers, replacing parseIpfsUrl with resolveIpfsUrlSync for deterministic gateway URL resolution. Image rendering is migrated from next/image to FallbackImage component, with corresponding test updates to verify the new behavior.

Changes

Cohort / File(s)	Summary
IPFS URL Resolution Refactoring helpers/waves/drop.helpers.ts, components/waves/drop/WaveDropAdditionalInfo.tsx	Replaced parseIpfsUrl with resolveIpfsUrlSync for preview image and promo video URL resolution, enabling synchronous deterministic gateway URL mapping.
Image Component Migration components/waves/drop/WaveDropAdditionalInfo.tsx	Migrated image rendering from next/image to FallbackImage for preview images and artwork tiles, providing primary (scaled) and fallback (original) URLs.
Test Updates for URL Resolution __tests__/helpers/waves/drop.helpers.test.ts	Mocked resolveIpfsUrlSync to deterministically resolve ipfs:// URLs to test gateway, updated assertions from substring checks to exact equality against resolved gateway URLs.
Test Updates for Component Integration __tests__/components/waves/drop/WaveDropAdditionalInfo.test.tsx	Mocked FallbackImage and resolveIpfsUrlSync; added test verifying that preview image carries correct data-fallback-src attribute with resolved gateway URL.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• PR #2282: Adjusts when preview image URL is used in drop preview logic, complementing this PR's changes to how the URL is resolved and rendered.
• PR #1876: Uses getDropPreviewImageUrl downstream in MyStreamWaveMyVote; affected by this PR's modifications to URL resolution strategy.
• PR #2138: Related IPFS URL normalization changes, switching between parseIpfsUrl and resolveIpfsUrlSync with corresponding test updates.

Suggested reviewers

• ragnep
• GelatoGenesis

Poem

🐰 From parse to resolve, IPFS takes its toll,
Gateways now sync'd with a deterministic goal,
FallbackImages bloom where next/image once grew,
Each wave drop adorned with a fallback view—
The rabbit hops onward, URLs true! 🌐

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'Drop preview image fallback' clearly summarizes the main change: adding fallback image handling for drop preview images by migrating from next/image to FallbackImage component.
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.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch drop-preview-image-fallback

---

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

_{Review rate limit: 0/1 reviews remaining, refill in 53 minutes and 30 seconds.}

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

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@__tests__/components/waves/drop/WaveDropAdditionalInfo.test.tsx`:
- Around line 10-16: The test currently asserts a mock-only DOM attribute
data-fallback-src produced by the mocked FallbackImage, which doesn't exist in
production; update WaveDropAdditionalInfo.test.tsx to stop asserting
data-fallback-src and instead assert that the mocked FallbackImage received the
expected fallbackSrc prop (e.g., by checking the props passed to the
FallbackImage mock or using Jest's toHaveBeenCalledWith/props inspection for the
FallbackImage mock component) so the test verifies the prop contract rather than
a mock-specific rendered attribute.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 626fcc67-007e-4144-bde3-afe78abcd23b

📥 Commits

Reviewing files that changed from the base of the PR and between dbad364 and 5f34dbf.

📒 Files selected for processing (4)

• __tests__/components/waves/drop/WaveDropAdditionalInfo.test.tsx
• __tests__/helpers/waves/drop.helpers.test.ts
• components/waves/drop/WaveDropAdditionalInfo.tsx
• helpers/waves/drop.helpers.ts

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud