conditionally load component for sonarcloud notifications

server/sonar-web/src/main/js/app/components/GlobalContainer.tsx

@@ -18,15 +18,12 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
-import * as classNames from 'classnames';
 import GlobalNav from './nav/global/GlobalNav';
 import StartupModal from './StartupModal';
 import GlobalFooterContainer from './GlobalFooterContainer';
 import GlobalMessagesContainer from './GlobalMessagesContainer';
 import SuggestionsProvider from './embed-docs-modal/SuggestionsProvider';
 import Workspace from '../../components/workspace/Workspace';
-import { isSonarCloud } from '../../helpers/system';
-import '../styles/sonarcloud.css';
 
 interface Props {
   children: React.ReactNode;
@@ -40,7 +37,7 @@ export default function GlobalContainer(props: Props) {
   return (
     <SuggestionsProvider>
       <StartupModal>
-        <div className={classNames('global-container', { sonarcloud: isSonarCloud() })}>
+        <div className="global-container">
           <div className="page-wrapper" id="container">
             <div className="page-container">
               <Workspace>

server/sonar-web/src/main/js/app/components/nav/global/GlobalNav.css

@@ -101,7 +101,7 @@
 }
 
 .global-navbar-menu-right .navbar-search {
-  flex: 0 1 310px; /* Workaround for SONAR-10971 */
+  flex: 0 1 240px; /* Workaround for SONAR-10971 */
   min-width: 0;
 }
 

server/sonar-web/src/main/js/app/components/nav/global/GlobalNav.tsx

@@ -23,8 +23,6 @@ import GlobalNavBranding, { SonarCloudNavBranding } from './GlobalNavBranding';
 import GlobalNavMenu from './GlobalNavMenu';
 import GlobalNavExplore from './GlobalNavExplore';
 import GlobalNavUserContainer from './GlobalNavUserContainer';
-import NotificationsSidebar from '../../notifications/NotificationsSidebar';
-import NavLatestNotification from '../../notifications/NavLatestNotification';
 import Search from '../../search/Search';
 import EmbedDocsPopupHelper from '../../embed-docs-modal/EmbedDocsPopupHelper';
 import * as theme from '../../../theme';
@@ -46,10 +44,18 @@ import { isSonarCloud } from '../../../../helpers/system';
 import { isLoggedIn } from '../../../../helpers/users';
 import { OnboardingContext } from '../../OnboardingContext';
 import { setCurrentUserSetting } from '../../../../store/users';
-import './GlobalNav.css';
 import { parseDate } from '../../../../helpers/dates';
+import './GlobalNav.css';
 
 const GlobalNavPlus = lazyLoad(() => import('./GlobalNavPlus'), 'GlobalNavPlus');
+const NotificationsSidebar = lazyLoad(
+  () => import('../../notifications/NotificationsSidebar'),
+  'NotificationsSidebar'
+);
+const NavLatestNotification = lazyLoad(
+  () => import('../../notifications/NavLatestNotification'),
+  'NavLatestNotification'
+);
 
 interface Props {
   accessToken?: string;

server/sonar-web/src/main/js/app/components/notifications/notifications.css

@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 .navbar-latest-notification {
-  flex: 0 1 380px;
+  flex: 0 1 240px;
   text-align: right;
   overflow: hidden;
 }

server/sonar-web/src/main/js/app/styles/sonarcloud.css

@@ -1,40 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2019 SonarSource SA
- * mailto:info AT sonarsource DOT com
- *
- * This program is free software; you can redistribute it and/or
- * modify it under the terms of the GNU Lesser General Public
- * License as published by the Free Software Foundation; either
- * version 3 of the License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
- * Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program; if not, write to the Free Software Foundation,
- * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
- */
-.sonarcloud .global-navbar-menu-right .navbar-search {
-  flex: 0 0 310px;
-}
-
-.sonarcloud table.form {
-  width: 100%;
-}
-
-.sonarcloud table.form tr,
-.sonarcloud table.form td {
-  vertical-align: middle;
-}
-
-.sonarcloud table.form tr:first-child,
-.sonarcloud table.form td:first-child {
-  width: 450px;
-}
-
-.sonarcloud table.form tbody tr:nth-child(2n) {
-  background: var(--sonarcloudBlack200);
-}

server/sonar-web/src/main/js/apps/account/notifications/GlobalNotifications.tsx

@@ -38,7 +38,7 @@ export default function GlobalNotifications(props: Props) {
         <h2>{translate('my_profile.overall_notifications.title')}</h2>
 
         <div className="boxed-group-inner">
-          <table className="form">
+          <table className="data zebra">
             <thead>
               <tr>
                 <th />

server/sonar-web/src/main/js/apps/account/notifications/SonarCloudNotifications.tsx

@@ -42,7 +42,7 @@ export class SonarCloudNotifications extends React.PureComponent<Props> {
       <section className="boxed-group">
         <h2>{translate('my_profile.sonarcloud_feature_notifications.title')}</h2>
         <div className="boxed-group-inner">
-          <table className="form">
+          <table className="data zebra">
             <thead>
               <tr>
                 <th />

server/sonar-web/src/main/js/apps/account/notifications/__tests__/__snapshots__/GlobalNotifications-test.tsx.snap

@@ -12,7 +12,7 @@ exports[`should match snapshot 1`] = `
       className="boxed-group-inner"
     >
       <table
-        className="form"
+        className="data zebra"
       >
         <thead>
           <tr>
@@ -86,7 +86,7 @@ exports[`should show SonarCloud options if in SC context 1`] = `
       className="boxed-group-inner"
     >
       <table
-        className="form"
+        className="data zebra"
       >
         <thead>
           <tr>

server/sonar-web/src/main/js/apps/account/notifications/__tests__/__snapshots__/SonarCloudNotifications-test.tsx.snap

@@ -11,7 +11,7 @@ exports[`should match snapshot 1`] = `
     className="boxed-group-inner"
   >
     <table
-      className="form"
+      className="data zebra"
     >
       <thead>
         <tr>