Sergei
2b36f801f1
- Add useLoadingState hook with data/loading/error state management - Add useSimpleLoading hook for basic boolean loading state - Add useMultipleLoadingStates hook for tracking multiple items - Create Skeleton component with shimmer animation for placeholders - Create specialized skeletons: SkeletonText, SkeletonAvatar, SkeletonCard, SkeletonListItem, SkeletonBeneficiaryCard, SkeletonSensorCard - Create LoadingOverlay components: modal, inline, and card variants - Create ScreenLoading wrapper with loading/error/content states - Create RefreshableScreen with built-in pull-to-refresh - Create EmptyState and LoadingButtonState utility components - Add comprehensive tests for all components and hooks (61 tests passing) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
58 lines
1.7 KiB
TypeScript
58 lines
1.7 KiB
TypeScript
import React from 'react';
|
|
import { render } from '@testing-library/react-native';
|
|
import {
|
|
LoadingOverlay,
|
|
InlineLoadingOverlay,
|
|
LoadingCardOverlay,
|
|
} from '@/components/ui/LoadingOverlay';
|
|
|
|
describe('LoadingOverlay', () => {
|
|
it('renders nothing when visible is false', () => {
|
|
const { toJSON } = render(<LoadingOverlay visible={false} />);
|
|
expect(toJSON()).toBeNull();
|
|
});
|
|
|
|
it('renders modal when visible is true', () => {
|
|
const { getByText } = render(<LoadingOverlay visible={true} />);
|
|
expect(getByText('Loading...')).toBeTruthy();
|
|
});
|
|
|
|
it('renders custom message', () => {
|
|
const { getByText } = render(
|
|
<LoadingOverlay visible={true} message="Saving..." />
|
|
);
|
|
expect(getByText('Saving...')).toBeTruthy();
|
|
});
|
|
});
|
|
|
|
describe('InlineLoadingOverlay', () => {
|
|
it('renders nothing when visible is false', () => {
|
|
const { toJSON } = render(<InlineLoadingOverlay visible={false} />);
|
|
expect(toJSON()).toBeNull();
|
|
});
|
|
|
|
it('renders overlay when visible is true', () => {
|
|
const { toJSON } = render(<InlineLoadingOverlay visible={true} />);
|
|
expect(toJSON()).toBeTruthy();
|
|
});
|
|
|
|
it('renders with message', () => {
|
|
const { getByText } = render(
|
|
<InlineLoadingOverlay visible={true} message="Loading data..." />
|
|
);
|
|
expect(getByText('Loading data...')).toBeTruthy();
|
|
});
|
|
});
|
|
|
|
describe('LoadingCardOverlay', () => {
|
|
it('renders nothing when visible is false', () => {
|
|
const { toJSON } = render(<LoadingCardOverlay visible={false} />);
|
|
expect(toJSON()).toBeNull();
|
|
});
|
|
|
|
it('renders overlay when visible is true', () => {
|
|
const { toJSON } = render(<LoadingCardOverlay visible={true} />);
|
|
expect(toJSON()).toBeTruthy();
|
|
});
|
|
});
|