@applicaster/zapp-react-native-ui-components 16.0.0-rc.83 → 16.0.0-rc.84

package/Components/ModalComponent/AudioPlayer/Components/Item.tsx

@@ -706,18 +706,31 @@ function ItemButton({
     }
   };
 
+  const buttonPadding = {
+    paddingTop: layout.paddingTop,
+    paddingRight: layout.paddingRight,
+    paddingBottom: layout.paddingBottom,
+    paddingLeft: layout.paddingLeft,
+  };
+
+  // A nested Pressable with no handler swallows the parent row press.
+  if (!onPress) {
+    return (
+      <View pointerEvents="none" style={buttonPadding}>
+        {renderIcon()}
+      </View>
+    );
+  }
+
   return (
     <Pressable
       onPress={(e: any) => {
         e?.stopPropagation?.();
-        onPress?.();
+        onPress();
       }}
       style={({ pressed }) => [
+        buttonPadding,
         {
-          paddingTop: layout.paddingTop,
-          paddingRight: layout.paddingRight,
-          paddingBottom: layout.paddingBottom,
-          paddingLeft: layout.paddingLeft,
           opacity: pressed || focused ? 0.7 : 1,
         },
       ]}
@@ -849,6 +862,10 @@ export function AudioPlayerTrackItem({
 
   const container = resolveContainerSpec(image);
 
+  const handleTrailingButtonPress =
+    onTrailingButtonPress ??
+    (data.trailingButton === "multiSelect" ? onPress : undefined);
+
   return (
     <ItemContainer
       image={image}
@@ -884,7 +901,7 @@ export function AudioPlayerTrackItem({
           focusedLeadingButton={focusedLeadingButton}
           focusedTrailingButton={focusedTrailingButton}
           onLeadingButtonPress={onLeadingButtonPress}
-          onTrailingButtonPress={onTrailingButtonPress}
+          onTrailingButtonPress={handleTrailingButtonPress}
           isSelected={data.isSelected}
           renderHandle={renderHandle}
           checkboxAssets={checkboxAssets}

package/Components/ModalComponent/AudioPlayer/Components/__tests__/Item.test.tsx

@@ -0,0 +1,66 @@
+import React from "react";
+import { Pressable } from "react-native";
+import { fireEvent, render, screen } from "@testing-library/react-native";
+import { AudioPlayerTrackItem, VARIANT_PLAYLIST_ITEM } from "../Item";
+
+const playlistItemData = {
+  textLabel1: "Queue",
+  textLabel2: "",
+  trailingButton: "multiSelect" as const,
+  isSelected: false,
+};
+
+describe("AudioPlayerTrackItem multiSelect checkbox", () => {
+  it("invokes onPress when the checkbox is pressed even if onTrailingButtonPress is omitted", () => {
+    const onPress = jest.fn();
+
+    render(
+      <AudioPlayerTrackItem
+        configuration={VARIANT_PLAYLIST_ITEM}
+        data={playlistItemData}
+        onPress={onPress}
+      />
+    );
+
+    const pressables = screen.UNSAFE_getAllByType(Pressable);
+    fireEvent.press(pressables[pressables.length - 1]);
+
+    expect(onPress).toHaveBeenCalledTimes(1);
+  });
+
+  it("invokes onTrailingButtonPress instead of onPress when a dedicated trailing handler is provided", () => {
+    const onPress = jest.fn();
+    const onTrailingButtonPress = jest.fn();
+
+    render(
+      <AudioPlayerTrackItem
+        configuration={VARIANT_PLAYLIST_ITEM}
+        data={playlistItemData}
+        onPress={onPress}
+        onTrailingButtonPress={onTrailingButtonPress}
+      />
+    );
+
+    const pressables = screen.UNSAFE_getAllByType(Pressable);
+    fireEvent.press(pressables[pressables.length - 1]);
+
+    expect(onTrailingButtonPress).toHaveBeenCalledTimes(1);
+    expect(onPress).not.toHaveBeenCalled();
+  });
+
+  it("invokes onPress when the row is pressed", () => {
+    const onPress = jest.fn();
+
+    render(
+      <AudioPlayerTrackItem
+        configuration={VARIANT_PLAYLIST_ITEM}
+        data={playlistItemData}
+        onPress={onPress}
+      />
+    );
+
+    fireEvent.press(screen.UNSAFE_getAllByType(Pressable)[0]);
+
+    expect(onPress).toHaveBeenCalledTimes(1);
+  });
+});

package/Components/ModalComponent/presets/__tests__/getCell.test.ts

@@ -1,3 +1,6 @@
+import React from "react";
+import { Pressable } from "react-native";
+import { fireEvent, render, screen } from "@testing-library/react-native";
 import { getCell } from "../index";
 import { standardCell } from "../standardCell";
 import { selectableCell } from "../selectableCell";
@@ -64,3 +67,24 @@ describe("mapMenuItemToPlaylistData", () => {
     expect(data.trailingButton).toBeUndefined();
   });
 });
+
+describe("selectableCell checkbox press", () => {
+  it("invokes onPress with the playlist item when the checkbox is pressed", () => {
+    const onPress = jest.fn();
+    const item = { id: "queue", title: "Queue" };
+
+    render(
+      selectableCell.renderItem({
+        item,
+        index: 0,
+        onPress,
+        context: { behavior: { selectMode: "multi" } } as any,
+      }) as React.ReactElement
+    );
+
+    const pressables = screen.UNSAFE_getAllByType(Pressable);
+    fireEvent.press(pressables[pressables.length - 1]);
+
+    expect(onPress).toHaveBeenCalledWith(item);
+  });
+});

package/Components/ModalComponent/presets/selectableCell.tsx

@@ -21,7 +21,7 @@ export const selectableCell: CellRenderer = {
                 title: item.title,
                 action: item.secondaryAction!.action,
               })
-          : undefined
+          : () => onPress(item)
       }
     />
   ),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-ui-components",
-  "version": "16.0.0-rc.83",
+  "version": "16.0.0-rc.84",
   "description": "Applicaster Zapp React Native ui components for the Quick Brick App",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,10 +28,10 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "16.0.0-rc.83",
-    "@applicaster/zapp-react-native-bridge": "16.0.0-rc.83",
-    "@applicaster/zapp-react-native-redux": "16.0.0-rc.83",
-    "@applicaster/zapp-react-native-utils": "16.0.0-rc.83",
+    "@applicaster/applicaster-types": "16.0.0-rc.84",
+    "@applicaster/zapp-react-native-bridge": "16.0.0-rc.84",
+    "@applicaster/zapp-react-native-redux": "16.0.0-rc.84",
+    "@applicaster/zapp-react-native-utils": "16.0.0-rc.84",
     "fast-json-stable-stringify": "^2.1.0",
     "promise": "^8.3.0",
     "react-native-sortables": "1.7.1",