Skip to content

feat(mobile): add delightful loading screen for mobile users#5454

Open
nimrodkra wants to merge 4 commits intomainfrom
eng-604-make-mobile-loading-screen-on-mobile-more-delightful
Open

feat(mobile): add delightful loading screen for mobile users#5454
nimrodkra wants to merge 4 commits intomainfrom
eng-604-make-mobile-loading-screen-on-mobile-more-delightful

Conversation

@nimrodkra
Copy link
Member

@nimrodkra nimrodkra commented Feb 5, 2026

Summary

  • Add MobileAppLoader component with floating logo animation and spinner for a polished loading experience
  • Integrate into MainLayout to display during app initialization on mobile instead of a blank screen
  • Uses existing design system tokens and float-animation utility class

Closes ENG-604


Created by Huginn 🐦‍⬛

Preview domain

https://eng-604-make-mobile-loading-scre.preview.app.daily.dev

Add MobileAppLoader component with floating logo animation and spinner
for a more polished loading experience on mobile devices. The component
displays during app initialization instead of showing a blank screen.

Changes:
- Create MobileAppLoader component with float-animation utility
- Integrate into MainLayout for mobile-only loading state

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
@vercel
Copy link

vercel bot commented Feb 5, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
daily-webapp Ready Ready Preview Feb 5, 2026 2:39pm
1 Skipped Deployment
Project Deployment Actions Updated (UTC)
storybook Ignored Ignored Feb 5, 2026 2:39pm

Request Review

@rebelchris
Copy link
Contributor

I'm not 100% sure this will be the one you want to replace. I think that one lives in iOS but this should be ok to push and try..

Copy link
Contributor

@capJavert capJavert left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This now blinks on all resolutions.

Was this supposed to be just for iOS or native?

- Change detection from viewport-based to isPWA() for PWA-only display
- Use cloudinary app icon (cloudinaryAppIconMain) for consistent branding
- Apply iOS-style rounded corners (22%) to the square icon

Co-authored-by: Cursor <cursoragent@cursor.com>
@nimrodkra
Copy link
Member Author

@rebelchris @capJavert you're faster than light. Yes I saw these issues and made some changes that should reflect better what I intended to do

Co-authored-by: Cursor <cursoragent@cursor.com>
Copy link
Contributor

@rebelchris rebelchris left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Go for it, think you still get that square loading bar on the iOS app though if that's what you wanted to change:?

(!isPageReady && isPageApplicableForOnboarding) ||
shouldRedirectOnboarding
) {
if (typeof window !== 'undefined' && isPWA()) {
Copy link
Contributor

@capJavert capJavert Feb 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We also have:

  • iOS native app - isIOSNative helper
  • Android app - isAndroidApp in AuthContext

I know clunky but just if you wanted to target those as well.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants