@oxyhq/services 22.8.7 → 22.10.0

package/lib/commonjs/ui/screens/AccountMembersScreen.js

@@ -9,17 +9,16 @@ var _reactNative = require("react-native");
 var _vectorIcons = require("@expo/vector-icons");
 var _reactQuery = require("@tanstack/react-query");
 var _bloom = require("@oxyhq/bloom");
+var _surfaces = require("@oxyhq/bloom/surfaces");
 var _theme = require("@oxyhq/bloom/theme");
 var _typography = require("@oxyhq/bloom/typography");
 var _button = require("@oxyhq/bloom/button");
 var _textField = require("@oxyhq/bloom/text-field");
 var _divider = require("@oxyhq/bloom/divider");
-var _core = require("@oxyhq/core");
-var _Header = _interopRequireDefault(require("../components/Header.js"));
 var _OxyContext = require("../context/OxyContext.js");
 var _useI18n = require("../hooks/useI18n.js");
+var _useSurfaceHeader = require("../hooks/useSurfaceHeader.js");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /** Roles assignable via invite / role change — everything except `owner`. */
 
 const ASSIGNABLE_ROLES = ['admin', 'editor', 'developer', 'billing', 'viewer'];
@@ -44,6 +43,10 @@ const AccountMembersScreen = ({
   const {
     t
   } = (0, _useI18n.useI18n)();
+  (0, _useSurfaceHeader.useSurfaceHeader)({
+    title: t('accounts.members.title') || 'Members',
+    subtitle: t('accounts.members.subtitle') || 'People with access to this account.'
+  });
   const {
     oxyServices,
     canUsePrivateApi
@@ -146,10 +149,6 @@ const AccountMembersScreen = ({
       _bloom.toast.error(errorMessage(error, t('accounts.members.toasts.transferFailed') || 'Failed to transfer ownership'));
     }
   });
-  const [memberToRemove, setMemberToRemove] = (0, _react.useState)(null);
-  const [memberToPromote, setMemberToPromote] = (0, _react.useState)(null);
-  const removeDialog = (0, _bloom.useDialogControl)();
-  const transferDialog = (0, _bloom.useDialogControl)();
   const handleInvite = (0, _react.useCallback)(() => {
     const usernameOrEmail = inviteIdentifier.trim();
     if (!usernameOrEmail) {
@@ -171,298 +170,230 @@ const AccountMembersScreen = ({
       role
     });
   }, [updateMutation]);
-  const confirmRemove = (0, _react.useCallback)(member => {
-    setMemberToRemove(member);
-    removeDialog.open();
-  }, [removeDialog]);
-  const confirmTransfer = (0, _react.useCallback)(member => {
-    setMemberToPromote(member);
-    transferDialog.open();
-  }, [transferDialog]);
-  const title = t('accounts.members.title') || 'Members';
+  const confirmRemove = (0, _react.useCallback)(async member => {
+    const confirmed = await _surfaces.surfaces.confirm({
+      title: t('accounts.members.removeConfirm.title') || 'Remove member',
+      message: t('accounts.members.removeConfirm.description') || 'Remove this member from the account? They will lose all access.',
+      confirmLabel: t('accounts.members.actions.remove') || 'Remove',
+      cancelLabel: t('common.cancel') || 'Cancel',
+      destructive: true
+    });
+    if (confirmed) removeMutation.mutate(member._id);
+  }, [removeMutation, t]);
+  const confirmTransfer = (0, _react.useCallback)(async member => {
+    const confirmed = await _surfaces.surfaces.confirm({
+      title: t('accounts.members.transferConfirm.title') || 'Transfer ownership',
+      message: t('accounts.members.transferConfirm.description') || 'Transfer ownership of this account to this member? You will be demoted to admin. This cannot be undone.',
+      confirmLabel: t('accounts.members.actions.transfer') || 'Transfer ownership',
+      cancelLabel: t('common.cancel') || 'Cancel',
+      destructive: true
+    });
+    if (confirmed) transferMutation.mutate(member.memberUserId);
+  }, [transferMutation, t]);
   if (!id) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      className: "flex-1 bg-bg",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Header.default, {
-        title: title,
-        onBack: goBack,
-        onClose: onClose,
-        showBackButton: true,
-        showCloseButton: true,
-        elevation: "subtle"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        className: "flex-1 items-center justify-center px-screen-margin",
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        className: "items-center justify-center px-screen-margin py-space-40",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
           className: "text-body font-body text-text-secondary text-center",
           children: t('accounts.members.errors.missingAccount') || 'No account selected.'
         })
-      })]
+      })
     });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    className: "flex-1 bg-bg",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Header.default, {
-      title: title,
-      onBack: goBack,
-      onClose: onClose,
-      showBackButton: true,
-      showCloseButton: true,
-      elevation: "subtle"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.KeyboardAvoidingView, {
-      className: "flex-1",
-      behavior: _reactNative.Platform.OS === 'ios' ? 'padding' : undefined,
-      keyboardVerticalOffset: _reactNative.Platform.OS === 'ios' ? 88 : 0,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.ScrollView, {
-        className: "flex-1",
-        contentContainerClassName: "px-screen-margin pt-space-24 pb-space-32 gap-space-24",
-        showsVerticalScrollIndicator: false,
-        keyboardShouldPersistTaps: "handled",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          className: "gap-space-8",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.H1, {
-            className: "text-headerBold font-headerBold text-text",
-            children: title
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-            className: "text-body font-body text-text-secondary",
-            children: t('accounts.members.subtitle') || 'People with access to this account.'
-          })]
-        }), !accountQuery.isLoading && !canRead ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-          className: "text-body font-body text-text-secondary text-center py-space-24",
-          children: t('accounts.members.errors.noPermission') || 'You do not have permission to view members.'
-        }) : null, canInvite ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          className: "gap-space-12 p-space-16 rounded-radius-20 bg-fill",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-            className: "text-body font-bodyBold text-text",
-            children: t('accounts.members.invite.title') || 'Add a member'
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_textField.TextField, {
-            isInvalid: !!inviteError,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_textField.TextFieldInput, {
-              floatingLabel: true,
-              label: t('accounts.members.invite.identifierLabel') || 'Username or email',
-              value: inviteIdentifier,
-              onChangeText: value => {
-                setInviteIdentifier(value);
-                if (inviteError) setInviteError(null);
-              },
-              isInvalid: !!inviteError,
-              autoCapitalize: "none",
-              autoCorrect: false,
-              autoComplete: "off"
-            })
-          }), inviteError ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-            className: "text-caption font-caption px-space-4",
+    className: "px-screen-margin pt-space-16 pb-space-32 gap-space-24",
+    children: [!accountQuery.isLoading && !canRead ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+      className: "text-body font-body text-text-secondary text-center py-space-24",
+      children: t('accounts.members.errors.noPermission') || 'You do not have permission to view members.'
+    }) : null, canInvite ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      className: "gap-space-12 p-space-16 rounded-radius-20 bg-fill",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+        className: "text-body font-bodyBold text-text",
+        children: t('accounts.members.invite.title') || 'Add a member'
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_textField.TextField, {
+        isInvalid: !!inviteError,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_textField.TextFieldInput, {
+          floatingLabel: true,
+          label: t('accounts.members.invite.identifierLabel') || 'Username or email',
+          value: inviteIdentifier,
+          onChangeText: value => {
+            setInviteIdentifier(value);
+            if (inviteError) setInviteError(null);
+          },
+          isInvalid: !!inviteError,
+          autoCapitalize: "none",
+          autoCorrect: false,
+          autoComplete: "off"
+        })
+      }), inviteError ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+        className: "text-caption font-caption px-space-4",
+        style: {
+          color: colors.negative
+        },
+        children: inviteError
+      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+        className: "text-caption font-caption text-text-secondary px-space-4",
+        children: t('accounts.members.invite.roleLabel') || 'Role'
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        className: "flex-row flex-wrap gap-space-8",
+        children: ASSIGNABLE_ROLES.map(role => {
+          const selected = role === inviteRole;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+            accessibilityRole: "radio",
+            accessibilityState: {
+              selected
+            },
+            accessibilityLabel: roleLabel(role),
+            onPress: () => setInviteRole(role),
+            activeOpacity: 0.7,
+            className: "px-space-12 py-space-8 rounded-radius-full",
             style: {
-              color: colors.negative
+              backgroundColor: selected ? colors.primary : colors.card,
+              borderWidth: 1,
+              borderColor: selected ? colors.primary : colors.border
             },
-            children: inviteError
-          }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-            className: "text-caption font-caption text-text-secondary px-space-4",
-            children: t('accounts.members.invite.roleLabel') || 'Role'
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            className: "flex-row flex-wrap gap-space-8",
-            children: ASSIGNABLE_ROLES.map(role => {
-              const selected = role === inviteRole;
-              return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-                accessibilityRole: "radio",
-                accessibilityState: {
-                  selected
-                },
-                accessibilityLabel: roleLabel(role),
-                onPress: () => setInviteRole(role),
-                activeOpacity: 0.7,
-                className: "px-space-12 py-space-8 rounded-radius-full",
-                style: {
-                  backgroundColor: selected ? colors.primary : colors.card,
-                  borderWidth: 1,
-                  borderColor: selected ? colors.primary : colors.border
-                },
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                  className: "text-caption font-bodyBold",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+              className: "text-caption font-bodyBold",
+              style: {
+                color: selected ? colors.background : colors.text
+              },
+              children: roleLabel(role)
+            })
+          }, role);
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
+        variant: "primary",
+        onPress: handleInvite,
+        disabled: inviteMutation.isPending || !inviteIdentifier.trim(),
+        loading: inviteMutation.isPending,
+        accessibilityLabel: t('accounts.members.invite.submit') || 'Add member',
+        className: "w-full",
+        children: t('accounts.members.invite.submit') || 'Add member'
+      })]
+    }) : null, canRead ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      className: "gap-space-8",
+      children: membersQuery.isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        className: "items-center py-space-24",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ActivityIndicator, {
+          color: colors.primary
+        })
+      }) : members.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+        className: "text-body font-body text-text-secondary text-center py-space-24",
+        children: t('accounts.members.empty') || 'No members yet.'
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        className: "rounded-radius-20 bg-fill overflow-hidden",
+        children: members.map((member, index) => {
+          const isOwner = member.role === 'owner';
+          const isLastOwner = isOwner && ownerCount <= 1;
+          const canEditThisRole = canUpdate && !isOwner;
+          const canRemoveThisMember = canRemove && !isLastOwner && (!isOwner || canTransfer);
+          const canTransferToThis = canTransfer && !isOwner && member.status === 'active';
+          return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            children: [index > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider.Divider, {
+              color: colors.border,
+              spacing: 0
+            }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+              className: "p-space-16 gap-space-8",
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                className: "flex-row items-center gap-space-8",
+                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+                  className: "text-body font-bodyBold text-text flex-1",
+                  numberOfLines: 1,
+                  children: member.memberUserId
+                }), isOwner ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+                  className: "px-space-8 py-space-4 rounded-radius-full",
                   style: {
-                    color: selected ? colors.background : colors.text
+                    backgroundColor: colors.primarySubtle
                   },
-                  children: roleLabel(role)
-                })
-              }, role);
-            })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
-            variant: "primary",
-            onPress: handleInvite,
-            disabled: inviteMutation.isPending || !inviteIdentifier.trim(),
-            loading: inviteMutation.isPending,
-            accessibilityLabel: t('accounts.members.invite.submit') || 'Add member',
-            className: "w-full",
-            children: t('accounts.members.invite.submit') || 'Add member'
-          })]
-        }) : null, canRead ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          className: "gap-space-8",
-          children: membersQuery.isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            className: "items-center py-space-24",
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ActivityIndicator, {
-              color: colors.primary
-            })
-          }) : members.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-            className: "text-body font-body text-text-secondary text-center py-space-24",
-            children: t('accounts.members.empty') || 'No members yet.'
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            className: "rounded-radius-20 bg-fill overflow-hidden",
-            children: members.map((member, index) => {
-              const isOwner = member.role === 'owner';
-              const isLastOwner = isOwner && ownerCount <= 1;
-              const canEditThisRole = canUpdate && !isOwner;
-              const canRemoveThisMember = canRemove && !isLastOwner && (!isOwner || canTransfer);
-              const canTransferToThis = canTransfer && !isOwner && member.status === 'active';
-              return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                children: [index > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider.Divider, {
-                  color: colors.border,
-                  spacing: 0
-                }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                  className: "p-space-16 gap-space-8",
-                  children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                    className: "flex-row items-center gap-space-8",
-                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                      className: "text-body font-bodyBold text-text flex-1",
-                      numberOfLines: 1,
-                      children: member.memberUserId
-                    }), isOwner ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-                      className: "px-space-8 py-space-4 rounded-radius-full",
-                      style: {
-                        backgroundColor: colors.primarySubtle
-                      },
-                      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                        className: "text-caption font-bodyBold",
-                        style: {
-                          color: colors.primary
-                        },
-                        children: roleLabel('owner')
-                      })
-                    }) : null, member.status !== 'active' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-                      className: "px-space-8 py-space-4 rounded-radius-full",
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+                    className: "text-caption font-bodyBold",
+                    style: {
+                      color: colors.primary
+                    },
+                    children: roleLabel('owner')
+                  })
+                }) : null, member.status !== 'active' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+                  className: "px-space-8 py-space-4 rounded-radius-full",
+                  style: {
+                    backgroundColor: colors.card
+                  },
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+                    className: "text-caption font-caption capitalize text-text-secondary",
+                    children: member.status
+                  })
+                }) : null]
+              }), canEditThisRole ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+                className: "flex-row flex-wrap gap-space-8",
+                children: ASSIGNABLE_ROLES.map(role => {
+                  const selected = role === member.role;
+                  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+                    accessibilityRole: "radio",
+                    accessibilityState: {
+                      selected
+                    },
+                    accessibilityLabel: roleLabel(role),
+                    onPress: () => handleChangeRole(member, role),
+                    disabled: updateMutation.isPending,
+                    activeOpacity: 0.7,
+                    className: "px-space-12 py-space-4 rounded-radius-full",
+                    style: {
+                      backgroundColor: selected ? colors.primary : colors.card,
+                      borderWidth: 1,
+                      borderColor: selected ? colors.primary : colors.border
+                    },
+                    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+                      className: "text-caption font-bodyBold",
                       style: {
-                        backgroundColor: colors.card
+                        color: selected ? colors.background : colors.text
                       },
-                      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                        className: "text-caption font-caption capitalize text-text-secondary",
-                        children: member.status
-                      })
-                    }) : null]
-                  }), canEditThisRole ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-                    className: "flex-row flex-wrap gap-space-8",
-                    children: ASSIGNABLE_ROLES.map(role => {
-                      const selected = role === member.role;
-                      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
-                        accessibilityRole: "radio",
-                        accessibilityState: {
-                          selected
-                        },
-                        accessibilityLabel: roleLabel(role),
-                        onPress: () => handleChangeRole(member, role),
-                        disabled: updateMutation.isPending,
-                        activeOpacity: 0.7,
-                        className: "px-space-12 py-space-4 rounded-radius-full",
-                        style: {
-                          backgroundColor: selected ? colors.primary : colors.card,
-                          borderWidth: 1,
-                          borderColor: selected ? colors.primary : colors.border
-                        },
-                        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                          className: "text-caption font-bodyBold",
-                          style: {
-                            color: selected ? colors.background : colors.text
-                          },
-                          children: roleLabel(role)
-                        })
-                      }, role);
+                      children: roleLabel(role)
                     })
-                  }) : !isOwner ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                    className: "text-caption font-caption text-text-secondary",
-                    children: roleLabel(member.role)
-                  }) : null, canTransferToThis || canRemoveThisMember ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                    className: "flex-row gap-space-16 pt-space-4",
-                    children: [canTransferToThis ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-                      accessibilityRole: "button",
-                      accessibilityLabel: t('accounts.members.actions.transfer') || 'Transfer ownership',
-                      onPress: () => confirmTransfer(member),
-                      activeOpacity: 0.7,
-                      className: "flex-row items-center gap-space-4",
-                      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
-                        name: "swap-horizontal-outline",
-                        size: 16,
-                        color: colors.icon
-                      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                        className: "text-caption font-bodyBold text-text-secondary",
-                        children: t('accounts.members.actions.transfer') || 'Transfer ownership'
-                      })]
-                    }) : null, canRemoveThisMember ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-                      accessibilityRole: "button",
-                      accessibilityLabel: t('accounts.members.actions.remove') || 'Remove member',
-                      onPress: () => confirmRemove(member),
-                      activeOpacity: 0.7,
-                      className: "flex-row items-center gap-space-4",
-                      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
-                        name: "trash-outline",
-                        size: 16,
-                        color: colors.error
-                      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
-                        className: "text-caption font-bodyBold",
-                        style: {
-                          color: colors.error
-                        },
-                        children: t('accounts.members.actions.remove') || 'Remove'
-                      })]
-                    }) : null]
-                  }) : null]
-                })]
-              }, member._id);
-            })
-          })
-        }) : null]
+                  }, role);
+                })
+              }) : !isOwner ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+                className: "text-caption font-caption text-text-secondary",
+                children: roleLabel(member.role)
+              }) : null, canTransferToThis || canRemoveThisMember ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+                className: "flex-row gap-space-16 pt-space-4",
+                children: [canTransferToThis ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+                  accessibilityRole: "button",
+                  accessibilityLabel: t('accounts.members.actions.transfer') || 'Transfer ownership',
+                  onPress: () => confirmTransfer(member),
+                  activeOpacity: 0.7,
+                  className: "flex-row items-center gap-space-4",
+                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
+                    name: "swap-horizontal-outline",
+                    size: 16,
+                    color: colors.icon
+                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+                    className: "text-caption font-bodyBold text-text-secondary",
+                    children: t('accounts.members.actions.transfer') || 'Transfer ownership'
+                  })]
+                }) : null, canRemoveThisMember ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+                  accessibilityRole: "button",
+                  accessibilityLabel: t('accounts.members.actions.remove') || 'Remove member',
+                  onPress: () => confirmRemove(member),
+                  activeOpacity: 0.7,
+                  className: "flex-row items-center gap-space-4",
+                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
+                    name: "trash-outline",
+                    size: 16,
+                    color: colors.error
+                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_typography.Text, {
+                    className: "text-caption font-bodyBold",
+                    style: {
+                      color: colors.error
+                    },
+                    children: t('accounts.members.actions.remove') || 'Remove'
+                  })]
+                }) : null]
+              }) : null]
+            })]
+          }, member._id);
+        })
       })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bloom.Dialog, {
-      control: removeDialog,
-      title: t('accounts.members.removeConfirm.title') || 'Remove member',
-      description: t('accounts.members.removeConfirm.description') || 'Remove this member from the account? They will lose all access.',
-      actions: [{
-        label: t('accounts.members.actions.remove') || 'Remove',
-        color: 'destructive',
-        onPress: () => {
-          const target = memberToRemove;
-          setMemberToRemove(null);
-          if (target) {
-            removeMutation.mutate(target._id);
-          } else {
-            _core.logger.debug('Remove confirmed with no pending member', {
-              component: 'AccountMembersScreen'
-            });
-          }
-        }
-      }, {
-        label: t('common.cancel') || 'Cancel',
-        color: 'cancel'
-      }]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bloom.Dialog, {
-      control: transferDialog,
-      title: t('accounts.members.transferConfirm.title') || 'Transfer ownership',
-      description: t('accounts.members.transferConfirm.description') || 'Transfer ownership of this account to this member? You will be demoted to admin. This cannot be undone.',
-      actions: [{
-        label: t('accounts.members.actions.transfer') || 'Transfer ownership',
-        color: 'destructive',
-        onPress: () => {
-          const target = memberToPromote;
-          setMemberToPromote(null);
-          if (target) {
-            transferMutation.mutate(target.memberUserId);
-          } else {
-            _core.logger.debug('Transfer confirmed with no pending member', {
-              component: 'AccountMembersScreen'
-            });
-          }
-        }
-      }, {
-        label: t('common.cancel') || 'Cancel',
-        color: 'cancel'
-      }]
-    })]
+    }) : null]
   });
 };
 var _default = exports.default = AccountMembersScreen;