feat: align App of the Day widget UI

[stackingsaunter]

Summary

• keep current App of the Day selection logic unchanged
• replace the bottom Open button with a chevron row layout matching Recently Used Apps
• move App of the Day to the left Home column above the Alby Go card

Test plan

• Run cd frontend && yarn tsc:compile
• Verify App of the Day appears above Alby Go on Home
• Verify clicking the row still navigates to the correct app page

Made with Cursor

Summary by CodeRabbit

• Refactor

  • Relocated "App of the Day" widget from the right column to the left column
  • Updated widget interaction to function as a full-width clickable card instead of a separate button action

• Style

  • Refined card layout spacing and text rendering formatting

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 29e99437-90aa-49fb-8d6e-7a521b7e5721

📥 Commits

Reviewing files that changed from the base of the PR and between c0e8df6 and 0b33532.

📒 Files selected for processing (2)

• frontend/src/components/home/widgets/AppOfTheDayWidget.tsx
• frontend/src/screens/Home.tsx

---

📝 Walkthrough

Walkthrough

The "App of the Day" widget was repositioned on the home page from the right column to the left column, and its interaction pattern was refactored to use a full-width card link instead of a separate footer action button.

Changes

Cohort / File(s)	Summary
Widget Interaction Refactor frontend/src/components/home/widgets/AppOfTheDayWidget.tsx	Replaced the "Open" footer action button with a full-width react-router-dom Link wrapper around the card content (logo, title/description, chevron icon). Updated layout styling (header/content padding, removed footer) and text rendering (title truncation, description line-clamping). Changed image alt text to dynamic app title.
Layout Repositioning frontend/src/screens/Home.tsx	Moved AppOfTheDayWidget from the right column grid (after LightningMessageboardWidget) to the left column grid (after SupportAlbyWidget).

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 A widget hops from right to left so bright,
Its footer fades, the card becomes the sight—
One click, one link, no button need apply,
The app of the day now catches every eye! ✨

🚥 Pre-merge checks | ✅ 3

✅ 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 'feat: align App of the Day widget UI' directly describes the main change: updating the widget's UI to match the Recently Used Apps chevron row layout and repositioning it in the Home column layout.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ 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 feat/app-of-day-ui-polish

---

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

[reneaaron]

Updated some minor things as some of the definitions would collide with theme variables.

tACK