diff --git a/.eslintrc.json b/.eslintrc.json
new file mode 100644
index 00000000..4f180023
--- /dev/null
+++ b/.eslintrc.json
@@ -0,0 +1,26 @@
+{
+ "env": {
+ "browser": true,
+ "es2021": true,
+ "node": true
+ },
+ "extends": [
+ "plugin:react/recommended",
+ "airbnb",
+ "prettier"
+ ],
+ "parser": "@typescript-eslint/parser",
+ "parserOptions": {
+ "ecmaFeatures": {
+ "jsx": true
+ },
+ "ecmaVersion": 12,
+ "sourceType": "module"
+ },
+ "plugins": [
+ "react",
+ "@typescript-eslint"
+ ],
+ "rules": {
+ }
+}
diff --git a/.prettierrc.json b/.prettierrc.json
new file mode 100644
index 00000000..85b1406c
--- /dev/null
+++ b/.prettierrc.json
@@ -0,0 +1,5 @@
+{
+ "singleQuote": true,
+ "tabWidth": 2,
+ "useTabs": false
+}
diff --git a/backend/channels.ts b/backend/channels.ts
index 436caa7b..6eb4eb62 100644
--- a/backend/channels.ts
+++ b/backend/channels.ts
@@ -70,11 +70,9 @@ let listObj: any;
ipcMain.on('return-db-list', (event, dbName) => {
// DB query to get the database size
let dbSize: string;
- db.query(`SELECT pg_size_pretty(pg_database_size('${dbName}'));`).then(
- (queryStats) => {
- dbSize = queryStats.rows[0].pg_size_pretty;
- }
- );
+ db.query(`SELECT pg_size_pretty(pg_database_size('${dbName}'));`).then((queryStats) => {
+ dbSize = queryStats.rows[0].pg_size_pretty;
+ });
db.getLists().then((data) => event.sender.send('db-lists', data, dbSize));
});
@@ -93,15 +91,9 @@ ipcMain.on('upload-file', (event, filePath: string) => {
let dbName: string;
if (process.platform === 'darwin') {
- dbName = filePath[0].slice(
- filePath[0].lastIndexOf('/') + 1,
- filePath[0].lastIndexOf('.')
- );
+ dbName = filePath[0].slice(filePath[0].lastIndexOf('/') + 1, filePath[0].lastIndexOf('.'));
} else {
- dbName = filePath[0].slice(
- filePath[0].lastIndexOf('\\') + 1,
- filePath[0].lastIndexOf('.')
- );
+ dbName = filePath[0].slice(filePath[0].lastIndexOf('\\') + 1, filePath[0].lastIndexOf('.'));
}
const createDB: string = createDBFunc(dbName);
@@ -134,11 +126,9 @@ ipcMain.on('upload-file', (event, filePath: string) => {
execute(runCmd, sendLists);
// DB query to get the database size
- db.query(`SELECT pg_size_pretty(pg_database_size('${dbName}'));`).then(
- (queryStats) => {
- dbSize = queryStats.rows[0].pg_size_pretty;
- }
- );
+ db.query(`SELECT pg_size_pretty(pg_database_size('${dbName}'));`).then((queryStats) => {
+ dbSize = queryStats.rows[0].pg_size_pretty;
+ });
};
// Step 3: Import database file from file path into docker container
@@ -315,19 +305,17 @@ ipcMain.on('execute-query-tracked', (event, data: QueryType) => {
frontendData.queryData = queryData.rows;
if (!queryString.match(/create/i)) {
// Run EXPLAIN (FORMAT JSON, ANALYZE)
- db.query('EXPLAIN (FORMAT JSON, ANALYZE) ' + queryString).then(
- (queryStats) => {
- frontendData.queryStatistics = queryStats.rows;
-
- (async function getListAsync() {
- listObj = await db.getLists();
- frontendData.lists = listObj;
- event.sender.send('db-lists', listObj);
- event.sender.send('return-execute-query', frontendData);
- event.sender.send('async-complete');
- })();
- }
- );
+ db.query('EXPLAIN (FORMAT JSON, ANALYZE) ' + queryString).then((queryStats) => {
+ frontendData.queryStatistics = queryStats.rows;
+
+ (async function getListAsync() {
+ listObj = await db.getLists();
+ frontendData.lists = listObj;
+ event.sender.send('db-lists', listObj);
+ event.sender.send('return-execute-query', frontendData);
+ event.sender.send('async-complete');
+ })();
+ });
} else {
// Handling for tracking a create table query, can't run explain/analyze on create statements
(async function getListAsync() {
@@ -365,21 +353,11 @@ ipcMain.on('generate-dummy-data', (event: any, data: dummyDataRequest) => {
db.getSchemaLayout().then((result) => {
schemaLayout = result;
// generate the dummy data and save it into matrices associated with table names
- tableMatricesArray = generateDummyData(
- schemaLayout,
- dummyDataRequest,
- keyObject
- );
+ tableMatricesArray = generateDummyData(schemaLayout, dummyDataRequest, keyObject);
//iterate through tableMatricesArray to write individual .csv files
for (const tableObject of tableMatricesArray) {
// write all entries in tableMatrix to csv file
- writeCSVFile(
- tableObject,
- schemaLayout,
- keyObject,
- dummyDataRequest,
- event
- );
+ writeCSVFile(tableObject, schemaLayout, keyObject, dummyDataRequest, event);
}
});
});
diff --git a/backend/main.ts b/backend/main.ts
index 6c454ded..dacb1281 100644
--- a/backend/main.ts
+++ b/backend/main.ts
@@ -30,10 +30,7 @@ let pruned: boolean = false;
let mainMenu = Menu.buildFromTemplate(require('./mainMenu'));
// Keep a reference for dev mode
let dev = false;
-if (
- process.env.NODE_ENV !== undefined &&
- process.env.NODE_ENV === 'development'
-) {
+if (process.env.NODE_ENV !== undefined && process.env.NODE_ENV === 'development') {
dev = true;
}
@@ -51,9 +48,7 @@ function createWindow() {
});
if (process.platform === 'darwin') {
- app.dock.setIcon(
- path.join(__dirname, '../../frontend/assets/images/seeqr_dock.png')
- );
+ app.dock.setIcon(path.join(__dirname, '../../frontend/assets/images/seeqr_dock.png'));
}
// Load index.html of the app
diff --git a/backend/mainMenu.ts b/backend/mainMenu.ts
index c6ddf295..7f176dad 100644
--- a/backend/mainMenu.ts
+++ b/backend/mainMenu.ts
@@ -6,21 +6,21 @@ module.exports = [
// { role: 'appMenu' }
...(isMac
? [
- {
- label: app.name,
- submenu: [
- { role: 'about' },
- { type: 'separator' },
- { role: 'services' },
- { type: 'separator' },
- { role: 'hide' },
- { role: 'hideothers' },
- { role: 'unhide' },
- { type: 'separator' },
- { role: 'quit' },
- ],
- },
- ]
+ {
+ label: app.name,
+ submenu: [
+ { role: 'about' },
+ { type: 'separator' },
+ { role: 'services' },
+ { type: 'separator' },
+ { role: 'hide' },
+ { role: 'hideothers' },
+ { role: 'unhide' },
+ { type: 'separator' },
+ { role: 'quit' },
+ ],
+ },
+ ]
: []),
// { role: 'fileMenu' }
{
@@ -39,14 +39,14 @@ module.exports = [
{ role: 'paste' },
...(isMac
? [
- { role: 'delete' },
- { role: 'selectAll' },
- { type: 'separator' },
- {
- label: 'Speech',
- submenu: [{ role: 'startspeaking' }, { role: 'stopspeaking' }],
- },
- ]
+ { role: 'delete' },
+ { role: 'selectAll' },
+ { type: 'separator' },
+ {
+ label: 'Speech',
+ submenu: [{ role: 'startspeaking' }, { role: 'stopspeaking' }],
+ },
+ ]
: [{ role: 'delete' }, { type: 'separator' }, { role: 'selectAll' }]),
],
},
diff --git a/backend/models.ts b/backend/models.ts
index 0a753849..cdb34c37 100644
--- a/backend/models.ts
+++ b/backend/models.ts
@@ -37,11 +37,7 @@ const getDBNames = () => {
let dbList: any = [];
for (let i = 0; i < databases.rows.length; ++i) {
let curName = databases.rows[i].datname;
- if (
- curName !== 'postgres' &&
- curName !== 'template0' &&
- curName !== 'template1'
- )
+ if (curName !== 'postgres' && curName !== 'template0' && curName !== 'template1')
dbList.push(databases.rows[i].datname);
}
resolve(dbList);
@@ -270,11 +266,8 @@ module.exports = {
let count: number = 0;
for (const fk in keyObject[tableName].foreignKeyColumns) {
- let primaryTable: string =
- keyObject[tableName].foreignKeyColumns[fk];
- let primaryKey: any = Object.keys(
- keyObject[primaryTable].primaryKeyColumns
- )[0];
+ let primaryTable: string = keyObject[tableName].foreignKeyColumns[fk];
+ let primaryKey: any = Object.keys(keyObject[primaryTable].primaryKeyColumns)[0];
if (count > 0) queryString += `, `;
queryString += `ADD CONSTRAINT "${tableName}_fk${count}" FOREIGN KEY ("${fk}") REFERENCES ${primaryTable}("${primaryKey}")`;
count += 1;
diff --git a/frontend/components/LoadingModal.tsx b/frontend/components/LoadingModal.tsx
index 20d78148..24876257 100644
--- a/frontend/components/LoadingModal.tsx
+++ b/frontend/components/LoadingModal.tsx
@@ -4,14 +4,13 @@ import ReactLoading from 'react-loading';
// "Loading" pop up renders whenever async functions are called
const LoadingModal = (props) => {
if (props.show) {
- return(
+ return (
LOADING...
-
+
);
- }
- else return null;
-}
+ } else return null;
+};
-export default LoadingModal;
\ No newline at end of file
+export default LoadingModal;
diff --git a/frontend/components/Splash.tsx b/frontend/components/Splash.tsx
index 72fae97d..aeff51cb 100644
--- a/frontend/components/Splash.tsx
+++ b/frontend/components/Splash.tsx
@@ -16,19 +16,22 @@ export class Splash extends Component {
return (
-
-
Welcome!
-
-
-
Create custom schema
-
-
-
-
Import database in .sql or .tar
-
-
+
+
Welcome!
+
+
+
Create custom schema
+
+
+
+
Import database in .sql or .tar
+
-
+
);
}
diff --git a/frontend/components/leftPanel/schemaChildren/Data.tsx b/frontend/components/leftPanel/schemaChildren/Data.tsx
index 75cad1b6..69f3658d 100644
--- a/frontend/components/leftPanel/schemaChildren/Data.tsx
+++ b/frontend/components/leftPanel/schemaChildren/Data.tsx
@@ -5,7 +5,7 @@ type DataProps = {
queries: {
queryString: string;
queryData: {}[];
- queryStatistics: any
+ queryStatistics: any;
querySchema: string;
queryLabel: string;
}[];
@@ -23,11 +23,8 @@ export class Data extends Component
{
return (
Data Table
-
- {queries.length === 0 ? null :
}
-
-
+
{queries.length === 0 ? null :
}
);
}
-}
\ No newline at end of file
+}
diff --git a/frontend/components/leftPanel/schemaChildren/DummyDataPanel.tsx b/frontend/components/leftPanel/schemaChildren/DummyDataPanel.tsx
index 5402c971..c9c0d3ef 100644
--- a/frontend/components/leftPanel/schemaChildren/DummyDataPanel.tsx
+++ b/frontend/components/leftPanel/schemaChildren/DummyDataPanel.tsx
@@ -8,18 +8,17 @@ const { ipcRenderer } = window.require('electron');
type ClickEvent = React.MouseEvent;
type DummyDataPanelProps = {
- currentSchema: string;
- tableList: string[];
+ currentSchema: string;
+ tableList: string[];
};
type state = {
- currentTable: string,
- dataInfo: {},
- rowNumber: string
-}
+ currentTable: string;
+ dataInfo: {};
+ rowNumber: string;
+};
class DummyDataPanel extends Component {
-
constructor(props: DummyDataPanelProps) {
super(props);
this.dropDownList = this.dropDownList.bind(this);
@@ -33,13 +32,13 @@ class DummyDataPanel extends Component {
state: state = {
currentTable: 'select table',
dataInfo: {},
- rowNumber: ''
- }
+ rowNumber: '',
+ };
//handler to change the dropdown display to the selected table name
selectHandler = (eventKey, e: React.SyntheticEvent) => {
if (eventKey !== 'none') {
- this.setState({currentTable: eventKey});
+ this.setState({ currentTable: eventKey });
}
};
@@ -51,14 +50,22 @@ class DummyDataPanel extends Component {
// Allows user to choose a specific table, or to write dummy data to all tables.
if (this.props.tableList.length > 0) {
for (let i = 0; i <= this.props.tableList.length; i++) {
- if(this.props.tableList[i]) tableName = this.props.tableList[i];
+ if (this.props.tableList[i]) tableName = this.props.tableList[i];
else tableName = 'all';
- result.push({tableName});
+ result.push(
+
+ {tableName}
+
+ );
}
} else {
- // Adds message in dropdown list to show that not tables are available
- // Went this route because we couldn't get the dropdown to disappear if there were no tables in tableList
- result.push(No tables available!);
+ // Adds message in dropdown list to show that not tables are available
+ // Went this route because we couldn't get the dropdown to disappear if there were no tables in tableList
+ result.push(
+
+ No tables available!
+
+ );
}
return result;
};
@@ -77,67 +84,70 @@ class DummyDataPanel extends Component {
else {
let table = this.state.currentTable;
let number = Number(this.state.rowNumber);
- if (table !== 'all') {
- this.setState(prevState => ({
- ...prevState,
- currentTable: 'select table',
- rowNumber: '',
- dataInfo: {
- ...prevState.dataInfo,
- [table]: number
- }
- }))
- }
- else {
- const dataInfo = {};
- this.props.tableList.forEach(table => {
- if (table !== 'all') {
- dataInfo[table] = number;
- }
- })
- this.setState(prevState => ({
- ...prevState,
- currentTable: 'select table',
- rowNumber: '',
- dataInfo
- }))
- }
+ if (table !== 'all') {
+ this.setState((prevState) => ({
+ ...prevState,
+ currentTable: 'select table',
+ rowNumber: '',
+ dataInfo: {
+ ...prevState.dataInfo,
+ [table]: number,
+ },
+ }));
+ } else {
+ const dataInfo = {};
+ this.props.tableList.forEach((table) => {
+ if (table !== 'all') {
+ dataInfo[table] = number;
+ }
+ });
+ this.setState((prevState) => ({
+ ...prevState,
+ currentTable: 'select table',
+ rowNumber: '',
+ dataInfo,
+ }));
}
- }
+ }
+ };
//onclick listener to delete row from table
deleteRow = (event: any) => {
let name = event.target.id;
- this.setState(prevState => ({
+ this.setState((prevState) => ({
...prevState,
dataInfo: {
...prevState.dataInfo,
- [name]: undefined
- }
- }))
- }
+ [name]: undefined,
+ },
+ }));
+ };
//onchange listener to update the rowNumber string in state
changeRowNumber = (event: any) => {
- this.setState({ rowNumber: event.target.value })
- }
+ this.setState({ rowNumber: event.target.value });
+ };
createRow = () => {
//once state updates on click, render the table row from the object
const newRows: JSX.Element[] = [];
- for (let key in this.state.dataInfo) {
- if (this.state.dataInfo[key]) {
- newRows.push(
-
- {key} |
- {this.state.dataInfo[key]} |
- |
-
- )
- }
+ for (let key in this.state.dataInfo) {
+ if (this.state.dataInfo[key]) {
+ newRows.push(
+
+ {key} |
+ {this.state.dataInfo[key]} |
+
+
+ |
+
+ );
}
+ }
return newRows;
- }
+ };
submitDummyData = (event: any) => {
//check if there are requested dummy data values
@@ -145,57 +155,53 @@ class DummyDataPanel extends Component {
//creates a dummyDataRequest object with schema name and table name/rows
const dummyDataRequest = {
schemaName: this.props.currentSchema,
- dummyData: this.state.dataInfo
- }
+ dummyData: this.state.dataInfo,
+ };
ipcRenderer.send('generate-dummy-data', dummyDataRequest);
//reset state to clear the dummy data panel's table
- this.setState({dataInfo: {}});
- }
- else dialog.showErrorBox('Please add table and row numbers', '');
- }
+ this.setState({ dataInfo: {} });
+ } else dialog.showErrorBox('Please add table and row numbers', '');
+ };
render() {
-
return (
Generate Dummy Data
Select table and number of rows:
-
-
-
- {this.state.currentTable}
-
-
- {this.dropDownList()}
-
-
-
-
-
-
-
-
-
-
- table |
- # of rows |
- delete |
-
- {this.createRow()}
-
-
-
-
-
-
+
+
+ {this.state.currentTable}
+ {this.dropDownList()}
+
+
+
+
+
+
+
+
+ table |
+ # of rows |
+ delete |
+
+ {this.createRow()}
+
+
+
+
+
+
- )
+ );
}
}
-export default DummyDataPanel;
\ No newline at end of file
+export default DummyDataPanel;
diff --git a/frontend/components/leftPanel/schemaChildren/SchemaModal.tsx b/frontend/components/leftPanel/schemaChildren/SchemaModal.tsx
index bfa961ef..5574a868 100644
--- a/frontend/components/leftPanel/schemaChildren/SchemaModal.tsx
+++ b/frontend/components/leftPanel/schemaChildren/SchemaModal.tsx
@@ -85,10 +85,7 @@ class SchemaModal extends Component {
})
.catch((err: object) => {
- console.log(
- 'Error in handleSchemaFilePath method of SchemaModal.tsx.',
- err
- );
+ console.log('Error in handleSchemaFilePath method of SchemaModal.tsx.', err);
});
}
@@ -176,20 +173,14 @@ class SchemaModal extends Component {
-
- With Data?
-
+
With Data?
-
diff --git a/frontend/components/rightPanel/Compare.tsx b/frontend/components/rightPanel/Compare.tsx
index 0c5607dc..c2fd17a7 100644
--- a/frontend/components/rightPanel/Compare.tsx
+++ b/frontend/components/rightPanel/Compare.tsx
@@ -1,7 +1,7 @@
import React, { useState } from 'react';
import DropdownButton from 'react-bootstrap/DropdownButton';
import Dropdown from 'react-bootstrap/Dropdown';
-import { Bar, defaults } from "react-chartjs-2";
+import { Bar, defaults } from 'react-chartjs-2';
defaults.global.defaultFontColor = 'rgb(198,210,213)';
@@ -9,21 +9,20 @@ type CompareProps = {
queries: {
queryString: string;
queryData: {}[];
- queryStatistics: any
+ queryStatistics: any;
querySchema: string;
queryLabel: string;
}[];
- currentSchema: string
+ currentSchema: string;
};
export const Compare = (props: CompareProps) => {
-
// -------------------------------------------------------------------------------------------------------------
// ------------------------------------ logic for setting state --------------------------------------------
// vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv
// declaring initial state
- let initial: any = { ...props, compareList: [] };
+ let initial: any = { ...props, compareList: [] };
const [queryInfo, setCompare] = useState(initial);
const addCompareQuery = (event) => {
@@ -33,14 +32,14 @@ export const Compare = (props: CompareProps) => {
// if the query is clicked in the dropdown menu
if (query.queryLabel === event.target.text) {
// only allow the addition of queries that aren't already being compared
- if (!compareList.includes(query)){
+ if (!compareList.includes(query)) {
compareList.push(query);
}
}
});
// reset state to account for the change in queries being tracked
setCompare({ ...queryInfo, compareList });
- }
+ };
// -------------------------------------------------------------------------------------------------------------
// ------------------------------------ logic for the compare query table --------------------------------------
@@ -49,13 +48,18 @@ export const Compare = (props: CompareProps) => {
const deleteCompareQuery = (event) => {
// reset comparelist so that the query that is chosen is not included any more
let compareList: any = queryInfo.compareList.filter(
- (query) => query.queryLabel !== event.target.id);
+ (query) => query.queryLabel !== event.target.id
+ );
setCompare({ ...queryInfo, compareList });
- }
+ };
const dropDownList = () => {
// for each query on the query list, make a dropdown item in the menu
- return props.queries.map((query, index) => {query.queryLabel});
+ return props.queries.map((query, index) => (
+
+ {query.queryLabel}
+
+ ));
};
// Rendering the compare table with selected queries from dropdown list
@@ -81,7 +85,7 @@ export const Compare = (props: CompareProps) => {
// To display additional analytics, comment back in JSX elements in the return statement below.
return (
- {queryLabel} |
+ {queryLabel} |
{querySchema} |
{/* {queryString} | */}
{/* {scanType} | */}
@@ -90,9 +94,13 @@ export const Compare = (props: CompareProps) => {
{/* {planningTime} |
{executionTime} |
{actualStartupTime} | */}
- {actualTotalTime} |
+ {actualTotalTime} |
{/* {loops} | */}
- X |
+
+
+ X
+
+ |
);
});
@@ -108,43 +116,56 @@ export const Compare = (props: CompareProps) => {
// first we create an object with all of the comparelist data organized in a way that enables us to render our graph easily
const compareDataObject: any = {};
// then we populate that object
- for (const query of compareList){
+ for (const query of compareList) {
const { queryLabel, querySchema, queryStatistics } = query;
- if (!compareDataObject[querySchema]){
+ if (!compareDataObject[querySchema]) {
compareDataObject[querySchema] = {
- [queryLabel.toString()] : queryStatistics[0]["QUERY PLAN"][0]["Execution Time"] + queryStatistics[0]["QUERY PLAN"][0]["Planning Time"]
- }
+ [queryLabel.toString()]:
+ queryStatistics[0]['QUERY PLAN'][0]['Execution Time'] +
+ queryStatistics[0]['QUERY PLAN'][0]['Planning Time'],
+ };
} else {
- compareDataObject[querySchema][queryLabel.toString()] = queryStatistics[0]["QUERY PLAN"][0]["Execution Time"] + queryStatistics[0]["QUERY PLAN"][0]["Planning Time"]
+ compareDataObject[querySchema][queryLabel.toString()] =
+ queryStatistics[0]['QUERY PLAN'][0]['Execution Time'] +
+ queryStatistics[0]['QUERY PLAN'][0]['Planning Time'];
}
- };
+ }
// then we generate a labelData array to store all unique query labels
const labelDataArray: any = [];
- for (const schema in compareDataObject){
+ for (const schema in compareDataObject) {
for (const label in compareDataObject[schema]) {
- if (!labelDataArray.includes(label)){
+ if (!labelDataArray.includes(label)) {
labelDataArray.push(label);
- }
+ }
}
}
-
// then we generate an array of data for each schema, storing data for each unique query according to the schema
const runTimeDataArray: any = [];
- for (const schema in compareDataObject){
+ for (const schema in compareDataObject) {
const schemaArray: any = [];
- for(const label of labelDataArray){
- schemaArray.push(compareDataObject[schema][label] ? compareDataObject[schema][label] : 0)
+ for (const label of labelDataArray) {
+ schemaArray.push(compareDataObject[schema][label] ? compareDataObject[schema][label] : 0);
}
- runTimeDataArray.push({[schema]: schemaArray});
+ runTimeDataArray.push({ [schema]: schemaArray });
}
// creating a list of possible colors for the graph
const schemaColors = {
nextColor: 0,
- colorList: ['#006C67', '#F194B4', '#FFB100', '#FFEBC6', '#A4036F', '#048BA8', '#16DB93', '#EFEA5A', '#F29E4C']
- }
+ colorList: [
+ '#006C67',
+ '#F194B4',
+ '#FFB100',
+ '#FFEBC6',
+ '#A4036F',
+ '#048BA8',
+ '#16DB93',
+ '#EFEA5A',
+ '#F29E4C',
+ ],
+ };
// then we generate datasets for each schema for the bar chart
const datasets = runTimeDataArray.map((schemaDataObject) => {
@@ -156,16 +177,16 @@ export const Compare = (props: CompareProps) => {
backgroundColor: color,
borderColor: color,
borderWidth: 1,
- data: schemaDataObject[schemaLabel]
- }
- })
+ data: schemaDataObject[schemaLabel],
+ };
+ });
//then we combine the label array and the data arrays for each schema into a data object to pass to our bar graph
return {
labels: labelDataArray,
- datasets: datasets
- }
- }
+ datasets: datasets,
+ };
+ };
// -------------------------------------------------------------------------------------------------------------
// ------------------------------------ rendering the elements -------------------------------------------------
@@ -202,17 +223,16 @@ export const Compare = (props: CompareProps) => {
title: {
display: true,
text: 'QUERY LABEL VS RUNTIME (ms)',
- fontSize: 16
+ fontSize: 16,
},
legend: {
display: true,
- position: 'right'
+ position: 'right',
},
- maintainAspectRatio: false
+ maintainAspectRatio: false,
}}
/>
);
};
-
diff --git a/frontend/components/rightPanel/History.tsx b/frontend/components/rightPanel/History.tsx
index 2506667c..31149281 100644
--- a/frontend/components/rightPanel/History.tsx
+++ b/frontend/components/rightPanel/History.tsx
@@ -4,7 +4,7 @@ type HistoryProps = {
queries: {
queryString: string;
queryData: {}[];
- queryStatistics: any
+ queryStatistics: any;
querySchema: string;
queryLabel: string;
}[];
diff --git a/package.json b/package.json
index 5cddb318..bae17019 100644
--- a/package.json
+++ b/package.json
@@ -55,10 +55,12 @@
"@types/enzyme": "^3.10.7",
"@types/enzyme-adapter-react-16": "^1.0.6",
"@types/jest": "^26.0.14",
- "@types/node": "^14.6.0",
+ "@types/node": "^14.14.22",
"@types/react": "^16.9.46",
"@types/react-dom": "^16.9.8",
"@types/react-router-dom": "^5.1.5",
+ "@typescript-eslint/eslint-plugin": "^4.14.1",
+ "@typescript-eslint/parser": "^4.14.1",
"babel-loader": "^8.1.0",
"babel-minify-webpack-plugin": "^0.3.1",
"csp-html-webpack-plugin": "^4.0.0",
@@ -69,6 +71,13 @@
"electron-reloader": "^1.1.0",
"enzyme": "^3.11.0",
"enzyme-adapter-react-16": "^1.15.5",
+ "eslint": "^7.19.0",
+ "eslint-config-airbnb": "^18.2.1",
+ "eslint-config-prettier": "^7.2.0",
+ "eslint-plugin-import": "^2.22.1",
+ "eslint-plugin-jsx-a11y": "^6.4.1",
+ "eslint-plugin-react": "^7.22.0",
+ "eslint-plugin-react-hooks": "^4.2.0",
"file-loader": "^6.0.0",
"html-webpack-plugin": "^4.3.0",
"image-webpack-loader": "^6.0.0",
@@ -76,6 +85,7 @@
"mini-css-extract-plugin": "^0.9.0",
"nodemon": "^2.0.4",
"postcss-loader": "^3.0.0",
+ "prettier": "^2.2.1",
"react-router-dom": "^5.2.0",
"sass-loader": "^9.0.2",
"source-map-loader": "^1.0.1",