rewrite more components from flow to ts (#913)

83 files changed, 655 insertions, 849 deletions

diff --git a/server/sonar-web/src/main/js/api/issues.ts b/server/sonar-web/src/main/js/api/issues.ts
index 40d1222314a..fc49c0f7658 100644
--- a/server/sonar-web/src/main/js/api/issues.ts
+++ b/server/sonar-web/src/main/js/api/issues.ts
@@ -23,10 +23,10 @@ import { RawIssue } from '../helpers/issues';
 import throwGlobalError from '../app/utils/throwGlobalError';
 
 export interface IssueResponse {
-  components?: Array<{}>;
-  issue: {};
+  components?: Array<{ key: string; name: string }>;
+  issue: RawIssue;
   rules?: Array<{}>;
-  users?: Array<{}>;
+  users?: Array<{ login: string }>;
 }
 
 interface IssuesResponse {
diff --git a/server/sonar-web/src/main/js/app/components/MarkdownHelp.js b/server/sonar-web/src/main/js/app/components/MarkdownHelp.tsx
index f4b957da4f0..e1c76f55ada 100644
--- a/server/sonar-web/src/main/js/app/components/MarkdownHelp.js
+++ b/server/sonar-web/src/main/js/app/components/MarkdownHelp.tsx
@@ -17,8 +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.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 
 export default function MarkdownHelp() {
   return (
@@ -45,9 +44,9 @@ export default function MarkdownHelp() {
             </td>
           </tr>
           <tr>
-            <td className="text-top">[SonarQube™ Home Page](http://www.sonarqube.org)</td>
+            <td className="text-top">{'[SonarQube™ Home Page](http://www.sonarqube.org)'}</td>
             <td className="markdown text-top">
-              <a href="http://www.sonarqube.org" target="_blank">
+              <a href="http://www.sonarqube.org" rel="noopener noreferrer" target="_blank">
                 SonarQube™ Home Page
               </a>
             </td>
@@ -104,9 +103,8 @@ export default function MarkdownHelp() {
           <tr>
             <td className="text-top">
               ``
-              {/* eslint-disable-next-line react/jsx-no-comment-textnodes */}
               <br />
-              // code on multiple lines
+              {'// code on multiple lines'}
               <br />
               {'public void foo() {'}
               <br />
diff --git a/server/sonar-web/src/main/js/app/types.ts b/server/sonar-web/src/main/js/app/types.ts
index 20827b40e4e..9f0d53fdd5c 100644
--- a/server/sonar-web/src/main/js/app/types.ts
+++ b/server/sonar-web/src/main/js/app/types.ts
@@ -311,7 +311,7 @@ export interface SecurityHotspot {
 }
 
 export interface Issue {
-  actions?: string[];
+  actions: string[];
   assignee?: string;
   assigneeActive?: string;
   assigneeAvatar?: string;
@@ -326,6 +326,7 @@ export interface Issue {
   componentUuid: string;
   creationDate: string;
   effort?: string;
+  externalRuleEngine?: string;
   fromExternalRule?: boolean;
   key: string;
   flows: FlowLocation[][];
@@ -349,7 +350,7 @@ export interface Issue {
   subProjectUuid?: string;
   tags?: string[];
   textRange?: TextRange;
-  transitions?: string[];
+  transitions: string[];
   type: IssueType;
 }
 
diff --git a/server/sonar-web/src/main/js/apps/issues/components/App.tsx b/server/sonar-web/src/main/js/apps/issues/components/App.tsx
index 580546a000b..cfb4f7bee79 100644
--- a/server/sonar-web/src/main/js/apps/issues/components/App.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/components/App.tsx
@@ -737,7 +737,7 @@ export default class App extends React.PureComponent<Props, State> {
     });
   };
 
-  handleIssueCheck = (issue: string, event: MouseEvent) => {
+  handleIssueCheck = (issue: string, event: { shiftKey?: boolean }) => {
     // Selecting multiple issues with shift+click
     const { lastChecked } = this.state;
     if (event.shiftKey && lastChecked) {
diff --git a/server/sonar-web/src/main/js/apps/issues/components/IssuesList.tsx b/server/sonar-web/src/main/js/apps/issues/components/IssuesList.tsx
index 58eca3237cc..e748494a653 100644
--- a/server/sonar-web/src/main/js/apps/issues/components/IssuesList.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/components/IssuesList.tsx
@@ -29,7 +29,7 @@ interface Props {
   issues: Issue[];
   onFilterChange: (changes: Partial<Query>) => void;
   onIssueChange: (issue: Issue) => void;
-  onIssueCheck: ((issueKey: string, event: Event) => void) | undefined;
+  onIssueCheck: ((issueKey: string, event: { shiftKey?: boolean }) => void) | undefined;
   onIssueClick: (issueKey: string) => void;
   onPopupToggle: (issue: string, popupName: string, open?: boolean) => void;
   openPopup: { issue: string; name: string } | undefined;
diff --git a/server/sonar-web/src/main/js/apps/issues/components/ListItem.tsx b/server/sonar-web/src/main/js/apps/issues/components/ListItem.tsx
index a93601a5176..65cf89e269f 100644
--- a/server/sonar-web/src/main/js/apps/issues/components/ListItem.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/components/ListItem.tsx
@@ -29,7 +29,7 @@ interface Props {
   component: Component | undefined;
   issue: IssueType;
   onChange: (issue: IssueType) => void;
-  onCheck: ((issueKey: string, event: Event) => void) | undefined;
+  onCheck: ((issueKey: string, event: { shiftKey?: boolean }) => void) | undefined;
   onClick: (issueKey: string) => void;
   onFilterChange: (changes: Partial<Query>) => void;
   onPopupToggle: (issue: string, popupName: string, open?: boolean) => void;
diff --git a/server/sonar-web/src/main/js/apps/issues/components/__tests__/BulkChangeModal-test.tsx b/server/sonar-web/src/main/js/apps/issues/components/__tests__/BulkChangeModal-test.tsx
index d6fbe8a5d2d..e6fa64c3464 100644
--- a/server/sonar-web/src/main/js/apps/issues/components/__tests__/BulkChangeModal-test.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/components/__tests__/BulkChangeModal-test.tsx
@@ -36,6 +36,7 @@ it('should display error message when no issues available', async () => {
 it('should display form when issues are present', async () => {
   const wrapper = getWrapper([
     {
+      actions: [],
       component: 'foo',
       componentLongName: 'foo',
       componentQualifier: 'foo',
@@ -55,6 +56,7 @@ it('should display form when issues are present', async () => {
       secondaryLocations: [],
       severity: 'foo',
       status: 'foo',
+      transitions: [],
       type: IssueType.Bug
     }
   ]);
diff --git a/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/ConciseIssue-test.tsx b/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/ConciseIssue-test.tsx
index 7677f2c8b90..094dc233472 100644
--- a/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/ConciseIssue-test.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/ConciseIssue-test.tsx
@@ -20,29 +20,31 @@
 import * as React from 'react';
 import { shallow } from 'enzyme';
 import ConciseIssue from '../ConciseIssue';
-import { IssueType } from '../../../../app/types';
+import { Issue, IssueType } from '../../../../app/types';
 
-const issue = {
+const issue: Issue = {
+  actions: [],
   component: '',
   componentLongName: 'src/file.js',
   componentQualifier: '',
   componentUuid: '',
   creationDate: '',
+  flows: [],
+  fromHotspot: false,
   key: '',
   message: '',
   organization: '',
   project: '',
+  projectKey: '',
   projectName: '',
   projectOrganization: '',
-  projectKey: '',
   rule: '',
   ruleName: '',
+  secondaryLocations: [],
   severity: '',
   status: '',
-  type: IssueType.Bug,
-  secondaryLocations: [],
-  flows: [],
-  fromHotspot: false
+  transitions: [],
+  type: IssueType.Bug
 };
 
 it('should render', () => {
diff --git a/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/__snapshots__/ConciseIssue-test.tsx.snap b/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/__snapshots__/ConciseIssue-test.tsx.snap
index 3041bcc6b35..002ac690399 100644
--- a/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/__snapshots__/ConciseIssue-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/issues/conciseIssuesList/__tests__/__snapshots__/ConciseIssue-test.tsx.snap
@@ -8,6 +8,7 @@ exports[`should render 1`] = `
   <ConciseIssueBox
     issue={
       Object {
+        "actions": Array [],
         "component": "",
         "componentLongName": "src/file.js",
         "componentQualifier": "",
@@ -27,6 +28,7 @@ exports[`should render 1`] = `
         "secondaryLocations": Array [],
         "severity": "",
         "status": "",
+        "transitions": Array [],
         "type": "BUG",
       }
     }
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/actions-test.js.snap b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/actions-test.ts.snap
index 10cb48ebfeb..10cb48ebfeb 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/actions-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/actions-test.ts.snap
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.js.snap b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.ts.snap
index 1bc54255ce1..1bc54255ce1 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/__snapshots__/utils-test.ts.snap
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/actions-test.js b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/actions-test.ts
index 66f345754f2..f8f35a099ab 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/actions-test.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/actions-test.ts
@@ -17,7 +17,6 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
 import * as actions from '../actions';
 import { parseDate } from '../../../helpers/dates';
 
diff --git a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.js b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.ts
index 125badba8bd..1226fbc7a45 100644
--- a/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/__tests__/utils-test.ts
@@ -17,10 +17,20 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
 import * as utils from '../utils';
 import * as dates from '../../../helpers/dates';
 
+jest.mock('../../../helpers/dates', () => {
+  const actual = require.requireActual('../../../helpers/dates');
+  return Object.assign({}, actual, {
+    startOfDay: jest.fn(date => {
+      const startDay = new Date(date);
+      startDay.setUTCHours(0, 0, 0, 0);
+      return startDay;
+    })
+  });
+});
+
 const ANALYSES = [
   {
     key: 'AVyMjlK1HjR_PLDzRbB9',
@@ -78,8 +88,8 @@ const HISTORY = [
 ];
 
 const METRICS = [
-  { key: 'uncovered_lines', name: 'Uncovered Lines', type: 'INT' },
-  { key: 'lines_to_cover', name: 'Line to Cover', type: 'PERCENT' }
+  { id: '1', key: 'uncovered_lines', name: 'Uncovered Lines', type: 'INT' },
+  { id: '2', key: 'lines_to_cover', name: 'Line to Cover', type: 'PERCENT' }
 ];
 
 const QUERY = {
@@ -107,11 +117,6 @@ describe('generateSeries', () => {
 });
 
 describe('getAnalysesByVersionByDay', () => {
-  dates.startOfDay = jest.fn(date => {
-    const startDay = new Date(date);
-    startDay.setUTCHours(0, 0, 0, 0);
-    return startDay;
-  });
   it('should correctly map analysis by versions and by days', () => {
     expect(
       utils.getAnalysesByVersionByDay(ANALYSES, {
@@ -266,6 +271,7 @@ describe('hasHistoryData', () => {
       utils.hasHistoryData([
         {
           name: 'foo',
+          translatedName: 'foo',
           type: 'INT',
           data: [
             { x: dates.parseDate('2017-04-27T08:21:32.000Z'), y: 2 },
@@ -278,11 +284,13 @@ describe('hasHistoryData', () => {
       utils.hasHistoryData([
         {
           name: 'foo',
+          translatedName: 'foo',
           type: 'INT',
           data: []
         },
         {
           name: 'bar',
+          translatedName: 'bar',
           type: 'INT',
           data: [
             { x: dates.parseDate('2017-04-27T08:21:32.000Z'), y: 2 },
@@ -295,6 +303,7 @@ describe('hasHistoryData', () => {
       utils.hasHistoryData([
         {
           name: 'bar',
+          translatedName: 'bar',
           type: 'INT',
           data: [{ x: dates.parseDate('2017-04-27T08:21:32.000Z'), y: 2 }]
         }
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineCode-test.tsx b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineCode-test.tsx
index 9ba8c1ecc56..e50deb1f6ee 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineCode-test.tsx
+++ b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineCode-test.tsx
@@ -23,6 +23,7 @@ import LineCode from '../LineCode';
 import { BranchType, Issue, ShortLivingBranch, IssueType } from '../../../../app/types';
 
 const issueBase: Issue = {
+  actions: [],
   component: '',
   componentLongName: '',
   componentQualifier: '',
@@ -42,6 +43,7 @@ const issueBase: Issue = {
   secondaryLocations: [],
   severity: '',
   status: '',
+  transitions: [],
   type: IssueType.Bug
 };
 
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesIndicator-test.tsx b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesIndicator-test.tsx
index 03551c9c82c..b42dcbfb670 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesIndicator-test.tsx
+++ b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesIndicator-test.tsx
@@ -24,6 +24,7 @@ import LineIssuesIndicator from '../LineIssuesIndicator';
 import { Issue, IssueType } from '../../../../app/types';
 
 const issueBase: Issue = {
+  actions: [],
   component: '',
   componentLongName: '',
   componentQualifier: '',
@@ -43,6 +44,7 @@ const issueBase: Issue = {
   secondaryLocations: [],
   severity: '',
   status: '',
+  transitions: [],
   type: IssueType.Bug
 };
 
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesList-test.tsx b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesList-test.tsx
index 3e1f834af24..5c40c7d813f 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesList-test.tsx
+++ b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/LineIssuesList-test.tsx
@@ -23,6 +23,7 @@ import LineIssuesList from '../LineIssuesList';
 import { Issue, IssueType } from '../../../../app/types';
 
 const issueBase: Issue = {
+  actions: [],
   component: '',
   componentLongName: '',
   componentQualifier: '',
@@ -42,6 +43,7 @@ const issueBase: Issue = {
   secondaryLocations: [],
   severity: '',
   status: '',
+  transitions: [],
   type: IssueType.Bug
 };
 
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineCode-test.tsx.snap b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineCode-test.tsx.snap
index 0e31b6b8405..df5c914a676 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineCode-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineCode-test.tsx.snap
@@ -47,6 +47,7 @@ exports[`render code 1`] = `
     issues={
       Array [
         Object {
+          "actions": Array [],
           "component": "",
           "componentLongName": "",
           "componentQualifier": "",
@@ -66,9 +67,11 @@ exports[`render code 1`] = `
           "secondaryLocations": Array [],
           "severity": "",
           "status": "",
+          "transitions": Array [],
           "type": "BUG",
         },
         Object {
+          "actions": Array [],
           "component": "",
           "componentLongName": "",
           "componentQualifier": "",
@@ -88,6 +91,7 @@ exports[`render code 1`] = `
           "secondaryLocations": Array [],
           "severity": "",
           "status": "",
+          "transitions": Array [],
           "type": "BUG",
         },
       ]
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineIssuesList-test.tsx.snap b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineIssuesList-test.tsx.snap
index 8a7ac40bb32..23005294869 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineIssuesList-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/SourceViewer/components/__tests__/__snapshots__/LineIssuesList-test.tsx.snap
@@ -9,6 +9,7 @@ exports[`render issues list 1`] = `
     displayLocationsLink={true}
     issue={
       Object {
+        "actions": Array [],
         "component": "",
         "componentLongName": "",
         "componentQualifier": "",
@@ -28,6 +29,7 @@ exports[`render issues list 1`] = `
         "secondaryLocations": Array [],
         "severity": "",
         "status": "",
+        "transitions": Array [],
         "type": "BUG",
       }
     }
@@ -42,6 +44,7 @@ exports[`render issues list 1`] = `
     displayLocationsLink={true}
     issue={
       Object {
+        "actions": Array [],
         "component": "",
         "componentLongName": "",
         "componentQualifier": "",
@@ -61,6 +64,7 @@ exports[`render issues list 1`] = `
         "secondaryLocations": Array [],
         "severity": "",
         "status": "",
+        "transitions": Array [],
         "type": "BUG",
       }
     }
diff --git a/server/sonar-web/src/main/js/components/common/SelectList.js b/server/sonar-web/src/main/js/components/common/SelectList.tsx
index 3977dc93645..b568a0bca5b 100644
--- a/server/sonar-web/src/main/js/components/common/SelectList.js
+++ b/server/sonar-web/src/main/js/components/common/SelectList.tsx
@@ -17,37 +17,29 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
-import key from 'keymaster';
+import * as React from 'react';
+import * as key from 'keymaster';
 import { uniqueId } from 'lodash';
 import classNames from 'classnames';
 import SelectListItem from './SelectListItem';
 
-/*::
-type Props = {
-  children?: SelectListItem,
-  className?: string,
-  items: Array<string>,
-  currentItem: string,
-  onSelect: string => void
-};
-*/
-
-/*::
-type State = {
-  active: string
-};
-*/
-
-export default class SelectList extends React.PureComponent {
-  /*:: currentKeyScope: string; */
-  /*:: previousFilter: Function; */
-  /*:: previousKeyScope: string; */
-  /*:: props: Props; */
-  /*:: state: State; */
-
-  constructor(props /*: Props */) {
+interface Props {
+  className?: string;
+  items: string[];
+  currentItem: string;
+  onSelect: (item: string) => void;
+}
+
+interface State {
+  active: string;
+}
+
+export default class SelectList extends React.PureComponent<Props, State> {
+  currentKeyScope?: string;
+  previousFilter?: (event: any) => void;
+  previousKeyScope?: string;
+
+  constructor(props: Props) {
     super(props);
     this.state = {
       active: props.currentItem
@@ -58,12 +50,12 @@ export default class SelectList extends React.PureComponent {
     this.attachShortcuts();
   }
 
-  componentWillReceiveProps(nextProps /*: Props */) {
+  componentDidUpdate(prevProps: Props) {
     if (
-      nextProps.currentItem !== this.props.currentItem &&
-      !nextProps.items.includes(this.state.active)
+      prevProps.currentItem !== this.props.currentItem &&
+      !this.props.items.includes(this.state.active)
     ) {
-      this.setState({ active: nextProps.currentItem });
+      this.setState({ active: this.props.currentItem });
     }
   }
 
@@ -79,8 +71,8 @@ export default class SelectList extends React.PureComponent {
 
     // sometimes there is a *focused* search field next to the SelectList component
     // we need to allow shortcuts in this case, but only for the used keys
-    key.filter = (event /*: KeyboardEvent & { target: HTMLElement } */) => {
-      const tagName = (event.target || event.srcElement).tagName;
+    (key as any).filter = (event: KeyboardEvent & { target: HTMLElement }) => {
+      const { tagName } = event.target || event.srcElement;
       const isInput = tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA';
       return [13, 38, 40].includes(event.keyCode) || !isInput;
     };
@@ -104,20 +96,24 @@ export default class SelectList extends React.PureComponent {
   };
 
   detachShortcuts = () => {
-    key.setScope(this.previousKeyScope);
-    key.deleteScope(this.currentKeyScope);
-    key.filter = this.previousFilter;
+    if (this.previousKeyScope) {
+      key.setScope(this.previousKeyScope);
+    }
+    if (this.currentKeyScope) {
+      key.deleteScope(this.currentKeyScope);
+    }
+    (key as any).filter = this.previousFilter;
   };
 
-  handleSelect = (item /*: string */) => {
+  handleSelect = (item: string) => {
     this.props.onSelect(item);
   };
 
-  handleHover = (item /*: string */) => {
+  handleHover = (item: string) => {
     this.setState({ active: item });
   };
 
-  selectNextElement = (state /*: State */, props /*: Props */) => {
+  selectNextElement = (state: State, props: Props) => {
     const idx = props.items.indexOf(state.active);
     if (idx < 0) {
       return { active: props.items[0] };
@@ -125,7 +121,7 @@ export default class SelectList extends React.PureComponent {
     return { active: props.items[(idx + 1) % props.items.length] };
   };
 
-  selectPreviousElement = (state /*: State */, props /*: Props */) => {
+  selectPreviousElement = (state: State, props: Props) => {
     const idx = props.items.indexOf(state.active);
     if (idx <= 0) {
       return { active: props.items[props.items.length - 1] };
@@ -133,7 +129,7 @@ export default class SelectList extends React.PureComponent {
     return { active: props.items[idx - 1] };
   };
 
-  renderChild = (child /*: Object */) => {
+  renderChild = (child: any) => {
     if (child == null) {
       return null;
     }
diff --git a/server/sonar-web/src/main/js/components/common/SelectListItem.js b/server/sonar-web/src/main/js/components/common/SelectListItem.tsx
index 6e2ec4d6646..db8fff73c25 100644
--- a/server/sonar-web/src/main/js/components/common/SelectListItem.js
+++ b/server/sonar-web/src/main/js/components/common/SelectListItem.tsx
@@ -17,27 +17,21 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import classNames from 'classnames';
 import Tooltip from '../controls/Tooltip';
 
-/*::
-type Props = {
-  active?: string,
-  children?: React.Element<*>,
-  item: string,
-  onSelect?: string => void,
-  onHover?: string => void,
-  title?: string
-};
-*/
-
-export default class SelectListItem extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  active?: string;
+  item: string;
+  onHover?: (item: string) => void;
+  onSelect?: (item: string) => void;
+  title?: string;
+}
 
-  handleSelect = (evt /*: SyntheticInputEvent */) => {
-    evt.preventDefault();
+export default class SelectListItem extends React.PureComponent<Props> {
+  handleSelect = (event: React.MouseEvent) => {
+    event.preventDefault();
     if (this.props.onSelect) {
       this.props.onSelect(this.props.item);
     }
@@ -50,10 +44,7 @@ export default class SelectListItem extends React.PureComponent {
   };
 
   renderLink() {
-    let children = this.props.item;
-    if (this.props.children) {
-      children = this.props.children;
-    }
+    const children = this.props.children || this.props.item;
     return (
       <li>
         <a
diff --git a/server/sonar-web/src/main/js/components/common/__tests__/SelectList-test.js b/server/sonar-web/src/main/js/components/common/__tests__/SelectList-test.tsx
index 29832878a31..3d846538ca1 100644
--- a/server/sonar-web/src/main/js/components/common/__tests__/SelectList-test.js
+++ b/server/sonar-web/src/main/js/components/common/__tests__/SelectList-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow, mount } from 'enzyme';
-import React from 'react';
 import SelectList from '../SelectList';
 import SelectListItem from '../SelectListItem';
 import { click, keydown } from '../../../helpers/testUtils';
diff --git a/server/sonar-web/src/main/js/components/common/__tests__/SelectListItem-test.js b/server/sonar-web/src/main/js/components/common/__tests__/SelectListItem-test.tsx
index 28d51a86363..d52a301d719 100644
--- a/server/sonar-web/src/main/js/components/common/__tests__/SelectListItem-test.js
+++ b/server/sonar-web/src/main/js/components/common/__tests__/SelectListItem-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import SelectListItem from '../SelectListItem';
 
 it('should render correctly without children', () => {
diff --git a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectList-test.js.snap b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectList-test.tsx.snap
index c1c91a2ba8e..c1c91a2ba8e 100644
--- a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectList-test.js.snap
+++ b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectList-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectListItem-test.js.snap b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectListItem-test.tsx.snap
index 09632d1a13d..09632d1a13d 100644
--- a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectListItem-test.js.snap
+++ b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/SelectListItem-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/Issue.d.ts b/server/sonar-web/src/main/js/components/issue/Issue.d.ts
deleted file mode 100644
index 389a01a09a2..00000000000
--- a/server/sonar-web/src/main/js/components/issue/Issue.d.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2018 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.
- */
-import * as React from 'react';
-import { BranchLike, Issue as IssueType } from '../../app/types';
-
-interface IssueProps {
-  branchLike?: BranchLike;
-  checked?: boolean;
-  displayLocationsCount?: boolean;
-  displayLocationsLink?: boolean;
-  issue: IssueType;
-  onChange: (issue: IssueType) => void;
-  onCheck?: (issueKey: string, event: Event) => void;
-  onClick: (issueKey: string) => void;
-  onFilter?: (property: string, issue: IssueType) => void;
-  onPopupToggle: (issue: string, popupName: string, open?: boolean) => void;
-  openPopup?: string;
-  selected: boolean;
-}
-
-export default class Issue extends React.PureComponent<IssueProps> {}
diff --git a/server/sonar-web/src/main/js/components/issue/Issue.js b/server/sonar-web/src/main/js/components/issue/Issue.tsx
index 3562a3c6bad..e08b886fff2 100644
--- a/server/sonar-web/src/main/js/components/issue/Issue.js
+++ b/server/sonar-web/src/main/js/components/issue/Issue.tsx
@@ -17,40 +17,30 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
-import key from 'keymaster';
-import PropTypes from 'prop-types';
+import * as React from 'react';
+import * as key from 'keymaster';
 import IssueView from './IssueView';
 import { updateIssue } from './actions';
 import { setIssueAssignee } from '../../api/issues';
-/*:: import type { Issue as IssueType } from './types'; */
+import { BranchLike, Issue as IssueType } from '../../app/types';
 import './Issue.css';
 
-/*::
-type Props = {|
-  branchLike?: { id?: string; name: string },
-  checked?: boolean,
+interface Props {
+  branchLike?: BranchLike;
+  checked?: boolean;
   displayLocationsCount?: boolean;
   displayLocationsLink?: boolean;
-  issue: IssueType,
-  onChange: IssueType => void,
-  onCheck?: (issue: string, event: Event) => void,
-  onClick: string => void,
-  onFilter?: (property: string, issue: IssueType) => void,
-  onPopupToggle: (issue: string, popupName: string, open: ?boolean) => void,
-  openPopup: ?string,
-  selected: boolean
-|};
-*/
-
-export default class Issue extends React.PureComponent {
-  /*:: props: Props; */
-
-  static contextTypes = {
-    store: PropTypes.object
-  };
+  issue: IssueType;
+  onChange: (issue: IssueType) => void;
+  onCheck?: (issue: string, event: { shiftKey?: boolean }) => void;
+  onClick: (issueKey: string) => void;
+  onFilter?: (property: string, issue: IssueType) => void;
+  onPopupToggle: (issue: string, popupName: string, open?: boolean) => void;
+  openPopup?: string;
+  selected: boolean;
+}
 
+export default class Issue extends React.PureComponent<Props> {
   static defaultProps = {
     displayLocationsCount: true,
     displayLocationsLink: true,
@@ -63,13 +53,13 @@ export default class Issue extends React.PureComponent {
     }
   }
 
-  componentWillUpdate(nextProps /*: Props */) {
+  componentWillUpdate(nextProps: Props) {
     if (!nextProps.selected && this.props.selected) {
       this.unbindShortcuts();
     }
   }
 
-  componentDidUpdate(prevProps /*: Props */) {
+  componentDidUpdate(prevProps: Props) {
     if (!prevProps.selected && this.props.selected) {
       this.bindShortcuts();
     }
@@ -108,7 +98,7 @@ export default class Issue extends React.PureComponent {
       this.togglePopup('edit-tags');
       return false;
     });
-    key('space', 'issues', (event /*: Event*/) => {
+    key('space', 'issues', (event: KeyboardEvent) => {
       if (this.props.onCheck) {
         this.props.onCheck(this.props.issue.key, event);
         return false;
@@ -127,11 +117,11 @@ export default class Issue extends React.PureComponent {
     key.unbind('t', 'issues');
   }
 
-  togglePopup = (popupName /*: string */, open /*: ?boolean */) => {
+  togglePopup = (popupName: string, open?: boolean) => {
     this.props.onPopupToggle(this.props.issue.key, popupName, open);
   };
 
-  handleAssignement = (login /*: string */) => {
+  handleAssignement = (login: string) => {
     const { issue } = this.props;
     if (issue.assignee !== login) {
       updateIssue(this.props.onChange, setIssueAssignee({ issue: issue.key, assignee: login }));
diff --git a/server/sonar-web/src/main/js/components/issue/IssueView.js b/server/sonar-web/src/main/js/components/issue/IssueView.tsx
index fbb2ac1e259..932d51a9176 100644
--- a/server/sonar-web/src/main/js/components/issue/IssueView.js
+++ b/server/sonar-web/src/main/js/components/issue/IssueView.tsx
@@ -17,56 +17,51 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import classNames from 'classnames';
 import IssueTitleBar from './components/IssueTitleBar';
 import IssueActionsBar from './components/IssueActionsBar';
 import IssueCommentLine from './components/IssueCommentLine';
 import { updateIssue } from './actions';
 import { deleteIssueComment, editIssueComment } from '../../api/issues';
-/*:: import type { Issue } from './types'; */
+import { Issue, BranchLike } from '../../app/types';
 
-/*::
-type Props = {|
-  branchLike?: { id?: string; name: string },
-  checked?: boolean,
-  currentPopup: ?string,
+interface Props {
+  branchLike?: BranchLike;
+  checked?: boolean;
+  currentPopup?: string;
   displayLocationsCount?: boolean;
   displayLocationsLink?: boolean;
-  issue: Issue,
-  onAssign: string => void,
-  onChange: Issue => void,
-  onCheck?: (issue: string, event: Event) => void,
-  onClick: string => void,
-  onFilter?: (property: string, issue: Issue) => void,
-  selected: boolean,
-  togglePopup: (string, boolean | void) => void
-|};
-*/
-
-export default class IssueView extends React.PureComponent {
-  /*:: props: Props; */
+  issue: Issue;
+  onAssign: (login: string) => void;
+  onChange: (issue: Issue) => void;
+  onCheck?: (issue: string, event: { shiftKey?: boolean }) => void;
+  onClick: (issueKey: string) => void;
+  onFilter?: (property: string, issue: Issue) => void;
+  selected: boolean;
+  togglePopup: (popup: string, show: boolean | void) => void;
+}
 
-  handleCheck = (event /*: Event */) => {
+export default class IssueView extends React.PureComponent<Props> {
+  handleCheck = (event: React.MouseEvent) => {
     event.preventDefault();
     if (this.props.onCheck) {
       this.props.onCheck(this.props.issue.key, event);
     }
   };
 
-  handleClick = (event /*: Event & { target: HTMLElement } */) => {
-    if (!isClickable(event.target) && this.props.onClick) {
+  handleClick = (event: React.MouseEvent) => {
+    if (!isClickable(event.target as HTMLElement) && this.props.onClick) {
       event.preventDefault();
       this.props.onClick(this.props.issue.key);
     }
   };
 
-  editComment = (comment /*: string */, text /*: string */) => {
+  editComment = (comment: string, text: string) => {
     updateIssue(this.props.onChange, editIssueComment({ comment, text }));
   };
 
-  deleteComment = (comment /*: string */) => {
+  deleteComment = (comment: string) => {
     updateIssue(this.props.onChange, deleteIssueComment({ comment }));
   };
 
@@ -130,11 +125,11 @@ export default class IssueView extends React.PureComponent {
   }
 }
 
-function isClickable(node /*: any */) {
+function isClickable(node: HTMLElement | undefined | null): boolean {
   if (!node) {
     return false;
   }
   const clickableTags = ['A', 'BUTTON', 'INPUT', 'TEXTAREA'];
   const tagName = (node.tagName || '').toUpperCase();
-  return clickableTags.includes(tagName) || isClickable(node.parentNode);
+  return clickableTags.includes(tagName) || isClickable(node.parentElement);
 }
diff --git a/server/sonar-web/src/main/js/components/issue/actions.js b/server/sonar-web/src/main/js/components/issue/actions.ts
index 567b731c0bb..763c3b2baca 100644
--- a/server/sonar-web/src/main/js/components/issue/actions.js
+++ b/server/sonar-web/src/main/js/components/issue/actions.ts
@@ -17,20 +17,19 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
 import { parseIssueFromResponse } from '../../helpers/issues';
-/*:: import type { Issue } from './types'; */
+import { Issue } from '../../app/types';
+import { IssueResponse } from '../../api/issues';
 
 export const updateIssue = (
-  onChange /*: Issue => void */,
-  resultPromise /*: Promise<*> */,
-  oldIssue /*: ?Issue */,
-  newIssue /*: ?Issue */
+  onChange: (issue: Issue) => void,
+  resultPromise: Promise<IssueResponse>,
+  oldIssue?: Issue,
+  newIssue?: Issue
 ) => {
-  const optimisticUpdate = oldIssue != null && newIssue != null;
+  const optimisticUpdate = oldIssue !== undefined && newIssue !== undefined;
   if (optimisticUpdate) {
-    // $FlowFixMe `newIssue` is not null, because `optimisticUpdate` is true
-    onChange(newIssue);
+    onChange(newIssue!);
   }
 
   resultPromise.then(
@@ -45,10 +44,9 @@ export const updateIssue = (
         onChange(issue);
       }
     },
-    error => {
+    () => {
       if (optimisticUpdate) {
-        // $FlowFixMe `oldIssue` is not null, because `optimisticUpdate` is true
-        onChange(oldIssue);
+        onChange(oldIssue!);
       }
     }
   );
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.js b/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.tsx
index 7167a3a87e2..ae74f0131f9 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueActionsBar.tsx
@@ -17,8 +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.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import IssueAssign from './IssueAssign';
 import IssueCommentAction from './IssueCommentAction';
 import IssueSeverity from './IssueSeverity';
@@ -26,37 +25,33 @@ import IssueTags from './IssueTags';
 import IssueTransition from './IssueTransition';
 import IssueType from './IssueType';
 import { updateIssue } from '../actions';
-import { IssueType as IssueTypes } from '../../../app/types';
+import { IssueType as IssueTypes, Issue } from '../../../app/types';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
-/*:: import type { Issue } from '../types'; */
+import { RawQuery } from '../../../helpers/query';
+import { IssueResponse } from '../../../api/issues';
 
-/*::
-type Props = {
-  issue: Issue,
-  currentPopup: ?string,
-  onAssign: string => void,
-  onChange: Issue => void,
-  togglePopup: (string, boolean | void) => void
-};
-*/
+interface Props {
+  issue: Issue;
+  currentPopup?: string;
+  onAssign: (login: string) => void;
+  onChange: (issue: Issue) => void;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-/*::
-type State = {
-  commentPlaceholder: string
-};
-*/
+interface State {
+  commentPlaceholder: string;
+}
 
-export default class IssueActionsBar extends React.PureComponent {
-  /*:: props: Props; */
-  state /*: State */ = {
+export default class IssueActionsBar extends React.PureComponent<Props, State> {
+  state: State = {
     commentPlaceholder: ''
   };
 
   setIssueProperty = (
-    property /*: string */,
-    popup /*: string */,
-    apiCall /*: Object => Promise<*> */,
-    value /*: string */
+    property: keyof Issue,
+    popup: string,
+    apiCall: (query: RawQuery) => Promise<IssueResponse>,
+    value: string
   ) => {
     const { issue } = this.props;
     if (issue[property] !== value) {
@@ -71,12 +66,12 @@ export default class IssueActionsBar extends React.PureComponent {
     this.props.togglePopup(popup, false);
   };
 
-  toggleComment = (open /*: boolean | void */, placeholder /*: string | void */) => {
+  toggleComment = (open: boolean | undefined, placeholder: string | undefined) => {
     this.setState({ commentPlaceholder: placeholder || '' });
     this.props.togglePopup('comment', open);
   };
 
-  handleTransition = (issue /*: Issue */) => {
+  handleTransition = (issue: Issue) => {
     this.props.onChange(issue);
     if (
       issue.resolution === 'FALSE-POSITIVE' ||
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueAssign.js b/server/sonar-web/src/main/js/components/issue/components/IssueAssign.tsx
index 355b0effbdc..34072ed3d2c 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueAssign.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueAssign.tsx
@@ -17,30 +17,25 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import SetAssigneePopup from '../popups/SetAssigneePopup';
 import Avatar from '../../ui/Avatar';
 import Toggler from '../../controls/Toggler';
 import DropdownIcon from '../../icons-components/DropdownIcon';
 import { Button } from '../../ui/buttons';
 import { translate } from '../../../helpers/l10n';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Props = {
-  isOpen: boolean,
-  issue: Issue,
-  canAssign: boolean,
-  onAssign: string => void,
-  togglePopup: (string, boolean | void) => void
-};
-*/
-
-export default class IssueAssign extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  isOpen: boolean;
+  issue: Pick<Issue, 'assignee' | 'assigneeAvatar' | 'assigneeName' | 'projectOrganization'>;
+  canAssign: boolean;
+  onAssign: (login: string) => void;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-  toggleAssign = (open /*: boolean | void */) => {
+export default class IssueAssign extends React.PureComponent<Props> {
+  toggleAssign = (open?: boolean) => {
     this.props.togglePopup('assign', open);
   };
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.js b/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.tsx
index d071ce91c74..19e8b1a3ca5 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueChangelog.tsx
@@ -17,8 +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.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import ChangelogPopup from '../popups/ChangelogPopup';
 import DropdownIcon from '../../icons-components/DropdownIcon';
 import DateFromNow from '../../intl/DateFromNow';
@@ -26,21 +25,17 @@ import DateTimeFormatter from '../../intl/DateTimeFormatter';
 import Toggler from '../../controls/Toggler';
 import Tooltip from '../../controls/Tooltip';
 import { Button } from '../../ui/buttons';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Props = {
-  isOpen: boolean,
-  issue: Issue,
-  creationDate: string,
-  togglePopup: (string, boolean | void) => void
-};
-*/
-
-export default class IssueChangelog extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  isOpen: boolean;
+  issue: Pick<Issue, 'author' | 'creationDate' | 'key'>;
+  creationDate: string;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-  toggleChangelog = (open /*: boolean | void */) => {
+export default class IssueChangelog extends React.PureComponent<Props> {
+  toggleChangelog = (open?: boolean) => {
     this.props.togglePopup('changelog', open);
   };
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueChangelogDiff.js b/server/sonar-web/src/main/js/components/issue/components/IssueChangelogDiff.tsx
index f8a9ef5f925..1700b90ba3b 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueChangelogDiff.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueChangelogDiff.tsx
@@ -17,21 +17,21 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { formatMeasure } from '../../../helpers/measures';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
 
-/*::
-export type ChangelogDiff = {
-  key: string,
-  oldValue?: string,
-  newValue?: string
-};
-*/
+export interface ChangelogDiff {
+  key: string;
+  newValue?: string;
+  oldValue?: string;
+}
+
+interface Props {
+  diff: ChangelogDiff;
+}
 
-export default function IssueChangelogDiff(props /*: { diff: ChangelogDiff } */) {
-  const { diff } = props;
+export default function IssueChangelogDiff({ diff }: Props) {
   if (diff.key === 'file') {
     return (
       <p>
@@ -42,8 +42,7 @@ export default function IssueChangelogDiff(props /*: { diff: ChangelogDiff } */)
         )}
       </p>
     );
-  }
-  if (diff.key === 'from_long_branch') {
+  } else if (diff.key === 'from_long_branch') {
     return (
       <p>
         {translateWithParameters(
@@ -53,8 +52,7 @@ export default function IssueChangelogDiff(props /*: { diff: ChangelogDiff } */)
         )}
       </p>
     );
-  }
-  if (diff.key === 'from_short_branch') {
+  } else if (diff.key === 'from_short_branch') {
     return (
       <p>
         {translateWithParameters(
@@ -68,7 +66,7 @@ export default function IssueChangelogDiff(props /*: { diff: ChangelogDiff } */)
 
   let message;
   if (diff.newValue != null) {
-    let newValue /*: string */ = diff.newValue;
+    let { newValue } = diff;
     if (diff.key === 'effort') {
       newValue = formatMeasure(diff.newValue, 'WORK_DUR');
     }
@@ -85,7 +83,7 @@ export default function IssueChangelogDiff(props /*: { diff: ChangelogDiff } */)
   }
 
   if (diff.oldValue != null) {
-    let oldValue /*: string */ = diff.oldValue;
+    let { oldValue } = diff;
     if (diff.key === 'effort') {
       oldValue = formatMeasure(diff.oldValue, 'WORK_DUR');
     }
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueCommentAction.js b/server/sonar-web/src/main/js/components/issue/components/IssueCommentAction.tsx
index f40031e0aaf..950c88e89ae 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueCommentAction.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueCommentAction.tsx
@@ -17,30 +17,25 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { updateIssue } from '../actions';
 import Toggler from '../../controls/Toggler';
 import { Button } from '../../ui/buttons';
 import CommentPopup from '../popups/CommentPopup';
 import { addIssueComment } from '../../../api/issues';
 import { translate } from '../../../helpers/l10n';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Props = {|
-  commentPlaceholder: string,
-  currentPopup: ?string,
-  issueKey: string,
-  onChange: Issue => void,
-  toggleComment: (open?: boolean, placeholder?: string) => void
-|};
-*/
-
-export default class IssueCommentAction extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  commentPlaceholder: string;
+  currentPopup?: string;
+  issueKey: string;
+  onChange: (issue: Issue) => void;
+  toggleComment: (open?: boolean, placeholder?: string) => void;
+}
 
-  addComment = (text /*: string */) => {
+export default class IssueCommentAction extends React.PureComponent<Props> {
+  addComment = (text: string) => {
     updateIssue(this.props.onChange, addIssueComment({ issue: this.props.issueKey, text }));
     this.props.toggleComment(false);
   };
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.js b/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.tsx
index 417f4294609..ce516d1775a 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.tsx
@@ -17,38 +17,31 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import Avatar from '../../ui/Avatar';
 import Toggler from '../../controls/Toggler';
-import EditIcon from '../../icons-components/EditIcon';
 import { EditButton, DeleteButton } from '../../ui/buttons';
 import CommentDeletePopup from '../popups/CommentDeletePopup';
 import CommentPopup from '../popups/CommentPopup';
 import DateFromNow from '../../intl/DateFromNow';
-/*:: import type { IssueComment } from '../types'; */
+import { IssueComment } from '../../../app/types';
 
-/*::
-type Props = {
-  comment: IssueComment,
-  onDelete: string => void,
-  onEdit: (string, string) => void
-};
-*/
+interface Props {
+  comment: IssueComment;
+  onDelete: (comment: string) => void;
+  onEdit: (comment: string, text: string) => void;
+}
 
-/*::
-type State = {
-  openPopup: string
-};
-*/
+interface State {
+  openPopup: string;
+}
 
-export default class IssueCommentLine extends React.PureComponent {
-  /*:: props: Props; */
-  state /*: State */ = {
+export default class IssueCommentLine extends React.PureComponent<Props, State> {
+  state: State = {
     openPopup: ''
   };
 
-  handleEdit = (text /*: string */) => {
+  handleEdit = (text: string) => {
     this.props.onEdit(this.props.comment.key, text);
     this.toggleEditPopup(false);
   };
@@ -58,8 +51,8 @@ export default class IssueCommentLine extends React.PureComponent {
     this.toggleDeletePopup(false);
   };
 
-  togglePopup = (popupName /*: string */, force /*: ?boolean */) => {
-    this.setState((prevState /*: State */) => {
+  togglePopup = (popupName: string, force?: boolean) => {
+    this.setState(prevState => {
       if (prevState.openPopup !== popupName && force !== false) {
         return { openPopup: popupName };
       } else if (prevState.openPopup === popupName && force !== true) {
@@ -69,11 +62,11 @@ export default class IssueCommentLine extends React.PureComponent {
     });
   };
 
-  toggleDeletePopup = (force /*: ?boolean */) => {
+  toggleDeletePopup = (force?: boolean) => {
     this.togglePopup('delete', force);
   };
 
-  toggleEditPopup = (force /*: ?boolean */) => {
+  toggleEditPopup = (force?: boolean) => {
     this.togglePopup('edit', force);
   };
 
@@ -105,7 +98,6 @@ export default class IssueCommentLine extends React.PureComponent {
           {comment.updatable && (
             <div className="dropdown">
               <Toggler
-                className="display-inline-block"
                 onRequestClose={this.closePopups}
                 open={this.state.openPopup === 'edit'}
                 overlay={
@@ -126,7 +118,6 @@ export default class IssueCommentLine extends React.PureComponent {
           {comment.updatable && (
             <div className="dropdown">
               <Toggler
-                className="display-inline-block"
                 onRequestClose={this.closePopups}
                 open={this.state.openPopup === 'delete'}
                 overlay={<CommentDeletePopup onDelete={this.handleDelete} />}>
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueMessage.js b/server/sonar-web/src/main/js/components/issue/components/IssueMessage.tsx
index 6b20d3e9246..226a6547d5f 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueMessage.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueMessage.tsx
@@ -17,26 +17,26 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
-import PropTypes from 'prop-types';
+import * as React from 'react';
 import EllipsisIcon from '../../icons-components/EllipsisIcon';
 import Tooltip from '../../controls/Tooltip';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
 import { Button } from '../../ui/buttons';
+import { WorkspaceContext } from '../../workspace/context';
 
-export default class IssueMessage extends React.PureComponent {
-  /*:: props: {
-    engine?: string,
-    manualVulnerability: boolean,
-    message: string,
-    organization: string,
-    rule: string
-  };
-  */
+interface Props {
+  engine?: string;
+  manualVulnerability: boolean;
+  message: string;
+  organization: string;
+  rule: string;
+}
+
+export default class IssueMessage extends React.PureComponent<Props> {
+  context!: { workspace: WorkspaceContext };
 
   static contextTypes = {
-    workspace: PropTypes.object.isRequired
+    workspace: () => null
   };
 
   handleClick = () => {
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueSeverity.js b/server/sonar-web/src/main/js/components/issue/components/IssueSeverity.tsx
index 3541f276c9b..3913c36af51 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueSeverity.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueSeverity.tsx
@@ -17,34 +17,35 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import SetSeverityPopup from '../popups/SetSeverityPopup';
-import { setIssueSeverity } from '../../../api/issues';
+import { setIssueSeverity, IssueResponse } from '../../../api/issues';
 import Toggler from '../../controls/Toggler';
 import DropdownIcon from '../../icons-components/DropdownIcon';
 import SeverityHelper from '../../shared/SeverityHelper';
 import { Button } from '../../ui/buttons';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
+import { RawQuery } from '../../../helpers/query';
 
-/*::
-type Props = {
-  canSetSeverity: boolean,
-  isOpen: boolean,
-  issue: Issue,
-  setIssueProperty: (string, string, apiCall: (Object) => Promise<*>, string) => void,
-  togglePopup: (string, boolean | void) => void
-};
-*/
-
-export default class IssueSeverity extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  canSetSeverity: boolean;
+  isOpen: boolean;
+  issue: Pick<Issue, 'severity'>;
+  setIssueProperty: (
+    property: keyof Issue,
+    popup: string,
+    apiCall: (query: RawQuery) => Promise<IssueResponse>,
+    value: string
+  ) => void;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-  toggleSetSeverity = (open /*: boolean | void */) => {
+export default class IssueSeverity extends React.PureComponent<Props> {
+  toggleSetSeverity = (open?: boolean) => {
     this.props.togglePopup('set-severity', open);
   };
 
-  setSeverity = (severity /*: string */) => {
+  setSeverity = (severity: string) => {
     this.props.setIssueProperty('severity', 'set-severity', setIssueSeverity, severity);
   };
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueTags.js b/server/sonar-web/src/main/js/components/issue/components/IssueTags.tsx
index 868126e4d7d..c0b8cb68f40 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueTags.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueTags.tsx
@@ -17,8 +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.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { updateIssue } from '../actions';
 import SetIssueTagsPopup from '../popups/SetIssueTagsPopup';
 import { setIssueTags } from '../../../api/issues';
@@ -26,33 +25,29 @@ import Toggler from '../../controls/Toggler';
 import TagsList from '../../tags/TagsList';
 import { Button } from '../../ui/buttons';
 import { translate } from '../../../helpers/l10n';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Props = {|
-  canSetTags: boolean,
-  isOpen: boolean,
-  issue: Issue,
-  onChange: Issue => void,
-  togglePopup: (string, boolean | void) => void
-|};
-*/
-
-export default class IssueTags extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  canSetTags: boolean;
+  isOpen: boolean;
+  issue: Pick<Issue, 'key' | 'projectOrganization' | 'tags'>;
+  onChange: (issue: Issue) => void;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-  toggleSetTags = (open /*: boolean | void */) => {
+export default class IssueTags extends React.PureComponent<Props> {
+  toggleSetTags = (open?: boolean) => {
     this.props.togglePopup('edit-tags', open);
   };
 
-  setTags = (tags /*: Array<string> */) => {
+  setTags = (tags: string[]) => {
     const { issue } = this.props;
     const newIssue = { ...issue, tags };
     updateIssue(
       this.props.onChange,
       setIssueTags({ issue: issue.key, tags: tags.join(',') }),
-      issue,
-      newIssue
+      issue as Issue,
+      newIssue as Issue
     );
   };
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.js b/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.tsx
index 245240c46c5..11a869003e9 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueTitleBar.tsx
@@ -17,8 +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.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { Link } from 'react-router';
 import IssueChangelog from './IssueChangelog';
 import IssueMessage from './IssueMessage';
@@ -30,22 +29,19 @@ import { getBranchLikeQuery } from '../../../helpers/branches';
 import { getComponentIssuesUrl } from '../../../helpers/urls';
 import { formatMeasure } from '../../../helpers/measures';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
-import { IssueType } from '../../../app/types';
-/*:: import type { Issue } from '../types'; */
+import { IssueType, BranchLike, Issue } from '../../../app/types';
 
-/*::
-type Props = {|
-  branchLike?: { id?: string; name: string },
-  currentPopup: ?string,
+interface Props {
+  branchLike?: BranchLike;
+  currentPopup?: string;
   displayLocationsCount?: boolean;
   displayLocationsLink?: boolean;
-  issue: Issue,
-  onFilter?: (property: string, issue: Issue) => void,
-  togglePopup: (string, boolean | void) => void
-|};
-*/
+  issue: Issue;
+  onFilter?: (property: string, issue: Issue) => void;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-export default function IssueTitleBar(props /*: Props */) {
+export default function IssueTitleBar(props: Props) {
   const { issue } = props;
   const hasSimilarIssuesFilter = props.onFilter != null;
 
@@ -57,7 +53,7 @@ export default function IssueTitleBar(props /*: Props */) {
     <Tooltip
       overlay={translateWithParameters(
         'issue.this_issue_involves_x_code_locations',
-        formatMeasure(locationsCount)
+        formatMeasure(locationsCount, 'INT')
       )}>
       <LocationIndex>{locationsCount}</LocationIndex>
     </Tooltip>
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueTransition.js b/server/sonar-web/src/main/js/components/issue/components/IssueTransition.tsx
index f57008c6691..1bb4bde8f59 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueTransition.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueTransition.tsx
@@ -17,8 +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.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { updateIssue } from '../actions';
 import SetTransitionPopup from '../popups/SetTransitionPopup';
 import { setIssueTransition } from '../../../api/issues';
@@ -26,22 +25,18 @@ import Toggler from '../../controls/Toggler';
 import DropdownIcon from '../../icons-components/DropdownIcon';
 import StatusHelper from '../../shared/StatusHelper';
 import { Button } from '../../ui/buttons';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Props = {
-  hasTransitions: boolean,
-  isOpen: boolean,
-  issue: Issue,
-  onChange: Issue => void,
-  togglePopup: (string, boolean | void) => void
-};
-*/
-
-export default class IssueTransition extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  hasTransitions: boolean;
+  isOpen: boolean;
+  issue: Pick<Issue, 'key' | 'resolution' | 'status' | 'transitions'>;
+  onChange: (issue: Issue) => void;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-  setTransition = (transition /*: string */) => {
+export default class IssueTransition extends React.PureComponent<Props> {
+  setTransition = (transition: string) => {
     updateIssue(
       this.props.onChange,
       setIssueTransition({ issue: this.props.issue.key, transition })
@@ -49,7 +44,7 @@ export default class IssueTransition extends React.PureComponent {
     this.toggleSetTransition();
   };
 
-  toggleSetTransition = (open /*: boolean | void */) => {
+  toggleSetTransition = (open?: boolean) => {
     this.props.togglePopup('transition', open);
   };
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueType.js b/server/sonar-web/src/main/js/components/issue/components/IssueType.tsx
index dffc6245a69..6d38647517a 100644
--- a/server/sonar-web/src/main/js/components/issue/components/IssueType.js
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueType.tsx
@@ -17,35 +17,36 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import SetTypePopup from '../popups/SetTypePopup';
-import { setIssueType } from '../../../api/issues';
+import { setIssueType, IssueResponse } from '../../../api/issues';
 import Toggler from '../../controls/Toggler';
 import DropdownIcon from '../../icons-components/DropdownIcon';
 import { Button } from '../../ui/buttons';
 import IssueTypeIcon from '../../ui/IssueTypeIcon';
 import { translate } from '../../../helpers/l10n';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
+import { RawQuery } from '../../../helpers/query';
 
-/*::
-type Props = {
-  canSetType: boolean,
-  isOpen: boolean,
-  issue: Issue,
-  setIssueProperty: (string, string, apiCall: (Object) => Promise<*>, string) => void,
-  togglePopup: (string, boolean | void) => void
-};
-*/
-
-export default class IssueType extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  canSetType: boolean;
+  isOpen: boolean;
+  issue: Pick<Issue, 'type'>;
+  setIssueProperty: (
+    property: keyof Issue,
+    popup: string,
+    apiCall: (query: RawQuery) => Promise<IssueResponse>,
+    value: string
+  ) => void;
+  togglePopup: (popup: string, show?: boolean) => void;
+}
 
-  toggleSetType = (open /*: boolean | void */) => {
+export default class IssueType extends React.PureComponent<Props> {
+  toggleSetType = (open?: boolean) => {
     this.props.togglePopup('set-type', open);
   };
 
-  setType = (type /*: string */) => {
+  setType = (type: string) => {
     this.props.setIssueProperty('type', 'set-type', setIssueType, type);
   };
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.js b/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.tsx
index a47d9fad24e..2af9d3a8ff3 100644
--- a/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.js
+++ b/server/sonar-web/src/main/js/components/issue/components/SimilarIssuesFilter.tsx
@@ -17,39 +17,31 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import SimilarIssuesPopup from '../popups/SimilarIssuesPopup';
 import Toggler from '../../controls/Toggler';
 import DropdownIcon from '../../icons-components/DropdownIcon';
 import FilterIcon from '../../icons-components/FilterIcon';
 import { Button } from '../../ui/buttons';
 import { translate } from '../../../helpers/l10n';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Props = {|
-  isOpen: boolean,
-  issue: Issue,
-  togglePopup: (string, boolean | void) => void,
-  onFilter: (property: string, issue: Issue) => void
-|};
-*/
-
-export default class SimilarIssuesFilter extends React.PureComponent {
-  /*:: props: Props; */
-
-  handleClick = (evt /*: SyntheticInputEvent */) => {
-    evt.preventDefault();
-    this.togglePopup();
-  };
+interface Props {
+  isOpen: boolean;
+  issue: Issue;
+  togglePopup: (popup: string, show?: boolean) => void;
+  onFilter?: (property: string, issue: Issue) => void;
+}
 
-  handleFilter = (property /*: string */, issue /*: Issue */) => {
+export default class SimilarIssuesFilter extends React.PureComponent<Props> {
+  handleFilter = (property: string, issue: Issue) => {
     this.togglePopup(false);
-    this.props.onFilter(property, issue);
+    if (this.props.onFilter) {
+      this.props.onFilter(property, issue);
+    }
   };
 
-  togglePopup = (open /*: boolean | void */) => {
+  togglePopup = (open?: boolean) => {
     this.props.togglePopup('similarIssues', open);
   };
 
@@ -67,7 +59,7 @@ export default class SimilarIssuesFilter extends React.PureComponent {
           <Button
             aria-label={translate('issue.filter_similar_issues')}
             className="js-issue-filter button-link issue-action issue-action-with-options"
-            onClick={this.handleClick}
+            onClick={this.togglePopup}
             title={translate('issue.filter_similar_issues')}>
             <FilterIcon className="icon-half-transparent" />
             <DropdownIcon className="icon-half-transparent" />
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueAssign-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueAssign-test.tsx
index b426640ed31..ceea6ee5565 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueAssign-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueAssign-test.tsx
@@ -17,15 +17,16 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueAssign from '../IssueAssign';
 import { click } from '../../../../helpers/testUtils';
 
 const issue = {
   assignee: 'john',
   assigneeAvatar: 'gravatarhash',
-  assigneeName: 'John Doe'
+  assigneeName: 'John Doe',
+  projectOrganization: 'org'
 };
 
 it('should render without the action when the correct rights are missing', () => {
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueChangelog-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueChangelog-test.tsx
index fd81fcc3734..7ecb907b675 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueChangelog-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueChangelog-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueChangelog from '../IssueChangelog';
 import { click } from '../../../../helpers/testUtils';
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentAction-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentAction-test.tsx
index 5a6317e63e0..07e29ea27db 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentAction-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentAction-test.tsx
@@ -17,17 +17,17 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueCommentAction from '../IssueCommentAction';
 import { click } from '../../../../helpers/testUtils';
 
 it('should render correctly', () => {
   const element = shallow(
     <IssueCommentAction
-      currentPopup={null}
+      commentPlaceholder=""
       issueKey="issue-key"
-      onIssueChange={jest.fn()}
+      onChange={jest.fn()}
       toggleComment={jest.fn()}
     />
   );
@@ -38,9 +38,9 @@ it('should open the popup when the button is clicked', () => {
   const toggle = jest.fn();
   const element = shallow(
     <IssueCommentAction
-      currentPopup={null}
+      commentPlaceholder=""
       issueKey="issue-key"
-      onIssueChange={jest.fn()}
+      onChange={jest.fn()}
       toggleComment={toggle}
     />
   );
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentLine-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentLine-test.tsx
index 90cc0e1d8dc..ce358423f35 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentLine-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueCommentLine-test.tsx
@@ -17,17 +17,19 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueCommentLine from '../IssueCommentLine';
 import { click } from '../../../../helpers/testUtils';
+import { IssueComment } from '../../../../app/types';
 
-const comment = {
-  key: 'comment-key',
-  authorName: 'John Doe',
+const comment: IssueComment = {
   authorAvatar: 'gravatarhash',
-  htmlText: '<b>test</b>',
+  authorName: 'John Doe',
   createdAt: '2017-03-01T09:36:01+0100',
+  htmlText: '<b>test</b>',
+  key: 'comment-key',
+  markdown: '*test*',
   updatable: true
 };
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueMessage-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueMessage-test.tsx
index 8371d6376b0..55b5241bacb 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueMessage-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueMessage-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueMessage from '../IssueMessage';
 
 it('should render with the message and a link to open the rule', () => {
@@ -28,8 +28,7 @@ it('should render with the message and a link to open the rule', () => {
       message="Reduce the number of conditional operators (4) used in the expression"
       organization="myorg"
       rule="javascript:S1067"
-    />,
-    { context: { workspace: {} } }
+    />
   );
   expect(element).toMatchSnapshot();
 });
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueSeverity-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueSeverity-test.tsx
index 08b00404347..a1254a2bcca 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueSeverity-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueSeverity-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueSeverity from '../IssueSeverity';
 import { click } from '../../../../helpers/testUtils';
 
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTags-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTags-test.tsx
index cf7efb121cd..3c1e4927131 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTags-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTags-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueTags from '../IssueTags';
 import { click } from '../../../../helpers/testUtils';
 
@@ -33,11 +33,8 @@ it('should render without the action when the correct rights are missing', () =>
     <IssueTags
       canSetTags={false}
       isOpen={false}
-      issue={{
-        transitions: [],
-        status: 'CLOSED'
-      }}
-      onIssueChange={jest.fn()}
+      issue={{ ...issue, tags: [] }}
+      onChange={jest.fn()}
       togglePopup={jest.fn()}
     />
   );
@@ -50,7 +47,7 @@ it('should render with the action', () => {
       canSetTags={true}
       isOpen={false}
       issue={issue}
-      onIssueChange={jest.fn()}
+      onChange={jest.fn()}
       togglePopup={jest.fn()}
     />
   );
@@ -64,7 +61,7 @@ it('should open the popup when the button is clicked', () => {
       canSetTags={true}
       isOpen={false}
       issue={issue}
-      onIssueChange={jest.fn()}
+      onChange={jest.fn()}
       togglePopup={toggle}
     />
   );
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTitleBar-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTitleBar-test.tsx
index 78ae2b7b1ef..43b0c9a8f21 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTitleBar-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTitleBar-test.tsx
@@ -17,57 +17,84 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueTitleBar from '../IssueTitleBar';
+import {
+  ShortLivingBranch,
+  Issue,
+  BranchType,
+  IssueType,
+  FlowLocation
+} from '../../../../app/types';
 
-const issue = {
-  line: 25,
-  textRange: {
-    startLine: 25,
-    endLine: 26,
-    startOffset: 0,
-    endOffset: 15
-  },
+const issue: Issue = {
+  actions: [],
+  component: 'main.js',
+  componentLongName: 'main.js',
+  componentQualifier: 'FIL',
+  componentUuid: 'foo1234',
   creationDate: '2017-03-01T09:36:01+0100',
+  flows: [],
+  fromHotspot: false,
+  key: 'AVsae-CQS-9G3txfbFN2',
+  line: 25,
+  message: 'Reduce the number of conditional operators (4) used in the expression',
   organization: 'myorg',
   project: 'myproject',
-  key: 'AVsae-CQS-9G3txfbFN2',
+  projectKey: 'foo',
+  projectName: 'Foo',
+  projectOrganization: 'org',
   rule: 'javascript:S1067',
-  message: 'Reduce the number of conditional operators (4) used in the expression',
-  flows: [],
+  ruleName: 'foo',
   secondaryLocations: [],
-  fromHotspot: false
+  severity: 'MAJOR',
+  status: 'OPEN',
+  textRange: { startLine: 25, endLine: 26, startOffset: 0, endOffset: 15 },
+  transitions: [],
+  type: IssueType.Bug
 };
 
-const issueWithLocations = {
+const issueWithLocations: Issue = {
   ...issue,
-  flows: [[{}, {}, {}], [{}, {}]],
-  secondaryLocations: [{}, {}]
+  flows: [[loc(), loc(), loc()], [loc(), loc()]],
+  secondaryLocations: [loc(), loc()]
 };
 
+function loc(): FlowLocation {
+  return {
+    component: 'main.js',
+    textRange: { startLine: 1, startOffset: 1, endLine: 2, endOffset: 2 }
+  };
+}
+
 it('should render the titlebar correctly', () => {
+  const branch: ShortLivingBranch = {
+    isMain: false,
+    mergeBranch: 'master',
+    name: 'feature-1.0',
+    type: BranchType.SHORT
+  };
   const element = shallow(
-    <IssueTitleBar
-      branchLike={{ isMain: false, name: 'feature-1.0', type: 'SHORT' }}
-      currentPopup={null}
-      issue={issue}
-      togglePopup={jest.fn()}
-    />
+    <IssueTitleBar branchLike={branch} issue={issue} togglePopup={jest.fn()} />
   );
   expect(element).toMatchSnapshot();
 });
 
 it('should render the titlebar with the filter', () => {
   const element = shallow(
-    <IssueTitleBar currentPopup={null} issue={issue} onFilter={jest.fn()} togglePopup={jest.fn()} />
+    <IssueTitleBar issue={issue} onFilter={jest.fn()} togglePopup={jest.fn()} />
   );
   expect(element).toMatchSnapshot();
 });
 
 it('should count all code locations', () => {
   const element = shallow(
-    <IssueTitleBar displayLocationsCount={true} issue={issueWithLocations} />
+    <IssueTitleBar
+      displayLocationsCount={true}
+      issue={issueWithLocations}
+      togglePopup={jest.fn()}
+    />
   );
   expect(element.find('LocationIndex')).toMatchSnapshot();
 });
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTransition-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTransition-test.tsx
index 98da66e0449..09c39941a80 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTransition-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueTransition-test.tsx
@@ -17,12 +17,13 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueTransition from '../IssueTransition';
 import { click } from '../../../../helpers/testUtils';
 
 const issue = {
+  key: 'foo1234',
   transitions: ['confirm', 'resolve', 'falsepositive', 'wontfix'],
   status: 'OPEN'
 };
@@ -33,10 +34,11 @@ it('should render without the action when there is no transitions', () => {
       hasTransitions={false}
       isOpen={false}
       issue={{
+        key: 'foo1234',
         transitions: [],
         status: 'CLOSED'
       }}
-      setIssueProperty={jest.fn()}
+      onChange={jest.fn()}
       togglePopup={jest.fn()}
     />
   );
@@ -49,7 +51,7 @@ it('should render with the action', () => {
       hasTransitions={true}
       isOpen={false}
       issue={issue}
-      setIssueProperty={jest.fn()}
+      onChange={jest.fn()}
       togglePopup={jest.fn()}
     />
   );
@@ -62,11 +64,12 @@ it('should render with a resolution', () => {
       hasTransitions={true}
       isOpen={false}
       issue={{
+        key: 'foo1234',
         transitions: ['reopen'],
         status: 'RESOLVED',
         resolution: 'FIXED'
       }}
-      setIssueProperty={jest.fn()}
+      onChange={jest.fn()}
       togglePopup={jest.fn()}
     />
   );
@@ -80,7 +83,7 @@ it('should open the popup when the button is clicked', () => {
       hasTransitions={true}
       isOpen={false}
       issue={issue}
-      setIssueProperty={jest.fn()}
+      onChange={jest.fn()}
       togglePopup={toggle}
     />
   );
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueType-test.js b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueType-test.tsx
index 78bb502686b..a7d62b447c1 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueType-test.js
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/IssueType-test.tsx
@@ -17,13 +17,14 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import IssueType from '../IssueType';
 import { click } from '../../../../helpers/testUtils';
+import { IssueType as Type } from '../../../../app/types';
 
 const issue = {
-  type: 'bug'
+  type: Type.Bug
 };
 
 it('should render without the action when the correct rights are missing', () => {
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueAssign-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueAssign-test.tsx.snap
index 3ac74928b8f..935728e035a 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueAssign-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueAssign-test.tsx.snap
@@ -24,6 +24,7 @@ exports[`should open the popup when the button is clicked 2`] = `
             "assignee": "john",
             "assigneeAvatar": "gravatarhash",
             "assigneeName": "John Doe",
+            "projectOrganization": "org",
           }
         }
         onSelect={[MockFunction]}
@@ -74,6 +75,7 @@ exports[`should render with the action 1`] = `
             "assignee": "john",
             "assigneeAvatar": "gravatarhash",
             "assigneeName": "John Doe",
+            "projectOrganization": "org",
           }
         }
         onSelect={[MockFunction]}
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.tsx.snap
index fad46a6b759..fad46a6b759 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueChangelog-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentAction-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentAction-test.tsx.snap
index 948279ebf57..1721de8d175 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentAction-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentAction-test.tsx.snap
@@ -10,6 +10,7 @@ exports[`should open the popup when the button is clicked 1`] = `
     overlay={
       <CommentPopup
         onComment={[Function]}
+        placeholder=""
         toggleComment={
           [MockFunction] {
             "calls": Array [
@@ -50,6 +51,7 @@ exports[`should render correctly 1`] = `
     overlay={
       <CommentPopup
         onComment={[Function]}
+        placeholder=""
         toggleComment={[MockFunction]}
       />
     }
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.tsx.snap
index 4db5ed5aa9c..f32c4877164 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.tsx.snap
@@ -50,7 +50,6 @@ exports[`should open the right popups when the buttons are clicked 3`] = `
       className="dropdown"
     >
       <Toggler
-        className="display-inline-block"
         onRequestClose={[Function]}
         open={false}
         overlay={
@@ -62,6 +61,7 @@ exports[`should open the right popups when the buttons are clicked 3`] = `
                 "createdAt": "2017-03-01T09:36:01+0100",
                 "htmlText": "<b>test</b>",
                 "key": "comment-key",
+                "markdown": "*test*",
                 "updatable": true,
               }
             }
@@ -81,7 +81,6 @@ exports[`should open the right popups when the buttons are clicked 3`] = `
       className="dropdown"
     >
       <Toggler
-        className="display-inline-block"
         onRequestClose={[Function]}
         open={true}
         overlay={
@@ -175,7 +174,6 @@ exports[`should render correctly a comment that is updatable 1`] = `
       className="dropdown"
     >
       <Toggler
-        className="display-inline-block"
         onRequestClose={[Function]}
         open={false}
         overlay={
@@ -187,6 +185,7 @@ exports[`should render correctly a comment that is updatable 1`] = `
                 "createdAt": "2017-03-01T09:36:01+0100",
                 "htmlText": "<b>test</b>",
                 "key": "comment-key",
+                "markdown": "*test*",
                 "updatable": true,
               }
             }
@@ -206,7 +205,6 @@ exports[`should render correctly a comment that is updatable 1`] = `
       className="dropdown"
     >
       <Toggler
-        className="display-inline-block"
         onRequestClose={[Function]}
         open={false}
         overlay={
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.tsx.snap
index edda212b2f0..edda212b2f0 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueMessage-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueSeverity-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueSeverity-test.tsx.snap
index 898a75fd3d6..898a75fd3d6 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueSeverity-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueSeverity-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTags-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTags-test.tsx.snap
index ca33fb7f1ec..ca33fb7f1ec 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTags-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTags-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.tsx.snap
index 9aed610d4ce..6b7ce57dfa0 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTitleBar-test.tsx.snap
@@ -30,6 +30,11 @@ exports[`should render the titlebar correctly 1`] = `
           isOpen={false}
           issue={
             Object {
+              "actions": Array [],
+              "component": "main.js",
+              "componentLongName": "main.js",
+              "componentQualifier": "FIL",
+              "componentUuid": "foo1234",
               "creationDate": "2017-03-01T09:36:01+0100",
               "flows": Array [],
               "fromHotspot": false,
@@ -38,14 +43,22 @@ exports[`should render the titlebar correctly 1`] = `
               "message": "Reduce the number of conditional operators (4) used in the expression",
               "organization": "myorg",
               "project": "myproject",
+              "projectKey": "foo",
+              "projectName": "Foo",
+              "projectOrganization": "org",
               "rule": "javascript:S1067",
+              "ruleName": "foo",
               "secondaryLocations": Array [],
+              "severity": "MAJOR",
+              "status": "OPEN",
               "textRange": Object {
                 "endLine": 26,
                 "endOffset": 15,
                 "startLine": 25,
                 "startOffset": 0,
               },
+              "transitions": Array [],
+              "type": "BUG",
             }
           }
           togglePopup={[MockFunction]}
@@ -115,6 +128,11 @@ exports[`should render the titlebar with the filter 1`] = `
           isOpen={false}
           issue={
             Object {
+              "actions": Array [],
+              "component": "main.js",
+              "componentLongName": "main.js",
+              "componentQualifier": "FIL",
+              "componentUuid": "foo1234",
               "creationDate": "2017-03-01T09:36:01+0100",
               "flows": Array [],
               "fromHotspot": false,
@@ -123,14 +141,22 @@ exports[`should render the titlebar with the filter 1`] = `
               "message": "Reduce the number of conditional operators (4) used in the expression",
               "organization": "myorg",
               "project": "myproject",
+              "projectKey": "foo",
+              "projectName": "Foo",
+              "projectOrganization": "org",
               "rule": "javascript:S1067",
+              "ruleName": "foo",
               "secondaryLocations": Array [],
+              "severity": "MAJOR",
+              "status": "OPEN",
               "textRange": Object {
                 "endLine": 26,
                 "endOffset": 15,
                 "startLine": 25,
                 "startOffset": 0,
               },
+              "transitions": Array [],
+              "type": "BUG",
             }
           }
           togglePopup={[MockFunction]}
@@ -177,6 +203,11 @@ exports[`should render the titlebar with the filter 1`] = `
           isOpen={false}
           issue={
             Object {
+              "actions": Array [],
+              "component": "main.js",
+              "componentLongName": "main.js",
+              "componentQualifier": "FIL",
+              "componentUuid": "foo1234",
               "creationDate": "2017-03-01T09:36:01+0100",
               "flows": Array [],
               "fromHotspot": false,
@@ -185,14 +216,22 @@ exports[`should render the titlebar with the filter 1`] = `
               "message": "Reduce the number of conditional operators (4) used in the expression",
               "organization": "myorg",
               "project": "myproject",
+              "projectKey": "foo",
+              "projectName": "Foo",
+              "projectOrganization": "org",
               "rule": "javascript:S1067",
+              "ruleName": "foo",
               "secondaryLocations": Array [],
+              "severity": "MAJOR",
+              "status": "OPEN",
               "textRange": Object {
                 "endLine": 26,
                 "endOffset": 15,
                 "startLine": 25,
                 "startOffset": 0,
               },
+              "transitions": Array [],
+              "type": "BUG",
             }
           }
           onFilter={[MockFunction]}
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTransition-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTransition-test.tsx.snap
index dcfe4ff35ea..dcfe4ff35ea 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTransition-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueTransition-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueType-test.js.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueType-test.tsx.snap
index 1eb2844dbf6..585eae8a6cb 100644
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueType-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueType-test.tsx.snap
@@ -20,7 +20,7 @@ exports[`should open the popup when the button is clicked 2`] = `
       <SetTypePopup
         issue={
           Object {
-            "type": "bug",
+            "type": "BUG",
           }
         }
         onSelect={[Function]}
@@ -33,9 +33,9 @@ exports[`should open the popup when the button is clicked 2`] = `
     >
       <IssueTypeIcon
         className="little-spacer-right"
-        query="bug"
+        query="BUG"
       />
-      issue.type.bug
+      issue.type.BUG
       <DropdownIcon
         className="little-spacer-left"
       />
@@ -55,7 +55,7 @@ exports[`should render with the action 1`] = `
       <SetTypePopup
         issue={
           Object {
-            "type": "bug",
+            "type": "BUG",
           }
         }
         onSelect={[Function]}
@@ -68,9 +68,9 @@ exports[`should render with the action 1`] = `
     >
       <IssueTypeIcon
         className="little-spacer-right"
-        query="bug"
+        query="BUG"
       />
-      issue.type.bug
+      issue.type.BUG
       <DropdownIcon
         className="little-spacer-left"
       />
@@ -83,8 +83,8 @@ exports[`should render without the action when the correct rights are missing 1`
 <span>
   <IssueTypeIcon
     className="little-spacer-right"
-    query="bug"
+    query="BUG"
   />
-  issue.type.bug
+  issue.type.BUG
 </span>
 `;
diff --git a/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.js b/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.tsx
index 71c5d3b5b00..394fa2567d1 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.tsx
@@ -17,44 +17,34 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { getIssueChangelog } from '../../../api/issues';
 import { translate } from '../../../helpers/l10n';
 import Avatar from '../../ui/Avatar';
 import DateTimeFormatter from '../../intl/DateTimeFormatter';
-import IssueChangelogDiff from '../components/IssueChangelogDiff';
+import IssueChangelogDiff, { ChangelogDiff } from '../components/IssueChangelogDiff';
 import { DropdownOverlay } from '../../controls/Dropdown';
-/*:: import type { ChangelogDiff } from '../components/IssueChangelogDiff'; */
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Changelog = {
-  avatar?: string,
-  creationDate: string,
-  diffs: Array<ChangelogDiff>,
-  user: string,
-  userName: string
-};
-*/
+interface Changelog {
+  avatar?: string;
+  creationDate: string;
+  diffs: ChangelogDiff[];
+  user: string;
+  userName: string;
+}
 
-/*::
-type Props = {
-  issue: Issue,
-  popupPosition?: {}
-};
-*/
+interface Props {
+  issue: Pick<Issue, 'author' | 'creationDate' | 'key'>;
+}
 
-/*::
-type State = {
-  changelogs: Array<Changelog>
-};
-*/
+interface State {
+  changelogs: Changelog[];
+}
 
-export default class ChangelogPopup extends React.PureComponent {
-  /*:: mounted: boolean; */
-  /*:: props: Props; */
-  state /*: State */ = {
+export default class ChangelogPopup extends React.PureComponent<Props, State> {
+  mounted = false;
+  state: State = {
     changelogs: []
   };
 
diff --git a/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.js b/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.tsx
index 940718ffe8b..9f9c963f393 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.tsx
@@ -17,25 +17,21 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { Button } from '../../ui/buttons';
 import { translate } from '../../../helpers/l10n';
 import { DropdownOverlay } from '../../controls/Dropdown';
 
-/*::
-type Props = {
-  onDelete: () => void,
-  popupPosition?: {}
-};
-*/
+interface Props {
+  onDelete: () => void;
+}
 
-export default function CommentDeletePopup(props /*: Props */) {
+export default function CommentDeletePopup({ onDelete }: Props) {
   return (
     <DropdownOverlay>
       <div className="menu is-container">
         <div className="spacer-bottom">{translate('issue.comment.delete_confirm_message')}</div>
-        <Button className="button-red" onClick={props.onDelete}>
+        <Button className="button-red" onClick={onDelete}>
           {translate('delete')}
         </Button>
       </div>
diff --git a/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.js b/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.tsx
index aa298b7f919..fe399cd8d4c 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.tsx
@@ -17,43 +17,35 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import MarkdownTips from '../../common/MarkdownTips';
 import { Button, ResetButtonLink } from '../../ui/buttons';
 import { translate } from '../../../helpers/l10n';
 import { DropdownOverlay } from '../../controls/Dropdown';
-/*:: import type { IssueComment } from '../types'; */
+import { IssueComment } from '../../../app/types';
 
-/*::
-type Props = {
-  comment?: IssueComment,
-  onComment: string => void,
-  toggleComment: boolean => void,
-  placeholder: string,
-  popupPosition?: {}
-};
-*/
-
-/*::
-type State = {
-  textComment: string
-};
-*/
+interface Props {
+  comment?: Pick<IssueComment, 'markdown'>;
+  onComment: (text: string) => void;
+  toggleComment: (visible: boolean) => void;
+  placeholder: string;
+  popupPosition?: {};
+}
 
-export default class CommentPopup extends React.PureComponent {
-  /*:: props: Props; */
-  /*:: state: State; */
+interface State {
+  textComment: string;
+}
 
-  constructor(props /*: Props */) {
+export default class CommentPopup extends React.PureComponent<Props, State> {
+  constructor(props: Props) {
     super(props);
     this.state = {
       textComment: props.comment ? props.comment.markdown : ''
     };
   }
 
-  handleCommentChange = (evt /*: SyntheticInputEvent */) => {
-    this.setState({ textComment: evt.target.value });
+  handleCommentChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
+    this.setState({ textComment: event.target.value });
   };
 
   handleCommentClick = () => {
@@ -66,13 +58,13 @@ export default class CommentPopup extends React.PureComponent {
     this.props.toggleComment(false);
   };
 
-  handleKeyboard = (evt /*: KeyboardEvent */) => {
-    if (evt.keyCode === 13 && (evt.metaKey || evt.ctrlKey)) {
+  handleKeyboard = (event: React.KeyboardEvent) => {
+    if (event.keyCode === 13 && (event.metaKey || event.ctrlKey)) {
       // Ctrl + Enter
       this.handleCommentClick();
-    } else if ([37, 38, 39, 40].includes(evt.keyCode)) {
+    } else if ([37, 38, 39, 40].includes(event.keyCode)) {
       // Arrow keys
-      evt.stopPropagation();
+      event.stopPropagation();
     }
   };
 
@@ -87,7 +79,7 @@ export default class CommentPopup extends React.PureComponent {
               onChange={this.handleCommentChange}
               onKeyDown={this.handleKeyboard}
               placeholder={this.props.placeholder}
-              rows="2"
+              rows={2}
               value={this.state.textComment}
             />
           </div>
diff --git a/server/sonar-web/src/main/js/components/issue/popups/SetAssigneePopup.js b/server/sonar-web/src/main/js/components/issue/popups/SetAssigneePopup.tsx
index 434bfa9e196..28bd4a38b98 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/SetAssigneePopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/SetAssigneePopup.tsx
@@ -17,11 +17,9 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { map } from 'lodash';
 import { connect } from 'react-redux';
-import * as PropTypes from 'prop-types';
 import Avatar from '../../ui/Avatar';
 import SelectList from '../../common/SelectList';
 import SelectListItem from '../../common/SelectListItem';
@@ -29,52 +27,40 @@ import SearchBox from '../../controls/SearchBox';
 import { searchMembers } from '../../../api/organizations';
 import { searchUsers } from '../../../api/users';
 import { translate } from '../../../helpers/l10n';
-import { getCurrentUser } from '../../../store/rootReducer';
+import { getCurrentUser, Store } from '../../../store/rootReducer';
 import { DropdownOverlay } from '../../controls/Dropdown';
-/*:: import type { Issue } from '../types'; */
-
-/*::
-type User = {
-  avatar?: string,
-  email?: string,
-  login: string,
-  name: string
-};
-*/
+import { Issue, CurrentUser, isLoggedIn, OrganizationMember } from '../../../app/types';
+import { isSonarCloud } from '../../../helpers/system';
+
+interface User {
+  avatar?: string;
+  email?: string;
+  login: string;
+  name: string;
+}
 
-/*::
-type Props = {
-  currentUser: User,
-  issue: Issue,
-  onSelect: string => void,
-  popupPosition?: {}
-};
-*/
+interface Props {
+  currentUser: CurrentUser;
+  issue: Pick<Issue, 'projectOrganization'>;
+  onSelect: (login: string) => void;
+}
 
-/*::
-type State = {
-  query: string,
-  users: Array<User>,
-  currentUser: string
-};
-*/
+interface State {
+  currentUser: string;
+  query: string;
+  users: User[];
+}
 
 const LIST_SIZE = 10;
 
-class SetAssigneePopup extends React.PureComponent {
-  /*:: defaultUsersArray: Array<User>; */
-  /*:: props: Props; */
-  /*:: state: State; */
-
-  static contextTypes = {
-    organizationsEnabled: PropTypes.bool
-  };
+class SetAssigneePopup extends React.PureComponent<Props, State> {
+  defaultUsersArray: User[];
 
-  constructor(props /*: Props */) {
+  constructor(props: Props) {
     super(props);
     this.defaultUsersArray = [{ login: '', name: translate('unassigned') }];
 
-    if (props.currentUser.isLoggedIn) {
+    if (isLoggedIn(props.currentUser)) {
       this.defaultUsersArray = [props.currentUser, ...this.defaultUsersArray];
     }
 
@@ -85,7 +71,7 @@ class SetAssigneePopup extends React.PureComponent {
     };
   }
 
-  searchMembers = (query /*: string */) => {
+  searchMembers = (query: string) => {
     searchMembers({
       organization: this.props.issue.projectOrganization,
       q: query,
@@ -93,18 +79,18 @@ class SetAssigneePopup extends React.PureComponent {
     }).then(this.handleSearchResult, () => {});
   };
 
-  searchUsers = (query /*: string */) => {
+  searchUsers = (query: string) => {
     searchUsers({ q: query, ps: LIST_SIZE }).then(this.handleSearchResult, () => {});
   };
 
-  handleSearchResult = (data /*: Object */) => {
+  handleSearchResult = (response: { users: OrganizationMember[] }) => {
     this.setState({
-      users: data.users,
-      currentUser: data.users.length > 0 ? data.users[0].login : ''
+      users: response.users,
+      currentUser: response.users.length > 0 ? response.users[0].login : ''
     });
   };
 
-  handleSearchChange = (query /*: string */) => {
+  handleSearchChange = (query: string) => {
     if (query.length === 0) {
       this.setState({
         query,
@@ -113,7 +99,7 @@ class SetAssigneePopup extends React.PureComponent {
       });
     } else {
       this.setState({ query });
-      if (this.context.organizationsEnabled) {
+      if (isSonarCloud()) {
         this.searchMembers(query);
       } else {
         this.searchUsers(query);
@@ -158,7 +144,7 @@ class SetAssigneePopup extends React.PureComponent {
   }
 }
 
-const mapStateToProps = state => ({
+const mapStateToProps = (state: Store) => ({
   currentUser: getCurrentUser(state)
 });
 
diff --git a/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.js b/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.tsx
index 12fb311222b..dbefb623d92 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/SetSeverityPopup.tsx
@@ -17,42 +17,32 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { translate } from '../../../helpers/l10n';
 import SelectList from '../../common/SelectList';
 import SelectListItem from '../../common/SelectListItem';
 import SeverityIcon from '../../icons-components/SeverityIcon';
 import { DropdownOverlay } from '../../controls/Dropdown';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
 type Props = {
-  issue: Issue,
-  onSelect: string => void,
+  issue: Pick<Issue, 'severity'>;
+  onSelect: (severity: string) => void;
 };
-*/
 
 const SEVERITY = ['BLOCKER', 'CRITICAL', 'MAJOR', 'MINOR', 'INFO'];
 
-export default class SetSeverityPopup extends React.PureComponent {
-  /*:: props: Props; */
-
-  render() {
-    return (
-      <DropdownOverlay>
-        <SelectList
-          currentItem={this.props.issue.severity}
-          items={SEVERITY}
-          onSelect={this.props.onSelect}>
-          {SEVERITY.map(severity => (
-            <SelectListItem item={severity} key={severity}>
-              <SeverityIcon className="little-spacer-right" severity={severity} />
-              {translate('severity', severity)}
-            </SelectListItem>
-          ))}
-        </SelectList>
-      </DropdownOverlay>
-    );
-  }
+export default function SetSeverityPopup({ issue, onSelect }: Props) {
+  return (
+    <DropdownOverlay>
+      <SelectList currentItem={issue.severity} items={SEVERITY} onSelect={onSelect}>
+        {SEVERITY.map(severity => (
+          <SelectListItem item={severity} key={severity}>
+            <SeverityIcon className="little-spacer-right" severity={severity} />
+            {translate('severity', severity)}
+          </SelectListItem>
+        ))}
+      </SelectList>
+    </DropdownOverlay>
+  );
 }
diff --git a/server/sonar-web/src/main/js/components/issue/popups/SetTransitionPopup.js b/server/sonar-web/src/main/js/components/issue/popups/SetTransitionPopup.tsx
index 20bf1f6c1f4..b0a6a41cafe 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/SetTransitionPopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/SetTransitionPopup.tsx
@@ -17,40 +17,32 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import SelectList from '../../common/SelectList';
 import SelectListItem from '../../common/SelectListItem';
 import { translate } from '../../../helpers/l10n';
 import { DropdownOverlay } from '../../controls/Dropdown';
 
-/*::
-type Props = {
-  transitions: Array<string>,
-  onSelect: string => void,
-};
-*/
-
-export default class SetTransitionPopup extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  onSelect: (transition: string) => void;
+  transitions: string[];
+}
 
-  render() {
-    const { transitions } = this.props;
-    return (
-      <DropdownOverlay>
-        <SelectList currentItem={transitions[0]} items={transitions} onSelect={this.props.onSelect}>
-          {transitions.map(transition => {
-            return (
-              <SelectListItem
-                item={transition}
-                key={transition}
-                title={translate('issue.transition', transition, 'description')}>
-                {translate('issue.transition', transition)}
-              </SelectListItem>
-            );
-          })}
-        </SelectList>
-      </DropdownOverlay>
-    );
-  }
+export default function SetTransitionPopup({ onSelect, transitions }: Props) {
+  return (
+    <DropdownOverlay>
+      <SelectList currentItem={transitions[0]} items={transitions} onSelect={onSelect}>
+        {transitions.map(transition => {
+          return (
+            <SelectListItem
+              item={transition}
+              key={transition}
+              title={translate('issue.transition', transition, 'description')}>
+              {translate('issue.transition', transition)}
+            </SelectListItem>
+          );
+        })}
+      </SelectList>
+    </DropdownOverlay>
+  );
 }
diff --git a/server/sonar-web/src/main/js/components/issue/popups/SetTypePopup.js b/server/sonar-web/src/main/js/components/issue/popups/SetTypePopup.tsx
index cb65a1018c0..9deb10ced76 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/SetTypePopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/SetTypePopup.tsx
@@ -17,43 +17,32 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import { translate } from '../../../helpers/l10n';
 import IssueTypeIcon from '../../ui/IssueTypeIcon';
 import SelectList from '../../common/SelectList';
 import SelectListItem from '../../common/SelectListItem';
 import { DropdownOverlay } from '../../controls/Dropdown';
-import { IssueType } from '../../../app/types';
-/*:: import type { Issue } from '../types'; */
+import { Issue, IssueType } from '../../../app/types';
 
-/*::
-type Props = {
-  issue: Issue,
-  onSelect: string => void,
-};
-*/
+interface Props {
+  issue: Pick<Issue, 'type'>;
+  onSelect: (type: IssueType) => void;
+}
 
 const TYPES = [IssueType.Bug, IssueType.Vulnerability, IssueType.CodeSmell];
 
-export default class SetTypePopup extends React.PureComponent {
-  /*:: props: Props; */
-
-  render() {
-    return (
-      <DropdownOverlay>
-        <SelectList
-          currentItem={this.props.issue.type}
-          items={TYPES}
-          onSelect={this.props.onSelect}>
-          {TYPES.map(type => (
-            <SelectListItem item={type} key={type}>
-              <IssueTypeIcon className="little-spacer-right" query={type} />
-              {translate('issue.type', type)}
-            </SelectListItem>
-          ))}
-        </SelectList>
-      </DropdownOverlay>
-    );
-  }
+export default function SetTypePopup({ issue, onSelect }: Props) {
+  return (
+    <DropdownOverlay>
+      <SelectList currentItem={issue.type} items={TYPES} onSelect={onSelect}>
+        {TYPES.map(type => (
+          <SelectListItem item={type} key={type}>
+            <IssueTypeIcon className="little-spacer-right" query={type} />
+            {translate('issue.type', type)}
+          </SelectListItem>
+        ))}
+      </SelectList>
+    </DropdownOverlay>
+  );
 }
diff --git a/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.js b/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.tsx
index 9674ca0fc93..85f8a606ab1 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/SimilarIssuesPopup.tsx
@@ -17,8 +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.
  */
-// @flow
-import React from 'react';
+import * as React from 'react';
 import SelectList from '../../common/SelectList';
 import SelectListItem from '../../common/SelectListItem';
 import { DropdownOverlay } from '../../controls/Dropdown';
@@ -30,19 +29,15 @@ import IssueTypeIcon from '../../ui/IssueTypeIcon';
 import Avatar from '../../ui/Avatar';
 import { translate } from '../../../helpers/l10n';
 import { fileFromPath, limitComponentName } from '../../../helpers/path';
-/*:: import type { Issue } from '../types'; */
+import { Issue } from '../../../app/types';
 
-/*::
-type Props = {|
-  issue: Issue,
-  onFilter: (property: string, issue: Issue) => void,
-|};
-*/
-
-export default class SimilarIssuesPopup extends React.PureComponent {
-  /*:: props: Props; */
+interface Props {
+  issue: Issue;
+  onFilter: (property: string, issue: Issue) => void;
+}
 
-  handleSelect = (property /*: string */) => {
+export default class SimilarIssuesPopup extends React.PureComponent<Props> {
+  handleSelect = (property: string) => {
     this.props.onFilter(property, this.props.issue);
   };
 
@@ -58,10 +53,9 @@ export default class SimilarIssuesPopup extends React.PureComponent {
       'rule',
       ...(issue.tags || []).map(tag => `tag###${tag}`),
       'project',
-      // $FlowFixMe items are filtered later
       issue.subProject ? 'module' : undefined,
       'file'
-    ].filter(item => item);
+    ].filter(item => item) as string[];
 
     return (
       <DropdownOverlay noPadding={true}>
@@ -84,7 +78,7 @@ export default class SimilarIssuesPopup extends React.PureComponent {
           </SelectListItem>
 
           <SelectListItem item="status">
-            <StatusHelper status={issue.status} />
+            <StatusHelper resolution={undefined} status={issue.status} />
           </SelectListItem>
 
           <SelectListItem item="resolution">
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/ChangelogPopup-test.js b/server/sonar-web/src/main/js/components/issue/popups/__tests__/ChangelogPopup-test.tsx
index fa67372738e..b2b9cdef8fe 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/ChangelogPopup-test.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/ChangelogPopup-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import ChangelogPopup from '../ChangelogPopup';
 
 it('should render the changelog popup correctly', () => {
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentDeletePopup-test.js b/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentDeletePopup-test.tsx
index be0c222335d..75b418a16d1 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentDeletePopup-test.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentDeletePopup-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import CommentDeletePopup from '../CommentDeletePopup';
 import { click } from '../../../../helpers/testUtils';
 
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentPopup-test.js b/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentPopup-test.tsx
index 6cfd0dcdf64..638ab76ea08 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentPopup-test.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/CommentPopup-test.tsx
@@ -17,19 +17,14 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import CommentPopup from '../CommentPopup';
 import { click } from '../../../../helpers/testUtils';
 
 it('should render the comment popup correctly without existing comment', () => {
   const element = shallow(
-    <CommentPopup
-      customClass="myclass"
-      onComment={jest.fn()}
-      placeholder="placeholder test"
-      toggleComment={jest.fn()}
-    />
+    <CommentPopup onComment={jest.fn()} placeholder="placeholder test" toggleComment={jest.fn()} />
   );
   expect(element).toMatchSnapshot();
 });
@@ -49,12 +44,7 @@ it('should render the comment popup correctly when changing a comment', () => {
 it('should render not allow to send comment with only spaces', () => {
   const onComment = jest.fn();
   const element = shallow(
-    <CommentPopup
-      customClass="myclass"
-      onComment={onComment}
-      placeholder="placeholder test"
-      toggleComment={jest.fn()}
-    />
+    <CommentPopup onComment={onComment} placeholder="placeholder test" toggleComment={jest.fn()} />
   );
   click(element.find('.js-issue-comment-submit'));
   expect(onComment.mock.calls.length).toBe(0);
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetSeverityPopup-test.js b/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetSeverityPopup-test.tsx
index aadfe2e46cb..e84b929d358 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetSeverityPopup-test.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetSeverityPopup-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import SetSeverityPopup from '../SetSeverityPopup';
 
 it('should render tags popup correctly', () => {
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTransitionPopup-test.js b/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTransitionPopup-test.tsx
index c7d86d56e10..cab0efac5cb 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTransitionPopup-test.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTransitionPopup-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import SetTransitionPopup from '../SetTransitionPopup';
 
 it('should render tags popup correctly', () => {
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTypePopup-test.js b/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTypePopup-test.tsx
index 79a8a292eed..20d17bb4fbf 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTypePopup-test.js
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/SetTypePopup-test.tsx
@@ -17,8 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import * as React from 'react';
 import { shallow } from 'enzyme';
-import React from 'react';
 import SetTypePopup from '../SetTypePopup';
 import { IssueType } from '../../../../app/types';
 
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.js.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.tsx.snap
index f54cfd88b77..f54cfd88b77 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.js.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.tsx.snap
index 43c00928943..43c00928943 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentPopup-test.js.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentPopup-test.tsx.snap
index 8ed5e9eb55a..d6ad2e18439 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentPopup-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentPopup-test.tsx.snap
@@ -13,7 +13,7 @@ exports[`should render the comment popup correctly when changing a comment 1`] =
         onChange={[Function]}
         onKeyDown={[Function]}
         placeholder=""
-        rows="2"
+        rows={2}
         value="*test*"
       />
     </div>
@@ -60,7 +60,7 @@ exports[`should render the comment popup correctly without existing comment 1`]
         onChange={[Function]}
         onKeyDown={[Function]}
         placeholder="placeholder test"
-        rows="2"
+        rows={2}
         value=""
       />
     </div>
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetSeverityPopup-test.js.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetSeverityPopup-test.tsx.snap
index f8818f53cab..f8818f53cab 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetSeverityPopup-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetSeverityPopup-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTransitionPopup-test.js.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTransitionPopup-test.tsx.snap
index a9728b1687a..a9728b1687a 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTransitionPopup-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTransitionPopup-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTypePopup-test.js.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTypePopup-test.tsx.snap
index 5055d807449..5055d807449 100644
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTypePopup-test.js.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/SetTypePopup-test.tsx.snap
diff --git a/server/sonar-web/src/main/js/components/issue/types.js b/server/sonar-web/src/main/js/components/issue/types.js
deleted file mode 100644
index d93d826d5b5..00000000000
--- a/server/sonar-web/src/main/js/components/issue/types.js
+++ /dev/null
@@ -1,93 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2018 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.
- */
-// @flow
-/*::
-export type TextRange = {
-  startLine: number,
-  startOffset: number,
-  endLine: number,
-  endOffset: number
-};
-*/
-
-/*::
-export type FlowLocation = {
-  msg: string,
-  textRange: TextRange
-};
-*/
-
-/*::
-export type IssueComment = {
-  author?: string,
-  authorActive?: boolean,
-  authorAvatar?: string,
-  authorLogin?: string,
-  authorName?: string,
-  createdAt: string,
-  htmlText: string,
-  key: string,
-  markdown: string,
-  updatable: boolean
-};
-*/
-
-/*::
-export type Issue = {
-  actions: Array<string>,
-  assignee?: string,
-  assigneeActive?: string,
-  assigneeAvatar?: string,
-  assigneeLogin?: string,
-  assigneeName?: string,
-  author?: string,
-  comments?: Array<IssueComment>,
-  component: string,
-  componentLongName: string,
-  componentQualifier: string,
-  componentUuid: string,
-  creationDate: string,
-  effort?: string,
-  externalRuleEngine?: string,
-  key: string,
-  flows: Array<Array<FlowLocation>>,
-  fromHotspot: boolean,
-  line?: number,
-  message: string,
-  organization: string,
-  project: string,
-  projectName: string,
-  projectOrganization: string,
-  projectKey: string,
-  resolution?: string,
-  rule: string,
-  ruleName: string,
-  secondaryLocations: Array<FlowLocation>,
-  severity: string,
-  status: string,
-  subProject?: string,
-  subProjectName?: string,
-  subProjectUuid?: string,
-  tags?: Array<string>,
-  textRange?: TextRange,
-  transitions?: Array<string>,
-  type: string
-};
-*/
diff --git a/server/sonar-web/src/main/js/components/ui/buttons.tsx b/server/sonar-web/src/main/js/components/ui/buttons.tsx
index f3644d39b59..1e9d8bb866f 100644
--- a/server/sonar-web/src/main/js/components/ui/buttons.tsx
+++ b/server/sonar-web/src/main/js/components/ui/buttons.tsx
@@ -26,18 +26,19 @@ import EditIcon from '../icons-components/EditIcon';
 import Tooltip from '../controls/Tooltip';
 import './buttons.css';
 
-interface ButtonProps {
+type AllowedButtonAttributes = Pick<
+  React.ButtonHTMLAttributes<HTMLButtonElement>,
+  'className' | 'disabled' | 'id' | 'style' | 'title'
+>;
+
+interface ButtonProps extends AllowedButtonAttributes {
   autoFocus?: boolean;
-  className?: string;
   children?: React.ReactNode;
-  disabled?: boolean;
-  id?: string;
   innerRef?: (node: HTMLElement | null) => void;
   name?: string;
-  onClick?: (event: React.MouseEvent<HTMLElement>) => void;
+  onClick?: () => void;
   preventDefault?: boolean;
   stopPropagation?: boolean;
-  style?: React.CSSProperties;
   type?: string;
 }
 
@@ -48,7 +49,7 @@ export class Button extends React.PureComponent<ButtonProps> {
     event.currentTarget.blur();
     if (preventDefault) event.preventDefault();
     if (stopPropagation) event.stopPropagation();
-    if (onClick) onClick(event);
+    if (onClick) onClick();
   };
 
   render() {