Completed the full mobile app polish pass: navigation feel, safe‑area consistency, input styling, list rows, FAB
patterns, skeleton loading, photo selection/bulk actions with shared‑element transitions, notification detail sheet,
offline banner, maskable manifest icons, and route prefetching.
Key changes
- Navigation/shell: press feedback on all header actions, glassy sticky header and tab bar, safer bottom spacing
(resources/js/admin/mobile/components/MobileShell.tsx, resources/js/admin/mobile/components/BottomNav.tsx).
- Forms + lists: shared mobile form controls, list‑style rows in settings/profile, consistent inputs across core
flows (resources/js/admin/mobile/components/FormControls.tsx, resources/js/admin/mobile/SettingsPage.tsx,
resources/js/admin/mobile/ProfilePage.tsx, resources/js/admin/mobile/EventFormPage.tsx, resources/js/admin/mobile/
EventMembersPage.tsx, resources/js/admin/mobile/EventTasksPage.tsx, resources/js/admin/mobile/
EventGuestNotificationsPage.tsx, resources/js/admin/mobile/NotificationsPage.tsx, resources/js/admin/mobile/
EventPhotosPage.tsx, resources/js/admin/mobile/EventsPage.tsx).
- Media workflows: shared‑element photo transitions, selection mode + bulk actions bar (resources/js/admin/mobile/
EventPhotosPage.tsx).
- Loading UX: shimmering skeletons (resources/css/app.css, resources/js/admin/mobile/components/Primitives.tsx).
- PWA polish + perf: maskable icons, offline banner hook, and route prefetch (public/manifest.json, resources/js/
admin/mobile/hooks/useOnlineStatus.tsx, resources/js/admin/mobile/prefetch.ts, resources/js/admin/main.tsx).
This commit is contained in:
@@ -33,6 +33,7 @@ const MobileLoginPage = React.lazy(() => import('./mobile/LoginPage'));
|
||||
const MobileDashboardPage = React.lazy(() => import('./mobile/DashboardPage'));
|
||||
const MobileTasksTabPage = React.lazy(() => import('./mobile/TasksTabPage'));
|
||||
const MobileUploadsTabPage = React.lazy(() => import('./mobile/UploadsTabPage'));
|
||||
const MobileAnimatedOutlet = React.lazy(() => import('./mobile/components/MobileAnimatedOutlet'));
|
||||
|
||||
function RequireAuth() {
|
||||
const { status } = useAuth();
|
||||
@@ -50,7 +51,11 @@ function RequireAuth() {
|
||||
return <Navigate to={ADMIN_LOGIN_START_PATH} state={{ from: location }} replace />;
|
||||
}
|
||||
|
||||
return <Outlet />;
|
||||
return (
|
||||
<React.Suspense fallback={<Outlet />}>
|
||||
<MobileAnimatedOutlet />
|
||||
</React.Suspense>
|
||||
);
|
||||
}
|
||||
|
||||
function LandingGate() {
|
||||
|
||||
Reference in New Issue
Block a user