translate all routes files to ts (#2378)

7 files changed, 200 insertions, 202 deletions

diff --git a/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.js b/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.js
deleted file mode 100644
index 13826f80dc8..00000000000
--- a/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.js
+++ /dev/null
@@ -1,94 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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 React from 'react';
-import moment from 'moment';
-import { sortBy } from 'lodash';
-import { Link } from 'react-router';
-import Level from '../../../components/ui/Level';
-import { projectType } from './propTypes';
-import { translateWithParameters, translate } from '../../../helpers/l10n';
-
-export default class ProjectCard extends React.PureComponent {
-  static propTypes = {
-    project: projectType.isRequired
-  };
-
-  render() {
-    const { project } = this.props;
-    const isAnalyzed = project.lastAnalysisDate != null;
-    const analysisMoment = isAnalyzed && moment(project.lastAnalysisDate);
-    const links = sortBy(project.links, 'type');
-
-    return (
-      <div className="account-project-card clearfix">
-        <aside className="account-project-side">
-          {isAnalyzed
-            ? <div className="account-project-analysis" title={analysisMoment.format('LLL')}>
-                {translateWithParameters(
-                  'my_account.projects.analyzed_x',
-                  analysisMoment.fromNow()
-                )}
-              </div>
-            : <div className="account-project-analysis">
-                {translate('my_account.projects.never_analyzed')}
-              </div>}
-
-          {project.qualityGate != null &&
-            <div className="account-project-quality-gate">
-              <Level level={project.qualityGate} />
-            </div>}
-        </aside>
-
-        <h3 className="account-project-name">
-          <Link to={{ pathname: '/dashboard', query: { id: project.key } }}>
-            {project.name}
-          </Link>
-        </h3>
-
-        {links.length > 0 &&
-          <div className="account-project-links">
-            <ul className="list-inline">
-              {links.map(link =>
-                <li key={link.type}>
-                  <a
-                    className="link-with-icon"
-                    href={link.href}
-                    title={link.name}
-                    target="_blank"
-                    rel="nofollow">
-                    <i className={`icon-color-link icon-${link.type}`} />
-                  </a>
-                </li>
-              )}
-            </ul>
-          </div>}
-
-        <div className="account-project-key">
-          {project.key}
-        </div>
-
-        {!!project.description &&
-          <div className="account-project-description">
-            {project.description}
-          </div>}
-      </div>
-    );
-  }
-}
diff --git a/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.tsx b/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.tsx
new file mode 100644
index 00000000000..93a3a787715
--- /dev/null
+++ b/server/sonar-web/src/main/js/apps/account/projects/ProjectCard.tsx
@@ -0,0 +1,94 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 * as moment from 'moment';
+import { sortBy } from 'lodash';
+import { Link } from 'react-router';
+import { IProject } from './types';
+import Level from '../../../components/ui/Level';
+import { translateWithParameters, translate } from '../../../helpers/l10n';
+
+interface Props {
+  project: IProject;
+}
+
+export default function ProjectCard(props: Props) {
+  const { project } = props;
+  const isAnalyzed = project.lastAnalysisDate != null;
+  const analysisMoment = isAnalyzed && moment(project.lastAnalysisDate);
+  const links = sortBy(project.links, 'type');
+
+  return (
+    <div className="account-project-card clearfix">
+      <aside className="account-project-side">
+        {isAnalyzed
+          ? <div
+              className="account-project-analysis"
+              title={analysisMoment ? analysisMoment.format('LLL') : undefined}>
+              {translateWithParameters(
+                'my_account.projects.analyzed_x',
+                analysisMoment ? analysisMoment.fromNow() : undefined
+              )}
+            </div>
+          : <div className="account-project-analysis">
+              {translate('my_account.projects.never_analyzed')}
+            </div>}
+
+        {project.qualityGate != null &&
+          <div className="account-project-quality-gate">
+            <Level level={project.qualityGate} />
+          </div>}
+      </aside>
+
+      <h3 className="account-project-name">
+        <Link to={{ pathname: '/dashboard', query: { id: project.key } }}>
+          {project.name}
+        </Link>
+      </h3>
+
+      {links.length > 0 &&
+        <div className="account-project-links">
+          <ul className="list-inline">
+            {links.map(link =>
+              <li key={link.type}>
+                <a
+                  className="link-with-icon"
+                  href={link.href}
+                  title={link.name}
+                  target="_blank"
+                  rel="nofollow">
+                  <i className={`icon-color-link icon-${link.type}`} />
+                </a>
+              </li>
+            )}
+          </ul>
+        </div>}
+
+      <div className="account-project-key">
+        {project.key}
+      </div>
+
+      {!!project.description &&
+        <div className="account-project-description">
+          {project.description}
+        </div>}
+    </div>
+  );
+}
diff --git a/server/sonar-web/src/main/js/apps/account/projects/Projects.js b/server/sonar-web/src/main/js/apps/account/projects/Projects.js
deleted file mode 100644
index 89c151f73d5..00000000000
--- a/server/sonar-web/src/main/js/apps/account/projects/Projects.js
+++ /dev/null
@@ -1,67 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2017 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 React from 'react';
-import PropTypes from 'prop-types';
-import ProjectCard from './ProjectCard';
-import ListFooter from '../../../components/controls/ListFooter';
-import { projectsListType } from './propTypes';
-import { translate } from '../../../helpers/l10n';
-
-export default class Projects extends React.PureComponent {
-  static propTypes = {
-    projects: projectsListType.isRequired,
-    total: PropTypes.number.isRequired,
-    loading: PropTypes.bool.isRequired,
-    loadMore: PropTypes.func.isRequired
-  };
-
-  render() {
-    const { projects } = this.props;
-
-    return (
-      <div id="account-projects">
-        {projects.length === 0
-          ? <div className="js-no-results">
-              {translate('my_account.projects.no_results')}
-            </div>
-          : <p>
-              {translate('my_account.projects.description')}
-            </p>}
-
-        {projects.length > 0 &&
-          <ul className="account-projects-list">
-            {projects.map(project =>
-              <li key={project.key}>
-                <ProjectCard project={project} />
-              </li>
-            )}
-          </ul>}
-
-        {projects.length > 0 &&
-          <ListFooter
-            count={projects.length}
-            total={this.props.total}
-            ready={!this.props.loading}
-            loadMore={this.props.loadMore}
-          />}
-      </div>
-    );
-  }
-}
diff --git a/server/sonar-web/src/main/js/apps/account/projects/Projects.tsx b/server/sonar-web/src/main/js/apps/account/projects/Projects.tsx
new file mode 100644
index 00000000000..e3681c3465d
--- /dev/null
+++ b/server/sonar-web/src/main/js/apps/account/projects/Projects.tsx
@@ -0,0 +1,65 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 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 ProjectCard from './ProjectCard';
+import { IProject } from './types';
+import ListFooter from '../../../components/controls/ListFooter';
+import { translate } from '../../../helpers/l10n';
+
+interface Props {
+  loading: boolean;
+  loadMore: () => void;
+  projects: IProject[];
+  search: (query: string) => void;
+  total?: number;
+}
+
+export default function Projects(props: Props) {
+  const { projects } = props;
+
+  return (
+    <div id="account-projects">
+      {projects.length === 0
+        ? <div className="js-no-results">
+            {translate('my_account.projects.no_results')}
+          </div>
+        : <p>
+            {translate('my_account.projects.description')}
+          </p>}
+
+      {projects.length > 0 &&
+        <ul className="account-projects-list">
+          {projects.map(project =>
+            <li key={project.key}>
+              <ProjectCard project={project} />
+            </li>
+          )}
+        </ul>}
+
+      {projects.length > 0 &&
+        <ListFooter
+          count={projects.length}
+          total={props.total || 0}
+          ready={!props.loading}
+          loadMore={props.loadMore}
+        />}
+    </div>
+  );
+}
diff --git a/server/sonar-web/src/main/js/apps/account/projects/ProjectsContainer.js b/server/sonar-web/src/main/js/apps/account/projects/ProjectsContainer.tsx
index 69aea617c93..b822768884d 100644
--- a/server/sonar-web/src/main/js/apps/account/projects/ProjectsContainer.js
+++ b/server/sonar-web/src/main/js/apps/account/projects/ProjectsContainer.tsx
@@ -17,24 +17,28 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import React from 'react';
+import * as React from 'react';
 import Helmet from 'react-helmet';
 import Projects from './Projects';
 import { getMyProjects } from '../../../api/components';
 import { translate } from '../../../helpers/l10n';
 
-export default class ProjectsContainer extends React.PureComponent {
-  state = {
+interface State {
+  loading: boolean;
+  page: number;
+  projects?: any[];
+  query: string;
+  total?: number;
+}
+
+export default class ProjectsContainer extends React.PureComponent<{}, State> {
+  mounted: boolean;
+  state: State = {
     loading: true,
     page: 1,
     query: ''
   };
 
-  componentWillMount() {
-    this.loadMore = this.loadMore.bind(this);
-    this.search = this.search.bind(this);
-  }
-
   componentDidMount() {
     this.mounted = true;
     this.loadProjects();
@@ -46,15 +50,15 @@ export default class ProjectsContainer extends React.PureComponent {
 
   loadProjects(page = this.state.page, query = this.state.query) {
     this.setState({ loading: true });
-    const data = { ps: 100 };
+    const data: { [p: string]: any } = { ps: 100 };
     if (page > 1) {
       data.p = page;
     }
     if (query) {
       data.q = query;
     }
-    return getMyProjects(data).then(r => {
-      const projects = page > 1 ? [...this.state.projects, ...r.projects] : r.projects;
+    return getMyProjects(data).then((r: any) => {
+      const projects = page > 1 ? [...(this.state.projects || []), ...r.projects] : r.projects;
       this.setState({
         projects,
         query,
@@ -65,13 +69,9 @@ export default class ProjectsContainer extends React.PureComponent {
     });
   }
 
-  loadMore() {
-    return this.loadProjects(this.state.page + 1);
-  }
+  loadMore = () => this.loadProjects(this.state.page + 1);
 
-  search(query) {
-    return this.loadProjects(1, query);
-  }
+  search = (query: string) => this.loadProjects(1, query);
 
   render() {
     const helmet = <Helmet title={translate('my_account.projects')} />;
diff --git a/server/sonar-web/src/main/js/apps/account/projects/propTypes.js b/server/sonar-web/src/main/js/apps/account/projects/types.ts
index cae87b48906..76feb045c64 100644
--- a/server/sonar-web/src/main/js/apps/account/projects/propTypes.js
+++ b/server/sonar-web/src/main/js/apps/account/projects/types.ts
@@ -1,7 +1,7 @@
 /*
  * SonarQube
- * Copyright (C) 2009-2017 SonarSource SA
- * mailto:info AT sonarsource DOT com
+ * Copyright (C) 2009-2016 SonarSource SA
+ * mailto:contact 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
@@ -17,18 +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 PropTypes from 'prop-types';
-
-const { shape, string, array, arrayOf } = PropTypes;
-
-export const projectType = shape({
-  id: string.isRequired,
-  key: string.isRequired,
-  name: string.isRequired,
-  lastAnalysisDate: string,
-  description: string,
-  links: array.isRequired,
-  qualityGate: string
-});
-
-export const projectsListType = arrayOf(projectType);
+export interface IProject {
+  id: string;
+  key: string;
+  name: string;
+  lastAnalysisDate: string;
+  description: string;
+  links: Array<{
+    href: string;
+    name: string;
+    type: string;
+  }>;
+  qualityGate: string;
+}
diff --git a/server/sonar-web/src/main/js/apps/account/routes.js b/server/sonar-web/src/main/js/apps/account/routes.ts
index 2b92bf00f6b..90e66149504 100644
--- a/server/sonar-web/src/main/js/apps/account/routes.js
+++ b/server/sonar-web/src/main/js/apps/account/routes.ts
@@ -17,44 +17,46 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
+import { RouterState, IndexRouteProps, RouteComponent } from 'react-router';
+
 const routes = [
   {
-    getComponent(_, callback) {
+    getComponent(_: RouterState, callback: (err: any, component: RouteComponent) => any) {
       import('./components/Account').then(i => callback(null, i.default));
     },
     childRoutes: [
       {
-        getIndexRoute(_, callback) {
+        getIndexRoute(_: RouterState, callback: (err: any, route: IndexRouteProps) => any) {
           import('./profile/Profile').then(i => callback(null, { component: i.default }));
         }
       },
       {
         path: 'security',
-        getComponent(_, callback) {
+        getComponent(_: RouterState, callback: (err: any, component: RouteComponent) => any) {
           import('./components/Security').then(i => callback(null, i.default));
         }
       },
       {
         path: 'projects',
-        getComponent(_, callback) {
+        getComponent(_: RouterState, callback: (err: any, component: RouteComponent) => any) {
           import('./projects/ProjectsContainer').then(i => callback(null, i.default));
         }
       },
       {
         path: 'notifications',
-        getComponent(_, callback) {
+        getComponent(_: RouterState, callback: (err: any, component: RouteComponent) => any) {
           import('./notifications/Notifications').then(i => callback(null, i.default));
         }
       },
       {
         path: 'organizations',
-        getComponent(_, callback) {
+        getComponent(_: RouterState, callback: (err: any, component: RouteComponent) => any) {
           import('./organizations/UserOrganizations').then(i => callback(null, i.default));
         },
         childRoutes: [
           {
             path: 'create',
-            getComponent(_, callback) {
+            getComponent(_: RouterState, callback: (err: any, component: RouteComponent) => any) {
               import('./organizations/CreateOrganizationForm').then(i => callback(null, i.default));
             }
           }