@applicaster/zapp-react-native-utils 15.0.0-alpha.4515904047 → 15.0.0-alpha.5412418016

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.
@@ -35,8 +35,11 @@ export class AnalyticPlayerListener
35
35
  this.handleAnalyticEvent(PLAYBACK_EVENT.complete);
36
36
  };
37
37
 
38
- onError = (err: Error) => {
39
- this.handleAnalyticEvent(PLAYBACK_EVENT.error, err); // TODO: Check error format
38
+ onError = (err: QuickBrickPlayer.PlayerErrorI) => {
39
+ this.handleAnalyticEvent(
40
+ PLAYBACK_EVENT.error,
41
+ err.toObject?.() || { message: err.message }
42
+ );
40
43
  };
41
44
 
42
45
  onPlayerPause = (event) => {
@@ -69,6 +69,7 @@ exports[`focusManagerIOS should be defined 1`] = `
69
69
  "getGroupRootById": [Function],
70
70
  "getPreferredFocusChild": [Function],
71
71
  "invokeHandler": [Function],
72
+ "isChildOf": [Function],
72
73
  "isFocusOn": [Function],
73
74
  "isGroupItemFocused": [Function],
74
75
  "moveFocus": [Function],
@@ -1,12 +1,20 @@
1
1
  import { NativeModules } from "react-native";
2
2
  import * as R from "ramda";
3
3
 
4
- import { isCurrentFocusOn } from "../focusManagerAux/utils";
4
+ import {
5
+ isCurrentFocusOn,
6
+ isChildOf as isChildOfUtils,
7
+ } from "../focusManagerAux/utils";
5
8
  import { Tree } from "./treeDataStructure/Tree";
6
9
  import { findFocusableNode } from "./treeDataStructure/Utils";
7
10
  import { subscriber } from "../../functionUtils";
8
11
  import { findChild } from "./utils";
9
12
 
13
+ import {
14
+ emitRegistered,
15
+ emitUnregistered,
16
+ } from "../focusManagerAux/utils/utils.ios";
17
+
10
18
  const { FocusableManagerModule } = NativeModules;
11
19
 
12
20
  /**
@@ -180,10 +188,14 @@ export const focusManager = (function () {
180
188
  function register({ id, component }) {
181
189
  const { isGroup = false } = component;
182
190
 
191
+ emitRegistered(id);
192
+
183
193
  return isGroup ? registerGroup(id, component) : registerItem(id, component);
184
194
  }
185
195
 
186
196
  function unregister(id, { group = false } = {}) {
197
+ emitUnregistered(id);
198
+
187
199
  group ? unregisterGroup(id) : unregisterItem(id);
188
200
  }
189
201
 
@@ -400,6 +412,10 @@ export const focusManager = (function () {
400
412
  return id && isCurrentFocusOn(id, currentFocusNode);
401
413
  }
402
414
 
415
+ function isChildOf(childId, parentId): boolean {
416
+ return isChildOfUtils(focusableTree, childId, parentId);
417
+ }
418
+
403
419
  return {
404
420
  on,
405
421
  invokeHandler,
@@ -422,5 +438,6 @@ export const focusManager = (function () {
422
438
  isGroupItemFocused,
423
439
  getPreferredFocusChild,
424
440
  isFocusOn,
441
+ isChildOf,
425
442
  };
426
443
  })();
@@ -190,3 +190,21 @@ export const isCurrentFocusOn = (id, node) => {
190
190
 
191
191
  return isCurrentFocusOn(id, node.parent);
192
192
  };
193
+
194
+ export const isChildOf = (focusableTree, childId, parentId) => {
195
+ if (isNil(childId) || isNil(parentId)) {
196
+ return false;
197
+ }
198
+
199
+ const childNode = focusableTree.findInTree(childId);
200
+
201
+ if (isNil(childNode)) {
202
+ return false;
203
+ }
204
+
205
+ if (childNode.parent?.id === parentId) {
206
+ return true;
207
+ }
208
+
209
+ return isChildOf(focusableTree, childNode.parent?.id, parentId);
210
+ };
@@ -0,0 +1,35 @@
1
+ import { ReplaySubject } from "rxjs";
2
+ import { filter } from "rxjs/operators";
3
+ import { BUTTON_PREFIX } from "@applicaster/zapp-react-native-ui-components/Components/MasterCell/DefaultComponents/tv/TvActionButtons/const";
4
+ import { focusManager } from "@applicaster/zapp-react-native-utils/appUtils/focusManager/index.ios";
5
+
6
+ type FocusableID = string;
7
+ type RegistrationEvent = {
8
+ id: FocusableID;
9
+ registered: boolean;
10
+ };
11
+
12
+ const isFocusableButton = (id: Option<FocusableID>): boolean =>
13
+ id && id.includes?.(BUTTON_PREFIX);
14
+
15
+ const registeredSubject$ = new ReplaySubject<RegistrationEvent>(1);
16
+
17
+ export const focusableButtonsRegistration$ = (focusableGroupId: string) =>
18
+ registeredSubject$.pipe(
19
+ filter(
20
+ (value) =>
21
+ value.registered && focusManager.isChildOf(value.id, focusableGroupId)
22
+ )
23
+ );
24
+
25
+ export const emitRegistered = (id: Option<FocusableID>): void => {
26
+ if (isFocusableButton(id)) {
27
+ registeredSubject$.next({ id, registered: true });
28
+ }
29
+ };
30
+
31
+ export const emitUnregistered = (id: Option<FocusableID>): void => {
32
+ if (isFocusableButton(id)) {
33
+ registeredSubject$.next({ id, registered: false });
34
+ }
35
+ };
@@ -2,6 +2,27 @@ export const userPreferencesNamespace = "user_preferences";
2
2
 
3
3
  export const skipActionType = "show_skip";
4
4
 
5
+ export class PlayerError
6
+ extends Error
7
+ implements QuickBrickPlayer.PlayerErrorI
8
+ {
9
+ description: string;
10
+
11
+ constructor(message: string, description: string) {
12
+ super(message);
13
+ this.description = description;
14
+
15
+ Object.setPrototypeOf(this, PlayerError.prototype);
16
+ }
17
+
18
+ toObject() {
19
+ return {
20
+ error: this.message,
21
+ message: this.description,
22
+ };
23
+ }
24
+ }
25
+
5
26
  export enum SharedPlayerCallBacksKeys {
6
27
  OnPlayerResume = "onPlayerResume",
7
28
  OnPlayerPause = "onPlayerPause",
@@ -575,24 +575,27 @@ export function routeIsPlayerScreen(currentRoute) {
575
575
  return currentRoute?.includes("/playable");
576
576
  }
577
577
 
578
- export const getNavBarProps =
579
- (currentRiver: ZappRiver, pathname: string, title: string) => () => {
580
- const props = getNavigationPropsV2({
581
- currentRiver,
582
- title,
583
- category: "nav_bar",
584
- });
578
+ export const getNavBarProps = (
579
+ currentRiver: ZappRiver,
580
+ pathname: string,
581
+ title: string
582
+ ) => {
583
+ const props = getNavigationPropsV2({
584
+ currentRiver,
585
+ title,
586
+ category: "nav_bar",
587
+ });
585
588
 
586
- if (props) {
587
- return {
588
- ...props,
589
- id: pathname,
590
- pathname: pathname,
591
- };
592
- }
589
+ if (props) {
590
+ return {
591
+ ...props,
592
+ id: pathname,
593
+ pathname: pathname,
594
+ };
595
+ }
593
596
 
594
- return null;
595
- };
597
+ return null;
598
+ };
596
599
 
597
600
  export const findMenuPlugin = (
598
601
  navigations: ZappNavigation[],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@applicaster/zapp-react-native-utils",
3
- "version": "15.0.0-alpha.4515904047",
3
+ "version": "15.0.0-alpha.5412418016",
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-alpha.4515904047",
30
+ "@applicaster/applicaster-types": "15.0.0-alpha.5412418016",
31
31
  "buffer": "^5.2.1",
32
32
  "camelize": "^1.0.0",
33
33
  "dayjs": "^1.11.10",
@@ -151,7 +151,13 @@ export const useBatchLoading = (
151
151
  }
152
152
  }
153
153
  });
154
- }, [feedUrls, feeds, loadPipesDataDispatcher]);
154
+ }, [
155
+ batchComponents,
156
+ feeds,
157
+ getUrl,
158
+ loadPipesDataDispatcher,
159
+ options.riverId,
160
+ ]);
155
161
 
156
162
  React.useEffect(() => {
157
163
  runBatchLoading();
@@ -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 (!source) {
79
- // eslint-disable-next-line no-console
80
- console.error("source is empty", {
81
- source,
82
- contexts,
83
- mapping,
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
- return null;
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
- mapping
197
- ? getInflatedDataSourceUrl({
198
- source: feedUrl,
199
- contexts: {
200
- entry: entryContext,
201
- screen: screenContext,
202
- search: getSearchContext(searchContext, mapping),
203
- },
204
- mapping,
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
  }
@@ -34,7 +34,9 @@ export const usePipesCacheReset = (riverId, riverComponents) => {
34
34
  component
35
35
  );
36
36
 
37
- dispatch(clearPipesData(url, { riverId }));
37
+ if (url) {
38
+ dispatch(clearPipesData(url, { riverId }));
39
+ }
38
40
  }
39
41
  });
40
42
  };
package/utils/index.ts CHANGED
@@ -34,4 +34,7 @@ export {
34
34
  last,
35
35
  toLower,
36
36
  isEqual as equals,
37
+ uniq,
38
+ uniqWith,
39
+ flowRight as compose,
37
40
  } from "lodash";
@@ -15,7 +15,7 @@ export enum ResultType {
15
15
  }
16
16
 
17
17
  export type CallbackResult = hookCallbackArgs & {
18
- options: {
18
+ options?: {
19
19
  resultType?: ResultType;
20
20
  };
21
21
  };
@@ -36,7 +36,7 @@ type General = Record<string, unknown>;
36
36
 
37
37
  const LogPrefix = "useCallbackNavigationAction:";
38
38
 
39
- const { log_info, log_verbose, log_error } = createLogger({
39
+ const { log_info, log_verbose, log_debug } = createLogger({
40
40
  subsystem: "hook-navigation-callback",
41
41
  });
42
42
 
@@ -58,21 +58,23 @@ const legacyMappingKeys = {
58
58
  },
59
59
  };
60
60
 
61
- const isNonEmptyString = (v: unknown): v is string =>
62
- typeof v === "string" && v.trim().length > 0;
63
-
64
61
  const NAV_ACTIONS = Object.values(NavigationCallbackOptions) as string[];
65
62
 
66
63
  const isNavAction = (v: unknown): v is NavigationCallbackOptions =>
67
- typeof v === "string" && NAV_ACTIONS.includes(v.trim());
64
+ typeof v === "string" && NAV_ACTIONS.includes(v);
68
65
 
69
66
  export const getNavigationKeys = (
70
67
  item?: ZappUIComponent | ZappRiver,
71
- resultType: ResultType = null
68
+ resultType: ResultType | null = null
72
69
  ): NavKeys => {
73
70
  const general = (item?.general ?? {}) as General;
74
- const pluginIdentifier = item?.type ?? "";
75
- const legacy = legacyMappingKeys[pluginIdentifier] ?? {};
71
+
72
+ const pluginIdentifier = (item as any).identifier ?? item?.type ?? "";
73
+
74
+ const legacy =
75
+ legacyMappingKeys[`${pluginIdentifier}.${resultType}`] ??
76
+ legacyMappingKeys[pluginIdentifier] ??
77
+ {};
76
78
 
77
79
  const actionKey = resultType
78
80
  ? `${resultType}_${CALLBACK_NAVIGATION_KEY}`
@@ -82,29 +84,27 @@ export const getNavigationKeys = (
82
84
  (general as General)[actionKey] ??
83
85
  (legacy.actionType ? (general as General)[legacy.actionType] : undefined);
84
86
 
85
- let action: NavigationCallbackOptions | null = null;
86
-
87
- if (isNonEmptyString(rawAction)) {
88
- const trimmed = rawAction.trim();
89
- action = isNavAction(trimmed) ? trimmed : null;
90
- }
87
+ const action: NavigationCallbackOptions | null = isNavAction(rawAction)
88
+ ? rawAction
89
+ : null;
91
90
 
92
91
  if (!action) return null;
93
92
 
94
93
  let targetScreenId: string | null = null;
95
94
 
96
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
+
97
100
  const screenId: string | null =
98
- ((general as General)[CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY] as string) ??
101
+ ((general as General)[screenKey] as string) ??
99
102
  (legacy.targetScreen
100
103
  ? ((general as General)[legacy.targetScreen] as string)
101
104
  : undefined);
102
105
 
103
106
  if (screenId) {
104
- const trimmedTargetScreenId = screenId.trim();
105
-
106
- targetScreenId =
107
- trimmedTargetScreenId.length > 0 ? trimmedTargetScreenId : null;
107
+ targetScreenId = screenId.length > 0 ? screenId : null;
108
108
  }
109
109
  }
110
110
 
@@ -113,10 +113,12 @@ export const getNavigationKeys = (
113
113
 
114
114
  export const useCallbackNavigationAction = (
115
115
  item?: ZappUIComponent | ZappRiver
116
- ): ((args: CallbackResult) => void | undefined) => {
116
+ ): ((
117
+ args: CallbackResult,
118
+ hookCallback?: hookCallback
119
+ ) => void | undefined) => {
117
120
  const navigation = useNavigation();
118
121
  const rivers = useRivers();
119
- const enabled = Boolean(item?.general?.[CALLBACK_NAVIGATION_KEY]);
120
122
  const screenContext = useScreenContext();
121
123
 
122
124
  const overrideCallbackFromComponent = useMemo(() => {
@@ -131,23 +133,36 @@ export const useCallbackNavigationAction = (
131
133
  }
132
134
 
133
135
  const callbackAction = useCallback<hookCallback>(
134
- (args: CallbackResult) => {
136
+ (args: CallbackResult, hookCallback: hookCallback = null) => {
135
137
  if (!args.success) {
136
- log_error(`${LogPrefix} callback called with no success`);
138
+ log_debug(
139
+ `${LogPrefix} callback called with no success, use original callback`
140
+ );
141
+
142
+ hookCallback?.(args);
137
143
 
138
144
  return;
139
145
  }
140
146
 
141
147
  if (args.cancelled) {
142
- log_error(`${LogPrefix} callback called but 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);
143
161
 
144
162
  return;
145
163
  }
146
164
 
147
- const data = getNavigationKeys(item, args.options?.resultType ?? null) ?? {
148
- action: NavigationCallbackOptions.DEFAULT,
149
- targetScreenId: null,
150
- };
165
+ hookCallback?.({ ...args, success: false, cancelled: true });
151
166
 
152
167
  switch (data.action) {
153
168
  case NavigationCallbackOptions.GO_BACK: {
@@ -198,5 +213,5 @@ export const useCallbackNavigationAction = (
198
213
  [item, navigation, rivers]
199
214
  );
200
215
 
201
- return enabled ? overrideCallbackFromComponent || callbackAction : undefined;
216
+ return overrideCallbackFromComponent || callbackAction;
202
217
  };
@@ -12,13 +12,7 @@ export const useCallbackActions = (
12
12
 
13
13
  return useCallback(
14
14
  async (data: CallbackResult) => {
15
- if (navigationAction && data.success) {
16
- hookCallback?.({ ...data, success: false, cancelled: true });
17
-
18
- navigationAction(data);
19
- } else {
20
- hookCallback?.(data);
21
- }
15
+ navigationAction(data, hookCallback);
22
16
  },
23
17
  [navigationAction, hookCallback]
24
18
  );