SONAR-11228 Provide link to the security page when creating a token

server/sonar-web/src/main/js/apps/tutorials/components/TokenStep.tsx

@@ -19,6 +19,8 @@
  */
 
 import * as React from 'react';
+import { FormattedMessage } from 'react-intl';
+import { Link } from 'react-router';
 import * as classNames from 'classnames';
 import Step from './Step';
 import { getTokens, generateToken, revokeToken } from '../../../api/user-tokens';
@@ -246,7 +248,19 @@ export default class TokenStep extends React.PureComponent<Props, State> {
           </div>
         )}
 
-        <div className="note big-spacer-top width-50">{translate('onboarding.token.text')}</div>
+        <div className="note big-spacer-top width-50">
+          <FormattedMessage
+            defaultMessage={translate('onboarding.token.text')}
+            id="onboarding.token.text"
+            values={{
+              link: (
+                <Link target="_blank" to="/account/security">
+                  {translate('onboarding.token.text.user_account')}
+                </Link>
+              )
+            }}
+          />
+        </div>
 
         {this.canContinue() && (
           <div className="big-spacer-top">

server/sonar-web/src/main/js/apps/tutorials/components/__tests__/TokenStep-test.tsx

@@ -18,9 +18,14 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
-import { mount } from 'enzyme';
 import TokenStep from '../TokenStep';
-import { change, click, submit, waitAndUpdate } from '../../../../helpers/testUtils';
+import {
+  change,
+  click,
+  submit,
+  waitAndUpdate,
+  shallowWithIntl
+} from '../../../../helpers/testUtils';
 
 jest.mock('../../../../api/user-tokens', () => ({
   getTokens: () => Promise.resolve([{ name: 'foo' }]),
@@ -33,7 +38,7 @@ jest.mock('../../../../components/icons-components/ClearIcon');
 const currentUser = { login: 'user' };
 
 it('generates token', async () => {
-  const wrapper = mount(
+  const wrapper = shallowWithIntl(
     <TokenStep
       currentUser={currentUser}
       finished={false}
@@ -44,16 +49,16 @@ it('generates token', async () => {
     />
   );
   await waitAndUpdate(wrapper);
-  expect(wrapper).toMatchSnapshot();
-  change(wrapper.find('input'), 'my token');
-  submit(wrapper.find('form'));
-  expect(wrapper).toMatchSnapshot(); // spinner
+  expect(wrapper.dive()).toMatchSnapshot();
+  change(wrapper.dive().find('input'), 'my token');
+  submit(wrapper.dive().find('form'));
+  expect(wrapper.dive()).toMatchSnapshot(); // spinner
   await waitAndUpdate(wrapper);
-  expect(wrapper).toMatchSnapshot();
+  expect(wrapper.dive()).toMatchSnapshot();
 });
 
 it('revokes token', async () => {
-  const wrapper = mount(
+  const wrapper = shallowWithIntl(
     <TokenStep
       currentUser={currentUser}
       finished={false}
@@ -65,17 +70,20 @@ it('revokes token', async () => {
   );
   await new Promise(setImmediate);
   wrapper.setState({ token: 'abcd1234', tokenName: 'my token' });
-  expect(wrapper).toMatchSnapshot();
-  (wrapper.find('DeleteButton').prop('onClick') as Function)();
+  expect(wrapper.dive()).toMatchSnapshot();
+  (wrapper
+    .dive()
+    .find('DeleteButton')
+    .prop('onClick') as Function)();
   wrapper.update();
-  expect(wrapper).toMatchSnapshot(); // spinner
+  expect(wrapper.dive()).toMatchSnapshot(); // spinner
   await waitAndUpdate(wrapper);
-  expect(wrapper).toMatchSnapshot();
+  expect(wrapper.dive()).toMatchSnapshot();
 });
 
 it('continues', async () => {
   const onContinue = jest.fn();
-  const wrapper = mount(
+  const wrapper = shallowWithIntl(
     <TokenStep
       currentUser={currentUser}
       finished={false}
@@ -87,13 +95,13 @@ it('continues', async () => {
   );
   await new Promise(setImmediate);
   wrapper.setState({ token: 'abcd1234', tokenName: 'my token' });
-  click(wrapper.find('[className="js-continue"]'));
+  click(wrapper.dive().find('[className="js-continue"]'));
   expect(onContinue).toBeCalledWith('abcd1234');
 });
 
 it('uses existing token', async () => {
   const onContinue = jest.fn();
-  const wrapper = mount(
+  const wrapper = shallowWithIntl(
     <TokenStep
       currentUser={currentUser}
       finished={false}
@@ -105,6 +113,6 @@ it('uses existing token', async () => {
   );
   await new Promise(setImmediate);
   wrapper.setState({ existingToken: 'abcd1234', selection: 'use-existing' });
-  click(wrapper.find('[className="js-continue"]'));
+  click(wrapper.dive().find('[className="js-continue"]'));
   expect(onContinue).toBeCalledWith('abcd1234');
 });

server/sonar-web/src/main/js/apps/tutorials/projectOnboarding/__tests__/ProjectOnboarding-test.tsx

@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
-import { shallow, mount } from 'enzyme';
+import { shallow } from 'enzyme';
 import { ProjectOnboarding } from '../ProjectOnboarding';
 import { click, doAsync } from '../../../../helpers/testUtils';
 import { getInstance, isSonarCloud } from '../../../../helpers/system';
@@ -72,7 +72,7 @@ it('finishes', () => {
   (getInstance as jest.Mock<any>).mockImplementation(() => 'SonarQube');
   (isSonarCloud as jest.Mock<any>).mockImplementation(() => false);
   const onFinish = jest.fn();
-  const wrapper = mount(
+  const wrapper = shallow(
     <ProjectOnboarding currentUser={currentUser} onFinish={onFinish} organizationsEnabled={false} />
   );
   click(wrapper.find('ResetButtonLink'));

sonar-core/src/main/resources/org/sonar/l10n/core.properties

@@ -2753,7 +2753,8 @@ onboarding.contribute_existing_project=Join a team
 onboarding.contribute_existing_project.note=Free
 
 onboarding.token.header=Provide a token
-onboarding.token.text=The token is used to identify you when an analysis is performed. If it has been compromised, you can revoke it at any point of time in your user account.
+onboarding.token.text=The token is used to identify you when an analysis is performed. If it has been compromised, you can revoke it at any point of time in your {link}.
+onboarding.token.text.user_account=user account
 onboarding.token.generate=Generate
 onboarding.token.placeholder=Enter a name for your token
 onboarding.token.generate_token=Generate a token