Consolidate js/jsx indentation

Previously indentation was not checked at all and in order to avoid
reviewers time with style checks, we can enforce it with eslint.

Current js/jsx changes were made by: yarn lint-fix

Note this this change can easily become outdated so we need to
coordinate and merge it quickly as each rebase would loose previous
votes.

Change-Id: I85883fc8db924ad4ce9acad5acdd42aed7e4d0e4

35 files changed, 268 insertions, 265 deletions

diff --git a/web/.eslintrc b/web/.eslintrc
index 4527f2e9f..6576313e7 100644
--- a/web/.eslintrc
+++ b/web/.eslintrc
@@ -3,6 +3,8 @@ plugins:
   - standard
   - jest
 rules:
+  # SwitchCase value is a multiplicator of configured indentation value (2)
+  indent: ["error", 2, {"SwitchCase": 1}]
   no-var: error
   no-console: off
   semi: [error, never]
diff --git a/web/package.json b/web/package.json
index 7395778bb..50256f45a 100644
--- a/web/package.json
+++ b/web/package.json
@@ -52,7 +52,8 @@
     "build": "react-scripts build",
     "test": "react-scripts test --env=jsdom --watchAll=false",
     "eject": "react-scripts eject",
-    "lint": "eslint --ext .js --ext .jsx src"
+    "lint": "eslint --ext .js --ext .jsx src",
+    "lint-fix": "eslint --ext .js --ext .jsx --fix src"
   },
   "browserslist": [
     ">0.2%",
diff --git a/web/src/App.jsx b/web/src/App.jsx
index ab54441a3..b3f574524 100644
--- a/web/src/App.jsx
+++ b/web/src/App.jsx
@@ -119,7 +119,7 @@ class App extends React.Component {
     this.menu
       // Do not include '/tenants' route in white-label setup
       .filter(item =>
-              (tenant.whiteLabel && !item.globalRoute) || !tenant.whiteLabel)
+        (tenant.whiteLabel && !item.globalRoute) || !tenant.whiteLabel)
       .forEach((item, index) => {
         // We use react-router's render function to be able to pass custom props
         // to our route components (pages):
@@ -135,9 +135,9 @@ class App extends React.Component {
               <item.component {...item.props} {...routerProps} />
             )}
             exact
-            />
+          />
         )
-    })
+      })
     if (tenant.defaultRoute)
       allRoutes.push(
         <Redirect from='*' to={tenant.defaultRoute} key='default-route' />
@@ -222,16 +222,16 @@ class App extends React.Component {
     return (
       <ToastNotificationList>
         {errors.map(error => (
-         <TimedToastNotification
-             key={error.id}
-             type='error'
-             onDismiss={() => {this.props.dispatch(clearError(error.id))}}
-             >
-           <span title={moment.utc(error.date).tz(this.props.timezone).format()}>
-               <strong>{error.text}</strong> ({error.status})&nbsp;
-                   {error.url}
-             </span>
-         </TimedToastNotification>
+          <TimedToastNotification
+            key={error.id}
+            type='error'
+            onDismiss={() => {this.props.dispatch(clearError(error.id))}}
+          >
+            <span title={moment.utc(error.date).tz(this.props.timezone).format()}>
+              <strong>{error.text}</strong> ({error.status})&nbsp;
+              {error.url}
+            </span>
+          </TimedToastNotification>
         ))}
       </ToastNotificationList>
     )
@@ -259,7 +259,7 @@ class App extends React.Component {
             history.push(this.props.tenant.linkPrefix + '/config-errors')
             this.setState({showErrors: false})
           }}
-          >
+        >
           <NotificationDrawerListItemHeader
             title={item.source_context.project + ' | ' + ctxPath}
             variant="danger" />
diff --git a/web/src/Misc.jsx b/web/src/Misc.jsx
index 1633b897b..a329c2ca9 100644
--- a/web/src/Misc.jsx
+++ b/web/src/Misc.jsx
@@ -39,8 +39,8 @@ function ExternalLink(props) {
 }
 
 ExternalLink.propTypes = {
-    target: PropTypes.string,
-    children: PropTypes.node,
+  target: PropTypes.string,
+  children: PropTypes.node,
 }
 
 function buildExternalLink(buildish) {
diff --git a/web/src/actions/build.js b/web/src/actions/build.js
index 5ec58a668..ef8b5f530 100644
--- a/web/src/actions/build.js
+++ b/web/src/actions/build.js
@@ -68,7 +68,7 @@ export function renderTree(tenant, build, path, obj, textRenderer, defaultRender
   if ('children' in obj && obj.children) {
     node.nodes = obj.children.map(
       n => renderTree(tenant, build, path+obj.name+'/', n,
-                     textRenderer, defaultRenderer))
+        textRenderer, defaultRenderer))
   }
   if (obj.mimetype === 'application/directory') {
     name = obj.name + '/'
@@ -252,7 +252,7 @@ export const receiveBuildManifest = (buildId, manifest) => {
     type: BUILD_MANIFEST_SUCCESS,
     buildId: buildId,
     manifest: {tree: manifest.tree, index: index,
-               index_links: manifest.index_links},
+      index_links: manifest.index_links},
     receivedAt: Date.now()
   }
 }
@@ -398,7 +398,7 @@ export function fetchBuildAllInfo(tenant, buildId, logfileName) {
       if (logfileName) {
         dispatch(fetchLogfile(buildId, logfileName, getState()))
       }
-   } catch (error) {
+    } catch (error) {
       dispatch(failedBuild(buildId, error, tenant.apiPrefix))
     }
   }
@@ -446,7 +446,7 @@ const shouldFetchBuildset = (buildsetId, state) => {
 
 export const fetchBuildsetIfNeeded = (tenant, buildsetId, force) => (
   dispatch, getState) => {
-    if (force || shouldFetchBuildset(buildsetId, getState())) {
-      return dispatch(fetchBuildset(tenant, buildsetId))
-    }
+  if (force || shouldFetchBuildset(buildsetId, getState())) {
+    return dispatch(fetchBuildset(tenant, buildsetId))
+  }
 }
diff --git a/web/src/actions/change.js b/web/src/actions/change.js
index 88305aed0..e9ead6de7 100644
--- a/web/src/actions/change.js
+++ b/web/src/actions/change.js
@@ -53,8 +53,8 @@ const shouldFetchChange = state => {
 
 export const fetchChangeIfNeeded = (tenant, change, force) => (
   dispatch, getState) => {
-    if (force || shouldFetchChange(getState())) {
-      return dispatch(fetchChange(tenant, change))
-    }
-    return Promise.resolve()
+  if (force || shouldFetchChange(getState())) {
+    return dispatch(fetchChange(tenant, change))
+  }
+  return Promise.resolve()
 }
diff --git a/web/src/actions/configErrors.js b/web/src/actions/configErrors.js
index 8f52f0632..e4b17d801 100644
--- a/web/src/actions/configErrors.js
+++ b/web/src/actions/configErrors.js
@@ -19,7 +19,7 @@ export function fetchConfigErrorsAction (tenant) {
     return fetchConfigErrors(tenant.apiPrefix)
       .then(response => {
         dispatch({type: 'FETCH_CONFIGERRORS_SUCCESS',
-                  errors: response.data})
+          errors: response.data})
       })
       .catch(error => {
         throw (error)
diff --git a/web/src/actions/job.js b/web/src/actions/job.js
index 039582637..edab60cec 100644
--- a/web/src/actions/job.js
+++ b/web/src/actions/job.js
@@ -59,8 +59,8 @@ const shouldFetchJob = (tenant, jobname, state) => {
 
 export const fetchJobIfNeeded = (tenant, jobname, force) => (
   dispatch, getState) => {
-    if (force || shouldFetchJob(tenant, jobname, getState())) {
-      return dispatch(fetchJob(tenant, jobname))
-    }
-    return Promise.resolve()
+  if (force || shouldFetchJob(tenant, jobname, getState())) {
+    return dispatch(fetchJob(tenant, jobname))
+  }
+  return Promise.resolve()
 }
diff --git a/web/src/actions/labels.js b/web/src/actions/labels.js
index 023550035..a285bbf7c 100644
--- a/web/src/actions/labels.js
+++ b/web/src/actions/labels.js
@@ -54,7 +54,7 @@ const shouldFetchLabels = (tenant, state) => {
 
 export const fetchLabelsIfNeeded = (tenant, force) => (
   dispatch, getState) => {
-    if (force || shouldFetchLabels(tenant, getState())) {
-      return dispatch(fetchLabels(tenant))
-    }
+  if (force || shouldFetchLabels(tenant, getState())) {
+    return dispatch(fetchLabels(tenant))
+  }
 }
diff --git a/web/src/actions/nodes.js b/web/src/actions/nodes.js
index a456c3fbe..e4ce4d5a8 100644
--- a/web/src/actions/nodes.js
+++ b/web/src/actions/nodes.js
@@ -57,7 +57,7 @@ const shouldFetchNodes = (tenant, state) => {
 
 export const fetchNodesIfNeeded = (tenant, force) => (
   dispatch, getState) => {
-    if (force || shouldFetchNodes(tenant, getState())) {
-      return dispatch(fetchNodes(tenant))
-    }
+  if (force || shouldFetchNodes(tenant, getState())) {
+    return dispatch(fetchNodes(tenant))
+  }
 }
diff --git a/web/src/actions/project.js b/web/src/actions/project.js
index a780ac8f3..de1da2197 100644
--- a/web/src/actions/project.js
+++ b/web/src/actions/project.js
@@ -91,8 +91,8 @@ const shouldFetchProject = (tenant, projectName, state) => {
 
 export const fetchProjectIfNeeded = (tenant, project, force) => (
   dispatch, getState) => {
-    if (force || shouldFetchProject(tenant, project, getState())) {
-      return dispatch(fetchProject(tenant, project))
-    }
-    return Promise.resolve()
+  if (force || shouldFetchProject(tenant, project, getState())) {
+    return dispatch(fetchProject(tenant, project))
+  }
+  return Promise.resolve()
 }
diff --git a/web/src/actions/projects.js b/web/src/actions/projects.js
index 3e711c1ca..118388ab2 100644
--- a/web/src/actions/projects.js
+++ b/web/src/actions/projects.js
@@ -54,8 +54,8 @@ const shouldFetchProjects = (tenant, state) => {
 
 export const fetchProjectsIfNeeded = (tenant, force) => (
   dispatch, getState) => {
-    if (force || shouldFetchProjects(tenant, getState())) {
-      return dispatch(fetchProjects(tenant))
-    }
-    return Promise.resolve()
+  if (force || shouldFetchProjects(tenant, getState())) {
+    return dispatch(fetchProjects(tenant))
+  }
+  return Promise.resolve()
 }
diff --git a/web/src/api.js b/web/src/api.js
index df49278b2..bf9abc0b3 100644
--- a/web/src/api.js
+++ b/web/src/api.js
@@ -97,7 +97,7 @@ const apiUrl = getZuulUrl()
 
 function getStreamUrl (apiPrefix) {
   const streamUrl = (apiUrl + apiPrefix)
-        .replace(/(http)(s)?:\/\//, 'ws$2://') + 'console-stream'
+    .replace(/(http)(s)?:\/\//, 'ws$2://') + 'console-stream'
   // console.log('Stream url is ', streamUrl)
   return streamUrl
 }
diff --git a/web/src/containers/Errors.jsx b/web/src/containers/Errors.jsx
index dcd3040e5..f6ce45a4f 100644
--- a/web/src/containers/Errors.jsx
+++ b/web/src/containers/Errors.jsx
@@ -44,10 +44,10 @@ function EmptyPage(props) {
 }
 
 EmptyPage.propTypes = {
-    title: PropTypes.string.isRequired,
-    icon: PropTypes.func.isRequired,
-    linkTarget: PropTypes.string.isRequired,
-    linkText: PropTypes.string.isRequired,
+  title: PropTypes.string.isRequired,
+  icon: PropTypes.func.isRequired,
+  linkTarget: PropTypes.string.isRequired,
+  linkText: PropTypes.string.isRequired,
 }
 
 export { EmptyPage }
diff --git a/web/src/containers/build/Artifact.jsx b/web/src/containers/build/Artifact.jsx
index e9d6243a4..4d4259440 100644
--- a/web/src/containers/build/Artifact.jsx
+++ b/web/src/containers/build/Artifact.jsx
@@ -51,10 +51,10 @@ class ArtifactList extends React.Component {
 
     const nodes = artifacts.map((artifact, index) => {
       const node = {text: <a href={artifact.url}>{artifact.name}</a>,
-                    icon: null}
+        icon: null}
       if (artifact.metadata) {
         node['nodes']= [{text: <Artifact key={index} artifact={artifact}/>,
-                         icon: ''}]
+          icon: ''}]
       }
       return node
     })
diff --git a/web/src/containers/build/BuildOutput.jsx b/web/src/containers/build/BuildOutput.jsx
index c36882434..03fe17ce7 100644
--- a/web/src/containers/build/BuildOutput.jsx
+++ b/web/src/containers/build/BuildOutput.jsx
@@ -16,24 +16,24 @@ import * as React from 'react'
 import { Fragment } from 'react'
 import PropTypes from 'prop-types'
 import {
-    Card,
-    CardBody,
-    CardHeader,
-    DataList,
-    DataListItem,
-    DataListItemRow,
-    DataListItemCells,
-    DataListCell,
-    Label,
-    Flex,
-    FlexItem,
+  Card,
+  CardBody,
+  CardHeader,
+  DataList,
+  DataListItem,
+  DataListItemRow,
+  DataListItemCells,
+  DataListCell,
+  Label,
+  Flex,
+  FlexItem,
 } from '@patternfly/react-core'
 
 import {
-    CheckCircleIcon,
-    InfoCircleIcon,
-    TimesIcon,
-    TimesCircleIcon,
+  CheckCircleIcon,
+  InfoCircleIcon,
+  TimesIcon,
+  TimesCircleIcon,
 } from '@patternfly/react-icons'
 
 class BuildOutput extends React.Component {
@@ -42,59 +42,59 @@ class BuildOutput extends React.Component {
   }
 
   renderHosts (hosts) {
-      return (
-        <Card>
-          <CardHeader>
-            <strong>Task run summary</strong>
-          </CardHeader>
-          <CardBody>
-            <DataList aria-label="Build Results">
-              {Object.entries(hosts).map(([host, values]) => (
-                <DataListItem key={host} aria-label="Host">
-                  <DataListItemRow>
-                    <DataListItemCells
-                      dataListCells={[
-                        <DataListCell key={host + '.name'}>{host} </DataListCell>,
-                        <DataListCell key={host + '.data'}>
-                          <Flex>
-                            <FlexItem>
-                              <Label color="green" icon={<CheckCircleIcon />}>{values.ok} OK</Label>
-                            </FlexItem>
-                            <FlexItem>
-                              <Label color="orange" icon={<InfoCircleIcon />}>{values.changed} changed</Label>
-                            </FlexItem>
-                            <FlexItem>
-                              <Label color="red" icon={<TimesCircleIcon />}>{values.failures} failed</Label>
-                            </FlexItem>
-                          </Flex>
-                        </DataListCell>
-                      ]}
-                    />
-                  </DataListItemRow>
-                </DataListItem>
-              ))}
-            </DataList>
-          </CardBody>
-        </Card>
-      )
+    return (
+      <Card>
+        <CardHeader>
+          <strong>Task run summary</strong>
+        </CardHeader>
+        <CardBody>
+          <DataList aria-label="Build Results">
+            {Object.entries(hosts).map(([host, values]) => (
+              <DataListItem key={host} aria-label="Host">
+                <DataListItemRow>
+                  <DataListItemCells
+                    dataListCells={[
+                      <DataListCell key={host + '.name'}>{host} </DataListCell>,
+                      <DataListCell key={host + '.data'}>
+                        <Flex>
+                          <FlexItem>
+                            <Label color="green" icon={<CheckCircleIcon />}>{values.ok} OK</Label>
+                          </FlexItem>
+                          <FlexItem>
+                            <Label color="orange" icon={<InfoCircleIcon />}>{values.changed} changed</Label>
+                          </FlexItem>
+                          <FlexItem>
+                            <Label color="red" icon={<TimesCircleIcon />}>{values.failures} failed</Label>
+                          </FlexItem>
+                        </Flex>
+                      </DataListCell>
+                    ]}
+                  />
+                </DataListItemRow>
+              </DataListItem>
+            ))}
+          </DataList>
+        </CardBody>
+      </Card>
+    )
   }
 
   renderFailedTask (host, task) {
     const max_lines = 42
     return (
       <Card key={host + task.zuul_log_id}>
-          <CardHeader>
-            <TimesIcon style={{ color: 'var(--pf-global--danger-color--100)' }}/>
+        <CardHeader>
+          <TimesIcon style={{ color: 'var(--pf-global--danger-color--100)' }}/>
             &nbsp;Task&nbsp;<strong>{task.name}</strong>&nbsp;
             failed running on host&nbsp;<strong>{host}</strong>
-          </CardHeader>
+        </CardHeader>
         <CardBody>
           {task.invocation && task.invocation.module_args &&
            task.invocation.module_args._raw_params && (
-             <pre key="cmd" title="cmd" className={`${'cmd'}`}>
-               {task.invocation.module_args._raw_params}
-             </pre>
-           )}
+            <pre key="cmd" title="cmd" className={`${'cmd'}`}>
+              {task.invocation.module_args._raw_params}
+            </pre>
+          )}
           {task.msg && (
             <pre key="msg" title="msg">{task.msg}</pre>
           )}
@@ -109,23 +109,23 @@ class BuildOutput extends React.Component {
                     {task.stdout_lines.slice(0, -max_lines).join('\n')}
                   </pre>
                 </details>)}
-            <pre key="stdout" title="stdout">
-              {task.stdout_lines.slice(-max_lines).join('\n')}
+              <pre key="stdout" title="stdout">
+                {task.stdout_lines.slice(-max_lines).join('\n')}
               </pre>
-              </Fragment>
+            </Fragment>
           )}
           {task.stderr_lines && task.stderr_lines.length > 0 && (
             <Fragment>
               {task.stderr_lines.length > max_lines && (
-                  <details className={`${'foldable'} ${'stderr'}`}><summary></summary>
-                    <pre key="stderr" title="stderr">
-                      {task.stderr_lines.slice(0, -max_lines).join('\n')}
-                    </pre>
-                  </details>
-                )}
-            <pre key="stderr" title="stderr">
-              {task.stderr_lines.slice(-max_lines).join('\n')}
-            </pre>
+                <details className={`${'foldable'} ${'stderr'}`}><summary></summary>
+                  <pre key="stderr" title="stderr">
+                    {task.stderr_lines.slice(0, -max_lines).join('\n')}
+                  </pre>
+                </details>
+              )}
+              <pre key="stderr" title="stderr">
+                {task.stderr_lines.slice(-max_lines).join('\n')}
+              </pre>
             </Fragment>
           )}
         </CardBody>
@@ -137,11 +137,11 @@ class BuildOutput extends React.Component {
     const { output } = this.props
     return (
       <React.Fragment>
-          {this.renderHosts(output)}
-          {Object.entries(output)
-           .filter(([, values]) => values.failed.length > 0)
-           .map(([host, values]) => (values.failed.map(failed => (
-             this.renderFailedTask(host, failed)))))}
+        {this.renderHosts(output)}
+        {Object.entries(output)
+          .filter(([, values]) => values.failed.length > 0)
+          .map(([host, values]) => (values.failed.map(failed => (
+            this.renderFailedTask(host, failed)))))}
       </React.Fragment>
     )
   }
diff --git a/web/src/containers/build/Console.jsx b/web/src/containers/build/Console.jsx
index 0e6c06f8e..3e065db94 100644
--- a/web/src/containers/build/Console.jsx
+++ b/web/src/containers/build/Console.jsx
@@ -228,9 +228,9 @@ class HostTask extends React.Component {
     let duration = moment.duration(
       moment(task.task.duration.end).diff(task.task.duration.start)
     ).format({
-        template: 'h [hr] m [min] s [sec]',
-        largest: 2,
-        minValue: 1,
+      template: 'h [hr] m [min] s [sec]',
+      largest: 2,
+      minValue: 1,
     })
 
     ai.push(
@@ -273,7 +273,7 @@ class HostTask extends React.Component {
           }
         </ListView.Item>
         <Modal key='modal' show={this.state.showModal} onHide={this.close}
-               dialogClassName="zuul-console-task-detail">
+          dialogClassName="zuul-console-task-detail">
           <Modal.Header>
             <button
               className="close"
@@ -336,27 +336,27 @@ class PlayBook extends React.Component {
         heading={playbook.phase[0].toUpperCase() + playbook.phase.slice(1) + ' playbook'}
         description={playbook.playbook}
       >
-          {playbook.plays.map((play, idx) => (
-            <React.Fragment key={idx}>
-              <Row key='play'>
-                <Col sm={12}>
-                  <strong>Play: {play.play.name}</strong>
-                </Col>
-              </Row>
-              {play.tasks.map((task, idx2) => (
-                Object.entries(task.hosts).map(([hostname, host]) => (
-                  <Row key={idx2+hostname}>
-                    <Col sm={12}>
-                      <HostTask hostname={hostname}
-                                taskPath={taskPath.concat([
-                                  idx.toString(), idx2.toString(), hostname])}
-                                displayPath={displayPath} task={task} host={host}
-                                errorIds={errorIds}/>
-                    </Col>
-                  </Row>
-                ))))}
-            </React.Fragment>
-          ))}
+        {playbook.plays.map((play, idx) => (
+          <React.Fragment key={idx}>
+            <Row key='play'>
+              <Col sm={12}>
+                <strong>Play: {play.play.name}</strong>
+              </Col>
+            </Row>
+            {play.tasks.map((task, idx2) => (
+              Object.entries(task.hosts).map(([hostname, host]) => (
+                <Row key={idx2+hostname}>
+                  <Col sm={12}>
+                    <HostTask hostname={hostname}
+                      taskPath={taskPath.concat([
+                        idx.toString(), idx2.toString(), hostname])}
+                      displayPath={displayPath} task={task} host={host}
+                      errorIds={errorIds}/>
+                  </Col>
+                </Row>
+              ))))}
+          </React.Fragment>
+        ))}
       </ListView.Item>
     )
   }
@@ -377,7 +377,7 @@ class Console extends React.Component {
         <ListView key="playbooks" className="zuul-console">
           {output.map((playbook, idx) => (
             <PlayBook key={idx} playbook={playbook} taskPath={[idx.toString()]}
-                      displayPath={displayPath} errorIds={errorIds}/>))}
+              displayPath={displayPath} errorIds={errorIds}/>))}
         </ListView>
       </React.Fragment>
     )
diff --git a/web/src/containers/config/Config.jsx b/web/src/containers/config/Config.jsx
index 36de8fd5e..7c21229cb 100644
--- a/web/src/containers/config/Config.jsx
+++ b/web/src/containers/config/Config.jsx
@@ -39,7 +39,7 @@ class ConfigModal extends React.Component {
     this.state = {
       isModalOpen: false,
       autoReload: false,
-     }
+    }
     this.handleModalToggle = () => {
       this.setState(({ isModalOpen }) => ({
         isModalOpen: !isModalOpen
@@ -73,7 +73,7 @@ class ConfigModal extends React.Component {
           variant={ButtonVariant.plain}
           key="cog"
           onClick={this.handleModalToggle}>
-           <CogIcon />
+          <CogIcon />
         </Button>
         <Modal
           variant={ModalVariant.small}
@@ -88,23 +88,23 @@ class ConfigModal extends React.Component {
               Cancel
             </Button>
           ]}
-          >
-            <div>
-              <p key="info">User configurable settings are saved in browser local storage only.</p>
-              <Switch
-                key="autoreload"
-                id="autoreload"
-                label="Auto reload status page"
-                isChecked={autoReload}
-                onChange={this.handleAutoReload}
-              />
-            </div>
+        >
+          <div>
+            <p key="info">User configurable settings are saved in browser local storage only.</p>
+            <Switch
+              key="autoreload"
+              id="autoreload"
+              label="Auto reload status page"
+              isChecked={autoReload}
+              onChange={this.handleAutoReload}
+            />
+          </div>
         </Modal>
-        </React.Fragment>
+      </React.Fragment>
     )
   }
 }
 
 export default connect(state => ({
-    preferences: state.preferences,
-  }))(ConfigModal)
+  preferences: state.preferences,
+}))(ConfigModal)
diff --git a/web/src/containers/job/Job.jsx b/web/src/containers/job/Job.jsx
index 2e62ae09e..0ff33c530 100644
--- a/web/src/containers/job/Job.jsx
+++ b/web/src/containers/job/Job.jsx
@@ -87,7 +87,7 @@ class Job extends React.Component {
                   variant={job[variantIdx]}
                   descriptionMaxHeight={descriptionMaxHeight}
                   parent={this}
-                  />
+                />
               </TabPane>
             </TabContent>
           </div>
diff --git a/web/src/containers/job/JobProject.jsx b/web/src/containers/job/JobProject.jsx
index a34271b60..5cff95b39 100644
--- a/web/src/containers/job/JobProject.jsx
+++ b/web/src/containers/job/JobProject.jsx
@@ -27,9 +27,9 @@ class JobProject extends React.Component {
       <span>
         {project.project_name}
         {project.override_branch && (
-        ' ( override-branch: ' + project.override_branch + ')')}
+          ' ( override-branch: ' + project.override_branch + ')')}
         {project.override_checkout && (
-        ' ( override-checkout: ' + project.override_checkout+ ')')}
+          ' ( override-checkout: ' + project.override_checkout+ ')')}
       </span>
     )
   }
diff --git a/web/src/containers/job/JobVariant.jsx b/web/src/containers/job/JobVariant.jsx
index 2bd5984c1..5e33e028d 100644
--- a/web/src/containers/job/JobVariant.jsx
+++ b/web/src/containers/job/JobVariant.jsx
@@ -68,12 +68,12 @@ class JobVariant extends React.Component {
 
     return (
       <div className="list-view-pf-additional-info">
-          {status.map((item, idx) => (
-            <div key={idx} className="list-view-pf-additional-info-item">
-              <Icon type='pf' name={item.icon} />
-              {item.name}
-            </div>
-          ))}
+        {status.map((item, idx) => (
+          <div key={idx} className="list-view-pf-additional-info-item">
+            <Icon type='pf' name={item.icon} />
+            {item.name}
+          </div>
+        ))}
       </div>
     )
   }
@@ -145,10 +145,10 @@ class JobVariant extends React.Component {
         }
         value = (
           <ReactHeight onHeightReady={height => {
-              if (height > descriptionMaxHeight) {
-                this.props.parent.setState({descriptionMaxHeight: height})
-              }
-            }}>
+            if (height > descriptionMaxHeight) {
+              this.props.parent.setState({descriptionMaxHeight: height})
+            }
+          }}>
             <div style={style}>
               {value}
             </div>
diff --git a/web/src/containers/job/Nodeset.jsx b/web/src/containers/job/Nodeset.jsx
index 14aba1b7d..7e0055a2d 100644
--- a/web/src/containers/job/Nodeset.jsx
+++ b/web/src/containers/job/Nodeset.jsx
@@ -53,7 +53,7 @@ class Nodeset extends React.Component {
                 {groups.length > 0 && ' (' + groups.map(item => (item)) + ') '}
               </span>
             </li>)
-          })}
+        })}
       </ul>
     )
     return (
diff --git a/web/src/containers/jobs/Jobs.jsx b/web/src/containers/jobs/Jobs.jsx
index 9bd54ca68..d7ab4bc69 100644
--- a/web/src/containers/jobs/Jobs.jsx
+++ b/web/src/containers/jobs/Jobs.jsx
@@ -117,11 +117,11 @@ class JobsList extends React.Component {
       let filters = filter.replace(/ +/g, ',').split(',')
       for (let job of jobs) {
         filters.forEach(jobFilter => {
-         if (jobFilter && (
-              (job.name.indexOf(jobFilter) !== -1) ||
+          if (jobFilter && (
+            (job.name.indexOf(jobFilter) !== -1) ||
               (job.description && job.description.indexOf(jobFilter) !== -1))) {
             getNode(job, !filtered)
-         }
+          }
         })
       }
     }
@@ -171,7 +171,7 @@ class JobsList extends React.Component {
               <FormControl.Feedback>
                 <span
                   onClick={() => {this.setState({filter: ''})
-                                 this.filter.value = ''}}
+                    this.filter.value = ''}}
                   style={{cursor: 'pointer', zIndex: 10, pointerEvents: 'auto'}}
                 >
                   <Icon type='pf' title='Clear filter' name='delete' />
diff --git a/web/src/containers/status/Change.jsx b/web/src/containers/status/Change.jsx
index b4d9be31d..30043d103 100644
--- a/web/src/containers/status/Change.jsx
+++ b/web/src/containers/status/Change.jsx
@@ -51,9 +51,9 @@ class Change extends React.Component {
       }
     }
     const icon = (
-        <span
-          className={'zuul-build-status ' + iconGlyph}
-          title={iconTitle} />
+      <span
+        className={'zuul-build-status ' + iconGlyph}
+        title={iconTitle} />
     )
     if (change.live) {
       return (
diff --git a/web/src/containers/status/ChangePanel.jsx b/web/src/containers/status/ChangePanel.jsx
index 9f3f3456a..a407bb6c8 100644
--- a/web/src/containers/status/ChangePanel.jsx
+++ b/web/src/containers/status/ChangePanel.jsx
@@ -203,7 +203,7 @@ class ChangePanel extends React.Component {
 
     return (
       <div className='progress zuul-job-result'
-            title={title}>
+        title={title}>
         <div className={'progress-bar ' + className}
           role='progressbar'
           aria-valuenow={progressPercent}
@@ -306,7 +306,7 @@ class ChangePanel extends React.Component {
     const header = (
       <div className='panel panel-default zuul-change'>
         <div className='panel-heading zuul-patchset-header'
-             onClick={this.onClick}>
+          onClick={this.onClick}>
           <div className='row'>
             <div className='col-xs-8'>
               <span className='change_project'>{change.project}</span>
diff --git a/web/src/containers/status/ChangeQueue.jsx b/web/src/containers/status/ChangeQueue.jsx
index 97218b76a..8bb45899c 100644
--- a/web/src/containers/status/ChangeQueue.jsx
+++ b/web/src/containers/status/ChangeQueue.jsx
@@ -40,7 +40,7 @@ class ChangeQueue extends React.Component {
             queue={queue}
             expanded={expanded}
             key={changeIdx.toString() + idx}
-            />)
+          />)
       })
     })
     return (
diff --git a/web/src/containers/status/Pipeline.jsx b/web/src/containers/status/Pipeline.jsx
index 0c0d06fe8..0d4f67de8 100644
--- a/web/src/containers/status/Pipeline.jsx
+++ b/web/src/containers/status/Pipeline.jsx
@@ -95,7 +95,7 @@ class Pipeline extends React.Component {
       changes.forEach(change => {
         filters.forEach(changeFilter => {
           if (changeFilter && (
-              (change.project && change.project.indexOf(changeFilter) !== -1) ||
+            (change.project && change.project.indexOf(changeFilter) !== -1) ||
               (change.id && change.id.indexOf(changeFilter) !== -1))) {
             found = true
             return
@@ -127,17 +127,17 @@ class Pipeline extends React.Component {
             </small>) : ''}
         </div>
         {pipeline.change_queues.filter(item => item.heads.length > 0)
-         .filter(item => (!filter || (
-           filter.indexOf(pipeline.name) !== -1 ||
+          .filter(item => (!filter || (
+            filter.indexOf(pipeline.name) !== -1 ||
              this.filterQueue(item, filter)
-         )))
+          )))
           .map(changeQueue => (
             <ChangeQueue
               queue={changeQueue}
               expanded={expanded}
               pipeline={pipeline.name}
               key={changeQueue.uuid}
-              />
+            />
           ))}
       </div>
     )
diff --git a/web/src/containers/timezone/SelectTz.jsx b/web/src/containers/timezone/SelectTz.jsx
index 8955129aa..aaa585336 100644
--- a/web/src/containers/timezone/SelectTz.jsx
+++ b/web/src/containers/timezone/SelectTz.jsx
@@ -20,8 +20,8 @@ import { setTimezoneAction } from '../../actions/timezone'
 
 class SelectTz extends React.Component {
    static propTypes = {
-      dispatch: PropTypes.func
-  }
+     dispatch: PropTypes.func
+   }
 
   state = {
     availableTz: moment.tz.names().map(item => ({value: item, label: item})),
@@ -94,27 +94,27 @@ class SelectTz extends React.Component {
       })
     }
     return (
-        <div style={containerStyles}>
+      <div style={containerStyles}>
         <OutlinedClockIcon/>
         <Select
-            className="zuul-select-tz"
-            styles={customStyles}
-            value={this.state.currentValue}
-            onChange={this.handleChange}
-            options={this.state.availableTz}
-            noOptionsMessage={() => 'No api found'}
-            placeholder={'Select Tz'}
-            defaultValue={this.state.defaultValue}
-            theme={(theme) => ({
-              ...theme,
-              borderRadius: 0,
-              spacing: {
+          className="zuul-select-tz"
+          styles={customStyles}
+          value={this.state.currentValue}
+          onChange={this.handleChange}
+          options={this.state.availableTz}
+          noOptionsMessage={() => 'No api found'}
+          placeholder={'Select Tz'}
+          defaultValue={this.state.defaultValue}
+          theme={(theme) => ({
+            ...theme,
+            borderRadius: 0,
+            spacing: {
               ...theme.spacing,
-                baseUnit: 2,
-              },
-            })}
-          />
-        </div>
+              baseUnit: 2,
+            },
+          })}
+        />
+      </div>
     )
   }
 }
diff --git a/web/src/pages/Jobs.jsx b/web/src/pages/Jobs.jsx
index 4237a4ca0..d0b6a1466 100644
--- a/web/src/pages/Jobs.jsx
+++ b/web/src/pages/Jobs.jsx
@@ -60,8 +60,8 @@ class JobsPage extends React.Component {
         </PageSection>
         {jobs && jobs.length > 0 &&
           <Jobs
-              jobs={jobs}
-              />}
+            jobs={jobs}
+          />}
       </PageSection>
     )
   }
diff --git a/web/src/pages/Status.jsx b/web/src/pages/Status.jsx
index 4245c26e6..dd83ba7e5 100644
--- a/web/src/pages/Status.jsx
+++ b/web/src/pages/Status.jsx
@@ -165,14 +165,14 @@ class StatusPage extends React.Component {
     return (
       <p>
         Queue lengths: <span>{status.trigger_event_queue ?
-                              status.trigger_event_queue.length : '0'
-          }</span> events,&nbsp;
+          status.trigger_event_queue.length : '0'
+        }</span> events,&nbsp;
         <span>{status.management_event_queue ?
-              status.management_event_queue.length : '0'
-          }</span> management events,&nbsp;
+          status.management_event_queue.length : '0'
+        }</span> management events,&nbsp;
         <span>{status.result_event_queue ?
-              status.result_event_queue.length : '0'
-          }</span> results.
+          status.result_event_queue.length : '0'
+        }</span> results.
       </p>
     )
   }
@@ -183,7 +183,7 @@ class StatusPage extends React.Component {
         <p>Zuul version: <span>{status.zuul_version}</span></p>
         {status.last_reconfigured ? (
           <p>Last reconfigured: <span>
-              {moment.utc(status.last_reconfigured).tz(this.props.timezone).format('llll')}
+            {moment.utc(status.last_reconfigured).tz(this.props.timezone).format('llll')}
           </span></p>) : ''}
       </React.Fragment>
     )
@@ -206,17 +206,17 @@ class StatusPage extends React.Component {
             defaultValue={filter}
             inputRef={i => this.filter = i}
             onKeyPress={this.handleKeyPress} />
-            {filter && (
-          <FormControl.Feedback>
-            <span
-              onClick={() => {this.setFilter('')}}
-              style={{cursor: 'pointer', zIndex: 10, pointerEvents: 'auto'}}
+          {filter && (
+            <FormControl.Feedback>
+              <span
+                onClick={() => {this.setFilter('')}}
+                style={{cursor: 'pointer', zIndex: 10, pointerEvents: 'auto'}}
               >
-              <Icon type='pf' title='Clear filter' name='delete' />
+                <Icon type='pf' title='Clear filter' name='delete' />
               &nbsp;
-            </span>
-          </FormControl.Feedback>
-            )}
+              </span>
+            </FormControl.Feedback>
+          )}
         </FormGroup>
         <FormGroup controlId='status'>
           &nbsp; Expand by default:&nbsp;
@@ -244,7 +244,7 @@ class StatusPage extends React.Component {
               filter={filter}
               expanded={expanded}
               key={item.name}
-              />
+            />
           ))}
         </div>
         {status && this.renderStatusFooter(status)}
diff --git a/web/src/pages/Stream.jsx b/web/src/pages/Stream.jsx
index a6f82302e..b8c9966aa 100644
--- a/web/src/pages/Stream.jsx
+++ b/web/src/pages/Stream.jsx
@@ -126,11 +126,11 @@ class StreamPage extends React.Component {
         console.log('Stop Attempting!', e)
       },
       onclose: e => {
-       console.log('onclose', e)
-       this.onMessage('\n--- END OF STREAM ---\n')
+        console.log('onclose', e)
+        this.onMessage('\n--- END OF STREAM ---\n')
       },
       onerror: e => {
-       console.log('onerror:', e)
+        console.log('onerror:', e)
       }
     })
 
diff --git a/web/src/pages/Tenants.jsx b/web/src/pages/Tenants.jsx
index 1ca2c35a7..fdffb8e62 100644
--- a/web/src/pages/Tenants.jsx
+++ b/web/src/pages/Tenants.jsx
@@ -64,15 +64,15 @@ class TenantsPage extends React.Component {
     const tenants = remoteData.tenants.map((tenant) => {
       return {
         cells: [
-        {title: (<b>{tenant.name}</b>)},
-        {title: (<Link to={'/t/' + tenant.name + '/status'}>Status</Link>)},
-        {title: (<Link to={'/t/' + tenant.name + '/projects'}>Projects</Link>)},
-        {title: (<Link to={'/t/' + tenant.name + '/jobs'}>Jobs</Link>)},
-        {title: (<Link to={'/t/' + tenant.name + '/builds'}>Builds</Link>)},
-        {title: (<Link to={'/t/' + tenant.name + '/buildsets'}>Buildsets</Link>)},
-        tenant.projects,
-        tenant.queue
-      ]}})
+          {title: (<b>{tenant.name}</b>)},
+          {title: (<Link to={'/t/' + tenant.name + '/status'}>Status</Link>)},
+          {title: (<Link to={'/t/' + tenant.name + '/projects'}>Projects</Link>)},
+          {title: (<Link to={'/t/' + tenant.name + '/jobs'}>Jobs</Link>)},
+          {title: (<Link to={'/t/' + tenant.name + '/builds'}>Builds</Link>)},
+          {title: (<Link to={'/t/' + tenant.name + '/buildsets'}>Buildsets</Link>)},
+          tenant.projects,
+          tenant.queue
+        ]}})
     const columns = [
       {
         title: <IconProperty icon={<HomeIcon />} value="Name"/>,
@@ -117,9 +117,9 @@ class TenantsPage extends React.Component {
           rows={tenants}
           className="zuul-tenant-table"
         >
-        <TableHeader />
-        <TableBody />
-      </Table>
+          <TableHeader />
+          <TableBody />
+        </Table>
       </PageSection>
     )
   }
diff --git a/web/src/reducers/errors.js b/web/src/reducers/errors.js
index 165bb02d0..cbb7f511b 100644
--- a/web/src/reducers/errors.js
+++ b/web/src/reducers/errors.js
@@ -30,7 +30,7 @@ export default (state = [], action) => {
   switch (action.type) {
     case ADD_ERROR:
       if (state.filter(error => (
-            error.url === action.error.url &&
+        error.url === action.error.url &&
             error.status === action.error.status)).length > 0)
         return state
       action.error.id = action.id
diff --git a/web/src/reducers/preferences.js b/web/src/reducers/preferences.js
index 860e91a78..6ca81028b 100644
--- a/web/src/reducers/preferences.js
+++ b/web/src/reducers/preferences.js
@@ -34,11 +34,11 @@ export default (state = {
 }, action) => {
   let newstate
   switch (action.type) {
-  case PREFERENCE_SET:
-    newstate = update(state, {$merge: {[action.key]: action.value}})
-    localStorage.setItem('preferences', JSON.stringify(newstate))
-    return newstate
-  default:
-    return state
+    case PREFERENCE_SET:
+      newstate = update(state, {$merge: {[action.key]: action.value}})
+      localStorage.setItem('preferences', JSON.stringify(newstate))
+      return newstate
+    default:
+      return state
   }
 }
diff --git a/web/src/reducers/timezone.js b/web/src/reducers/timezone.js
index c382ab0d3..c70fed612 100644
--- a/web/src/reducers/timezone.js
+++ b/web/src/reducers/timezone.js
@@ -13,10 +13,10 @@
 import { TIMEZONE_SET } from '../actions/timezone'
 
 export default (state = 'UTC', action) => {
-    switch (action.type) {
-      case TIMEZONE_SET:
-        return action.timezone
-      default:
-        return state
-    }
+  switch (action.type) {
+    case TIMEZONE_SET:
+      return action.timezone
+    default:
+      return state
   }
+}