Krow/Krow-workspace

Files

Achintha Isuru 0f0714c55b feat: add shimmer loading skeletons for various pages and components

- Implemented UiShimmer as a core shimmer wrapper for animated gradient effects.
- Created shimmer presets for list items, stats cards, section headers, and more.
- Developed specific skeletons for billing, invoices, coverage, hubs, reports, payments, shifts, and home pages.
- Enhanced user experience by providing visual placeholders during data loading.

2026-03-10 13:21:30 -04:00

1.5 KiB

Raw Blame History

Mobile Architecture Reviewer Memory

Project Structure

Features: apps/mobile/packages/features/{client,staff}/<feature>/
Design System: apps/mobile/packages/design_system/
Shimmer primitives: design_system/lib/src/widgets/shimmer/ (UiShimmer, UiShimmerBox, UiShimmerCircle, UiShimmerLine, presets)
UiConstants spacing: space0=0, space1=4, space2=8, space3=12, space4=16, space5=20, space6=24, space8=32, space10=40, space12=48

Design System Conventions

UiConstants.radiusLg, radiusMd, radiusSm, radiusFull are static final (not const) - cannot use const at call sites
Shimmer placeholder dimensions (width/height of boxes/lines/circles) are visual content sizes, not spacing - the design system presets use UiConstants for these too
Divider(height: 1, thickness: 0.5) is a common pattern in the codebase for thin dividers

Common Pre-Existing Issues (Do Not Flag as New)

Report detail pages use hardcoded top: 60 for AppBar clearance (all 6 report pages)
Payments page and billing page have hardcoded strings (pre-existing, not part of shimmer changes)
shift_details_page.dart has hardcoded strings and Navigator.of usage (pre-existing)

Review Patterns

Skeleton files are pure presentation widgets (StatelessWidget) - no BLoC, no business logic, no navigation
Skeleton files only import design_system and flutter/material.dart - clean dependency
Barrel file index.dart in reports_page/ widgets dir is an internal barrel, not public API