Skip to content

Commit 2c06d3b

Browse files
committed
Playground lint fixes
1 parent 5912cf2 commit 2c06d3b

File tree

12 files changed

+163
-151
lines changed

12 files changed

+163
-151
lines changed

packages/cubejs-playground/.eslintrc.js

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,17 @@
11
module.exports = {
2-
extends: 'airbnb',
2+
extends: 'react-app',
33
plugins: ['react', 'jsx-a11y', 'import'],
44
rules: {
5+
'jsx-a11y/click-events-have-key-events': 0,
6+
'jsx-a11y/no-static-element-interactions': 0,
7+
'jsx-a11y/anchor-is-valid': 0,
58
'react/jsx-no-bind': 0,
69
'react/jsx-first-prop-new-line': 0,
710
'react/jsx-indent-props': 0,
811
'react/jsx-filename-extension': 0,
12+
'react/destructuring-assignment': 0,
913
'react/react-in-jsx-scope': 0, // remove when import React is ready
1014
'import/no-unresolved': 0,
11-
'react/jsx-props-no-spreading': 0,
1215
'comma-dangle': 0,
1316
'no-console': 0,
1417
'no-plusplus': 0,
@@ -46,6 +49,11 @@ module.exports = {
4649
{
4750
order: ['static-methods', 'lifecycle', 'everything-else', 'render']
4851
}
49-
]
52+
],
53+
'react/jsx-props-no-spreading': [false, {
54+
"html": "ignore",
55+
"custom": "ignore",
56+
"explicitSpread": "ignore"
57+
}],
5058
}
5159
};

packages/cubejs-playground/src/App.js

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,11 @@
22
import React, { Component } from 'react';
33
import * as PropTypes from 'prop-types';
44
import '@ant-design/compatible/assets/index.css';
5-
import "./index.less";
6-
import "./index.css";
7-
import { Layout, Alert, notification } from "antd";
5+
import './index.less';
6+
import './index.css';
7+
import { Layout, Alert, notification } from 'antd';
88
import { fetch } from 'whatwg-fetch';
9-
import { withRouter } from "react-router";
9+
import { withRouter } from 'react-router';
1010
import Header from './components/Header';
1111
import { event, setAnonymousId } from './events';
1212

@@ -19,8 +19,12 @@ const selectedTab = (pathname) => {
1919
};
2020

2121
class App extends Component {
22+
static getDerivedStateFromError(error) {
23+
return { fatalError: error };
24+
}
25+
2226
async componentDidMount() {
23-
window.addEventListener("unhandledrejection", (promiseRejectionEvent) => {
27+
window.addEventListener('unhandledrejection', (promiseRejectionEvent) => {
2428
const error = promiseRejectionEvent.reason;
2529
console.log(error);
2630
const e = (error.stack || error).toString();
@@ -57,10 +61,6 @@ class App extends Component {
5761
});
5862
}
5963

60-
static getDerivedStateFromError(error) {
61-
return { fatalError: error };
62-
}
63-
6464
componentDidCatch(error, info) {
6565
event('Playground Error', {
6666
error: (error.stack || error).toString(),

packages/cubejs-playground/src/ChartContainer.jsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import { fetch } from 'whatwg-fetch';
1818
import { map } from 'ramda';
1919
import { Redirect, withRouter } from 'react-router-dom';
2020
import { QueryRenderer } from '@cubejs-client/react';
21-
import sqlFormatter from "sql-formatter";
21+
import sqlFormatter from 'sql-formatter';
2222
import PropTypes from 'prop-types';
2323
import PrismCode from './PrismCode';
2424
import CachePane from './components/CachePane';
@@ -55,11 +55,11 @@ class ChartContainer extends React.Component {
5555
codeSandboxSource,
5656
dependencies
5757
} = this.props;
58-
const codeSandboxRes = await fetch("https://codesandbox.io/api/v1/sandboxes/define?json=1", {
59-
method: "POST",
58+
const codeSandboxRes = await fetch('https://codesandbox.io/api/v1/sandboxes/define?json=1', {
59+
method: 'POST',
6060
headers: {
61-
"Content-Type": "application/json",
62-
Accept: "application/json"
61+
'Content-Type': 'application/json',
62+
Accept: 'application/json'
6363
},
6464
body: JSON.stringify(this.codeSandboxDefinition(codeSandboxSource, dependencies))
6565
});
@@ -321,17 +321,17 @@ class ChartContainer extends React.Component {
321321
const copyCodeToClipboard = async () => {
322322
if (!navigator.clipboard) {
323323
notification.error({
324-
message: `Your browser doesn't support copy to clipboard`
324+
message: 'Your browser doesn\'t support copy to clipboard'
325325
});
326326
}
327327
try {
328328
await navigator.clipboard.writeText(showCode === 'query' ? queryText : codeExample);
329329
notification.success({
330-
message: `Copied to clipboard`
330+
message: 'Copied to clipboard'
331331
});
332332
} catch (e) {
333333
notification.error({
334-
message: `Can't copy to clipboard`,
334+
message: 'Can\'t copy to clipboard',
335335
description: e,
336336
});
337337
}

packages/cubejs-playground/src/ChartRenderer.js

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -34,11 +34,11 @@ export const babelConfig = {
3434
const prettify = (object) => {
3535
let str = object;
3636
if (typeof object === 'object') {
37-
str = JSON.stringify(object, null, 2)
37+
str = JSON.stringify(object, null, 2);
3838
}
3939

40-
return str.split('\n').map((l, i) => (i > 0 ? ` ${l}` : l)).join('\n')
41-
}
40+
return str.split('\n').map((l, i) => (i > 0 ? ` ${l}` : l)).join('\n');
41+
};
4242

4343
const sourceCodeTemplate = (props) => {
4444
const {
@@ -90,7 +90,7 @@ export const chartLibraries = Object.keys(libraryToTemplate)
9090
.map(k => ({ value: k, title: libraryToTemplate[k].title }));
9191

9292
export const ChartRenderer = (props) => {
93-
const [jsCompilingError, setError] = useState(null)
93+
const [jsCompilingError, setError] = useState(null);
9494
const [chartLibrary, setChartLibrary] = useState('bizcharts');
9595

9696
const {
@@ -105,7 +105,7 @@ export const ChartRenderer = (props) => {
105105
pivotConfig
106106
} = props;
107107

108-
const sourceCodeFn = sourceCodeFnProp || sourceCodeTemplate
108+
const sourceCodeFn = sourceCodeFnProp || sourceCodeTemplate;
109109

110110
const selectedChartLibrary = selectChartLibrary(chartType, chartLibrary);
111111
const source = sourceCodeFn({
@@ -123,9 +123,9 @@ export const ChartRenderer = (props) => {
123123

124124
useEffect(() => {
125125
if (jsCompilingError) {
126-
setError(null)
126+
setError(null);
127127
}
128-
}, [source, chartType])
128+
}, [source, chartType]);
129129

130130
return (
131131
<ChartContainer
@@ -149,21 +149,21 @@ export const ChartRenderer = (props) => {
149149
description={<pre>{jsCompilingError.toString()}</pre>}
150150
type="error"
151151
/>
152-
)
152+
);
153153
}
154154

155155
return (
156156
<SourceRender
157-
onRender={(error) => {
158-
if (error) {
159-
setError(error)
157+
onRender={(renderError) => {
158+
if (renderError) {
159+
setError(renderError);
160160
}
161161
}}
162162
babelConfig={babelConfig}
163163
resolver={importName => dependencies[importName]}
164164
source={source}
165165
/>
166-
)
166+
);
167167
}}
168168
/>
169169
);

packages/cubejs-playground/src/DashboardPage.js

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
/* globals window */
22
import React, { Component } from 'react';
33
import '@ant-design/compatible/assets/index.css';
4-
import { Spin, Button, Alert, Menu, Dropdown } from 'antd';
4+
import {
5+
Spin, Button, Alert
6+
} from 'antd';
57
import { Link, withRouter, Redirect } from 'react-router-dom';
6-
import DashboardSource from "./DashboardSource";
8+
import DashboardSource from './DashboardSource';
79
import fetch from './playgroundFetch';
8-
import { chartLibraries } from "./ChartRenderer";
910

1011
const Frame = ({ children }) => (
1112
<div style={{ textAlign: 'center', marginTop: 50 }}>
@@ -14,19 +15,19 @@ const Frame = ({ children }) => (
1415
);
1516

1617
const Hint = () => (
17-
<p style={{ width: 450, margin: "20px auto" }}>
18-
Dashboard App is a convenient way to setup and deploy frontend app to work with Cube.js backend. You can learn more about it the <a href="https://cube.dev/docs/dashboard-app" target="_blankl">Cube.js docs</a>.
18+
<p style={{ width: 450, margin: '20px auto' }}>
19+
Dashboard App is a convenient way to setup and deploy frontend app to work with Cube.js backend.
20+
You can learn more about in the
21+
{' '}
22+
<a href="https://cube.dev/docs/dashboard-app" target="_blankl">Cube.js docs</a>
23+
.
1924
</p>
2025
);
2126

2227
class DashboardPage extends Component {
2328
constructor(props) {
2429
super(props);
25-
this.state = {
26-
chartLibrary: chartLibraries[0].value,
27-
framework: 'react',
28-
templatePackageName: 'react-antd-dynamic'
29-
};
30+
this.state = {};
3031
}
3132

3233
async componentDidMount() {
@@ -140,7 +141,7 @@ class DashboardPage extends Component {
140141
return (
141142
<div
142143
style={{
143-
height: '100%', width: '100%', padding: "15px 30px 30px 30px", background: "#fff"
144+
height: '100%', width: '100%', padding: '15px 30px 30px 30px', background: '#fff'
144145
}}
145146
>
146147
<Alert

packages/cubejs-playground/src/DashboardRenderer.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@ import * as cubejsReact from '@cubejs-client/react';
44
import * as antd from 'antd';
55
import { Spin } from 'antd';
66
import ChartContainer from './ChartContainer';
7-
import { libraryToTemplate } from "./ChartRenderer";
7+
import { libraryToTemplate } from './ChartRenderer';
88

99
const DashboardRenderer = (props) => {
10-
let {
10+
const {
1111
source,
1212
sourceFiles
1313
} = props;

packages/cubejs-playground/src/IndexPage.js

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React, { Component } from 'react';
22
import { fetch } from 'whatwg-fetch';
33
import { Spin } from 'antd';
4-
import { Redirect } from "react-router-dom";
4+
import { Redirect } from 'react-router-dom';
55

66
class IndexPage extends Component {
77
constructor(props) {
@@ -23,12 +23,15 @@ class IndexPage extends Component {
2323

2424
render() {
2525
if (!this.state.files) {
26-
return <div style={{ textAlign: 'center', padding: 24}}><Spin /></div>
26+
return <div style={{ textAlign: 'center', padding: 24 }}><Spin /></div>;
2727
}
28-
return <Redirect to={
29-
!this.state.files.length || this.state.files.length === 1 && this.state.files[0].fileName === 'Orders.js' ?
30-
'/schema' : '/build'
31-
} />;
28+
return (
29+
<Redirect to={
30+
!this.state.files.length || this.state.files.length === 1 && this.state.files[0].fileName === 'Orders.js'
31+
? '/schema' : '/build'
32+
}
33+
/>
34+
);
3235
}
3336
}
3437

0 commit comments

Comments
 (0)