@applicaster/zapp-react-native-utils 15.0.0-rc.56 → 15.0.0-rc.58

package/appUtils/focusManager/index.ios.ts

@@ -194,9 +194,9 @@ export const focusManager = (function () {
       registerItem(id, component);
     }
 
-    const parentId = component?.props?.groupId;
+    const groupId = component?.props?.groupId;
 
-    emitRegistered({ id, parentId, isGroup });
+    emitRegistered({ id, groupId, isGroup });
   }
 
   function unregister(id, { group = false } = {}) {

package/appUtils/focusManagerAux/utils/utils.ios.ts

@@ -1,5 +1,5 @@
 import { ReplaySubject, Subject } from "rxjs";
-import { filter, switchMap, take } from "rxjs/operators";
+import { filter, switchMap, take, map } from "rxjs/operators";
 import { BUTTON_PREFIX } from "@applicaster/zapp-react-native-ui-components/Components/MasterCell/DefaultComponents/tv/TvActionButtons/const";
 import { focusManager } from "@applicaster/zapp-react-native-utils/appUtils/focusManager/index.ios";
 
@@ -11,13 +11,23 @@ type RegistrationEvent = {
 
 let focusableViewRegistrationSubject$ = new Subject<{
   id: FocusableID;
-  parentId: FocusableID;
+  groupId: FocusableID;
 }>();
 
 let focusableGroupRegistrationSubject$ = new ReplaySubject<{
   id: FocusableID;
 }>();
 
+let focusableNativeViewRegistrationSubject$ = new Subject<{
+  id: FocusableID;
+  groupId: FocusableID;
+}>();
+
+let focusableNativeGroupRegistrationSubject$ = new ReplaySubject<{
+  id: FocusableID;
+  groupId: FocusableID;
+}>();
+
 const isFocusableButton = (id: Option<FocusableID>): boolean =>
   id && id.includes?.(BUTTON_PREFIX);
 
@@ -41,35 +51,90 @@ export const resetFocusableRegistration = () => {
     focusableGroupRegistrationSubject$.complete();
   }
 
+  if (!focusableNativeViewRegistrationSubject$.closed) {
+    focusableNativeViewRegistrationSubject$.complete();
+  }
+
+  if (!focusableNativeGroupRegistrationSubject$.closed) {
+    focusableNativeGroupRegistrationSubject$.complete();
+  }
+
   focusableViewRegistrationSubject$ = new Subject<{
     id: FocusableID;
-    parentId: FocusableID;
+    groupId: FocusableID;
   }>();
 
   focusableGroupRegistrationSubject$ = new ReplaySubject<{
     id: FocusableID;
   }>();
+
+  focusableNativeViewRegistrationSubject$ = new Subject<{
+    id: FocusableID;
+    groupId: FocusableID;
+  }>();
+
+  focusableNativeGroupRegistrationSubject$ = new ReplaySubject<{
+    id: FocusableID;
+    groupId: FocusableID;
+  }>();
+};
+
+const focusableNativeViewRegistration = ({ focusableView, focusableGroup }) => {
+  return focusableNativeViewRegistrationSubject$.pipe(
+    filter(
+      (focusableNativeView) => focusableNativeView.id === focusableView.id
+    ),
+    take(1),
+    switchMap((focusableNativeView) =>
+      // start waiting registration of its parent FocusableNativeGroup
+      focusableNativeGroupRegistrationSubject$.pipe(
+        filter(
+          (focusableNativeGroup) =>
+            focusableNativeGroup.id === focusableNativeView.groupId
+        ),
+        take(1),
+        map((focusableNativeGroup) => ({
+          focusableNativeGroup,
+          focusableNativeView,
+          focusableView,
+          focusableGroup,
+        }))
+      )
+    )
+  );
 };
 
 export const firstFocusableViewRegistrationFactory = () =>
   focusableViewRegistrationSubject$.pipe(
     take(1), // we care about only first FocusableView registration
-    switchMap(({ parentId }) =>
-      // start waiting registration of its parent
+    switchMap((focusableView) =>
+      // start waiting registration of its parent FocusableGroup
       focusableGroupRegistrationSubject$.pipe(
-        filter(({ id }) => id === parentId)
+        filter((focusableGroup) => focusableGroup.id === focusableView.groupId),
+        take(1),
+        map((focusableGroup) => ({
+          focusableView,
+          focusableGroup,
+        }))
       )
     ),
-    take(1)
+    // start waiting registration for FocusableNativeView and its parent FocusableNativeGroup
+    switchMap(({ focusableView, focusableGroup }) =>
+      focusableNativeViewRegistration({
+        focusableView,
+        focusableGroup,
+      })
+    )
   );
 
+// registration on RN level(into RN focusManager)
 export const emitRegistered = ({
   id,
-  parentId,
+  groupId,
   isGroup,
 }: {
   id: Option<FocusableID>;
-  parentId: Option<FocusableID>;
+  groupId: Option<FocusableID>;
   isGroup: boolean;
 }): void => {
   if (isFocusableButton(id)) {
@@ -80,13 +145,33 @@ export const emitRegistered = ({
     focusableGroupRegistrationSubject$.next({ id });
   }
 
-  if (!isGroup && id && parentId) {
-    focusableViewRegistrationSubject$.next({ id, parentId });
+  if (!isGroup && id && groupId) {
+    focusableViewRegistrationSubject$.next({ id, groupId });
   }
 };
 
+// unregistration on RN level(into RN focusManager)
 export const emitUnregistered = (id: Option<FocusableID>): void => {
   if (isFocusableButton(id)) {
     registeredSubject$.next({ id, registered: false });
   }
 };
+
+// registration focusableNativeView and focusableNativeGroup
+export const emitNativeRegistered = ({
+  id,
+  groupId,
+  isGroup,
+}: {
+  id: Option<FocusableID>;
+  groupId: Option<FocusableID>;
+  isGroup: boolean;
+}): void => {
+  if (!isGroup && id && groupId) {
+    focusableNativeViewRegistrationSubject$.next({ id, groupId });
+  }
+
+  if (isGroup && id && groupId) {
+    focusableNativeGroupRegistrationSubject$.next({ id, groupId });
+  }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "15.0.0-rc.56",
+  "version": "15.0.0-rc.58",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -27,7 +27,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "15.0.0-rc.56",
+    "@applicaster/applicaster-types": "15.0.0-rc.58",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",