Merge pull request wso2#1 from chanaka3d/chanakaAdd

Updating Alert messages with i18n support
AnuGayan · Feb 18, 2022 · de3fe06 · de3fe06
2 parents eb9d813 + b8c3821
commit de3fe06
Show file tree

Hide file tree

Showing 9 changed files with 114 additions and 30 deletions.
diff --git a/...wso2.carbon.apimgt.store.feature/src/main/resources/devportal/site/public/locales/en.json b/...wso2.carbon.apimgt.store.feature/src/main/resources/devportal/site/public/locales/en.json
@@ -28,6 +28,7 @@
   "Apis.Details.AsyncApiConsole.Webhooks.Unsubscribe": "Unsubscribe",
   "Apis.Details.AsyncApiConsole.Webhooks.callback": "Callback URL",
   "Apis.Details.AsyncApiConsole.Webhooks.curl": "cURL",
+  "Apis.Details.AsyncApiConsole.Webhooks.curl.copied": "cURL copied",
   "Apis.Details.AsyncApiConsole.Webhooks.lease": "Lease Seconds",
   "Apis.Details.AsyncApiConsole.Webhooks.secret": "Secret",
   "Apis.Details.Breadcrumb.comments": "Comments",
@@ -36,7 +37,13 @@
   "Apis.Details.Breadcrumb.sdks": "SDKs",
   "Apis.Details.Breadcrumb.subscriptions": "Subscriptions",
   "Apis.Details.Breadcrumb.try.out": "Try Out",
+  "Apis.Details.Comments.Comment.comment.deleted": "Comment has been successfully deleted",
+  "Apis.Details.Comments.Comment.delete.dialog.label.cancel": "Cancel",
+  "Apis.Details.Comments.Comment.delete.dialog.label.ok": "Yes",
+  "Apis.Details.Comments.Comment.delete.dialog.message": "Are you sure you want to delete this comment?",
+  "Apis.Details.Comments.Comment.delete.dialog.title": "Confirm Delete",
   "Apis.Details.Comments.Comment.load.more.replies": "Show More Replies",
+  "Apis.Details.Comments.Comment.reply.comment.deleted": "Reply comment has been successfully deleted",
   "Apis.Details.Comments.Comment.something.went.wrong": "Something went wrong while deleting comment",
   "Apis.Details.Comments.CommentAdd.btn.add.comment": "Comment",
   "Apis.Details.Comments.CommentAdd.btn.cancel": "Cancel",
@@ -113,6 +120,7 @@
   "Apis.Details.Credentials.Wizard.Wizard.rest": "Reset",
   "Apis.Details.Credentials.Wizard.Wizard.subscribe.to.new.application": "Subscribe to new application",
   "Apis.Details.Credentials.Wizard.Wizard.test": "Test",
+  "Apis.Details.Documents.Documentation.error.occurred": "Error occurred",
   "Apis.Details.Documents.Documentation.hide": "HIDE",
   "Apis.Details.Documents.Documentation.no.docs": "No Documents Available",
   "Apis.Details.Documents.Documentation.no.docs.content": "No documents are available for this API",
@@ -160,6 +168,7 @@
   "Apis.Details.Overview.comments.title": "Comments",
   "Apis.Details.Overview.description.less": " less",
   "Apis.Details.Overview.description.more": " more",
+  "Apis.Details.Overview.documents.error.occurred": "Error occurred",
   "Apis.Details.Overview.documents.no.content": "No Documents Available",
   "Apis.Details.Overview.documents.title": "Documents",
   "Apis.Details.Overview.error.occurred": "Error occurred",
@@ -236,6 +245,8 @@
   "Apis.Listing.Recommendations.invalid.tenant.domain": "Invalid tenant domain",
   "Apis.Listing.Recommendations.name": "Name",
   "Apis.Listing.Recommendations.rating": "Rating",
+  "Apis.Listing.StarRatingBar.error.occurred": "Error occurred while removing ratings",
+  "Apis.Listing.StarRatingBar.error.occurred.adding": "Error occurred while adding ratings",
   "Apis.Listing.StarRatingBar.rate.this": "Rate This",
   "Apis.Listing.StarRatingBar.user": "user",
   "Apis.Listing.StarRatingBar.users": "users",
@@ -299,17 +310,24 @@
   "Applications.Details.Subscriptions.api.webhooks": "Web Hooks",
   "Applications.Details.Subscriptions.api.webhooks.delivery.time.unavailable": "Delivery data unavailable",
   "Applications.Details.Subscriptions.api.webhooks.subscriptions.unavailable": "No Webhook subscriptions available at this time.",
+  "Applications.Details.Subscriptions.business.plan.updated": "Business Plan updated successfully!",
+  "Applications.Details.Subscriptions.delete.success": "Subscription deleted successfully!",
   "Applications.Details.Subscriptions.error.occurred.during.subscription": "Error occurred during subscription",
   "Applications.Details.Subscriptions.error.occurred.during.subscription.not.201": "Error occurred during subscription",
+  "Applications.Details.Subscriptions.error.occurred.webhook.subscription": "Error while retrieving webhook subscriptions",
+  "Applications.Details.Subscriptions.error.when.updating": "Error occurred when updating subscription",
+  "Applications.Details.Subscriptions.error.while.deleting": "Error occurred when deleting subscription",
   "Applications.Details.Subscriptions.filter.msg": "Filtered APIs for ",
   "Applications.Details.Subscriptions.filter.msg.all.apis": "Displaying all APIs",
   "Applications.Details.Subscriptions.no.subscriptions": "No Subscriptions Available",
   "Applications.Details.Subscriptions.no.subscriptions.content": "No subscriptions are available for this Application",
   "Applications.Details.Subscriptions.search": "Search APIs",
   "Applications.Details.Subscriptions.select.a.subscription.policy": "Select a subscription policy",
+  "Applications.Details.Subscriptions.something.went.wrong": "Something went wrong while deleting the Subscription!",
   "Applications.Details.Subscriptions.subscription.management": "Subscription Management",
   "Applications.Details.Subscriptions.subscription.management.add": "Subscribe APIs",
   "Applications.Details.Subscriptions.subscription.successful": "Subscription successful",
+  "Applications.Details.Subscriptions.wrong.with.subscription": "Something went wrong while updating the Subscription!",
   "Applications.Details.api.keys.title": " API Key",
   "Applications.Details.applications.all": "ALL APPs",
   "Applications.Details.index.secondary.navigation": "Secondary Navigation",

diff --git a/...rces/devportal/source/src/app/components/Apis/Details/AsyncApiConsole/AsyncApiConsole.jsx b/...rces/devportal/source/src/app/components/Apis/Details/AsyncApiConsole/AsyncApiConsole.jsx
@@ -21,7 +21,7 @@ import Paper from '@material-ui/core/Paper';
 import PropTypes from 'prop-types';
 import Grid from '@material-ui/core/Grid';
 import Typography from '@material-ui/core/Typography';
-import { FormattedMessage } from 'react-intl';
+import { FormattedMessage, useIntl } from 'react-intl';
 import { makeStyles } from '@material-ui/core/styles';
 import AuthManager from 'AppData/AuthManager';
 import Icon from '@material-ui/core/Icon';
@@ -54,6 +54,7 @@ const useStyles = makeStyles((theme) => ({
 }));
 
 export default function AsyncApiConsole() {
+    const intl = useIntl();
     const classes = useStyles();
     const { api } = useContext(ApiContext);
     const [securitySchemeType, setSecurityScheme] = useState('OAUTH');
@@ -110,7 +111,10 @@ export default function AsyncApiConsole() {
             .catch((error) => {
                 if (process.env.NODE_ENV !== 'production') {
                     console.error(error);
-                    Alert.error('Error occurred while retrieving the API');
+                    Alert.error(intl.formatMessage({
+                        id: 'Apis.Details.Overview.documents.error.occurred',
+                        defaultMessage: 'Error occurred while retrieving the API',
+                    }));
                 }
                 setScopes([]);
                 setEnvironments([]);

diff --git a/...evportal/source/src/app/components/Apis/Details/AsyncApiConsole/WebhookSubscriptionUI.jsx b/...evportal/source/src/app/components/Apis/Details/AsyncApiConsole/WebhookSubscriptionUI.jsx
@@ -32,7 +32,7 @@ import Grid from '@material-ui/core/Grid';
 import Radio from '@material-ui/core/Radio';
 import { RadioGroup } from '@material-ui/core';
 import FormControlLabel from '@material-ui/core/FormControlLabel';
-import { FormattedMessage, injectIntl } from 'react-intl';
+import { FormattedMessage, useIntl } from 'react-intl';
 import Utils from 'AppData/Utils';
 import Badge from '@material-ui/core/Badge';
 
@@ -41,6 +41,7 @@ function reducer(state, { field, value }) {
 }
 
 function WebhookSubscriptionUI(props) {
+    const intl = useIntl();
     const verb = props.topic.type.toLowerCase();
     const trimmedVerb = verb === 'publish' || verb === 'subscribe' ? verb.substr(0, 3) : verb;
     const useStyles = makeStyles((theme) => {
@@ -105,7 +106,7 @@ function WebhookSubscriptionUI(props) {
             },
         };
     });
-    const { generateGenericWHSubscriptionCurl, topic, intl } = props;
+    const { generateGenericWHSubscriptionCurl, topic } = props;
     const initialSubscriptionState = {
         topic: topic.name,
         secret: null,
@@ -284,7 +285,13 @@ function WebhookSubscriptionUI(props) {
                 <Button size='small' onClick={handleClick}>
                     <FormattedMessage id='Apis.Details.AsyncApiConsole.Curl' defaultMessage='Generate Curl' />
                 </Button>
-                <CopyToClipboard text={curl} onCopy={() => Alert.info('cURL copied')}>
+                <CopyToClipboard
+                    text={curl}
+                    onCopy={() => Alert.info(intl.formatMessage({
+                        defaultMessage: 'cURL copied',
+                        id: 'Apis.Details.AsyncApiConsole.Webhooks.curl.copied',
+                    }))}
+                >
                     <Button size='small'>
                         <FormattedMessage id='Apis.Details.AsyncApiConsole.Copy' defaultMessage='Copy Curl' />
                     </Button>
@@ -294,4 +301,4 @@ function WebhookSubscriptionUI(props) {
     );
 }
 
-export default injectIntl(WebhookSubscriptionUI);
+export default WebhookSubscriptionUI;
diff --git a/.../src/main/resources/devportal/source/src/app/components/Apis/Details/Comments/Comment.jsx b/.../src/main/resources/devportal/source/src/app/components/Apis/Details/Comments/Comment.jsx
@@ -230,10 +230,16 @@ class Comment extends React.Component {
                     if (onDeleteComment) {
                         onDeleteComment(commentIdOfCommentToDelete);
                     }
-                    Alert.info('Comment has been successfully deleted');
+                    Alert.info(intl.formatMessage({
+                        defaultMessage: 'Comment has been successfully deleted',
+                        id: 'Apis.Details.Comments.Comment.comment.deleted',
+                    }));
                 } else {
                     this.handleDeleteReply(parentCommentIdOfCommentToDelete, commentIdOfCommentToDelete);
-                    Alert.info('Reply comment has been successfully deleted');
+                    Alert.info(intl.formatMessage({
+                        defaultMessage: 'Reply comment has been successfully deleted',
+                        id: 'Apis.Details.Comments.Comment.reply.comment.deleted',
+                    }));
                 }
             })
             .catch((error) => {
@@ -540,10 +546,22 @@ class Comment extends React.Component {
                 </div>
                 <ConfirmDialog
                     key='key-dialog'
-                    labelCancel='Cancel'
-                    title='Confirm Delete'
-                    message='Are you sure you want to delete this comment?'
-                    labelOk='Yes'
+                    labelCancel={<FormattedMessage
+                        id='Apis.Details.Comments.Comment.delete.dialog.label.cancel'
+                        defaultMessage='Cancel'
+                    />}
+                    title={<FormattedMessage
+                        id='Apis.Details.Comments.Comment.delete.dialog.title'
+                        defaultMessage='Confirm Delete'
+                    />}
+                    message={<FormattedMessage
+                        id='Apis.Details.Comments.Comment.delete.dialog.message'
+                        defaultMessage='Are you sure you want to delete this comment?'
+                    />}
+                    labelOk={<FormattedMessage
+                        id='Apis.Details.Comments.Comment.delete.dialog.label.ok'
+                        defaultMessage='Yes'
+                    />}
                     callback={this.handleConfirmDialog}
                     open={openDialog}
                 />

diff --git a/...c/main/resources/devportal/source/src/app/components/Apis/Details/Documents/Documents.jsx b/...c/main/resources/devportal/source/src/app/components/Apis/Details/Documents/Documents.jsx
@@ -135,7 +135,7 @@ const styles = (theme) => ({
  * @returns {JSX} Returning JSX to render.
  */
 function Documents(props) {
-    const { classes } = props;
+    const { classes, intl } = props;
     const { location: { pathname } } = props;
     let match = matchPath(pathname, {
         path: '/apis/:apiUuid/documents/:documentId',
@@ -192,7 +192,10 @@ function Documents(props) {
                 }
                 const { status } = error;
                 if (status === 404) {
-                    Alert.error('Error occurred');
+                    Alert.error(intl.formatMessage({
+                        defaultMessage: 'Error occurred',
+                        id: 'Apis.Details.Documents.Documentation.error.occurred',
+                    }));
                 }
             });
     }, []);

diff --git a/...src/main/resources/devportal/source/src/app/components/Apis/Details/OverviewDocuments.jsx b/...src/main/resources/devportal/source/src/app/components/Apis/Details/OverviewDocuments.jsx
@@ -27,7 +27,7 @@ import ListItemIcon from '@material-ui/core/ListItemIcon';
 import ListItemText from '@material-ui/core/ListItemText';
 import Icon from '@material-ui/core/Icon';
 import { withStyles } from '@material-ui/core/styles';
-import { FormattedMessage } from 'react-intl';
+import { FormattedMessage, useIntl } from 'react-intl';
 import API from 'AppData/api';
 import Alert from 'AppComponents/Shared/Alert';
 
@@ -109,6 +109,7 @@ const styles = (theme) => ({
  */
 function OverviewDocuments(props) {
     const [docs, setDocs] = useState([]);
+    const intl = useIntl();
     const { apiId } = props;
     const history = useHistory();
     useEffect(() => {
@@ -127,7 +128,10 @@ function OverviewDocuments(props) {
                 }
                 const { status } = error;
                 if (status === 404) {
-                    Alert.error('Error occurred');
+                    Alert.error(intl.formatMessage({
+                        id: 'Apis.Details.Overview.documents.error.occurred',
+                        defaultMessage: 'Error occurred',
+                    }));
                 }
             });
     }, []);

diff --git a/...ure/src/main/resources/devportal/source/src/app/components/Apis/Listing/StarRatingBar.jsx b/...ure/src/main/resources/devportal/source/src/app/components/Apis/Listing/StarRatingBar.jsx
@@ -33,7 +33,7 @@ import Api from 'AppData/api';
 import AuthManager from 'AppData/AuthManager';
 import StarRatingSummary from 'AppComponents/Apis/Details/StarRatingSummary';
 import Rating from '@material-ui/lab/Rating';
-import { FormattedMessage } from 'react-intl';
+import { FormattedMessage, injectIntl } from 'react-intl';
 
 const styles = (theme) => ({
     starRate: {
@@ -163,7 +163,7 @@ class StarRatingBar extends React.Component {
      * @memberof StarRatingBar
      */
     doRate(rateIndex) {
-        const { apiId } = this.props;
+        const { apiId, intl } = this.props;
         const api = new Api();
         const ratingInfo = { rating: rateIndex };
         const promise = api.addRating(apiId, ratingInfo);
@@ -172,7 +172,10 @@ class StarRatingBar extends React.Component {
                 this.getApiRating();
             })
             .catch((error) => {
-                Alert.error('Error occurred while adding ratings');
+                Alert.error(intl.formatMessage({
+                    defaultMessage: 'Error occurred while adding ratings',
+                    id: 'Apis.Listing.StarRatingBar.error.occurred.adding',
+                }));
                 if (process.env.NODE_ENV !== 'production') {
                     console.log(error);
                 }
@@ -186,7 +189,7 @@ class StarRatingBar extends React.Component {
      * @memberof StarRatingBar
      */
     removeUserRating() {
-        const { apiId, setRatingUpdate } = this.props;
+        const { apiId, setRatingUpdate, intl } = this.props;
         const api = new Api();
         // remove user rating
         api.removeRatingOfUser(apiId, null)
@@ -195,7 +198,10 @@ class StarRatingBar extends React.Component {
                 setRatingUpdate();
             })
             .catch((error) => {
-                Alert.error('Error occurred while removing ratings');
+                Alert.error(intl.formatMessage({
+                    defaultMessage: 'Error occurred while removing ratings',
+                    id: 'Apis.Listing.StarRatingBar.error.occurred',
+                }));
                 if (process.env.NODE_ENV !== 'production') {
                     console.log(error);
                 }
@@ -325,4 +331,4 @@ StarRatingBar.propTypes = {
     setRatingUpdate: PropTypes.func,
 };
 
-export default withStyles(styles, { withTheme: true })(StarRatingBar);
+export default injectIntl(withStyles(styles, { withTheme: true })(StarRatingBar));
diff --git a/...main/resources/devportal/source/src/app/components/Applications/Details/Subscriptions.jsx b/...main/resources/devportal/source/src/app/components/Applications/Details/Subscriptions.jsx
@@ -232,17 +232,24 @@ class Subscriptions extends React.Component {
      * @memberof Subscriptions
      */
     handleSubscriptionDelete(subscriptionId) {
+        const { intl } = this.props;
         const client = new Subscription();
         const promisedDelete = client.deleteSubscription(subscriptionId);
 
         promisedDelete
             .then((response) => {
                 if (response.status !== 200) {
                     console.log(response);
-                    Alert.info('Something went wrong while deleting the Subscription!');
+                    Alert.info(intl.formatMessage({
+                        defaultMessage: 'Something went wrong while deleting the Subscription!',
+                        id: 'Applications.Details.Subscriptions.something.went.wrong',
+                    }));
                     return;
                 }
-                Alert.info('Subscription deleted successfully!');
+                Alert.info(intl.formatMessage({
+                    defaultMessage: 'Subscription deleted successfully!',
+                    id: 'Applications.Details.Subscriptions.delete.success',
+                }));
                 const { subscriptions } = this.state;
                 for (const endpointIndex in subscriptions) {
                     if (
@@ -260,7 +267,10 @@ class Subscriptions extends React.Component {
                 if (status === 401) {
                     this.setState({ isAuthorize: false });
                 }
-                Alert.error('Error occurred when deleting subscription');
+                Alert.error(intl.formatMessage({
+                    defaultMessage: 'Error occurred when deleting subscription',
+                    id: 'Applications.Details.Subscriptions.error.while.deleting',
+                }));
             });
     }
 
@@ -276,6 +286,7 @@ class Subscriptions extends React.Component {
      */
     handleSubscriptionUpdate(apiId, subscriptionId, currentThrottlingPolicy, status, requestedThrottlingPolicy) {
         const {
+            intl,
             match: {
                 params: { applicationId },
             },
@@ -294,18 +305,27 @@ class Subscriptions extends React.Component {
             .then((response) => {
                 if (response.status !== 200 && response.status !== 201) {
                     console.log(response);
-                    Alert.info('Something went wrong while updating the Subscription!');
+                    Alert.info(intl.formatMessage({
+                        defaultMessage: 'Something went wrong while updating the Subscription!',
+                        id: 'Applications.Details.Subscriptions.wrong.with.subscription',
+                    }));
                     return;
                 }
-                Alert.info('Business Plan updated successfully!');
+                Alert.info(intl.formatMessage({
+                    defaultMessage: 'Business Plan updated successfully!',
+                    id: 'Applications.Details.Subscriptions.business.plan.updated',
+                }));
                 this.updateSubscriptions(applicationId);
             })
             .catch((error) => {
                 const { status: statusInner } = error;
                 if (statusInner === 401) {
                     this.setState({ isAuthorize: false });
                 }
-                Alert.error('Error occurred when updating subscription');
+                Alert.error(intl.formatMessage({
+                    defaultMessage: 'Error occurred when updating subscription',
+                    id: 'Applications.Details.Subscriptions.error.when.updating',
+                }));
             });
     }