SONAR-9705 Make organization key easier to find

diff --git a/server/sonar-web/src/main/js/app/components/nav/global/GlobalNavUser.js b/server/sonar-web/src/main/js/app/components/nav/global/GlobalNavUser.js
index 37bc3af8caa4545133463bb834b36eb378a28be0..68c45c921ec2f170b8607749450bfe3692b92e6f 100644 (file)
--- a/server/sonar-web/src/main/js/app/components/nav/global/GlobalNavUser.js
+++ b/server/sonar-web/src/main/js/app/components/nav/global/GlobalNavUser.js
@@ -23,6 +23,7 @@ import classNames from 'classnames';
 import { sortBy } from 'lodash';
 import { Link } from 'react-router';
 import Avatar from '../../../../components/ui/Avatar';
+import OrganizationIcon from '../../../../components/icons-components/OrganizationIcon';
 import OrganizationLink from '../../../../components/ui/OrganizationLink';
 import { translate } from '../../../../helpers/l10n';
 
@@ -146,12 +147,17 @@ export default class GlobalNavUser extends React.PureComponent {
             </li>
             {hasOrganizations && <li role="separator" className="divider" />}
             {hasOrganizations && (
-              <li className="dropdown-header spacer-left">{translate('my_organizations')}</li>
+              <li>
+                <Link to="/account/organizations" onClick={this.closeDropdown}>
+                  {translate('my_organizations')}
+                </Link>
+              </li>
             )}
             {hasOrganizations &&
               sortBy(organizations, org => org.name.toLowerCase()).map(organization => (
                 <li key={organization.key}>
                   <OrganizationLink organization={organization} onClick={this.closeDropdown}>
+                    <OrganizationIcon />
                     <span className="spacer-left">{organization.name}</span>
                   </OrganizationLink>
                 </li>

diff --git a/server/sonar-web/src/main/js/app/components/nav/global/__tests__/__snapshots__/GlobalNavUser-test.js.snap b/server/sonar-web/src/main/js/app/components/nav/global/__tests__/__snapshots__/GlobalNavUser-test.js.snap
index f42167519ef26df98e152ef5aa1b530b39eea3f1..034d6700b8a3b72170ff4e91bb8e17ce6644072a 100644 (file)
--- a/server/sonar-web/src/main/js/app/components/nav/global/__tests__/__snapshots__/GlobalNavUser-test.js.snap
+++ b/server/sonar-web/src/main/js/app/components/nav/global/__tests__/__snapshots__/GlobalNavUser-test.js.snap
@@ -187,10 +187,15 @@ exports[`should render the users organizations 1`] = `
       className="divider"
       role="separator"
     />
-    <li
-      className="dropdown-header spacer-left"
-    >
-      my_organizations
+    <li>
+      <Link
+        onClick={[Function]}
+        onlyActiveOnIndex={false}
+        style={Object {}}
+        to="/account/organizations"
+      >
+        my_organizations
+      </Link>
     </li>
     <li>
       <OrganizationLink
@@ -202,6 +207,7 @@ exports[`should render the users organizations 1`] = `
           }
         }
       >
+        <OrganizationIcon />
         <span
           className="spacer-left"
         >
@@ -219,6 +225,7 @@ exports[`should render the users organizations 1`] = `
           }
         }
       >
+        <OrganizationIcon />
         <span
           className="spacer-left"
         >
@@ -236,6 +243,7 @@ exports[`should render the users organizations 1`] = `
           }
         }
       >
+        <OrganizationIcon />
         <span
           className="spacer-left"
         >

diff --git a/server/sonar-web/src/main/js/apps/account/organizations/CreateOrganizationForm.js b/server/sonar-web/src/main/js/apps/account/organizations/CreateOrganizationForm.js
index 129fec6034e0fa456945cf204f817e7ff8f838b0..03da57ec199e137c973177e7a7449c1b2c6a45f9 100644 (file)
--- a/server/sonar-web/src/main/js/apps/account/organizations/CreateOrganizationForm.js
+++ b/server/sonar-web/src/main/js/apps/account/organizations/CreateOrganizationForm.js
@@ -226,8 +226,8 @@ class CreateOrganizationForm extends React.PureComponent {
 
           <footer className="modal-foot">
             <div>
+              {this.state.loading && <i className="spinner spacer-right" />}
               <button disabled={this.state.loading} type="submit">
-                {this.state.loading && <i className="spinner little-spacer-right" />}
                 {translate('create')}
               </button>
               <button type="reset" className="button-link" onClick={this.closeForm}>

diff --git a/server/sonar-web/src/main/js/apps/account/organizations/OrganizationCard.js b/server/sonar-web/src/main/js/apps/account/organizations/OrganizationCard.js
index 392b0286d68639f735b0aec761ef203e263f2d0c..a76d12612b115c17847a7760613c727126bbc6b9 100644 (file)
--- a/server/sonar-web/src/main/js/apps/account/organizations/OrganizationCard.js
+++ b/server/sonar-web/src/main/js/apps/account/organizations/OrganizationCard.js
@@ -21,6 +21,7 @@
 import React from 'react';
 import OrganizationLink from '../../../components/ui/OrganizationLink';
 /*:: import type { Organization } from '../../../store/organizations/duck'; */
+import { translate } from '../../../helpers/l10n';
 
 /*::
 type Props = {
@@ -52,11 +53,22 @@ export default function OrganizationCard(props /*: Props */) {
         <OrganizationLink organization={organization}>{organization.name}</OrganizationLink>
       </h3>
 
-      <div className="account-project-key">{organization.key}</div>
-
       {!!organization.description && (
         <div className="account-project-description">{organization.description}</div>
       )}
+
+      <div className="account-project-key">
+        <span className="little-spacer-right">
+          {translate('key')}
+          {':'}
+        </span>
+        <input
+          onClick={event => event.currentTarget.select()}
+          readOnly={true}
+          type="text"
+          value={organization.key}
+        />
+      </div>
     </div>
   );
 }