SONAR-15508 SONAR-15546 Add alert in the System Upgrade Info box when having critical update

11 files changed, 656 insertions, 59 deletions

diff --git a/server/sonar-web/src/main/js/app/components/update-notification/UpdateNotification.tsx b/server/sonar-web/src/main/js/app/components/update-notification/UpdateNotification.tsx
index 1a3a23b4f5f..390137539cc 100644
--- a/server/sonar-web/src/main/js/app/components/update-notification/UpdateNotification.tsx
+++ b/server/sonar-web/src/main/js/app/components/update-notification/UpdateNotification.tsx
@@ -26,7 +26,7 @@ import { withCurrentUser } from '../../../components/hoc/withCurrentUser';
 import { AlertVariant } from '../../../components/ui/Alert';
 import DismissableAlert from '../../../components/ui/DismissableAlert';
 import SystemUpgradeButton from '../../../components/upgrade/SystemUpgradeButton';
-import { sortUpgrades } from '../../../components/upgrade/utils';
+import { sortUpgrades, UpdateUseCase } from '../../../components/upgrade/utils';
 import { translate } from '../../../helpers/l10n';
 import { hasGlobalPermission, isLoggedIn } from '../../../helpers/users';
 import { Permissions } from '../../../types/permissions';
@@ -39,18 +39,11 @@ type GroupedSystemUpdate = {
   [x: string]: T.Dict<SystemUpgrade[]>;
 };
 
-enum UseCase {
-  NewMinorVersion = 'new_minor_version',
-  NewPatch = 'new_patch',
-  PreLTS = 'pre_lts',
-  PreviousLTS = 'previous_lts'
-}
-
 const MAP_VARIANT: T.Dict<AlertVariant> = {
-  [UseCase.NewMinorVersion]: 'info',
-  [UseCase.NewPatch]: 'warning',
-  [UseCase.PreLTS]: 'warning',
-  [UseCase.PreviousLTS]: 'error'
+  [UpdateUseCase.NewMinorVersion]: 'info',
+  [UpdateUseCase.NewPatch]: 'warning',
+  [UpdateUseCase.PreLTS]: 'warning',
+  [UpdateUseCase.PreviousLTS]: 'error'
 };
 
 interface Props {
@@ -60,7 +53,7 @@ interface Props {
 
 interface State {
   dismissKey: string;
-  useCase: UseCase;
+  useCase: UpdateUseCase;
   systemUpgrades: SystemUpgrade[];
   canSeeNotification: boolean;
 }
@@ -75,7 +68,7 @@ export class UpdateNotification extends React.PureComponent<Props, State> {
       dismissKey: '',
       systemUpgrades: [],
       canSeeNotification: false,
-      useCase: UseCase.NewMinorVersion
+      useCase: UpdateUseCase.NewMinorVersion
     };
     this.fetchSystemUpgradeInformation();
   }
@@ -185,16 +178,16 @@ export class UpdateNotification extends React.PureComponent<Props, State> {
         })
     );
 
-    let useCase = UseCase.NewMinorVersion;
+    let useCase = UpdateUseCase.NewMinorVersion;
 
     if (this.isPreviousLTSUpdate(parsedVersion, latestLTS, systemUpgrades)) {
-      useCase = UseCase.PreviousLTS;
+      useCase = UpdateUseCase.PreviousLTS;
     } else if (this.isPreLTSUpdate(parsedVersion, latestLTS)) {
-      useCase = UseCase.PreLTS;
+      useCase = UpdateUseCase.PreLTS;
     } else if (this.isPatchUpdate(parsedVersion, systemUpgrades)) {
-      useCase = UseCase.NewPatch;
+      useCase = UpdateUseCase.NewPatch;
     } else if (this.isMinorUpdate(parsedVersion, systemUpgrades)) {
-      useCase = UseCase.NewMinorVersion;
+      useCase = UpdateUseCase.NewMinorVersion;
     }
 
     const latest = [...upgrades].sort(
@@ -230,9 +223,9 @@ export class UpdateNotification extends React.PureComponent<Props, State> {
       <DismissableAlert
         alertKey={dismissKey}
         variant={MAP_VARIANT[useCase]}
-        className="promote-update-notification">
+        className={`promote-update-notification it__upgrade-prompt-${useCase}`}>
         {translate('admin_notification.update', useCase)}
-        <SystemUpgradeButton systemUpgrades={systemUpgrades} />
+        <SystemUpgradeButton systemUpgrades={systemUpgrades} updateUseCase={useCase} />
       </DismissableAlert>
     );
   }
diff --git a/server/sonar-web/src/main/js/app/components/update-notification/__tests__/UpdateNotification-test.tsx b/server/sonar-web/src/main/js/app/components/update-notification/__tests__/UpdateNotification-test.tsx
index 6c284a04610..e6f9a7b7404 100644
--- a/server/sonar-web/src/main/js/app/components/update-notification/__tests__/UpdateNotification-test.tsx
+++ b/server/sonar-web/src/main/js/app/components/update-notification/__tests__/UpdateNotification-test.tsx
@@ -30,7 +30,9 @@ import { UpdateNotification } from '../UpdateNotification';
 jest.mock('../../../../api/system', () => {
   const { mockUpgrades } = jest.requireActual('../../../../helpers/mocks/system-upgrades');
   return {
-    getSystemUpgrades: jest.fn().mockResolvedValue({ upgrades: [mockUpgrades()], latestLTS: '8.9' })
+    getSystemUpgrades: jest
+      .fn()
+      .mockResolvedValue({ upgrades: [mockUpgrades({ version: '9.1' })], latestLTS: '8.9' })
   };
 });
 
@@ -38,6 +40,16 @@ function formatDate(date: Date): string {
   return `${date.getFullYear()}-${date.getMonth()}-${date.getDay()}`;
 }
 
+it('should render correctly', async () => {
+  const wrapper = shallowRender({
+    appState: mockAppState({ version: '9.0' }),
+    currentUser: mockLoggedInUser({ permissions: { global: [Permissions.Admin] } })
+  });
+  await waitAndUpdate(wrapper);
+  expect(wrapper).toMatchSnapshot('default');
+  expect(wrapper.setProps({ currentUser: mockCurrentUser() })).toMatchSnapshot('anonymous user');
+});
+
 it('should not show prompt when not admin', async () => {
   //As anonymous
   const wrapper = shallowRender();
diff --git a/server/sonar-web/src/main/js/app/components/update-notification/__tests__/__snapshots__/UpdateNotification-test.tsx.snap b/server/sonar-web/src/main/js/app/components/update-notification/__tests__/__snapshots__/UpdateNotification-test.tsx.snap
new file mode 100644
index 00000000000..c788a784593
--- /dev/null
+++ b/server/sonar-web/src/main/js/app/components/update-notification/__tests__/__snapshots__/UpdateNotification-test.tsx.snap
@@ -0,0 +1,28 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render correctly: anonymous user 1`] = `""`;
+
+exports[`should render correctly: default 1`] = `
+<DismissableAlert
+  alertKey="new_minor_version9.1"
+  className="promote-update-notification it__upgrade-prompt-new_minor_version"
+  variant="info"
+>
+  admin_notification.update.new_minor_version
+  <SystemUpgradeButton
+    latestLTS="8.9"
+    systemUpgrades={
+      Array [
+        Object {
+          "changeLogUrl": "changelogurl",
+          "description": "Version 5.6.7 description",
+          "downloadUrl": "downloadurl",
+          "releaseDate": "2017-03-01",
+          "version": "9.1",
+        },
+      ]
+    }
+    updateUseCase="new_minor_version"
+  />
+</DismissableAlert>
+`;
diff --git a/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeButton.tsx b/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeButton.tsx
index cd3a527ef9b..c993f597a7a 100644
--- a/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeButton.tsx
+++ b/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeButton.tsx
@@ -22,10 +22,11 @@ import { translate } from '../../helpers/l10n';
 import { SystemUpgrade } from '../../types/system';
 import { Button } from '../controls/buttons';
 import SystemUpgradeForm from './SystemUpgradeForm';
-import { groupUpgrades, sortUpgrades } from './utils';
+import { groupUpgrades, sortUpgrades, UpdateUseCase } from './utils';
 
 interface Props {
   systemUpgrades: SystemUpgrade[];
+  updateUseCase?: UpdateUseCase;
 }
 
 interface State {
@@ -44,7 +45,7 @@ export default class SystemUpgradeButton extends React.PureComponent<Props, Stat
   };
 
   render() {
-    const { systemUpgrades } = this.props;
+    const { systemUpgrades, updateUseCase } = this.props;
     const { openSystemUpgradeForm } = this.state;
     return (
       <>
@@ -55,6 +56,7 @@ export default class SystemUpgradeButton extends React.PureComponent<Props, Stat
           <SystemUpgradeForm
             onClose={this.handleCloseSystemUpgradeForm}
             systemUpgrades={groupUpgrades(sortUpgrades(systemUpgrades))}
+            updateUseCase={updateUseCase}
           />
         )}
       </>
diff --git a/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeForm.tsx b/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeForm.tsx
index 9a845dbc573..eb6e85ca6b8 100644
--- a/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeForm.tsx
+++ b/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeForm.tsx
@@ -17,6 +17,7 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import { filter, flatMap, isEmpty, negate } from 'lodash';
 import * as React from 'react';
 import { translate } from '../../helpers/l10n';
 import { EditionKey } from '../../types/editions';
@@ -24,39 +25,73 @@ import { SystemUpgrade } from '../../types/system';
 import { ResetButtonLink } from '../controls/buttons';
 import Modal from '../controls/Modal';
 import { withAppState } from '../hoc/withAppState';
+import { Alert, AlertVariant } from '../ui/Alert';
 import SystemUpgradeItem from './SystemUpgradeItem';
+import { UpdateUseCase } from './utils';
 
 interface Props {
-  appState: Pick<T.AppState, 'edition'>;
+  appState: Pick<T.AppState, 'edition' | 'version'>;
   onClose: () => void;
   systemUpgrades: SystemUpgrade[][];
+  latestLTS: string;
+  updateUseCase?: UpdateUseCase;
 }
 
+const MAP_ALERT: { [key in UpdateUseCase]?: AlertVariant } = {
+  [UpdateUseCase.NewPatch]: 'warning',
+  [UpdateUseCase.PreLTS]: 'warning',
+  [UpdateUseCase.PreviousLTS]: 'error'
+};
+
 interface State {
   upgrading: boolean;
 }
 
 export class SystemUpgradeForm extends React.PureComponent<Props, State> {
+  versionParser = /^(\d+)\.(\d+)(\.(\d+))?/;
   state: State = { upgrading: false };
 
   render() {
     const { upgrading } = this.state;
-    const { appState, systemUpgrades } = this.props;
+    const { appState, systemUpgrades, latestLTS, updateUseCase } = this.props;
+    let systemUpgradesWithPatch = systemUpgrades;
+    const alertVariant = updateUseCase ? MAP_ALERT[updateUseCase] : undefined;
     const header = translate('system.system_upgrade');
+    const parsedVersion = this.versionParser.exec(appState.version);
+    let patches: SystemUpgrade[] = [];
+    if (updateUseCase === UpdateUseCase.NewPatch && parsedVersion !== null) {
+      const [, major, minor] = parsedVersion;
+      const majoMinorVersion = `${major}.${minor}`;
+      patches = flatMap(systemUpgrades, upgrades =>
+        filter(upgrades, upgrade => upgrade.version.startsWith(majoMinorVersion))
+      );
+      systemUpgradesWithPatch = systemUpgrades
+        .map(upgrades => upgrades.filter(upgrade => !upgrade.version.startsWith(majoMinorVersion)))
+        .filter(negate(isEmpty));
+      systemUpgradesWithPatch.push(patches);
+    }
+
     return (
       <Modal contentLabel={header} onRequestClose={this.props.onClose}>
         <div className="modal-head">
           <h2>{header}</h2>
         </div>
+
         <div className="modal-body">
-          {systemUpgrades.map((upgrades, idx) => (
+          {alertVariant && updateUseCase && (
+            <Alert variant={alertVariant} className={`it__upgrade-alert-${updateUseCase}`}>
+              {translate('admin_notification.update', updateUseCase)}
+            </Alert>
+          )}
+          {systemUpgradesWithPatch.map(upgrades => (
             <SystemUpgradeItem
               edition={
                 appState.edition as EditionKey /* TODO: Fix once AppState is no longer ambiant. */
               }
               key={upgrades[upgrades.length - 1].version}
               systemUpgrades={upgrades}
-              isLatestVersion={idx === 0}
+              isPatch={upgrades === patches}
+              isLTSVersion={upgrades.some(upgrade => upgrade.version.startsWith(latestLTS))}
             />
           ))}
         </div>
diff --git a/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeItem.tsx b/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeItem.tsx
index 756455472c6..049bfa96d86 100644
--- a/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeItem.tsx
+++ b/server/sonar-web/src/main/js/components/upgrade/SystemUpgradeItem.tsx
@@ -32,25 +32,30 @@ import SystemUpgradeIntermediate from './SystemUpgradeIntermediate';
 
 export interface SystemUpgradeItemProps {
   edition: EditionKey | undefined;
-  isLatestVersion: boolean;
+  isLTSVersion: boolean;
+  isPatch: boolean;
   systemUpgrades: SystemUpgrade[];
 }
 
 export default function SystemUpgradeItem(props: SystemUpgradeItemProps) {
-  const { edition, isLatestVersion, systemUpgrades } = props;
+  const { edition, isPatch, isLTSVersion, systemUpgrades } = props;
   const lastUpgrade = systemUpgrades[0];
   const downloadUrl = getEditionDownloadUrl(
     getEdition(edition || EditionKey.community),
     lastUpgrade
   );
+  let header = translate('system.latest_version');
+  if (isLTSVersion) {
+    header = translate('system.lts_version');
+  } else if (isPatch) {
+    header = translate('system.latest_patch');
+  }
 
   return (
-    <div className="system-upgrade-version">
+    <div className="system-upgrade-version it__upgrade-list-item">
       <h3 className="h1 spacer-bottom">
-        <strong>
-          {isLatestVersion ? translate('system.latest_version') : translate('system.lts_version')}
-        </strong>
-        {isLatestVersion && (
+        <strong>{header}</strong>
+        {!isLTSVersion && (
           <a
             className="spacer-left medium"
             href="https://www.sonarqube.org/whats-new/?referrer=sonarqube"
diff --git a/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeForm-test.tsx b/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeForm-test.tsx
index 7e33af49609..6d4c06bdfec 100644
--- a/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeForm-test.tsx
+++ b/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeForm-test.tsx
@@ -21,6 +21,7 @@ import { shallow } from 'enzyme';
 import * as React from 'react';
 import { EditionKey } from '../../../types/editions';
 import { SystemUpgradeForm } from '../SystemUpgradeForm';
+import { UpdateUseCase } from '../utils';
 
 const UPGRADES = [
   [
@@ -69,14 +70,19 @@ const UPGRADES = [
   ]
 ];
 
-it('should display correctly', () => {
-  expect(
-    shallow(
-      <SystemUpgradeForm
-        appState={{ edition: EditionKey.community }}
-        onClose={jest.fn()}
-        systemUpgrades={UPGRADES}
-      />
-    )
-  ).toMatchSnapshot();
-});
+it.each([...Object.values(UpdateUseCase), undefined])(
+  'should display correctly for %s',
+  updateUseCase => {
+    expect(
+      shallow(
+        <SystemUpgradeForm
+          appState={{ edition: EditionKey.community, version: '5.6.3' }}
+          onClose={jest.fn()}
+          systemUpgrades={UPGRADES}
+          latestLTS="9.1"
+          updateUseCase={updateUseCase}
+        />
+      )
+    ).toMatchSnapshot();
+  }
+);
diff --git a/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeItem-test.tsx b/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeItem-test.tsx
index ba705ab5238..2229892042d 100644
--- a/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeItem-test.tsx
+++ b/server/sonar-web/src/main/js/components/upgrade/__tests__/SystemUpgradeItem-test.tsx
@@ -24,7 +24,8 @@ import SystemUpgradeItem, { SystemUpgradeItemProps } from '../SystemUpgradeItem'
 
 it('should display correctly', () => {
   expect(shallowRender()).toMatchSnapshot();
-  expect(shallowRender({ isLatestVersion: false })).toMatchSnapshot();
+  expect(shallowRender({ isLTSVersion: true })).toMatchSnapshot();
+  expect(shallowRender({ isPatch: true })).toMatchSnapshot();
   expect(shallowRender({ edition: EditionKey.developer })).toMatchSnapshot();
   expect(shallowRender({ edition: EditionKey.enterprise })).toMatchSnapshot();
   expect(shallowRender({ edition: EditionKey.datacenter })).toMatchSnapshot();
@@ -76,7 +77,8 @@ function shallowRender(props: Partial<SystemUpgradeItemProps> = {}) {
           downloadDeveloperUrl: 'http://download.url/developer'
         }
       ]}
-      isLatestVersion={true}
+      isPatch={false}
+      isLTSVersion={false}
       {...props}
     />
   );
diff --git a/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeForm-test.tsx.snap b/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeForm-test.tsx.snap
index e1c80419910..1a0e6083eb7 100644
--- a/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeForm-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeForm-test.tsx.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`should display correctly 1`] = `
+exports[`should display correctly for new_minor_version 1`] = `
 <Modal
   contentLabel="system.system_upgrade"
   onRequestClose={[MockFunction]}
@@ -17,7 +17,8 @@ exports[`should display correctly 1`] = `
   >
     <SystemUpgradeItem
       edition="community"
-      isLatestVersion={true}
+      isLTSVersion={false}
+      isPatch={false}
       key="6.3"
       systemUpgrades={
         Array [
@@ -42,7 +43,410 @@ exports[`should display correctly 1`] = `
     />
     <SystemUpgradeItem
       edition="community"
-      isLatestVersion={false}
+      isLTSVersion={false}
+      isPatch={false}
+      key="5.6.5"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.7 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.7",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.6 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-04-02",
+            "version": "5.6.6",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.5 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.5",
+          },
+        ]
+      }
+    />
+  </div>
+  <div
+    className="modal-foot"
+  >
+    <a
+      className="pull-left"
+      href="https://www.sonarqube.org/downloads/?referrer=sonarqube"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.see_sonarqube_downloads
+    </a>
+    <ResetButtonLink
+      onClick={[MockFunction]}
+    >
+      cancel
+    </ResetButtonLink>
+  </div>
+</Modal>
+`;
+
+exports[`should display correctly for new_patch 1`] = `
+<Modal
+  contentLabel="system.system_upgrade"
+  onRequestClose={[MockFunction]}
+>
+  <div
+    className="modal-head"
+  >
+    <h2>
+      system.system_upgrade
+    </h2>
+  </div>
+  <div
+    className="modal-body"
+  >
+    <Alert
+      className="it__upgrade-alert-new_patch"
+      variant="warning"
+    >
+      admin_notification.update.new_patch
+    </Alert>
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={false}
+      key="6.3"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.4 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-06-02",
+            "version": "6.4",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.3 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-05-02",
+            "version": "6.3",
+          },
+        ]
+      }
+    />
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={true}
+      key="5.6.5"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.7 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.7",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.6 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-04-02",
+            "version": "5.6.6",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.5 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.5",
+          },
+        ]
+      }
+    />
+  </div>
+  <div
+    className="modal-foot"
+  >
+    <a
+      className="pull-left"
+      href="https://www.sonarqube.org/downloads/?referrer=sonarqube"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.see_sonarqube_downloads
+    </a>
+    <ResetButtonLink
+      onClick={[MockFunction]}
+    >
+      cancel
+    </ResetButtonLink>
+  </div>
+</Modal>
+`;
+
+exports[`should display correctly for pre_lts 1`] = `
+<Modal
+  contentLabel="system.system_upgrade"
+  onRequestClose={[MockFunction]}
+>
+  <div
+    className="modal-head"
+  >
+    <h2>
+      system.system_upgrade
+    </h2>
+  </div>
+  <div
+    className="modal-body"
+  >
+    <Alert
+      className="it__upgrade-alert-pre_lts"
+      variant="warning"
+    >
+      admin_notification.update.pre_lts
+    </Alert>
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={false}
+      key="6.3"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.4 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-06-02",
+            "version": "6.4",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.3 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-05-02",
+            "version": "6.3",
+          },
+        ]
+      }
+    />
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={false}
+      key="5.6.5"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.7 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.7",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.6 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-04-02",
+            "version": "5.6.6",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.5 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.5",
+          },
+        ]
+      }
+    />
+  </div>
+  <div
+    className="modal-foot"
+  >
+    <a
+      className="pull-left"
+      href="https://www.sonarqube.org/downloads/?referrer=sonarqube"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.see_sonarqube_downloads
+    </a>
+    <ResetButtonLink
+      onClick={[MockFunction]}
+    >
+      cancel
+    </ResetButtonLink>
+  </div>
+</Modal>
+`;
+
+exports[`should display correctly for previous_lts 1`] = `
+<Modal
+  contentLabel="system.system_upgrade"
+  onRequestClose={[MockFunction]}
+>
+  <div
+    className="modal-head"
+  >
+    <h2>
+      system.system_upgrade
+    </h2>
+  </div>
+  <div
+    className="modal-body"
+  >
+    <Alert
+      className="it__upgrade-alert-previous_lts"
+      variant="error"
+    >
+      admin_notification.update.previous_lts
+    </Alert>
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={false}
+      key="6.3"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.4 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-06-02",
+            "version": "6.4",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.3 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-05-02",
+            "version": "6.3",
+          },
+        ]
+      }
+    />
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={false}
+      key="5.6.5"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.7 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.7",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.6 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-04-02",
+            "version": "5.6.6",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 5.6.5 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-03-01",
+            "version": "5.6.5",
+          },
+        ]
+      }
+    />
+  </div>
+  <div
+    className="modal-foot"
+  >
+    <a
+      className="pull-left"
+      href="https://www.sonarqube.org/downloads/?referrer=sonarqube"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.see_sonarqube_downloads
+    </a>
+    <ResetButtonLink
+      onClick={[MockFunction]}
+    >
+      cancel
+    </ResetButtonLink>
+  </div>
+</Modal>
+`;
+
+exports[`should display correctly for undefined 1`] = `
+<Modal
+  contentLabel="system.system_upgrade"
+  onRequestClose={[MockFunction]}
+>
+  <div
+    className="modal-head"
+  >
+    <h2>
+      system.system_upgrade
+    </h2>
+  </div>
+  <div
+    className="modal-body"
+  >
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={false}
+      key="6.3"
+      systemUpgrades={
+        Array [
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.4 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-06-02",
+            "version": "6.4",
+          },
+          Object {
+            "changeLogUrl": "changelogurl",
+            "description": "Version 6.3 description",
+            "downloadUrl": "downloadurl",
+            "plugins": Object {},
+            "releaseDate": "2017-05-02",
+            "version": "6.3",
+          },
+        ]
+      }
+    />
+    <SystemUpgradeItem
+      edition="community"
+      isLTSVersion={false}
+      isPatch={false}
       key="5.6.5"
       systemUpgrades={
         Array [
diff --git a/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeItem-test.tsx.snap b/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeItem-test.tsx.snap
index 51d35d94dc6..ca65521832b 100644
--- a/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeItem-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/upgrade/__tests__/__snapshots__/SystemUpgradeItem-test.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`should display correctly 1`] = `
 <div
-  className="system-upgrade-version"
+  className="system-upgrade-version it__upgrade-list-item"
 >
   <h3
     className="h1 spacer-bottom"
@@ -105,7 +105,7 @@ exports[`should display correctly 1`] = `
 
 exports[`should display correctly 2`] = `
 <div
-  className="system-upgrade-version"
+  className="system-upgrade-version it__upgrade-list-item"
 >
   <h3
     className="h1 spacer-bottom"
@@ -200,6 +200,109 @@ exports[`should display correctly 2`] = `
 
 exports[`should display correctly 3`] = `
 <div
+  className="system-upgrade-version it__upgrade-list-item"
+>
+  <h3
+    className="h1 spacer-bottom"
+  >
+    <strong>
+      system.latest_patch
+    </strong>
+    <a
+      className="spacer-left medium"
+      href="https://www.sonarqube.org/whats-new/?referrer=sonarqube"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.see_whats_new
+    </a>
+  </h3>
+  <p>
+    <FormattedMessage
+      defaultMessage="system.version_is_availble"
+      id="system.version_is_availble"
+      values={
+        Object {
+          "version": <b>
+            SonarQube 
+            5.6.7
+          </b>,
+        }
+      }
+    />
+  </p>
+  <p
+    className="spacer-top"
+  >
+    Version 5.6.7 description
+  </p>
+  <div
+    className="big-spacer-top"
+  >
+    <DateFormatter
+      date="2017-03-01"
+      long={true}
+    >
+      <Component />
+    </DateFormatter>
+    <a
+      className="spacer-left"
+      href="http://changelog.url/"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.release_notes
+    </a>
+  </div>
+  <SystemUpgradeIntermediate
+    className="spacer-top"
+    upgrades={
+      Array [
+        Object {
+          "changeLogUrl": "http://changelog.url/",
+          "description": "Version 5.6.6 description",
+          "downloadDeveloperUrl": "http://download.url/developer",
+          "downloadUrl": "http://download.url/community",
+          "releaseDate": "2017-04-02",
+          "version": "5.6.6",
+        },
+        Object {
+          "changeLogUrl": "http://changelog.url/",
+          "description": "Version 5.6.5 description",
+          "downloadDeveloperUrl": "http://download.url/developer",
+          "downloadUrl": "http://download.url/community",
+          "releaseDate": "2017-03-01",
+          "version": "5.6.5",
+        },
+      ]
+    }
+  />
+  <div
+    className="big-spacer-top"
+  >
+    <a
+      className="button"
+      download="http://download.url/community"
+      href="http://download.url/community"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.download_x.5.6.7
+    </a>
+    <a
+      className="spacer-left"
+      href="https://redirect.sonarsource.com/doc/upgrading.html"
+      rel="noopener noreferrer"
+      target="_blank"
+    >
+      system.how_to_upgrade
+    </a>
+  </div>
+</div>
+`;
+
+exports[`should display correctly 4`] = `
+<div
   className="system-upgrade-version"
 >
   <h3
@@ -301,9 +404,9 @@ exports[`should display correctly 3`] = `
 </div>
 `;
 
-exports[`should display correctly 4`] = `
+exports[`should display correctly 5`] = `
 <div
-  className="system-upgrade-version"
+  className="system-upgrade-version it__upgrade-list-item"
 >
   <h3
     className="h1 spacer-bottom"
@@ -404,9 +507,9 @@ exports[`should display correctly 4`] = `
 </div>
 `;
 
-exports[`should display correctly 5`] = `
+exports[`should display correctly 6`] = `
 <div
-  className="system-upgrade-version"
+  className="system-upgrade-version it__upgrade-list-item"
 >
   <h3
     className="h1 spacer-bottom"
@@ -507,9 +610,9 @@ exports[`should display correctly 5`] = `
 </div>
 `;
 
-exports[`should display correctly 6`] = `
+exports[`should display correctly 7`] = `
 <div
-  className="system-upgrade-version"
+  className="system-upgrade-version it__upgrade-list-item"
 >
   <h3
     className="h1 spacer-bottom"
diff --git a/server/sonar-web/src/main/js/components/upgrade/utils.ts b/server/sonar-web/src/main/js/components/upgrade/utils.ts
index e58b76a2bc0..39406c389d9 100644
--- a/server/sonar-web/src/main/js/components/upgrade/utils.ts
+++ b/server/sonar-web/src/main/js/components/upgrade/utils.ts
@@ -20,6 +20,13 @@
 import { groupBy, sortBy } from 'lodash';
 import { SystemUpgrade } from '../../types/system';
 
+export enum UpdateUseCase {
+  NewMinorVersion = 'new_minor_version',
+  NewPatch = 'new_patch',
+  PreLTS = 'pre_lts',
+  PreviousLTS = 'previous_lts'
+}
+
 export function sortUpgrades(upgrades: SystemUpgrade[]): SystemUpgrade[] {
   return sortBy(upgrades, [
     (upgrade: SystemUpgrade) => -Number(upgrade.version.split('.')[0]),