diff --git a/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx b/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx
index 5f772cdd..942a5e96 100644
--- a/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx
+++ b/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx
@@ -1,33 +1,58 @@
import React from 'react';
import PropTypes from 'prop-types';
import {
- Icon, IconButton, Stack, Chip,
+ Hyperlink, Icon, IconButton, Stack, Chip,
} from '@openedx/paragon';
import { Person, Check, Timelapse } from '@openedx/paragon/icons';
+import ROUTES from '../../../data/constants/routes';
export const EnterpriseCustomerUserDetail = ({
row,
}) => {
+ const user = row.original.enterpriseCustomerUser;
let memberDetails;
- const memberDetailIcon = (
-
- );
+ const iconLink = `${ROUTES.SUPPORT_TOOLS_TABS.SUB_DIRECTORY.LEARNER_INFORMATION}/?email=${user?.email}`;
+ const memberDetailIcon = () => {
+ if (user) {
+ return (
+
+
+
+ );
+ }
+ return (
+
+ );
+ };
- if (row.original.enterpriseCustomerUser?.username) {
+ if (user?.username) {
memberDetails = (
- {row.original.enterpriseCustomerUser?.username}
+ {user?.username}
-
{row.original.enterpriseCustomerUser?.email}
+
{user?.email}
);
} else {
@@ -39,7 +64,7 @@ export const EnterpriseCustomerUserDetail = ({
}
return (
- {memberDetailIcon}
+ {memberDetailIcon()}
{memberDetails}
);
diff --git a/src/Configuration/Customers/CustomerDetailView/tests/EnterpriseCustomerUserDetail.test.jsx b/src/Configuration/Customers/CustomerDetailView/tests/EnterpriseCustomerUserDetail.test.jsx
index ad269199..30a8decb 100644
--- a/src/Configuration/Customers/CustomerDetailView/tests/EnterpriseCustomerUserDetail.test.jsx
+++ b/src/Configuration/Customers/CustomerDetailView/tests/EnterpriseCustomerUserDetail.test.jsx
@@ -23,6 +23,7 @@ describe('EnterpriseCustomerUserDetail', () => {
render();
expect(screen.getByText('ash ketchum')).toBeInTheDocument();
expect(screen.getByText('ash@ketchum.org')).toBeInTheDocument();
+ expect(screen.getByTestId('icon-hyperlink')).toHaveAttribute('href', '/learner-information/?email=ash@ketchum.org');
});
it('renders pending enterprise customer detail', () => {
@@ -35,6 +36,7 @@ describe('EnterpriseCustomerUserDetail', () => {
};
render();
expect(screen.getByText('pending@customer.org')).toBeInTheDocument();
+ expect(screen.queryByTestId('icon-hyperlink')).not.toBeInTheDocument();
});
it('renders AdministratorCell there is a pending admin', () => {
diff --git a/src/Configuration/index.scss b/src/Configuration/index.scss
index c3780b47..ba077443 100644
--- a/src/Configuration/index.scss
+++ b/src/Configuration/index.scss
@@ -25,3 +25,9 @@
color: black !important;
font-weight: bold;
}
+
+.icon-button {
+ opacity: 1;
+ flex-shrink: 0;
+ pointer-events: none;
+}
\ No newline at end of file