Package Exports
- react-native-advanced-network
- react-native-advanced-network/lib/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-advanced-network) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
React Native Advanced Network Library
A flexible and extensible React Native networking library built with the decorator pattern. This library provides a robust solution for handling HTTP requests with support for:
- ๐ Authentication - Seamless authentication integration
- ๐พ Caching - Efficient caching for improved performance
- ๐ Automatic retries - Configurable retry logic for handling transient failures
- ๐ Fallback mechanisms - Fallback support for robust error handling
- ๐งช Highly testable - Provided mocks for easy testing
Easily chainable decorators allow you to customize your network stack to fit your specific needs. Built with TypeScript and modern JavaScript, this library offers a modern, efficient approach to networking in React Native applications.
Installation
npm install react-native-advanced-network
# or
yarn add react-native-advanced-network
Quick Start
import {
BaseNetworkRequestable,
authenticated,
cached,
retry,
fallback,
HTTPMethod
} from 'react-native-advanced-network';
// Create a basic network client
const baseClient = new BaseNetworkRequestable('https://api.example.com');
// Create a client with all decorators
const networkClient = authenticated(
cached(
retry(
fallback(
baseClient,
() => new BaseNetworkRequestable('https://fallback-api.example.com')
)
)
),
() => 'your-auth-token',
(endpoint) => endpoint.startsWith('/secure')
);
// Make a request
const getData = async () => {
try {
const response = await networkClient.request('/users', HTTPMethod.GET);
console.log('Response:', response);
} catch (error) {
console.error('Error:', error);
}
};
Core Components
NetworkRequestable Interface
The base interface for all network requests.
interface NetworkRequestable {
request<T>(
endpoint: string,
method: HTTPMethod,
body?: Record<string, any>,
responseType?: new () => T,
headers?: Record<string, string>
): Promise<T>;
}
BaseNetworkRequestable
The fundamental implementation of NetworkRequestable.
Decorators
AuthenticatedDecorator
Adds authentication to requests.
function authenticated(
networkRequestable: NetworkRequestable,
tokenProvider: () => string | null | undefined,
needsAuth: (endpoint: string) => boolean,
headerName: string = 'Authorization'
): NetworkRequestable
CacheDecorator
Implements caching for requests.
function cached(
networkRequestable: NetworkRequestable,
cache: Cache = new MemoryCache(),
ttl: number | null = null,
cacheMethods: HTTPMethod[] = [HTTPMethod.GET]
): CacheDecorator
RetryDecorator
Adds retry functionality to requests.
function retry(
networkRequestable: NetworkRequestable,
options: Partial<RetryOptions> = {}
): NetworkRequestable
FallbackDecorator
Provides a fallback mechanism for failed requests.
function fallback(
networkRequestable: NetworkRequestable,
fallbackProvider: () => NetworkRequestable,
options: Partial<FallbackOptions> = {}
): NetworkRequestable
Usage
Create a network requestable object with desired decorators:
import {
createNetworkClient,
authenticated,
cached,
retry,
fallback,
HTTPMethod,
BaseNetworkRequestable
} from 'react-native-advanced-network';
// Create a base client
const baseClient = createNetworkClient('https://api.example.com');
// Add decorators
const networkClient = baseClient
.authenticated(
() => AsyncStorage.getItem('authToken'),
(endpoint) => endpoint.includes('secure')
)
.cached()
.retry({ maxAttempts: 3 })
.fallback(() => createNetworkClient('https://fallback-api.example.com'));
// Make a request
const fetchData = async () => {
try {
const result = await networkClient.request(
'/users',
HTTPMethod.GET,
null,
null,
{ 'Accept-Language': 'en-US' }
);
console.log('Data:', result);
} catch (error) {
console.error('Error:', error);
}
};
Testing
Use MockNetworkRequestable
and MockCache
for unit testing:
import { MockNetworkRequestable, HTTPMethod } from 'react-native-advanced-network';
// Create a mock
const mockClient = new MockNetworkRequestable();
// Mock a response
mockClient.mockResponse('/users', HTTPMethod.GET, [{ id: 1, name: 'John' }]);
// Use in your tests
const result = await mockClient.request('/users', HTTPMethod.GET);
// result = [{ id: 1, name: 'John' }]
Error Handling
The library uses a custom NetworkError
class for error cases:
enum NetworkErrorType {
INVALID_URL = 'INVALID_URL',
NO_DATA = 'NO_DATA',
DECODING_ERROR = 'DECODING_ERROR',
HTTP_ERROR = 'HTTP_ERROR',
UNAUTHORIZED = 'UNAUTHORIZED',
CUSTOM = 'CUSTOM',
TIMEOUT = 'TIMEOUT',
NETWORK_FAILURE = 'NETWORK_FAILURE'
}
Handle these errors appropriately in your application code:
try {
const result = await networkClient.request('/users', HTTPMethod.GET);
// Handle successful response
} catch (error) {
if (error instanceof NetworkError) {
switch (error.type) {
case NetworkErrorType.UNAUTHORIZED:
// Handle unauthorized error
break;
case NetworkErrorType.TIMEOUT:
// Handle timeout error
break;
// Handle other error types
}
}
}
License
MIT