@umituz/react-native-subscription 2.14.99 → 2.14.100
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +211 -394
- package/package.json +1 -1
- package/src/application/README.md +46 -225
- package/src/application/ports/README.md +42 -97
- package/src/domain/README.md +36 -384
- package/src/domain/constants/README.md +0 -56
- package/src/domain/entities/README.md +43 -169
- package/src/domain/errors/README.md +33 -287
- package/src/domain/value-objects/README.md +43 -179
- package/src/domains/README.md +50 -238
- package/src/domains/README.md.bak +274 -0
- package/src/domains/config/README.md +93 -383
- package/src/domains/config/domain/README.md +23 -376
- package/src/domains/config/domain/entities/README.md +34 -343
- package/src/domains/paywall/README.md +99 -369
- package/src/domains/paywall/components/README.md +34 -178
- package/src/domains/paywall/entities/README.md +34 -193
- package/src/domains/paywall/hooks/README.md +34 -122
- package/src/domains/wallet/README.md +34 -275
- package/src/domains/wallet/README.md.bak +209 -0
- package/src/domains/wallet/domain/README.md +34 -101
- package/src/domains/wallet/domain/entities/README.md +34 -115
- package/src/domains/wallet/domain/errors/README.md +34 -151
- package/src/domains/wallet/infrastructure/README.md +34 -89
- package/src/domains/wallet/presentation/components/README.md +34 -224
- package/src/domains/wallet/presentation/hooks/README.md +34 -248
- package/src/infrastructure/README.md +37 -496
- package/src/infrastructure/mappers/README.md +0 -13
- package/src/infrastructure/repositories/README.md +74 -360
- package/src/infrastructure/services/README.md +95 -370
- package/src/presentation/README.md +123 -408
- package/src/presentation/README.md.bak +172 -0
- package/src/presentation/components/README.md +151 -179
- package/src/presentation/components/README.md.bak +217 -0
- package/src/presentation/components/details/CreditRow.md +65 -310
- package/src/presentation/components/details/DetailRow.md +63 -255
- package/src/presentation/components/details/PremiumDetailsCard.md +65 -238
- package/src/presentation/components/details/PremiumStatusBadge.md +64 -239
- package/src/presentation/components/details/README.md +97 -447
- package/src/presentation/components/feedback/PaywallFeedbackModal.md +63 -287
- package/src/presentation/components/feedback/README.md +97 -445
- package/src/presentation/components/paywall/PaywallModal.md +66 -416
- package/src/presentation/components/paywall/README.md +50 -186
- package/src/presentation/components/sections/README.md +97 -466
- package/src/presentation/components/sections/SubscriptionSection.md +92 -244
- package/src/presentation/hooks/README.md +154 -741
- package/src/presentation/hooks/useAuthAwarePurchase.md +58 -325
- package/src/presentation/hooks/useAuthGate.md +61 -375
- package/src/presentation/hooks/useAuthSubscriptionSync.md +66 -370
- package/src/presentation/hooks/useCreditChecker.md +73 -378
- package/src/presentation/hooks/useCredits.md +74 -313
- package/src/presentation/hooks/useCredits.md.bak +231 -0
- package/src/presentation/hooks/useCreditsGate.md +66 -318
- package/src/presentation/hooks/useDeductCredit.md +0 -76
- package/src/presentation/hooks/useDevTestCallbacks.md +63 -394
- package/src/presentation/hooks/useFeatureGate.md +105 -150
- package/src/presentation/hooks/useFeatureGate.md.bak +284 -0
- package/src/presentation/hooks/useInitializeCredits.md +64 -430
- package/src/presentation/hooks/usePaywall.md +61 -306
- package/src/presentation/hooks/usePaywallOperations.md +64 -458
- package/src/presentation/hooks/usePaywallVisibility.md +67 -316
- package/src/presentation/hooks/usePremium.md +84 -226
- package/src/presentation/hooks/usePremiumGate.md +60 -395
- package/src/presentation/hooks/usePremiumWithCredits.md +64 -401
- package/src/presentation/hooks/useSubscription.md +66 -422
- package/src/presentation/hooks/useSubscriptionDetails.md +65 -410
- package/src/presentation/hooks/useSubscriptionGate.md +80 -164
- package/src/presentation/hooks/useSubscriptionSettingsConfig.md +66 -346
- package/src/presentation/hooks/useSubscriptionStatus.md +66 -396
- package/src/presentation/hooks/useUserTier.md +63 -328
- package/src/presentation/hooks/useUserTierWithRepository.md +64 -424
- package/src/presentation/screens/README.md +48 -190
- package/src/presentation/types/README.md +0 -16
- package/src/presentation/utils/README.md +0 -21
- package/src/revenuecat/README.md +99 -518
- package/src/revenuecat/application/README.md +35 -150
- package/src/revenuecat/application/ports/README.md +34 -162
- package/src/revenuecat/domain/README.md +42 -141
- package/src/revenuecat/domain/constants/README.md +34 -176
- package/src/revenuecat/domain/entities/README.md +34 -374
- package/src/revenuecat/domain/errors/README.md +47 -191
- package/src/revenuecat/domain/types/README.md +34 -366
- package/src/revenuecat/domain/value-objects/README.md +34 -434
- package/src/revenuecat/infrastructure/README.md +34 -43
- package/src/revenuecat/infrastructure/config/README.md +32 -23
- package/src/revenuecat/infrastructure/handlers/README.md +34 -211
- package/src/revenuecat/infrastructure/managers/README.md +34 -42
- package/src/revenuecat/infrastructure/services/README.md +35 -318
- package/src/revenuecat/infrastructure/utils/README.md +34 -375
- package/src/revenuecat/presentation/README.md +34 -176
- package/src/revenuecat/presentation/hooks/README.md +29 -35
- package/src/utils/README.md +38 -525
package/README.md
CHANGED
|
@@ -2,460 +2,277 @@
|
|
|
2
2
|
|
|
3
3
|
Complete subscription management with RevenueCat, paywall UI, and credits system for React Native apps.
|
|
4
4
|
|
|
5
|
-
##
|
|
6
|
-
|
|
7
|
-
- 🚀 **RevenueCat Integration** - Full RevenueCat SDK integration with auto-initialization
|
|
8
|
-
- 💳 **Subscription Management** - Handle monthly, annual, and lifetime subscriptions
|
|
9
|
-
- 💰 **Credits System** - Built-in credits system with transaction tracking
|
|
10
|
-
- 🎨 **Paywall Components** - Beautiful, customizable paywall UI components
|
|
11
|
-
- 🔐 **Gate System** - Premium, auth, and credit gates for feature access control
|
|
12
|
-
- 🌍 **Multi-language Support** - Built-in i18n support
|
|
13
|
-
- 📊 **Analytics Ready** - Track subscription events and user behavior
|
|
14
|
-
- 🏗️ **DDD Architecture** - Domain-driven design with clean architecture
|
|
15
|
-
|
|
16
|
-
## Installation
|
|
17
|
-
|
|
18
|
-
```bash
|
|
19
|
-
npm install @umituz/react-native-subscription
|
|
20
|
-
# or
|
|
21
|
-
yarn add @umituz/react-native-subscription
|
|
22
|
-
```
|
|
5
|
+
## Package Overview
|
|
23
6
|
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
```json
|
|
27
|
-
{
|
|
28
|
-
"@tanstack/react-query": ">=5.0.0",
|
|
29
|
-
"expo-constants": ">=16.0.0",
|
|
30
|
-
"expo-image": ">=2.0.0",
|
|
31
|
-
"firebase": ">=10.0.0",
|
|
32
|
-
"react": ">=18.2.0",
|
|
33
|
-
"react-native": ">=0.74.0",
|
|
34
|
-
"react-native-purchases": ">=7.0.0",
|
|
35
|
-
"react-native-safe-area-context": ">=5.0.0"
|
|
36
|
-
}
|
|
37
|
-
```
|
|
7
|
+
**Import Path**: `@umituz/react-native-subscription`
|
|
38
8
|
|
|
39
|
-
|
|
9
|
+
**Version**: Latest
|
|
40
10
|
|
|
41
|
-
|
|
11
|
+
**Type**: React Native Package
|
|
42
12
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
<SubscriptionProvider
|
|
50
|
-
config={{
|
|
51
|
-
revenueCatApiKey: 'your_api_key',
|
|
52
|
-
revenueCatEntitlementId: 'premium',
|
|
53
|
-
}}
|
|
54
|
-
>
|
|
55
|
-
<YourApp />
|
|
56
|
-
</SubscriptionProvider>
|
|
57
|
-
);
|
|
58
|
-
}
|
|
13
|
+
This package provides comprehensive subscription and credit management with:
|
|
14
|
+
- RevenueCat integration for subscriptions
|
|
15
|
+
- Credits system with transaction tracking
|
|
16
|
+
- Paywall UI components
|
|
17
|
+
- Feature gating (premium, auth, credits)
|
|
18
|
+
- DDD architecture with clean layers
|
|
59
19
|
|
|
60
|
-
|
|
61
|
-
await initializeSubscription({
|
|
62
|
-
revenueCatApiKey: process.env.REVENUECAT_API_KEY,
|
|
63
|
-
revenueCatEntitlementId: 'premium',
|
|
64
|
-
});
|
|
65
|
-
```
|
|
20
|
+
## Strategy
|
|
66
21
|
|
|
67
|
-
###
|
|
22
|
+
### Architecture Principles
|
|
68
23
|
|
|
69
|
-
|
|
70
|
-
|
|
24
|
+
1. **Domain-Driven Design (DDD)**
|
|
25
|
+
- Separate domains: Wallet, Paywall, Config
|
|
26
|
+
- Each domain has its own entities, rules, and boundaries
|
|
27
|
+
- Business logic stays in domain layer
|
|
71
28
|
|
|
72
|
-
|
|
73
|
-
|
|
29
|
+
2. **Clean Architecture**
|
|
30
|
+
- Presentation: React hooks and components
|
|
31
|
+
- Application: Use cases and orchestration
|
|
32
|
+
- Domain: Entities and business rules
|
|
33
|
+
- Infrastructure: External integrations
|
|
74
34
|
|
|
75
|
-
|
|
35
|
+
3. **Separation of Concerns**
|
|
36
|
+
- UI components are pure and reusable
|
|
37
|
+
- Business logic is in hooks and services
|
|
38
|
+
- Data persistence is abstracted behind repositories
|
|
76
39
|
|
|
77
|
-
|
|
78
|
-
return <UpgradePrompt />;
|
|
79
|
-
}
|
|
40
|
+
### Integration Flow
|
|
80
41
|
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
42
|
+
1. **Initialization**
|
|
43
|
+
- Configure RevenueCat with API key
|
|
44
|
+
- Set up Firebase for credits storage
|
|
45
|
+
- Initialize providers at app root
|
|
84
46
|
|
|
85
|
-
|
|
47
|
+
2. **Subscription Management**
|
|
48
|
+
- Check user tier and subscription status
|
|
49
|
+
- Gate premium features
|
|
50
|
+
- Handle purchase flows
|
|
86
51
|
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
return (
|
|
94
|
-
<>
|
|
95
|
-
<Button onPress={() => setIsVisible(true)} title="Upgrade" />
|
|
96
|
-
|
|
97
|
-
<PaywallModal
|
|
98
|
-
isVisible={isVisible}
|
|
99
|
-
onClose={() => setIsVisible(false)}
|
|
100
|
-
config={{
|
|
101
|
-
title: 'Unlock Premium',
|
|
102
|
-
description: 'Get unlimited access',
|
|
103
|
-
features: [
|
|
104
|
-
{ icon: 'star', text: 'Unlimited credits' },
|
|
105
|
-
{ icon: 'zap', text: 'AI-powered tools' },
|
|
106
|
-
],
|
|
107
|
-
}}
|
|
108
|
-
/>
|
|
109
|
-
</>
|
|
110
|
-
);
|
|
111
|
-
}
|
|
112
|
-
```
|
|
52
|
+
3. **Credits System**
|
|
53
|
+
- Initialize credits on purchase
|
|
54
|
+
- Deduct credits for feature usage
|
|
55
|
+
- Track all transactions
|
|
56
|
+
- Handle credit exhaustion
|
|
113
57
|
|
|
114
|
-
|
|
58
|
+
4. **Paywall Display**
|
|
59
|
+
- Show paywall on feature gates
|
|
60
|
+
- Handle purchase operations
|
|
61
|
+
- Manage paywall visibility state
|
|
115
62
|
|
|
116
|
-
|
|
117
|
-
import { useCreditsGate } from '@umituz/react-native-subscription';
|
|
118
|
-
|
|
119
|
-
function FeatureWithCredits() {
|
|
120
|
-
const { hasCredits, consumeCredit } = useCreditsGate({
|
|
121
|
-
creditCost: 5,
|
|
122
|
-
featureId: 'ai_generation',
|
|
123
|
-
});
|
|
124
|
-
|
|
125
|
-
const handleAction = async () => {
|
|
126
|
-
if (!hasCredits) {
|
|
127
|
-
showPaywall();
|
|
128
|
-
return;
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
const result = await consumeCredit();
|
|
132
|
-
if (result.success) {
|
|
133
|
-
await performAction();
|
|
134
|
-
}
|
|
135
|
-
};
|
|
136
|
-
|
|
137
|
-
return <Button onPress={handleAction} title="Use Feature (5 credits)" />;
|
|
138
|
-
}
|
|
139
|
-
```
|
|
63
|
+
### Key Dependencies
|
|
140
64
|
|
|
141
|
-
|
|
65
|
+
- **RevenueCat**: `react-native-purchases` >= 7.0.0
|
|
66
|
+
- **Firebase**: `firebase` >= 10.0.0
|
|
67
|
+
- **State Management**: `@tanstack/react-query` >= 5.0.0
|
|
68
|
+
- **React Native**: `react-native` >= 0.74.0
|
|
142
69
|
|
|
143
|
-
|
|
70
|
+
## Restrictions
|
|
144
71
|
|
|
145
|
-
|
|
72
|
+
### REQUIRED
|
|
146
73
|
|
|
147
|
-
- **
|
|
148
|
-
- **
|
|
149
|
-
- **
|
|
74
|
+
- **RevenueCat Configuration**: MUST provide valid API key and entitlement ID
|
|
75
|
+
- **Firebase Setup**: MUST initialize Firebase for credits system
|
|
76
|
+
- **Provider Setup**: MUST wrap app with `SubscriptionProvider`
|
|
77
|
+
- **Authentication**: MUST have authenticated user for credits operations
|
|
78
|
+
- **Error Handling**: MUST handle all error states appropriately
|
|
150
79
|
|
|
151
|
-
###
|
|
80
|
+
### PROHIBITED
|
|
152
81
|
|
|
153
|
-
- **
|
|
154
|
-
- **
|
|
155
|
-
- **
|
|
156
|
-
- **
|
|
82
|
+
- **NEVER** use subscription hooks outside provider
|
|
83
|
+
- **NEVER** deduce credits without checking balance first
|
|
84
|
+
- **NEVER** gate features without proper user feedback
|
|
85
|
+
- **DO NOT** bypass gate hooks for premium features
|
|
86
|
+
- **DO NOT** initialize RevenueCat multiple times
|
|
157
87
|
|
|
158
|
-
###
|
|
88
|
+
### CRITICAL SAFETY
|
|
159
89
|
|
|
160
|
-
- **
|
|
161
|
-
- **
|
|
162
|
-
- **
|
|
163
|
-
- **
|
|
90
|
+
- **ALWAYS** check loading states before rendering
|
|
91
|
+
- **ALWAYS** handle edge cases (no subscription, expired, etc)
|
|
92
|
+
- **ALWAYS** validate return values from credit operations
|
|
93
|
+
- **NEVER** assume user has premium or credits
|
|
94
|
+
- **MUST** implement proper error boundaries
|
|
164
95
|
|
|
165
|
-
##
|
|
96
|
+
## Rules
|
|
166
97
|
|
|
167
|
-
###
|
|
98
|
+
### Provider Setup
|
|
168
99
|
|
|
169
100
|
```typescript
|
|
170
|
-
//
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
//
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
// Paywall
|
|
186
|
-
import {
|
|
187
|
-
usePaywall,
|
|
188
|
-
usePaywallActions,
|
|
189
|
-
usePaywallVisibility,
|
|
190
|
-
} from '@umituz/react-native-subscription';
|
|
191
|
-
|
|
192
|
-
// User Tier
|
|
193
|
-
import {
|
|
194
|
-
useUserTier,
|
|
195
|
-
useAuthGate,
|
|
196
|
-
useFeatureGate,
|
|
197
|
-
} from '@umituz/react-native-subscription';
|
|
101
|
+
// CORRECT - Wrap app with provider
|
|
102
|
+
<SubscriptionProvider config={{ revenueCatApiKey: 'xxx' }}>
|
|
103
|
+
<App />
|
|
104
|
+
</SubscriptionProvider>
|
|
105
|
+
|
|
106
|
+
// INCORRECT - No provider
|
|
107
|
+
<App /> // Hooks will fail
|
|
108
|
+
|
|
109
|
+
// INCORRECT - Multiple providers
|
|
110
|
+
<SubscriptionProvider>
|
|
111
|
+
<SubscriptionProvider> // Duplicate
|
|
112
|
+
<App />
|
|
113
|
+
</SubscriptionProvider>
|
|
114
|
+
</SubscriptionProvider>
|
|
198
115
|
```
|
|
199
116
|
|
|
200
|
-
###
|
|
117
|
+
### Feature Gating
|
|
201
118
|
|
|
202
119
|
```typescript
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
// Paywall components
|
|
211
|
-
PaywallModal,
|
|
212
|
-
PaywallScreen,
|
|
213
|
-
SubscriptionSection,
|
|
214
|
-
|
|
215
|
-
// Feedback
|
|
216
|
-
PaywallFeedbackModal,
|
|
217
|
-
} from '@umituz/react-native-subscription';
|
|
218
|
-
```
|
|
219
|
-
|
|
220
|
-
### Services
|
|
120
|
+
// CORRECT - Use gate hooks
|
|
121
|
+
const { canAccess, showPaywall } = usePremiumGate();
|
|
122
|
+
if (!canAccess) {
|
|
123
|
+
showPaywall();
|
|
124
|
+
return;
|
|
125
|
+
}
|
|
221
126
|
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
SubscriptionService,
|
|
227
|
-
|
|
228
|
-
// Credits
|
|
229
|
-
configureCreditsRepository,
|
|
230
|
-
getCreditsRepository,
|
|
231
|
-
|
|
232
|
-
// RevenueCat
|
|
233
|
-
useRevenueCat,
|
|
234
|
-
useCustomerInfo,
|
|
235
|
-
useRestorePurchase,
|
|
236
|
-
} from '@umituz/react-native-subscription';
|
|
127
|
+
// INCORRECT - Manual check
|
|
128
|
+
if (!user.isPremium) { // No feedback, no paywall
|
|
129
|
+
return;
|
|
130
|
+
}
|
|
237
131
|
```
|
|
238
132
|
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
### Complete Premium Feature Example
|
|
133
|
+
### Credit Operations
|
|
242
134
|
|
|
243
135
|
```typescript
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
useCreditsGate,
|
|
249
|
-
useUserTier,
|
|
250
|
-
PaywallModal,
|
|
251
|
-
} from '@umituz/react-native-subscription';
|
|
252
|
-
|
|
253
|
-
function PremiumFeature() {
|
|
254
|
-
const { tier, isPremium } = useUserTier();
|
|
255
|
-
const { canAccess, showPaywall } = usePremiumGate({
|
|
256
|
-
featureId: 'ai_tools',
|
|
257
|
-
});
|
|
258
|
-
|
|
259
|
-
const { hasCredits, credits, consumeCredit } = useCreditsGate({
|
|
260
|
-
creditCost: 5,
|
|
261
|
-
featureId: 'ai_generation',
|
|
262
|
-
});
|
|
263
|
-
|
|
264
|
-
const handleGenerate = async () => {
|
|
265
|
-
if (!canAccess) {
|
|
266
|
-
showPaywall();
|
|
267
|
-
return;
|
|
268
|
-
}
|
|
269
|
-
|
|
270
|
-
if (isPremium) {
|
|
271
|
-
// Premium: unlimited access
|
|
272
|
-
await generateContent();
|
|
273
|
-
} else if (hasCredits) {
|
|
274
|
-
// Free: use credits
|
|
275
|
-
const result = await consumeCredit();
|
|
276
|
-
if (result.success) {
|
|
277
|
-
await generateContent();
|
|
278
|
-
}
|
|
279
|
-
} else {
|
|
280
|
-
// No access: show upgrade
|
|
281
|
-
showPaywall();
|
|
282
|
-
}
|
|
283
|
-
};
|
|
284
|
-
|
|
285
|
-
return (
|
|
286
|
-
<View>
|
|
287
|
-
<Text>Tier: {tier}</Text>
|
|
288
|
-
{!isPremium && <Text>Credits: {credits}</Text>}
|
|
289
|
-
|
|
290
|
-
<Button
|
|
291
|
-
onPress={handleGenerate}
|
|
292
|
-
title={
|
|
293
|
-
isPremium
|
|
294
|
-
? 'Generate (Unlimited)'
|
|
295
|
-
: 'Generate (5 credits)'
|
|
296
|
-
}
|
|
297
|
-
/>
|
|
298
|
-
</View>
|
|
299
|
-
);
|
|
136
|
+
// CORRECT - Check return value
|
|
137
|
+
const success = await deductCredit(5);
|
|
138
|
+
if (success) {
|
|
139
|
+
executeFeature();
|
|
300
140
|
}
|
|
141
|
+
|
|
142
|
+
// INCORRECT - Assume success
|
|
143
|
+
await deductCredit(5);
|
|
144
|
+
executeFeature(); // May execute if deduction failed
|
|
301
145
|
```
|
|
302
146
|
|
|
303
|
-
###
|
|
147
|
+
### Loading States
|
|
304
148
|
|
|
305
149
|
```typescript
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
}
|
|
313
|
-
|
|
314
|
-
function SettingsScreen() {
|
|
315
|
-
const { subscription, isLoading, refetch } = useSubscription();
|
|
316
|
-
const [refreshing, setRefreshing] = React.useState(false);
|
|
317
|
-
|
|
318
|
-
const handleRefresh = async () => {
|
|
319
|
-
setRefreshing(true);
|
|
320
|
-
await refetch();
|
|
321
|
-
setRefreshing(false);
|
|
322
|
-
};
|
|
323
|
-
|
|
324
|
-
return (
|
|
325
|
-
<ScrollView
|
|
326
|
-
refreshControl={
|
|
327
|
-
<RefreshControl refreshing={refreshing} onRefresh={handleRefresh} />
|
|
328
|
-
}
|
|
329
|
-
>
|
|
330
|
-
<SubscriptionSection
|
|
331
|
-
subscription={subscription}
|
|
332
|
-
onPress={() => navigation.navigate('SubscriptionDetail')}
|
|
333
|
-
/>
|
|
334
|
-
|
|
335
|
-
{subscription?.isPremium && (
|
|
336
|
-
<PremiumDetailsCard
|
|
337
|
-
status={subscription}
|
|
338
|
-
onManagePress={handleManageSubscription}
|
|
339
|
-
/>
|
|
340
|
-
)}
|
|
341
|
-
</ScrollView>
|
|
342
|
-
);
|
|
343
|
-
}
|
|
150
|
+
// CORRECT - Respect loading
|
|
151
|
+
if (isLoading) return <Spinner />;
|
|
152
|
+
if (!isPremium) return <UpgradePrompt />;
|
|
153
|
+
return <Content />;
|
|
154
|
+
|
|
155
|
+
// INCORRECT - Ignore loading
|
|
156
|
+
{!isPremium && <UpgradePrompt />} // Flickers during load
|
|
344
157
|
```
|
|
345
158
|
|
|
346
|
-
##
|
|
159
|
+
## AI Agent Guidelines
|
|
347
160
|
|
|
348
|
-
###
|
|
161
|
+
### When Implementing Features
|
|
349
162
|
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
plans: {
|
|
358
|
-
monthly: monthlyPlan,
|
|
359
|
-
annual: annualPlan,
|
|
360
|
-
lifetime: lifetimePlan,
|
|
361
|
-
},
|
|
362
|
-
|
|
363
|
-
defaultPlan: 'monthly',
|
|
364
|
-
|
|
365
|
-
features: {
|
|
366
|
-
requireAuth: true,
|
|
367
|
-
allowRestore: true,
|
|
368
|
-
syncWithFirebase: true,
|
|
369
|
-
},
|
|
370
|
-
|
|
371
|
-
ui: {
|
|
372
|
-
showAnnualDiscount: true,
|
|
373
|
-
highlightPopularPlan: true,
|
|
374
|
-
showPerks: true,
|
|
375
|
-
},
|
|
376
|
-
};
|
|
377
|
-
```
|
|
163
|
+
1. **Always** use appropriate gate hooks for feature access
|
|
164
|
+
2. **Always** handle loading, error, and empty states
|
|
165
|
+
3. **Always** provide user feedback for blocked features
|
|
166
|
+
4. **Always** check return values from operations
|
|
167
|
+
5. **Never** bypass gate system or checks
|
|
168
|
+
6. **Must** test with different user tiers
|
|
169
|
+
7. **Must** handle network errors gracefully
|
|
378
170
|
|
|
379
|
-
###
|
|
171
|
+
### Implementation Checklist
|
|
380
172
|
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
price: 0.99,
|
|
393
|
-
currency: 'USD',
|
|
394
|
-
},
|
|
395
|
-
{
|
|
396
|
-
id: 'credits_medium',
|
|
397
|
-
productId: 'com.app.credits.medium',
|
|
398
|
-
amount: 500,
|
|
399
|
-
price: 3.99,
|
|
400
|
-
currency: 'USD',
|
|
401
|
-
},
|
|
402
|
-
],
|
|
403
|
-
|
|
404
|
-
creditCosts: {
|
|
405
|
-
ai_generation: 1,
|
|
406
|
-
ai_analysis: 2,
|
|
407
|
-
premium_feature: 5,
|
|
408
|
-
},
|
|
409
|
-
};
|
|
410
|
-
```
|
|
173
|
+
- [ ] Import from correct path
|
|
174
|
+
- [ ] Wrap with necessary providers
|
|
175
|
+
- [ ] Use gate hooks for features
|
|
176
|
+
- [ ] Handle loading states
|
|
177
|
+
- [ ] Handle error states
|
|
178
|
+
- [ ] Provide user feedback
|
|
179
|
+
- [ ] Test with guest user
|
|
180
|
+
- [ ] Test with free user
|
|
181
|
+
- [ ] Test with premium user
|
|
182
|
+
- [ ] Test with no credits
|
|
183
|
+
- [ ] Test with insufficient credits
|
|
411
184
|
|
|
412
|
-
|
|
185
|
+
### Common Patterns
|
|
413
186
|
|
|
414
|
-
|
|
187
|
+
1. **Premium Feature**: Use `usePremiumGate`
|
|
188
|
+
2. **Credit Feature**: Use `useCreditsGate` or `useDeductCredit`
|
|
189
|
+
3. **Auth Feature**: Use `useAuthGate`
|
|
190
|
+
4. **Combined Gates**: Use `useFeatureGate` for complex scenarios
|
|
191
|
+
5. **Paywall Trigger**: Use `usePaywallVisibility` for global state
|
|
415
192
|
|
|
416
|
-
|
|
417
|
-
┌─────────────────────────────────────────┐
|
|
418
|
-
│ Presentation Layer │
|
|
419
|
-
│ (React Hooks & Components) │
|
|
420
|
-
├─────────────────────────────────────────┤
|
|
421
|
-
│ Application Layer │
|
|
422
|
-
│ (Use Cases & Service Contracts) │
|
|
423
|
-
├─────────────────────────────────────────┤
|
|
424
|
-
│ Domain Layer │
|
|
425
|
-
│ (Entities & Business Logic) │
|
|
426
|
-
├─────────────────────────────────────────┤
|
|
427
|
-
│ Infrastructure Layer │
|
|
428
|
-
│ (External Services & Repositories) │
|
|
429
|
-
└─────────────────────────────────────────┘
|
|
430
|
-
```
|
|
193
|
+
### Error Scenarios to Handle
|
|
431
194
|
|
|
432
|
-
|
|
195
|
+
- **No Subscription**: Show upgrade prompt
|
|
196
|
+
- **Expired Subscription**: Show renewal prompt
|
|
197
|
+
- **No Credits**: Show credit purchase prompt
|
|
198
|
+
- **Insufficient Credits**: Show credit cost and purchase option
|
|
199
|
+
- **Network Error**: Show retry option
|
|
200
|
+
- **Purchase Failed**: Show error message and retry
|
|
433
201
|
|
|
434
|
-
|
|
435
|
-
2. **Use gate hooks** (`usePremiumGate`, `useCreditsGate`) for feature access control
|
|
436
|
-
3. **Handle errors gracefully** and show user-friendly messages
|
|
437
|
-
4. **Provide restore purchase** option for iOS and Android
|
|
438
|
-
5. **Track subscription events** with analytics
|
|
439
|
-
6. **Use translations** for multi-language support
|
|
440
|
-
7. **Test different subscription states** (guest, free, premium, expired)
|
|
202
|
+
## Documentation Structure
|
|
441
203
|
|
|
442
|
-
|
|
204
|
+
### Domain Documentation
|
|
443
205
|
|
|
444
|
-
|
|
206
|
+
- **[Wallet Domain](./src/domains/wallet/README.md)**: Credits and transactions
|
|
207
|
+
- **[Paywall Domain](./src/domains/paywall/README.md)**: Paywall components
|
|
208
|
+
- **[Config Domain](./src/domains/config/README.md)**: Configuration management
|
|
445
209
|
|
|
446
|
-
|
|
210
|
+
### Layer Documentation
|
|
447
211
|
|
|
448
|
-
|
|
212
|
+
- **[Presentation Layer](./src/presentation/README.md)**: Hooks and components
|
|
213
|
+
- **[Application Layer](./src/application/README.md)**: Use cases and ports
|
|
214
|
+
- **[Domain Layer](./src/domain/README.md)**: Entities and logic
|
|
215
|
+
- **[Infrastructure Layer](./src/infrastructure/README.md)**: Repositories and services
|
|
216
|
+
|
|
217
|
+
### Feature Documentation
|
|
218
|
+
|
|
219
|
+
- **[RevenueCat Integration](./src/revenuecat/README.md)**: RevenueCat setup
|
|
220
|
+
- **[Subscription Hooks](./src/presentation/hooks/README.md)**: Available hooks
|
|
221
|
+
- **[Premium Components](./src/presentation/components/README.md)**: UI components
|
|
222
|
+
|
|
223
|
+
### Quick Reference
|
|
224
|
+
|
|
225
|
+
#### Subscription Hooks
|
|
226
|
+
|
|
227
|
+
Location: `src/presentation/hooks/`
|
|
228
|
+
|
|
229
|
+
- `useSubscription` - Core subscription management
|
|
230
|
+
- `usePremium` - Check premium status
|
|
231
|
+
- `usePremiumGate` - Gate premium features
|
|
232
|
+
- `useUserTier` - Get user tier (guest/free/premium)
|
|
449
233
|
|
|
450
|
-
|
|
234
|
+
#### Credit Hooks
|
|
451
235
|
|
|
452
|
-
|
|
236
|
+
Location: `src/presentation/hooks/`
|
|
453
237
|
|
|
454
|
-
|
|
238
|
+
- `useCredits` - Access credit balance
|
|
239
|
+
- `useDeductCredit` - Deduct credits with optimistic updates
|
|
240
|
+
- `useCreditChecker` - Check credit availability
|
|
241
|
+
- `useCreditsGate` - Gate features by credits
|
|
455
242
|
|
|
456
|
-
|
|
457
|
-
|
|
243
|
+
#### Paywall Hooks
|
|
244
|
+
|
|
245
|
+
Location: `src/presentation/hooks/`
|
|
246
|
+
|
|
247
|
+
- `usePaywallVisibility` - Manage paywall state
|
|
248
|
+
- `usePaywallOperations` - Handle purchase operations
|
|
249
|
+
|
|
250
|
+
#### Components
|
|
251
|
+
|
|
252
|
+
Location: `src/presentation/components/`
|
|
253
|
+
|
|
254
|
+
- `PremiumDetailsCard` - Display subscription details
|
|
255
|
+
- `PremiumStatusBadge` - Show subscription badge
|
|
256
|
+
- `PaywallModal` - Full paywall modal
|
|
257
|
+
- `CreditRow` - Display credit balance with progress
|
|
258
|
+
|
|
259
|
+
## Contributing
|
|
260
|
+
|
|
261
|
+
When contributing to this package:
|
|
262
|
+
|
|
263
|
+
1. **Follow Documentation Template**: Use `README_TEMPLATE.md`
|
|
264
|
+
2. **Update Strategy Section**: Document architectural decisions
|
|
265
|
+
3. **List Restrictions**: Clearly state what's required/prohibited
|
|
266
|
+
4. **Provide Rules**: Show correct/incorrect usage
|
|
267
|
+
5. **AI Guidelines**: Include agent instructions
|
|
268
|
+
6. **No Code Examples**: Keep documentation code-agnostic
|
|
269
|
+
7. **English Only**: All documentation in English
|
|
458
270
|
|
|
459
271
|
## Support
|
|
460
272
|
|
|
461
|
-
|
|
273
|
+
- **Issues**: [GitHub Issues](https://github.com/umituz/react-native-subscription/issues)
|
|
274
|
+
- **Author**: Ümit UZ <umit@umituz.com>
|
|
275
|
+
|
|
276
|
+
## License
|
|
277
|
+
|
|
278
|
+
MIT License - see LICENSE file for details
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umituz/react-native-subscription",
|
|
3
|
-
"version": "2.14.
|
|
3
|
+
"version": "2.14.100",
|
|
4
4
|
"description": "Complete subscription management with RevenueCat, paywall UI, and credits system for React Native apps",
|
|
5
5
|
"main": "./src/index.ts",
|
|
6
6
|
"types": "./src/index.ts",
|