Repository: All-Hands-AI/OpenHands
File: frontend/src/components/features/org/organization-member-role-context-menu.tsx (TypeScript)

Code before:
    onClose();
  };

  return (
    <ContextMenu
      ref={menuRef}
      testId="organization-member-role-context-menu"
      position="bottom"
      alignment="right"
      className="min-h-fit mb-2 min-w-[195px] max-w-[195px] gap-0"
    >
      {availableRolesToChangeTo.includes("owner") && (
        <ContextMenuListItem
          testId="owner-option"
          onClick={(event) => handleRoleChangeClick(event, "owner")}
          className={contextMenuListItemClassName}
        >
          <ContextMenuIconText
            icon={
              <AdminIcon
                width={16}
                height={16}
                className="text-white pl-[2px]"
              />
            }
            text={ROLE_LABELS.owner}
            className="capitalize"
          />
        </ContextMenuListItem>
      )}
      {availableRolesToChangeTo.includes("admin") && (
        <ContextMenuListItem
          testId="admin-option"
          onClick={(event) => handleRoleChangeClick(event, "admin")}
          className={contextMenuListItemClassName}
        >
          <ContextMenuIconText
            icon={
              <AdminIcon
                width={16}
                height={16}
                className="text-white pl-[2px]"
              />
            }
            text={ROLE_LABELS.admin}
            className="capitalize"
          />
        </ContextMenuListItem>
      )}
      {availableRolesToChangeTo.includes("member") && (
        <ContextMenuListItem

Review comment (suggestion):
```suggestion
            text={t(I18nKey.ORG$ROLE_OWNER)}
```

We rely on the i18n for proper localization. Your change hard codes an English value which is undesired

Code after:
      testId="organization-member-role-context-menu"
      position="bottom"
      alignment="right"
      className="min-h-fit mb-2 min-w-[195px] max-w-[195px] gap-0"
    >
      {availableRolesToChangeTo.includes("owner") && (
        <ContextMenuListItem
          testId="owner-option"
          onClick={(event) => handleRoleChangeClick(event, "owner")}
          className={contextMenuListItemClassName}
        >
          <ContextMenuIconText
            icon={
              <AdminIcon
                width={16}
                height={16}
                className="text-white pl-[2px]"
              />
            }
            text={t(I18nKey.ORG$ROLE_OWNER)}
            className="capitalize"
          />
        </ContextMenuListItem>
      )}
      {availableRolesToChangeTo.includes("admin") && (
        <ContextMenuListItem
          testId="admin-option"
          onClick={(event) => handleRoleChangeClick(event, "admin")}
          className={contextMenuListItemClassName}
        >
          <ContextMenuIconText
            icon={
              <AdminIcon
                width={16}
                height={16}
                className="text-white pl-[2px]"
              />
            }
            text={t(I18nKey.ORG$ROLE_ADMIN)}
            className="capitalize"
          />
        </ContextMenuListItem>
      )}
      {availableRolesToChangeTo.includes("member") && (
        <ContextMenuListItem
          testId="member-option"
          onClick={(event) => handleRoleChangeClick(event, "member")}
          className={contextMenuListItemClassName}
        >
          <ContextMenuIconText
            icon={<UserIcon width={16} height={16} className="text-white" />}