Skip to content

Commit

Permalink
fix: PR review requests
Browse files Browse the repository at this point in the history
  • Loading branch information
kiram15 committed Sep 8, 2023
1 parent c47746d commit 9292c57
Show file tree
Hide file tree
Showing 7 changed files with 41 additions and 42 deletions.
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
import React, { useState } from 'react';
import PropTypes from 'prop-types';

import { MailtoLink, Form } from '@edx/paragon';
import { Form, Hyperlink } from '@edx/paragon';
import { dataPropType } from './constants';
import RegenerateCredentialWarningModal from './RegenerateCredentialWarningModal';
import CopyButton from './CopyButton';
import { API_CLIENT_DOCUMENTATION, ENTERPRISE_CUSTOMER_SUPPORT_EMAIL } from '../data/constants';
import { API_CLIENT_DOCUMENTATION, HELP_CENTER_LINK } from '../data/constants';

const APICredentialsPage = ({ data, setData }) => {
const [formValue, setFormValue] = useState('');
Expand Down Expand Up @@ -73,9 +74,12 @@ const APICredentialsPage = ({ data, setData }) => {
<p>
To troubleshoot your API credentialing, or to request additional API endpoints to your
credentials,&nbsp;
<MailtoLink to={ENTERPRISE_CUSTOMER_SUPPORT_EMAIL} target="_blank" rel="noopener noreferrer">
<Hyperlink
variant="muted"
destination={HELP_CENTER_LINK}
>
contact Enterprise Customer Support.
</MailtoLink>
</Hyperlink>
</p>
</div>
</div>
Expand All @@ -87,14 +91,7 @@ APICredentialsPage.defaultProps = {
};

APICredentialsPage.propTypes = {
data: PropTypes.shape({
name: PropTypes.string,
redirect_uris: PropTypes.string,
client_id: PropTypes.string,
client_secret: PropTypes.string,
api_client_documentation: PropTypes.string,
updated: PropTypes.bool,
}),
data: PropTypes.shape(dataPropType),
setData: PropTypes.func.isRequired,
};

Expand Down
10 changes: 2 additions & 8 deletions src/components/settings/SettingsApiCredentialsTab/CopyButton.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import PropTypes from 'prop-types';
import { Button } from '@edx/paragon';
import { ContentCopy } from '@edx/paragon/icons';
import CopiedToast from './CopiedToast';
import { dataPropType } from './constants';

const CopyButton = ({ data }) => {
const [isCopyLinkToastOpen, setIsCopyLinkToastOpen] = useState(false);
Expand Down Expand Up @@ -41,14 +42,7 @@ const CopyButton = ({ data }) => {
};

CopyButton.propTypes = {
data: PropTypes.shape({
name: PropTypes.string,
redirect_uris: PropTypes.string,
client_id: PropTypes.string,
client_secret: PropTypes.string,
api_client_documentation: PropTypes.string,
updated: PropTypes.bool,
}),
data: PropTypes.shape(dataPropType),
};

export default CopyButton;
Original file line number Diff line number Diff line change
@@ -1,15 +1,14 @@
import { Alert } from '@edx/paragon';
import { Error } from '@edx/paragon/icons';
import { credentialErrorMessage } from './constants';

const FailedAlert = () => (
<Alert variant="danger" icon={Error}>
<Alert.Heading>
Credential generation failed
</Alert.Heading>
<p>
Something went wrong while generating your credentials.
Please try again.
If the issue continues, contact Enterprise Customer Support.
{credentialErrorMessage}
</p>
</Alert>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
ShowSuccessToast, EnterpriseId,
} from './Context';
import LmsApiService from '../../../data/services/LmsApiService';
import { dataPropType } from './constants';

const RegenerateCredentialWarningModal = ({
redirectURIs,
Expand Down Expand Up @@ -90,14 +91,7 @@ const RegenerateCredentialWarningModal = ({

RegenerateCredentialWarningModal.propTypes = {
redirectURIs: PropTypes.string.isRequired,
data: PropTypes.shape({
name: PropTypes.string,
redirect_uris: PropTypes.string,
client_id: PropTypes.string,
client_secret: PropTypes.string,
api_client_documentation: PropTypes.string,
updated: PropTypes.bool,
}),
data: PropTypes.shape(dataPropType),
setData: PropTypes.func.isRequired,
};

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,16 @@ import React, { useState, useContext } from 'react';
import PropTypes from 'prop-types';

import {
Button, Card, Icon, MailtoLink, Spinner,
Button, Card, Hyperlink, Icon, Spinner,
} from '@edx/paragon';
import { Add, Error } from '@edx/paragon/icons';

import { credentialErrorMessage } from './constants';
import cardImage from '../../../data/images/ZeroState.svg';
import {
EnterpriseId,
} from './Context';
import { EnterpriseId } from './Context';
import LmsApiService from '../../../data/services/LmsApiService';
import {
API_CLIENT_DOCUMENTATION, API_TERMS_OF_SERVICE, ENTERPRISE_CUSTOMER_SUPPORT_EMAIL,
API_CLIENT_DOCUMENTATION, API_TERMS_OF_SERVICE, HELP_CENTER_LINK,
} from '../data/constants';

const ZeroStateCard = ({ setShowToast, setData }) => {
Expand Down Expand Up @@ -45,9 +44,12 @@ const ZeroStateCard = ({ setShowToast, setData }) => {
This page allows you to generate API credentials to send to&nbsp;
your developers so they can work on integration projects.
If you believe you are seeing this page in error,&nbsp;
<MailtoLink to={ENTERPRISE_CUSTOMER_SUPPORT_EMAIL} target="_blank" rel="noopener noreferrer">
<Hyperlink
variant="muted"
destination={HELP_CENTER_LINK}
>
contact Enterprise Customer Support.
</MailtoLink>
</Hyperlink>
</p>
)}
<p>
Expand All @@ -63,8 +65,7 @@ const ZeroStateCard = ({ setShowToast, setData }) => {
{ displayFailureAlert && (
<p className="d-flex small">
<Icon className="error-icon" src={Error} />
Something went wrong while generating your credentials.
Please try again. If the issue continues, contact Enterprise Customer Support.
{credentialErrorMessage}
</p>
)}
<Button
Expand Down
14 changes: 14 additions & 0 deletions src/components/settings/SettingsApiCredentialsTab/constants.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import PropTypes from 'prop-types';

export const dataPropType = PropTypes.shape({
name: PropTypes.string,
redirect_uris: PropTypes.string,
client_id: PropTypes.string,
client_secret: PropTypes.string,
api_client_documentation: PropTypes.string,
updated: PropTypes.bool,
});

export const credentialErrorMessage = 'Something went wrong while '
+ 'generating your credentials. Please try again. '
+ 'If the issue continues, contact Enterprise Customer Support.';
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { IntlProvider } from '@edx/frontend-platform/i18n';
import LmsApiService from '../../../../data/services/LmsApiService';
import SettingsApiCredentialsTab from '../index';
import {
API_CLIENT_DOCUMENTATION, HELP_CENTER_API_GUIDE, API_TERMS_OF_SERVICE, ENTERPRISE_CUSTOMER_SUPPORT_EMAIL,
API_CLIENT_DOCUMENTATION, HELP_CENTER_API_GUIDE, API_TERMS_OF_SERVICE, HELP_CENTER_LINK,
} from '../../data/constants';

jest.mock('../../../../data/services/LmsApiService', () => ({
Expand Down Expand Up @@ -92,7 +92,7 @@ describe('API Credentials Tab', () => {
expect(screen.getByRole('heading', { name: `API client documentation: ${API_CLIENT_DOCUMENTATION}` }).toBeInTheDocument);
expect(screen.getByRole('heading', { name: `Last generated on: ${updated}` }).toBeInTheDocument);
const link = screen.getByText('contact Enterprise Customer Support.');
expect(link.getAttribute('href')).toBe(`mailto:${ENTERPRISE_CUSTOMER_SUPPORT_EMAIL}`);
expect(link.getAttribute('href')).toBe(HELP_CENTER_LINK);
});
test('renders error stage while creating new api credentials through clicking generation button', async () => {
const mockFetchFn = jest.spyOn(LmsApiService, 'fetchAPICredentials');
Expand Down

0 comments on commit 9292c57

Please sign in to comment.