apps-sdk 1.1.56 → 1.1.58
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/package.json +1 -1
- package/src/components/AdaptyOnboarding.js +193 -126
- package/types/index.d.ts +7 -7
package/package.json
CHANGED
|
@@ -1,150 +1,217 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import { Modal } from 'react-native';
|
|
3
|
+
import { AdaptyOnboardingView } from 'react-native-adapty/dist/ui';
|
|
4
|
+
import { View } from "react-native";
|
|
2
5
|
import Adapty from '../libraries/Adapty';
|
|
3
6
|
import * as config from '../../config';
|
|
4
7
|
|
|
5
8
|
class AdaptyOnboarding extends React.Component {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
9
|
+
constructor(props) {
|
|
10
|
+
super(props);
|
|
11
|
+
this.state = {
|
|
12
|
+
onboarding: null,
|
|
13
|
+
isLoading: true,
|
|
14
|
+
};
|
|
15
|
+
this.remoteConfig = null;
|
|
16
|
+
this.termsAccepted = false;
|
|
17
|
+
this.currentStep = 0;
|
|
18
|
+
this.totalSteps = 0;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
componentDidMount() {
|
|
22
|
+
const { placementID, lang } = this.props;
|
|
23
|
+
this.loadOnboarding(placementID, lang);
|
|
16
24
|
}
|
|
17
|
-
}
|
|
18
25
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
26
|
+
async componentDidUpdate(prevProps) {
|
|
27
|
+
if (this.props.visible && !prevProps.visible) {
|
|
28
|
+
const { placementID, lang } = this.props;
|
|
29
|
+
await this.loadOnboarding(placementID, lang);
|
|
30
|
+
}
|
|
24
31
|
}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
32
|
+
|
|
33
|
+
loadOnboarding = async (placementID, lang) => {
|
|
34
|
+
try {
|
|
35
|
+
this.setState({ isLoading: true });
|
|
36
|
+
const onboarding = await Adapty.getOnboardingForPlacement(placementID, lang);
|
|
37
|
+
|
|
38
|
+
if (onboarding) {
|
|
39
|
+
this.remoteConfig = onboarding.remoteConfig || {};
|
|
40
|
+
|
|
41
|
+
if (this.props.onRemoteConfigLoaded && this.remoteConfig) {
|
|
42
|
+
config.DEBUG_MODE && console.log('Remote config loaded:', this.remoteConfig);
|
|
43
|
+
this.props.onRemoteConfigLoaded(this.remoteConfig);
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
this.setState({ onboarding, isLoading: false });
|
|
47
|
+
} else {
|
|
48
|
+
console.log('Onboarding not found for placement:', placementID, 'and language:', lang);
|
|
49
|
+
this.setState({ isLoading: false });
|
|
50
|
+
if (this.props.onError) {
|
|
51
|
+
this.props.onError(new Error('Onboarding not found'), this.remoteConfig);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
} catch (error) {
|
|
55
|
+
console.log('Error loading onboarding:', error);
|
|
56
|
+
this.setState({ isLoading: false });
|
|
57
|
+
if (this.props.onError) {
|
|
58
|
+
this.props.onError(error, this.remoteConfig);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
// --------------------------------------- Event Handlers ---------------------------------------
|
|
64
|
+
handleCustom = (actionId, meta) => {
|
|
65
|
+
config.DEBUG_MODE && console.log('Onboarding custom action:', actionId, meta);
|
|
49
66
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
onRemoteConfigLoaded(this.remoteConfig);
|
|
67
|
+
if (actionId === 'accept_terms') {
|
|
68
|
+
this.termsAccepted = true;
|
|
69
|
+
config.DEBUG_MODE && console.log('Terms accepted');
|
|
54
70
|
}
|
|
55
71
|
|
|
56
|
-
this.
|
|
72
|
+
if (this.props.onCustom) {
|
|
73
|
+
this.props.onCustom(actionId, meta, this.remoteConfig);
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
handleClose = (actionId, meta) => {
|
|
78
|
+
const isLastStep = this.totalSteps > 0 && this.currentStep === this.totalSteps - 1;
|
|
79
|
+
const canClose = this.termsAccepted && isLastStep;
|
|
57
80
|
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
onClose: async (actionId, meta) => {
|
|
67
|
-
config.DEBUG_MODE && console.log('Onboarding closed:', actionId, meta);
|
|
68
|
-
this.isPresenting = false;
|
|
69
|
-
// Pasar remoteConfig en el handler
|
|
70
|
-
if (onClose) {
|
|
71
|
-
onClose(actionId, meta, this.remoteConfig);
|
|
72
|
-
}
|
|
73
|
-
await this.onboardingView.dismiss();
|
|
74
|
-
return true;
|
|
75
|
-
},
|
|
76
|
-
onError: (error) => {
|
|
77
|
-
console.error('Onboarding error:', error);
|
|
78
|
-
this.isPresenting = false;
|
|
79
|
-
// Pasar remoteConfig en el handler
|
|
80
|
-
if (onError) {
|
|
81
|
-
onError(error, this.remoteConfig);
|
|
82
|
-
}
|
|
83
|
-
return true;
|
|
84
|
-
},
|
|
85
|
-
onAnalytics: (event, data) => {
|
|
86
|
-
config.DEBUG_MODE && console.log('Onboarding analytics:', event, data);
|
|
87
|
-
if (handlers.onAnalytics) {
|
|
88
|
-
handlers.onAnalytics(event, data, this.remoteConfig);
|
|
89
|
-
}
|
|
90
|
-
},
|
|
91
|
-
onPaywall: () => {
|
|
92
|
-
config.DEBUG_MODE && console.log('Onboarding paywall event');
|
|
93
|
-
if (handlers.onPaywall) {
|
|
94
|
-
handlers.onPaywall(this.remoteConfig);
|
|
95
|
-
}
|
|
96
|
-
},
|
|
97
|
-
onStateUpdated: (state) => {
|
|
98
|
-
config.DEBUG_MODE && console.log('Onboarding state updated:', state);
|
|
99
|
-
if (handlers.onStateUpdated) {
|
|
100
|
-
handlers.onStateUpdated(state, this.remoteConfig);
|
|
101
|
-
}
|
|
102
|
-
},
|
|
103
|
-
onFinishedLoading: () => {
|
|
104
|
-
config.DEBUG_MODE && console.log('Onboarding finished loading');
|
|
105
|
-
if (handlers.onFinishedLoading) {
|
|
106
|
-
handlers.onFinishedLoading(this.remoteConfig);
|
|
107
|
-
}
|
|
108
|
-
},
|
|
81
|
+
config.DEBUG_MODE && console.log('Onboarding close attempt:', {
|
|
82
|
+
actionId,
|
|
83
|
+
meta,
|
|
84
|
+
termsAccepted: this.termsAccepted,
|
|
85
|
+
currentStep: this.currentStep,
|
|
86
|
+
totalSteps: this.totalSteps,
|
|
87
|
+
isLastStep,
|
|
88
|
+
canClose
|
|
109
89
|
});
|
|
110
90
|
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
91
|
+
if (!canClose) {
|
|
92
|
+
config.DEBUG_MODE && console.log('Close prevented');
|
|
93
|
+
return false;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
config.DEBUG_MODE && console.log('Close allowed');
|
|
97
|
+
|
|
98
|
+
if (this.props.onClose) {
|
|
99
|
+
this.props.onClose(actionId, meta, this.remoteConfig);
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
this.termsAccepted = false;
|
|
103
|
+
this.currentStep = 0;
|
|
104
|
+
this.totalSteps = 0;
|
|
105
|
+
|
|
106
|
+
return true;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
handleStateUpdated = (action, meta) => {
|
|
110
|
+
if (meta && typeof meta === 'object') {
|
|
111
|
+
this.currentStep = meta.screen_index ?? this.currentStep;
|
|
112
|
+
this.totalSteps = meta.total_screens ?? this.totalSteps;
|
|
113
|
+
|
|
114
|
+
config.DEBUG_MODE && console.log('State updated:', {
|
|
115
|
+
action,
|
|
116
|
+
meta,
|
|
117
|
+
currentStep: this.currentStep,
|
|
118
|
+
totalSteps: this.totalSteps,
|
|
119
|
+
termsAccepted: this.termsAccepted
|
|
120
|
+
});
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
if (this.props.onStateUpdated) {
|
|
124
|
+
this.props.onStateUpdated(action, meta, this.remoteConfig);
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
handleError = (error) => {
|
|
129
|
+
console.log('Onboarding error:', error);
|
|
130
|
+
|
|
114
131
|
if (this.props.onError) {
|
|
115
|
-
|
|
132
|
+
this.props.onError(error, this.remoteConfig);
|
|
116
133
|
}
|
|
117
|
-
|
|
118
|
-
} catch (error) {
|
|
119
|
-
console.error('Error presenting onboarding:', error);
|
|
120
|
-
this.isPresenting = false;
|
|
121
|
-
if (this.props.onError) {
|
|
122
|
-
this.props.onError(error, this.remoteConfig);
|
|
123
|
-
}
|
|
134
|
+
return true;
|
|
124
135
|
}
|
|
125
|
-
}
|
|
126
136
|
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
} catch (error) {
|
|
134
|
-
console.error('Error dismissing onboarding:', error);
|
|
135
|
-
}
|
|
137
|
+
handleAnalytics = (event, data) => {
|
|
138
|
+
config.DEBUG_MODE && console.log('Onboarding analytics:', event, data);
|
|
139
|
+
|
|
140
|
+
if (this.props.onAnalytics) {
|
|
141
|
+
this.props.onAnalytics(event, data, this.remoteConfig);
|
|
142
|
+
}
|
|
136
143
|
}
|
|
137
|
-
}
|
|
138
144
|
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
145
|
+
handlePaywall = (actionId, meta) => {
|
|
146
|
+
config.DEBUG_MODE && console.log('Onboarding paywall:', actionId, meta);
|
|
147
|
+
|
|
148
|
+
if (this.props.onPaywall) {
|
|
149
|
+
this.props.onPaywall(this.remoteConfig);
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
handleFinishedLoading = (meta) => {
|
|
154
|
+
config.DEBUG_MODE && console.log('Onboarding finished loading', meta);
|
|
155
|
+
|
|
156
|
+
if (this.props.onFinishedLoading) {
|
|
157
|
+
this.props.onFinishedLoading(meta, this.remoteConfig);
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
// --------------------------------------- Event Handlers ---------------------------------------
|
|
161
|
+
|
|
162
|
+
render() {
|
|
163
|
+
const { visible } = this.props;
|
|
164
|
+
const { onboarding, isLoading } = this.state;
|
|
165
|
+
|
|
166
|
+
if (!visible) {
|
|
167
|
+
return null;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
const content = (
|
|
171
|
+
<View style={styles.container}>
|
|
172
|
+
{!isLoading && onboarding ? (
|
|
173
|
+
<AdaptyOnboardingView
|
|
174
|
+
onboarding={onboarding}
|
|
175
|
+
style={styles.onboardingView}
|
|
176
|
+
eventHandlers={{
|
|
177
|
+
onAnalytics: this.handleAnalytics,
|
|
178
|
+
onClose: this.handleClose,
|
|
179
|
+
onCustom: this.handleCustom,
|
|
180
|
+
onPaywall: this.handlePaywall,
|
|
181
|
+
onStateUpdated: this.handleStateUpdated,
|
|
182
|
+
onFinishedLoading: this.handleFinishedLoading,
|
|
183
|
+
onError: this.handleError,
|
|
184
|
+
}}
|
|
185
|
+
/>
|
|
186
|
+
) : null}
|
|
187
|
+
</View>
|
|
188
|
+
);
|
|
189
|
+
|
|
190
|
+
return (
|
|
191
|
+
<Modal
|
|
192
|
+
visible={visible}
|
|
193
|
+
animationType="slide"
|
|
194
|
+
presentationStyle="fullScreen"
|
|
195
|
+
onRequestClose={() => {
|
|
196
|
+
config.DEBUG_MODE && console.log('Modal onRequestClose prevented');
|
|
197
|
+
return false;
|
|
198
|
+
}}
|
|
199
|
+
>
|
|
200
|
+
{content}
|
|
201
|
+
</Modal>
|
|
202
|
+
);
|
|
203
|
+
}
|
|
204
|
+
}
|
|
143
205
|
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
206
|
+
const styles = {
|
|
207
|
+
container: {
|
|
208
|
+
backgroundColor: '#000',
|
|
209
|
+
width: '100%',
|
|
210
|
+
height: '100%',
|
|
211
|
+
},
|
|
212
|
+
onboardingView: {
|
|
213
|
+
flex: 1,
|
|
214
|
+
},
|
|
148
215
|
}
|
|
149
216
|
|
|
150
217
|
export default AdaptyOnboarding;
|
package/types/index.d.ts
CHANGED
|
@@ -162,14 +162,14 @@ declare module 'apps-sdk' {
|
|
|
162
162
|
visible: boolean;
|
|
163
163
|
placementID: string;
|
|
164
164
|
lang: string;
|
|
165
|
-
onCustom?: (actionId: string, meta
|
|
166
|
-
onClose?: (actionId: string, meta
|
|
167
|
-
onError?: (error: Error |
|
|
165
|
+
onCustom?: (actionId: string, meta: Record<string, any> | undefined, remoteConfig: Record<string, any> | null) => void;
|
|
166
|
+
onClose?: (actionId: string, meta: Record<string, any> | undefined, remoteConfig: Record<string, any> | null) => boolean;
|
|
167
|
+
onError?: (error: Error | any, remoteConfig: Record<string, any> | null) => boolean;
|
|
168
168
|
onRemoteConfigLoaded?: (remoteConfig: Record<string, any>) => void;
|
|
169
|
-
onAnalytics?: (event:
|
|
170
|
-
onPaywall?: (
|
|
171
|
-
onStateUpdated?: (
|
|
172
|
-
onFinishedLoading?: (remoteConfig
|
|
169
|
+
onAnalytics?: (event: any, data: any, remoteConfig: Record<string, any> | null) => void;
|
|
170
|
+
onPaywall?: (actionId: string, meta: Record<string, any> | undefined) => void;
|
|
171
|
+
onStateUpdated?: (action: any, meta: Record<string, any> | undefined, remoteConfig: Record<string, any> | null) => void;
|
|
172
|
+
onFinishedLoading?: (meta: Record<string, any> | undefined, remoteConfig: Record<string, any> | null) => void;
|
|
173
173
|
}
|
|
174
174
|
|
|
175
175
|
export class AdaptyOnboarding extends Component<AdaptyOnboardingProps, {}> {}
|