Skip to content

Commit 5cd8e48

Browse files
authored
Eslint fixes (#80)
## Changes ### Linting - Introduce ESLint to cadence-web - Follows style guide documented here: https://github.com/uber-web/uber-eslint - Introduce babel for compilation (needed for some of the eslint rules to be able to be applied such as spread operator) - Upgraded docker node version to allow for babel compilation ### Bug fixes - JSON tab now shows graph when toggled on - Compact mode now displays a cursor when hovering over an activity - Race condition initially loading page with 2 API calls which one of the callbacks rely on data from the other API. ### Note - Moving files into more sensible locations rather than everything in `/client` root. - Some of the eslint rules have been disabled inline in the code as some of the eslint fixes are harder to fix. In a future PR I will try to address each of these and gradually remove all of them.
1 parent e38f40e commit 5cd8e48

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

73 files changed

+3997
-2369
lines changed

.babelrc

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
{
2-
"presets": [[
3-
"env",
4-
{
5-
"targets": {
6-
"node": "current"
2+
"presets": [
3+
[
4+
"env",
5+
{
6+
"targets": {
7+
"node": "current"
8+
}
79
}
8-
}
9-
]]
10+
],
11+
"@babel/preset-env"
12+
]
1013
}

.eslintrc

Lines changed: 0 additions & 29 deletions
This file was deleted.

.eslintrc.js

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
module.exports = {
2+
extends: [
3+
'plugin:prettier/recommended',
4+
'eslint-config-fusion',
5+
'plugin:vue/essential',
6+
],
7+
env: {
8+
'jest/globals': true,
9+
'node': true,
10+
},
11+
globals: {
12+
module: true, // hot reloading
13+
scenario: true, // mocha
14+
},
15+
plugins: ['jest', 'import'],
16+
rules: {
17+
curly: ['error', 'all'],
18+
'dot-notation': 'error',
19+
'flowtype/require-valid-file-annotation': [2, 'never'],
20+
'import/order': [
21+
'error',
22+
{ 'groups': ['builtin', 'external', 'parent', 'sibling', 'index'] }
23+
],
24+
'jest/consistent-test-it': [
25+
'error',
26+
{ 'fn': 'test', 'withinDescribe': 'it' }
27+
],
28+
'jest/lowercase-name': [
29+
'error',
30+
{
31+
'ignore': ['describe', 'test']
32+
}
33+
],
34+
'no-var': 'error',
35+
'no-use-before-define': 'error',
36+
'no-useless-constructor': 'error',
37+
'object-curly-spacing': ['error', 'always'],
38+
'padding-line-between-statements': [
39+
'error',
40+
{ 'blankLine': 'always', 'prev': '*', 'next': 'return' },
41+
{ 'blankLine': 'always', 'prev': ['const', 'let', 'var'], 'next': '*' },
42+
{
43+
'blankLine': 'any',
44+
'prev': ['const', 'let', 'var'],
45+
'next': ['const', 'let', 'var']
46+
},
47+
{ 'blankLine': 'always', 'prev': 'directive', 'next': '*' },
48+
{ 'blankLine': 'any', 'prev': 'directive', 'next': 'directive' },
49+
{ 'blankLine': 'always', 'prev': '*', 'next': 'if' },
50+
{ 'blankLine': 'always', 'prev': 'if', 'next': '*' },
51+
{ 'blankLine': 'always', 'prev': '*', 'next': 'function' }
52+
],
53+
'prefer-const': 'error',
54+
'prettier/prettier': [
55+
'error',
56+
{
57+
bracketSpacing: true,
58+
singleQuote: true,
59+
trailingComma: 'es5',
60+
jsxBracketSameLine: false
61+
},
62+
],
63+
'space-before-blocks': 'error',
64+
},
65+
};

Dockerfile

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
FROM node:carbon
1+
FROM node:dubnium
22

33
WORKDIR /usr/cadence-web
44

client/App.vue

Lines changed: 40 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,66 @@
11
<script>
2-
import logo from './assets/logo.svg'
2+
import logo from './assets/logo.svg';
33
44
export default {
5-
data () {
6-
return { logo }
5+
data() {
6+
return { logo };
77
},
88
methods: {
99
globalClick(e) {
1010
if (this.editing && !this.$refs.domain.contains(e.target)) {
11-
this.clearEdit()
11+
this.clearEdit();
1212
}
1313
1414
if (e.target.tagName === 'A') {
15-
var href = e.target.getAttribute('href')
16-
if (href && href.startsWith('/') && !e.target.getAttribute('download') && !e.target.getAttribute('target')) {
17-
e.preventDefault()
18-
e.stopPropagation()
19-
this.$router.push(href)
15+
const href = e.target.getAttribute('href');
16+
17+
if (
18+
href &&
19+
href.startsWith('/') &&
20+
!e.target.getAttribute('download') &&
21+
!e.target.getAttribute('target')
22+
) {
23+
e.preventDefault();
24+
e.stopPropagation();
25+
this.$router.push(href);
2026
}
2127
}
22-
}
23-
}
24-
}
28+
},
29+
},
30+
};
2531
</script>
2632

2733
<template>
2834
<main @click="globalClick">
2935
<header class="top-bar">
3036
<a href="/" class="logo" v-html="logo"></a>
3137
<div class="domain" v-if="$route.params.domain">
32-
<a :href="`/domain/${$route.params.domain}/workflows`" :class="{'router-link-active': $route.path === `/domain/${$route.params.domain}/workflows`, workflows: true }">{{$route.params.domain}}</a>
33-
<a :href="`/domain/${$route.params.domain}/config`" :class="{'router-link-active': $route.path === `/domain/${$route.params.domain}/config`, config: true }"></a>
38+
<a
39+
:href="`/domain/${$route.params.domain}/workflows`"
40+
:class="{
41+
'router-link-active':
42+
$route.path === `/domain/${$route.params.domain}/workflows`,
43+
workflows: true,
44+
}"
45+
>{{ $route.params.domain }}</a
46+
>
47+
<a
48+
:href="`/domain/${$route.params.domain}/config`"
49+
:class="{
50+
'router-link-active':
51+
$route.path === `/domain/${$route.params.domain}/config`,
52+
config: true,
53+
}"
54+
></a>
55+
</div>
56+
<div class="list-workflows" v-if="$route.name === 'workflows'">
57+
Workflows
3458
</div>
35-
<div class="list-workflows" v-if="$route.name === 'workflows'">Workflows</div>
3659
<div class="detail-view workflow-id" v-if="$route.params.workflowId">
37-
<span>{{$route.params.workflowId}}</span>
60+
<span>{{ $route.params.workflowId }}</span>
3861
</div>
3962
<div class="detail-view task-list" v-if="$route.params.taskList">
40-
<span>{{$route.params.taskList}}</span>
63+
<span>{{ $route.params.taskList }}</span>
4164
</div>
4265
</header>
4366
<router-view></router-view>

client/constants.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,5 @@ export const jsonKeys = ['result', 'input', 'details', 'data', 'Error'];
22
export const preKeys = jsonKeys.concat(['stackTrace', 'details.stackTrace']);
33

44
export const MAXIMUM_JSON_CHARACTER_LIMIT = 5000;
5-
export const MAXIMUM_JSON_MESSAGE = '\n ... to see more open full screen mode from top right arrow.';
5+
export const MAXIMUM_JSON_MESSAGE =
6+
'\n ... to see more open full screen mode from top right arrow.';

client/directives/snapscroll.js

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,17 @@
11
export default {
2-
bind(el, binding) {
3-
el.addEventListener('scroll', function(e) {
4-
el.scrolledToBottom = el.scrollHeight - el.scrollTop - el.offsetHeight < 10
5-
})
2+
bind(el) {
3+
el.addEventListener('scroll', () => {
4+
// eslint-disable-next-line no-param-reassign
5+
el.scrolledToBottom =
6+
el.scrollHeight - el.scrollTop - el.offsetHeight < 10;
7+
});
68
},
7-
update: function(el) {
9+
update(el) {
810
if (el.scrolledToBottom) {
9-
setImmediate(() => el.scrollTop = el.scrollHeight - el.offsetHeight)
11+
setTimeout(() => {
12+
// eslint-disable-next-line no-param-reassign
13+
el.scrollTop = el.scrollHeight - el.offsetHeight;
14+
});
1015
}
11-
}
12-
}
16+
},
17+
};

client/helpers/get-json-string-object.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import getStringElipsis from './get-string-elipsis';
22

3-
const getJsonStringObject = (value) => {
3+
const getJsonStringObject = value => {
44
const jsonStringFull = value ? JSON.stringify(value, null, 2) : '';
55
const jsonStringDisplay = value ? getStringElipsis(jsonStringFull) : '';
6+
67
return {
78
jsonStringDisplay,
89
jsonStringFull,

client/helpers/get-key-value-pairs.js

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
1-
import {
2-
jsonKeys,
3-
preKeys,
4-
} from '../constants';
51
import moment from 'moment';
2+
import { jsonKeys, preKeys } from '../constants';
63
import getJsonStringObject from './get-json-string-object';
74

85
const getKeyValuePairs = event => {
@@ -12,6 +9,7 @@ const getKeyValuePairs = event => {
129
if (value === null || value === undefined) {
1310
return;
1411
}
12+
1513
const key = prefix ? `${prefix}.${k}` : k;
1614

1715
if (value.routeLink) {
@@ -90,6 +88,7 @@ const getKeyValuePairs = event => {
9088
};
9189

9290
flatten('', event || {}, event);
91+
9392
return kvps;
9493
};
9594

client/helpers/get-string-elipsis.spec.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,23 @@
1-
import getStringElipsis from './get-string-elipsis';
21
import {
32
MAXIMUM_JSON_CHARACTER_LIMIT,
43
MAXIMUM_JSON_MESSAGE,
54
} from '../constants';
5+
import getStringElipsis from './get-string-elipsis';
66

77
describe('getStringElipsis', () => {
88
describe('when passed a string that has a length less than MAXIMUM_JSON_CHARACTER_LIMIT', () => {
99
it('should return the original string', () => {
1010
const input = 'a-short-string';
1111
const output = getStringElipsis(input);
12+
1213
expect(output).toEqual('a-short-string');
1314
});
1415
});
1516
describe('when passed a string that has a length equal to MAXIMUM_JSON_CHARACTER_LIMIT', () => {
1617
it('should return a substring of the original string up until the limit and display a message.', () => {
1718
const input = ''.padEnd(MAXIMUM_JSON_CHARACTER_LIMIT, '_');
1819
const output = getStringElipsis(input);
20+
1921
expect(output).toEqual(input + MAXIMUM_JSON_MESSAGE);
2022
});
2123
});

0 commit comments

Comments
 (0)