@applicaster/zapp-react-native-utils 15.0.0-rc.2 → 15.0.0-rc.4
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 +2 -2
- package/reactHooks/feed/useFeedLoader.tsx +0 -9
- package/reactHooks/feed/useInflatedUrl.ts +23 -29
- package/zappFrameworkUtils/HookCallback/callbackNavigationAction.ts +83 -30
- package/zappFrameworkUtils/HookCallback/hookCallbackManifestExtensions.config.js +25 -9
- package/zappFrameworkUtils/HookCallback/useCallbackActions.ts +6 -9
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@applicaster/zapp-react-native-utils",
|
|
3
|
-
"version": "15.0.0-rc.
|
|
3
|
+
"version": "15.0.0-rc.4",
|
|
4
4
|
"description": "Applicaster Zapp React Native utilities package",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"types": "index.d.ts",
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
},
|
|
28
28
|
"homepage": "https://github.com/applicaster/quickbrick#readme",
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@applicaster/applicaster-types": "15.0.0-rc.
|
|
30
|
+
"@applicaster/applicaster-types": "15.0.0-rc.4",
|
|
31
31
|
"buffer": "^5.2.1",
|
|
32
32
|
"camelize": "^1.0.0",
|
|
33
33
|
"dayjs": "^1.11.10",
|
|
@@ -37,15 +37,6 @@ export const useFeedLoader = ({
|
|
|
37
37
|
mapping,
|
|
38
38
|
pipesOptions = {},
|
|
39
39
|
}: Props): FeedLoaderResponse => {
|
|
40
|
-
useEffect(() => {
|
|
41
|
-
if (!feedUrl) {
|
|
42
|
-
logger.warning({
|
|
43
|
-
message: "Required parameter feedUrl is missing",
|
|
44
|
-
data: { feedUrl },
|
|
45
|
-
});
|
|
46
|
-
}
|
|
47
|
-
}, []);
|
|
48
|
-
|
|
49
40
|
const isInitialRender = useIsInitialRender();
|
|
50
41
|
|
|
51
42
|
const callableFeedUrl = useInflatedUrl({ feedUrl, mapping });
|
|
@@ -18,6 +18,7 @@ import {
|
|
|
18
18
|
} from "@applicaster/zapp-pipes-v2-client";
|
|
19
19
|
import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
|
|
20
20
|
import { ENDPOINT_TAGS } from "../../types";
|
|
21
|
+
import { isNilOrEmpty } from "../../reactUtils/helpers";
|
|
21
22
|
|
|
22
23
|
/**
|
|
23
24
|
* will match any occurrence in a string of one or more word characters
|
|
@@ -75,15 +76,19 @@ export const getInflatedDataSourceUrl: GetInflatedDataSourceUrl = ({
|
|
|
75
76
|
* https://foo.com/shows/A1234
|
|
76
77
|
*/
|
|
77
78
|
|
|
78
|
-
if (!
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
79
|
+
if (!isNilOrEmpty(mapping)) {
|
|
80
|
+
if (!source) {
|
|
81
|
+
if (__DEV__) {
|
|
82
|
+
// eslint-disable-next-line no-console
|
|
83
|
+
throw new Error(
|
|
84
|
+
"getInflatedDataSourceUrl: source is empty while mapping is provided"
|
|
85
|
+
);
|
|
86
|
+
}
|
|
85
87
|
|
|
86
|
-
|
|
88
|
+
return null;
|
|
89
|
+
}
|
|
90
|
+
} else {
|
|
91
|
+
return source || null;
|
|
87
92
|
}
|
|
88
93
|
|
|
89
94
|
// Hack because in tv we expect to get key names instead of values from the fake entry
|
|
@@ -193,28 +198,17 @@ export function useInflatedUrl({
|
|
|
193
198
|
|
|
194
199
|
const url = useMemo(
|
|
195
200
|
() =>
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
: feedUrl,
|
|
207
|
-
[feedUrl, mapping]
|
|
201
|
+
getInflatedDataSourceUrl({
|
|
202
|
+
source: feedUrl,
|
|
203
|
+
contexts: {
|
|
204
|
+
entry: entryContext,
|
|
205
|
+
screen: screenContext,
|
|
206
|
+
search: getSearchContext(searchContext, mapping),
|
|
207
|
+
},
|
|
208
|
+
mapping,
|
|
209
|
+
}),
|
|
210
|
+
[entryContext, feedUrl, mapping, screenContext, searchContext]
|
|
208
211
|
);
|
|
209
212
|
|
|
210
|
-
if (!feedUrl) {
|
|
211
|
-
logger.warning({
|
|
212
|
-
message: "Required parameter feedUrl is missing",
|
|
213
|
-
data: { feedUrl },
|
|
214
|
-
});
|
|
215
|
-
|
|
216
|
-
return null;
|
|
217
|
-
}
|
|
218
|
-
|
|
219
213
|
return url;
|
|
220
214
|
}
|
|
@@ -9,10 +9,23 @@ export enum NavigationCallbackOptions {
|
|
|
9
9
|
GO_TO_SCREEN = "go_to_screen",
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
export
|
|
12
|
+
export enum ResultType {
|
|
13
|
+
login = "login",
|
|
14
|
+
logout = "logout",
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
export type CallbackResult = hookCallbackArgs & {
|
|
18
|
+
options?: {
|
|
19
|
+
resultType?: ResultType;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
export type ScreenResultCallback = (args: CallbackResult) => void | undefined;
|
|
24
|
+
|
|
25
|
+
export const CALLBACK_NAVIGATION_KEY = "completion_action";
|
|
13
26
|
|
|
14
27
|
export const CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY =
|
|
15
|
-
"
|
|
28
|
+
"completion_action_navigation_go_to_screen";
|
|
16
29
|
|
|
17
30
|
type NavKeys = {
|
|
18
31
|
action: NavigationCallbackOptions;
|
|
@@ -23,7 +36,7 @@ type General = Record<string, unknown>;
|
|
|
23
36
|
|
|
24
37
|
const LogPrefix = "useCallbackNavigationAction:";
|
|
25
38
|
|
|
26
|
-
const { log_info, log_verbose } = createLogger({
|
|
39
|
+
const { log_info, log_verbose, log_debug } = createLogger({
|
|
27
40
|
subsystem: "hook-navigation-callback",
|
|
28
41
|
});
|
|
29
42
|
|
|
@@ -35,50 +48,63 @@ const legacyMappingKeys = {
|
|
|
35
48
|
"quick-brick-user-account-ui-component": {
|
|
36
49
|
actionType: "callbackAction",
|
|
37
50
|
},
|
|
51
|
+
"quick-brick-login-multi-login-providers.login": {
|
|
52
|
+
actionType: "login_completion_action",
|
|
53
|
+
targetScreen: "navigate_to_login_screen",
|
|
54
|
+
},
|
|
55
|
+
"quick-brick-login-multi-login-providers.logout": {
|
|
56
|
+
actionType: "logout_completion_action",
|
|
57
|
+
targetScreen: "navigate_to_logout_screen",
|
|
58
|
+
},
|
|
38
59
|
};
|
|
39
60
|
|
|
40
|
-
const isNonEmptyString = (v: unknown): v is string =>
|
|
41
|
-
typeof v === "string" && v.trim().length > 0;
|
|
42
|
-
|
|
43
61
|
const NAV_ACTIONS = Object.values(NavigationCallbackOptions) as string[];
|
|
44
62
|
|
|
45
63
|
const isNavAction = (v: unknown): v is NavigationCallbackOptions =>
|
|
46
|
-
typeof v === "string" && NAV_ACTIONS.includes(v
|
|
64
|
+
typeof v === "string" && NAV_ACTIONS.includes(v);
|
|
47
65
|
|
|
48
66
|
export const getNavigationKeys = (
|
|
49
|
-
item?: ZappUIComponent | ZappRiver
|
|
67
|
+
item?: ZappUIComponent | ZappRiver,
|
|
68
|
+
resultType: ResultType | null = null
|
|
50
69
|
): NavKeys => {
|
|
51
70
|
const general = (item?.general ?? {}) as General;
|
|
52
|
-
|
|
53
|
-
const
|
|
71
|
+
|
|
72
|
+
const pluginIdentifier = (item as any).identifier ?? item?.type ?? "";
|
|
73
|
+
|
|
74
|
+
const legacy =
|
|
75
|
+
legacyMappingKeys[`${pluginIdentifier}.${resultType}`] ??
|
|
76
|
+
legacyMappingKeys[pluginIdentifier] ??
|
|
77
|
+
{};
|
|
78
|
+
|
|
79
|
+
const actionKey = resultType
|
|
80
|
+
? `${resultType}_${CALLBACK_NAVIGATION_KEY}`
|
|
81
|
+
: CALLBACK_NAVIGATION_KEY;
|
|
54
82
|
|
|
55
83
|
const rawAction =
|
|
56
|
-
(general as General)
|
|
84
|
+
(general as General)[actionKey] ??
|
|
57
85
|
(legacy.actionType ? (general as General)[legacy.actionType] : undefined);
|
|
58
86
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
const trimmed = rawAction.trim();
|
|
63
|
-
action = isNavAction(trimmed) ? trimmed : null;
|
|
64
|
-
}
|
|
87
|
+
const action: NavigationCallbackOptions | null = isNavAction(rawAction)
|
|
88
|
+
? rawAction
|
|
89
|
+
: null;
|
|
65
90
|
|
|
66
91
|
if (!action) return null;
|
|
67
92
|
|
|
68
93
|
let targetScreenId: string | null = null;
|
|
69
94
|
|
|
70
95
|
if (action === NavigationCallbackOptions.GO_TO_SCREEN) {
|
|
96
|
+
const screenKey = resultType
|
|
97
|
+
? `${resultType}_${CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY}`
|
|
98
|
+
: CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY;
|
|
99
|
+
|
|
71
100
|
const screenId: string | null =
|
|
72
|
-
((general as General)[
|
|
101
|
+
((general as General)[screenKey] as string) ??
|
|
73
102
|
(legacy.targetScreen
|
|
74
103
|
? ((general as General)[legacy.targetScreen] as string)
|
|
75
104
|
: undefined);
|
|
76
105
|
|
|
77
106
|
if (screenId) {
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
targetScreenId =
|
|
81
|
-
trimmedTargetScreenId.length > 0 ? trimmedTargetScreenId : null;
|
|
107
|
+
targetScreenId = screenId.length > 0 ? screenId : null;
|
|
82
108
|
}
|
|
83
109
|
}
|
|
84
110
|
|
|
@@ -87,10 +113,12 @@ export const getNavigationKeys = (
|
|
|
87
113
|
|
|
88
114
|
export const useCallbackNavigationAction = (
|
|
89
115
|
item?: ZappUIComponent | ZappRiver
|
|
90
|
-
):
|
|
116
|
+
): ((
|
|
117
|
+
args: CallbackResult,
|
|
118
|
+
hookCallback?: hookCallback
|
|
119
|
+
) => void | undefined) => {
|
|
91
120
|
const navigation = useNavigation();
|
|
92
121
|
const rivers = useRivers();
|
|
93
|
-
const enabled = Boolean(item?.general?.[CALLBACK_NAVIGATION_KEY]);
|
|
94
122
|
const screenContext = useScreenContext();
|
|
95
123
|
|
|
96
124
|
const overrideCallbackFromComponent = useMemo(() => {
|
|
@@ -105,11 +133,36 @@ export const useCallbackNavigationAction = (
|
|
|
105
133
|
}
|
|
106
134
|
|
|
107
135
|
const callbackAction = useCallback<hookCallback>(
|
|
108
|
-
(
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
136
|
+
(args: CallbackResult, hookCallback: hookCallback = null) => {
|
|
137
|
+
if (!args.success) {
|
|
138
|
+
log_debug(
|
|
139
|
+
`${LogPrefix} callback called with no success, use original callback`
|
|
140
|
+
);
|
|
141
|
+
|
|
142
|
+
hookCallback?.(args);
|
|
143
|
+
|
|
144
|
+
return;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
if (args.cancelled) {
|
|
148
|
+
log_debug(
|
|
149
|
+
`${LogPrefix} callback called but cancelled, use original callback`
|
|
150
|
+
);
|
|
151
|
+
|
|
152
|
+
hookCallback?.(args);
|
|
153
|
+
|
|
154
|
+
return;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
const data = getNavigationKeys(item, args.options?.resultType ?? null);
|
|
158
|
+
|
|
159
|
+
if (!data) {
|
|
160
|
+
hookCallback?.(args);
|
|
161
|
+
|
|
162
|
+
return;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
hookCallback?.({ ...args, success: false, cancelled: true });
|
|
113
166
|
|
|
114
167
|
switch (data.action) {
|
|
115
168
|
case NavigationCallbackOptions.GO_BACK: {
|
|
@@ -160,5 +213,5 @@ export const useCallbackNavigationAction = (
|
|
|
160
213
|
[item, navigation, rivers]
|
|
161
214
|
);
|
|
162
215
|
|
|
163
|
-
return
|
|
216
|
+
return overrideCallbackFromComponent || callbackAction;
|
|
164
217
|
};
|
|
@@ -5,20 +5,32 @@ const NavigationCallbackOptions = {
|
|
|
5
5
|
GO_TO_SCREEN: "go_to_screen",
|
|
6
6
|
};
|
|
7
7
|
|
|
8
|
-
const
|
|
8
|
+
const ResultType = {
|
|
9
|
+
login: "login",
|
|
10
|
+
logout: "logout",
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
const CALLBACK_NAVIGATION_KEY = "completion_action";
|
|
9
14
|
|
|
10
15
|
const CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY =
|
|
11
|
-
"
|
|
16
|
+
"completion_action_navigation_go_to_screen";
|
|
17
|
+
|
|
18
|
+
const callbackKeyPrefix = (key, prefix, keySeparator = "_") =>
|
|
19
|
+
prefix ? `${prefix}${keySeparator}${key}` : key;
|
|
12
20
|
|
|
13
|
-
const extendManifestWithHookCallback = () => ({
|
|
21
|
+
const extendManifestWithHookCallback = (prefix = null) => ({
|
|
14
22
|
group: true,
|
|
15
23
|
label: "CallBack Navigation",
|
|
16
24
|
folded: true,
|
|
17
25
|
fields: [
|
|
18
26
|
{
|
|
19
27
|
type: "select",
|
|
20
|
-
key: CALLBACK_NAVIGATION_KEY,
|
|
21
|
-
label:
|
|
28
|
+
key: callbackKeyPrefix(CALLBACK_NAVIGATION_KEY, prefix),
|
|
29
|
+
label: callbackKeyPrefix(
|
|
30
|
+
"Callback Navigation",
|
|
31
|
+
prefix?.toUpperCase(),
|
|
32
|
+
" "
|
|
33
|
+
),
|
|
22
34
|
label_tooltip:
|
|
23
35
|
"Defines what navigation action should be performed after the callback is called.",
|
|
24
36
|
options: [
|
|
@@ -43,13 +55,17 @@ const extendManifestWithHookCallback = () => ({
|
|
|
43
55
|
},
|
|
44
56
|
{
|
|
45
57
|
type: "screen_selector",
|
|
46
|
-
key: CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY,
|
|
47
|
-
label:
|
|
58
|
+
key: callbackKeyPrefix(CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY, prefix),
|
|
59
|
+
label: callbackKeyPrefix(
|
|
60
|
+
"Navigate to screen",
|
|
61
|
+
prefix?.toUpperCase(),
|
|
62
|
+
" "
|
|
63
|
+
),
|
|
48
64
|
label_tooltip: "Screen you wish to navigate to after success purchase",
|
|
49
65
|
rules: "conditional",
|
|
50
66
|
conditional_fields: [
|
|
51
67
|
{
|
|
52
|
-
key: `general/${CALLBACK_NAVIGATION_KEY}`,
|
|
68
|
+
key: `general/${callbackKeyPrefix(CALLBACK_NAVIGATION_KEY, prefix)}`,
|
|
53
69
|
condition_value: NavigationCallbackOptions.GO_TO_SCREEN,
|
|
54
70
|
},
|
|
55
71
|
],
|
|
@@ -57,4 +73,4 @@ const extendManifestWithHookCallback = () => ({
|
|
|
57
73
|
],
|
|
58
74
|
});
|
|
59
75
|
|
|
60
|
-
module.exports = { extendManifestWithHookCallback };
|
|
76
|
+
module.exports = { extendManifestWithHookCallback, ResultType };
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import { useCallback } from "react";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
CallbackResult,
|
|
4
|
+
useCallbackNavigationAction,
|
|
5
|
+
} from "./callbackNavigationAction";
|
|
3
6
|
|
|
4
7
|
export const useCallbackActions = (
|
|
5
8
|
item?: ZappUIComponent | ZappRiver,
|
|
@@ -8,14 +11,8 @@ export const useCallbackActions = (
|
|
|
8
11
|
const navigationAction = useCallbackNavigationAction(item);
|
|
9
12
|
|
|
10
13
|
return useCallback(
|
|
11
|
-
async (data:
|
|
12
|
-
|
|
13
|
-
hookCallback?.({ ...data, success: false, cancelled: true });
|
|
14
|
-
|
|
15
|
-
navigationAction(data);
|
|
16
|
-
} else {
|
|
17
|
-
hookCallback?.(data);
|
|
18
|
-
}
|
|
14
|
+
async (data: CallbackResult) => {
|
|
15
|
+
navigationAction(data, hookCallback);
|
|
19
16
|
},
|
|
20
17
|
[navigationAction, hookCallback]
|
|
21
18
|
);
|