public inbox for [email protected]
help / color / mirror / Atom feed[pgAdmin][patch] Linter for JSX files
2+ messages / 2 participants
[nested] [flat]
* [pgAdmin][patch] Linter for JSX files
@ 2021-04-08 10:35 Aditya Toshniwal <[email protected]>
0 siblings, 1 reply; 2+ messages in thread
From: Aditya Toshniwal @ 2021-04-08 10:35 UTC (permalink / raw)
To: pgadmin-hackers
Hi Hackers,
Attached patch contains the required changes for including JSX files in
linter checks.
Please review.
--
Thanks,
Aditya Toshniwal
pgAdmin hacker | Sr. Software Engineer | *edbpostgres.com*
<http://edbpostgres.com;
"Don't Complain about Heat, Plant a TREE"
Attachments:
[application/octet-stream] linter_jsx.patch (25.2K, 3-linter_jsx.patch)
download | inline diff:
diff --git a/web/.eslintrc.js b/web/.eslintrc.js
index ce89c7b0e..dc5531948 100644
--- a/web/.eslintrc.js
+++ b/web/.eslintrc.js
@@ -29,6 +29,7 @@ module.exports = {
'babelOptions': {
'plugins': [
'@babel/plugin-syntax-jsx',
+ '@babel/plugin-proposal-class-properties',
],
},
},
diff --git a/web/package.json b/web/package.json
index a23a4db31..3befc9aed 100644
--- a/web/package.json
+++ b/web/package.json
@@ -128,7 +128,7 @@
"wkx": "^0.5.0"
},
"scripts": {
- "linter": "yarn eslint --no-eslintrc -c .eslintrc.js --ext .js .",
+ "linter": "yarn eslint --no-eslintrc -c .eslintrc.js --ext .js --ext .jsx .",
"webpacker": "yarn run webpack --config webpack.config.js --progress",
"webpacker:watch": "yarn run webpack --config webpack.config.js --progress --watch",
"bundle:watch": "yarn run linter && yarn run webpacker:watch",
diff --git a/web/pgadmin/dashboard/static/js/Graphs.jsx b/web/pgadmin/dashboard/static/js/Graphs.jsx
index 7d945d4d3..dd6b1c98a 100644
--- a/web/pgadmin/dashboard/static/js/Graphs.jsx
+++ b/web/pgadmin/dashboard/static/js/Graphs.jsx
@@ -250,6 +250,7 @@ Graphs.propTypes = {
PropTypes.string.isRequired,
PropTypes.number.isRequired,
]),
+ pageVisible: PropTypes.bool,
enablePoll: PropTypes.bool,
};
@@ -330,40 +331,40 @@ export function GraphsWrapper(props) {
return (
<>
- <DashboardRow>
- <DashboardRowCol breakpoint='md' parts={6}>
- <ChartContainer id='sessions-graph' title={props.isDatabase ? gettext('Database sessions') : gettext('Server sessions')} legendRef={sessionStatsLegendRef} errorMsg={props.errorMsg}>
- <LineChart options={options} data={props.sessionStats} updateOptions={updateOptions}
- onInit={onInitCallback(sessionStatsLegendRef)}/>
- </ChartContainer>
- </DashboardRowCol>
- <DashboardRowCol breakpoint='md' parts={6}>
- <ChartContainer id='tps-graph' title={gettext('Transactions per second')} legendRef={tpsStatsLegendRef} errorMsg={props.errorMsg}>
- <LineChart options={options} data={props.tpsStats} updateOptions={updateOptions}
- onInit={onInitCallback(tpsStatsLegendRef)}/>
- </ChartContainer>
- </DashboardRowCol>
- </DashboardRow>
- <DashboardRow>
- <DashboardRowCol breakpoint='md' parts={4}>
- <ChartContainer id='ti-graph' title={gettext('Tuples in')} legendRef={tiStatsLegendRef} errorMsg={props.errorMsg}>
- <LineChart options={options} data={props.tiStats} updateOptions={updateOptions}
- onInit={onInitCallback(tiStatsLegendRef)}/>
- </ChartContainer>
- </DashboardRowCol>
- <DashboardRowCol breakpoint='md' parts={4}>
- <ChartContainer id='to-graph' title={gettext('Tuples out')} legendRef={toStatsLegendRef} errorMsg={props.errorMsg}>
- <LineChart options={options} data={props.toStats} updateOptions={updateOptions}
- onInit={onInitCallback(toStatsLegendRef)}/>
- </ChartContainer>
- </DashboardRowCol>
- <DashboardRowCol breakpoint='md' parts={4}>
- <ChartContainer id='bio-graph' title={gettext('Block I/O')} legendRef={bioStatsLegendRef} errorMsg={props.errorMsg}>
- <LineChart options={options} data={props.bioStats} updateOptions={updateOptions}
- onInit={onInitCallback(bioStatsLegendRef)}/>
- </ChartContainer>
- </DashboardRowCol>
- </DashboardRow>
+ <DashboardRow>
+ <DashboardRowCol breakpoint='md' parts={6}>
+ <ChartContainer id='sessions-graph' title={props.isDatabase ? gettext('Database sessions') : gettext('Server sessions')} legendRef={sessionStatsLegendRef} errorMsg={props.errorMsg}>
+ <LineChart options={options} data={props.sessionStats} updateOptions={updateOptions}
+ onInit={onInitCallback(sessionStatsLegendRef)}/>
+ </ChartContainer>
+ </DashboardRowCol>
+ <DashboardRowCol breakpoint='md' parts={6}>
+ <ChartContainer id='tps-graph' title={gettext('Transactions per second')} legendRef={tpsStatsLegendRef} errorMsg={props.errorMsg}>
+ <LineChart options={options} data={props.tpsStats} updateOptions={updateOptions}
+ onInit={onInitCallback(tpsStatsLegendRef)}/>
+ </ChartContainer>
+ </DashboardRowCol>
+ </DashboardRow>
+ <DashboardRow>
+ <DashboardRowCol breakpoint='md' parts={4}>
+ <ChartContainer id='ti-graph' title={gettext('Tuples in')} legendRef={tiStatsLegendRef} errorMsg={props.errorMsg}>
+ <LineChart options={options} data={props.tiStats} updateOptions={updateOptions}
+ onInit={onInitCallback(tiStatsLegendRef)}/>
+ </ChartContainer>
+ </DashboardRowCol>
+ <DashboardRowCol breakpoint='md' parts={4}>
+ <ChartContainer id='to-graph' title={gettext('Tuples out')} legendRef={toStatsLegendRef} errorMsg={props.errorMsg}>
+ <LineChart options={options} data={props.toStats} updateOptions={updateOptions}
+ onInit={onInitCallback(toStatsLegendRef)}/>
+ </ChartContainer>
+ </DashboardRowCol>
+ <DashboardRowCol breakpoint='md' parts={4}>
+ <ChartContainer id='bio-graph' title={gettext('Block I/O')} legendRef={bioStatsLegendRef} errorMsg={props.errorMsg}>
+ <LineChart options={options} data={props.bioStats} updateOptions={updateOptions}
+ onInit={onInitCallback(bioStatsLegendRef)}/>
+ </ChartContainer>
+ </DashboardRowCol>
+ </DashboardRow>
</>
);
}
diff --git a/web/pgadmin/static/js/chartjs/index.jsx b/web/pgadmin/static/js/chartjs/index.jsx
index 022e63875..dd88b2aba 100644
--- a/web/pgadmin/static/js/chartjs/index.jsx
+++ b/web/pgadmin/static/js/chartjs/index.jsx
@@ -81,8 +81,10 @@ export default function BaseChart({type='line', id, options, data, redraw=false,
BaseChart.propTypes = {
type: PropTypes.string.isRequired,
+ id: PropTypes.string,
data: PropTypes.object.isRequired,
options: PropTypes.object,
+ redraw: PropTypes.bool,
updateOptions: PropTypes.object,
onInit: PropTypes.func,
onUpdate: PropTypes.func,
diff --git a/web/pgadmin/tools/erd/static/js/erd_tool/links/OneToManyLink.jsx b/web/pgadmin/tools/erd/static/js/erd_tool/links/OneToManyLink.jsx
index 0121804d8..cd4e30a8c 100644
--- a/web/pgadmin/tools/erd/static/js/erd_tool/links/OneToManyLink.jsx
+++ b/web/pgadmin/tools/erd/static/js/erd_tool/links/OneToManyLink.jsx
@@ -18,6 +18,7 @@ import {
} from '@projectstorm/react-diagrams';
import {Point} from '@projectstorm/geometry';
import _ from 'lodash';
+import PropTypes from 'prop-types';
export const OneToManyModel = {
local_table_uid: undefined,
@@ -84,7 +85,7 @@ const CustomLinkEndWidget = props => {
<polyline className="svg-link-ele" points="-8,0 0,15 0,0 0,30 0,15 8,0" fill="none" strokeWidth={props.width} />
</>
);
- } else if (type == 'one') {
+ } else if (itype == 'one') {
return (
<polyline className="svg-link-ele" points="-8,15 0,15 0,0 0,30 0,15 8,15" fill="none" strokeWidth={props.width} />
);
@@ -102,6 +103,15 @@ const CustomLinkEndWidget = props => {
);
};
+CustomLinkEndWidget.propTypes = {
+ point: PropTypes.instanceOf(PointModel).isRequired,
+ rotation: PropTypes.number.isRequired,
+ tx: PropTypes.number.isRequired,
+ ty: PropTypes.number.isRequired,
+ type: PropTypes.oneOf(['many', 'one']).isRequired,
+ width: PropTypes.number,
+};
+
export class OneToManyLinkWidget extends RightAngleLinkWidget {
constructor(props) {
super(props);
@@ -243,7 +253,7 @@ export class OneToManyLinkWidget extends RightAngleLinkWidget {
window.addEventListener('mouseup', this.handleUp);
}
},
- onMouseEnter: (event) => {
+ onMouseEnter: () => {
this.setState({ selected: true });
this.props.link.lastHoverIndexOfPath = j;
},
diff --git a/web/pgadmin/tools/erd/static/js/erd_tool/nodes/TableNode.jsx b/web/pgadmin/tools/erd/static/js/erd_tool/nodes/TableNode.jsx
index 95a624d81..c4c62b4b4 100644
--- a/web/pgadmin/tools/erd/static/js/erd_tool/nodes/TableNode.jsx
+++ b/web/pgadmin/tools/erd/static/js/erd_tool/nodes/TableNode.jsx
@@ -8,7 +8,7 @@
//////////////////////////////////////////////////////////////
import React from 'react';
-import { DefaultNodeModel, PortWidget } from '@projectstorm/react-diagrams';
+import { DefaultNodeModel, DiagramEngine, PortWidget } from '@projectstorm/react-diagrams';
import { AbstractReactFactory } from '@projectstorm/react-canvas-core';
import _ from 'lodash';
import { IconButton, DetailsToggleButton } from '../ui_components/ToolBar';
@@ -17,6 +17,7 @@ import TableIcon from 'top/browser/server_groups/servers/databases/schemas/table
import PrimaryKeyIcon from 'top/browser/server_groups/servers/databases/schemas/tables/constraints/index_constraint/static/img/primary_key.svg';
import ForeignKeyIcon from 'top/browser/server_groups/servers/databases/schemas/tables/constraints/foreign_key/static/img/foreign_key.svg';
import ColumnIcon from 'top/browser/server_groups/servers/databases/schemas/tables/columns/static/img/column.svg';
+import PropTypes from 'prop-types';
const TYPE = 'table';
@@ -127,6 +128,11 @@ function RowIcon({icon}) {
);
}
+RowIcon.propTypes = {
+ icon: PropTypes.any.isRequired,
+};
+
+
export class TableNodeWidget extends React.Component {
constructor(props) {
super(props);
@@ -206,6 +212,11 @@ export class TableNodeWidget extends React.Component {
}
}
+TableNodeWidget.propTypes = {
+ node: PropTypes.instanceOf(TableNodeModel),
+ engine: PropTypes.instanceOf(DiagramEngine),
+};
+
export class TableNodeFactory extends AbstractReactFactory {
constructor() {
super(TYPE);
diff --git a/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/BodyWidget.jsx b/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/BodyWidget.jsx
index b79252992..05a55fca6 100644
--- a/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/BodyWidget.jsx
+++ b/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/BodyWidget.jsx
@@ -292,7 +292,7 @@ export default class BodyWidget extends React.Component {
closePanel() {
window.onbeforeunload = null;
- this.props.panel.off(wcDocker.EVENT.CLOSING);
+ this.props.panel.off(window.wcDocker.EVENT.CLOSING);
this.props.pgWindow.pgAdmin.Browser.docker.removePanel(this.props.panel);
}
@@ -555,16 +555,16 @@ export default class BodyWidget extends React.Component {
let nodesRect = this.diagram.getEngine().getBoundingNodesRect(this.diagram.getModel().getNodes(), 10);
let canvasRect = this.canvasEle.getBoundingClientRect();
let canvasTopLeftPoint = {
- x: canvasRect.left,
- y: canvasRect.top
+ x: canvasRect.left,
+ y: canvasRect.top
};
let nodeLayerTopLeftPoint = {
- x: canvasTopLeftPoint.x + this.diagram.getModel().getOffsetX(),
- y: canvasTopLeftPoint.y + this.diagram.getModel().getOffsetY()
+ x: canvasTopLeftPoint.x + this.diagram.getModel().getOffsetX(),
+ y: canvasTopLeftPoint.y + this.diagram.getModel().getOffsetY()
};
let nodesRectTopLeftPoint = {
- x: nodeLayerTopLeftPoint.x + nodesRect.getTopLeft().x,
- y: nodeLayerTopLeftPoint.y + nodesRect.getTopLeft().y
+ x: nodeLayerTopLeftPoint.x + nodesRect.getTopLeft().x,
+ y: nodeLayerTopLeftPoint.y + nodesRect.getTopLeft().y
};
let prevTransform = this.canvasEle.querySelector('div').style.transform;
this.canvasEle.childNodes.forEach((ele)=>{
@@ -579,37 +579,37 @@ export default class BodyWidget extends React.Component {
/* html2canvas ignores CSS styles, set the CSS styles to inline */
const setSvgInlineStyles = (targetElem) => {
const transformProperties = [
- 'fill',
- 'color',
- 'font-size',
- 'stroke',
- 'font'
+ 'fill',
+ 'color',
+ 'font-size',
+ 'stroke',
+ 'font'
];
- let svgElems = Array.from(targetElem.getElementsByTagName("svg"));
+ let svgElems = Array.from(targetElem.getElementsByTagName('svg'));
for (let svgEle of svgElems) {
- svgEle.setAttribute('width', svgEle.clientWidth);
- svgEle.setAttribute('height', svgEle.clientHeight);
- /* Wrap the SVG in a div tag so that transforms are consistent with html */
- let wrap = document.createElement('div');
- wrap.setAttribute('style', svgEle.getAttribute('style'));
- svgEle.setAttribute('style', null);
- svgEle.parentNode.appendChild(wrap);
- wrap.appendChild(svgEle);
- recurseElementChildren(svgEle);
+ svgEle.setAttribute('width', svgEle.clientWidth);
+ svgEle.setAttribute('height', svgEle.clientHeight);
+ /* Wrap the SVG in a div tag so that transforms are consistent with html */
+ let wrap = document.createElement('div');
+ wrap.setAttribute('style', svgEle.getAttribute('style'));
+ svgEle.setAttribute('style', null);
+ svgEle.parentNode.appendChild(wrap);
+ wrap.appendChild(svgEle);
+ recurseElementChildren(svgEle);
}
function recurseElementChildren(node) {
- if (!node.style)
- return;
+ if (!node.style)
+ return;
- let styles = getComputedStyle(node);
- for (let transformProperty of transformProperties) {
- node.style[transformProperty] = styles[transformProperty];
- }
- for (let child of Array.from(node.childNodes)) {
- recurseElementChildren(child);
- }
+ let styles = getComputedStyle(node);
+ for (let transformProperty of transformProperties) {
+ node.style[transformProperty] = styles[transformProperty];
+ }
+ for (let child of Array.from(node.childNodes)) {
+ recurseElementChildren(child);
+ }
}
- }
+ };
setTimeout(()=>{
html2canvas(this.canvasEle, {
@@ -720,7 +720,7 @@ export default class BodyWidget extends React.Component {
}
}
- onNoteClick(e) {
+ onNoteClick() {
let noteNode = this.diagram.getSelectedNodes()[0];
this.showNote(noteNode);
}
@@ -810,65 +810,65 @@ export default class BodyWidget extends React.Component {
render() {
return (
<>
- <ToolBar id="btn-toolbar">
- <ButtonGroup>
- <IconButton id="open-file" icon="fa fa-folder-open" onClick={this.onLoadDiagram} title={gettext('Load from file')}
- shortcut={this.state.preferences.open_project}/>
- <IconButton id="save-erd" icon="fa fa-save" onClick={()=>{this.onSaveDiagram();}} title={gettext('Save project')}
- shortcut={this.state.preferences.save_project} disabled={!this.state.dirty}/>
- <IconButton id="save-as-erd" icon="fa fa-share-square" onClick={this.onSaveAsDiagram} title={gettext('Save as')}
- shortcut={this.state.preferences.save_project_as}/>
- </ButtonGroup>
- <ButtonGroup>
- <IconButton id="save-sql" icon="fa fa-file-code" onClick={this.onSQLClick} title={gettext('Generate SQL')}
- shortcut={this.state.preferences.generate_sql}/>
- <IconButton id="save-image" icon="fa fa-file-image" onClick={this.onImageClick} title={gettext('Download image')}
- shortcut={this.state.preferences.download_image}/>
- </ButtonGroup>
- <ButtonGroup>
- <IconButton id="add-node" icon="fa fa-plus-square" onClick={this.onAddNewNode} title={gettext('Add table')}
- shortcut={this.state.preferences.add_table}/>
- <IconButton id="edit-node" icon="fa fa-pencil-alt" onClick={this.onEditNode} title={gettext('Edit table')}
- shortcut={this.state.preferences.edit_table} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
- <IconButton id="clone-node" icon="fa fa-clone" onClick={this.onCloneNode} title={gettext('Clone table')}
- shortcut={this.state.preferences.clone_table} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
- <IconButton id="delete-node" icon="fa fa-trash-alt" onClick={this.onDeleteNode} title={gettext('Drop table/link')}
- shortcut={this.state.preferences.drop_table} disabled={!this.state.any_item_selected}/>
- </ButtonGroup>
- <ButtonGroup>
- <IconButton id="add-onetomany" text="1M" onClick={this.onOneToManyClick} title={gettext('One-to-Many link')}
- shortcut={this.state.preferences.one_to_many} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
- <IconButton id="add-manytomany" text="MM" onClick={this.onManyToManyClick} title={gettext('Many-to-Many link')}
- shortcut={this.state.preferences.many_to_many} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
- </ButtonGroup>
- <ButtonGroup>
- <IconButton id="add-note" icon="fa fa-sticky-note" onClick={this.onNoteClick} title={gettext('Add/Edit note')}
- shortcut={this.state.preferences.add_edit_note} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
- <IconButton id="auto-align" icon="fa fa-magic" onClick={this.onAutoDistribute} title={gettext('Auto align')}
- shortcut={this.state.preferences.auto_align} />
- <DetailsToggleButton id="more-details" onClick={this.onDetailsToggle} showDetails={this.state.show_details}
- shortcut={this.state.preferences.show_details} />
- </ButtonGroup>
- <ButtonGroup>
- <IconButton id="zoom-to-fit" icon="fa fa-compress" onClick={this.diagram.zoomToFit} title={gettext('Zoom to fit')}
- shortcut={this.state.preferences.zoom_to_fit}/>
- <IconButton id="zoom-in" icon="fa fa-search-plus" onClick={this.diagram.zoomIn} title={gettext('Zoom in')}
- shortcut={this.state.preferences.zoom_in}/>
- <IconButton id="zoom-out" icon="fa fa-search-minus" onClick={this.diagram.zoomOut} title={gettext('Zoom out')}
- shortcut={this.state.preferences.zoom_out}/>
- </ButtonGroup>
- <ButtonGroup>
- <IconButton id="help" icon="fa fa-question" onClick={this.onHelpClick} title={gettext('Help')} />
- </ButtonGroup>
- </ToolBar>
- <ConnectionBar statusId="btn-conn-status" status={this.state.conn_status} bgcolor={this.props.params.bgcolor}
- fgcolor={this.props.params.fgcolor} title={this.props.params.title}/>
- <FloatingNote open={this.state.note_open} onClose={this.onNoteClose}
- reference={this.noteRefEle} noteNode={this.state.note_node} appendTo={this.diagramContainerRef.current} rows={8}/>
- <div className="diagram-container" ref={this.diagramContainerRef}>
- <Loader message={this.state.loading_msg} autoEllipsis={true}/>
- <CanvasWidget className="diagram-canvas flex-grow-1" ref={(ele)=>{this.canvasEle = ele?.ref?.current;}} engine={this.diagram.getEngine()} />
- </div>
+ <ToolBar id="btn-toolbar">
+ <ButtonGroup>
+ <IconButton id="open-file" icon="fa fa-folder-open" onClick={this.onLoadDiagram} title={gettext('Load from file')}
+ shortcut={this.state.preferences.open_project}/>
+ <IconButton id="save-erd" icon="fa fa-save" onClick={()=>{this.onSaveDiagram();}} title={gettext('Save project')}
+ shortcut={this.state.preferences.save_project} disabled={!this.state.dirty}/>
+ <IconButton id="save-as-erd" icon="fa fa-share-square" onClick={this.onSaveAsDiagram} title={gettext('Save as')}
+ shortcut={this.state.preferences.save_project_as}/>
+ </ButtonGroup>
+ <ButtonGroup>
+ <IconButton id="save-sql" icon="fa fa-file-code" onClick={this.onSQLClick} title={gettext('Generate SQL')}
+ shortcut={this.state.preferences.generate_sql}/>
+ <IconButton id="save-image" icon="fa fa-file-image" onClick={this.onImageClick} title={gettext('Download image')}
+ shortcut={this.state.preferences.download_image}/>
+ </ButtonGroup>
+ <ButtonGroup>
+ <IconButton id="add-node" icon="fa fa-plus-square" onClick={this.onAddNewNode} title={gettext('Add table')}
+ shortcut={this.state.preferences.add_table}/>
+ <IconButton id="edit-node" icon="fa fa-pencil-alt" onClick={this.onEditNode} title={gettext('Edit table')}
+ shortcut={this.state.preferences.edit_table} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
+ <IconButton id="clone-node" icon="fa fa-clone" onClick={this.onCloneNode} title={gettext('Clone table')}
+ shortcut={this.state.preferences.clone_table} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
+ <IconButton id="delete-node" icon="fa fa-trash-alt" onClick={this.onDeleteNode} title={gettext('Drop table/link')}
+ shortcut={this.state.preferences.drop_table} disabled={!this.state.any_item_selected}/>
+ </ButtonGroup>
+ <ButtonGroup>
+ <IconButton id="add-onetomany" text="1M" onClick={this.onOneToManyClick} title={gettext('One-to-Many link')}
+ shortcut={this.state.preferences.one_to_many} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
+ <IconButton id="add-manytomany" text="MM" onClick={this.onManyToManyClick} title={gettext('Many-to-Many link')}
+ shortcut={this.state.preferences.many_to_many} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
+ </ButtonGroup>
+ <ButtonGroup>
+ <IconButton id="add-note" icon="fa fa-sticky-note" onClick={this.onNoteClick} title={gettext('Add/Edit note')}
+ shortcut={this.state.preferences.add_edit_note} disabled={!this.state.single_node_selected || this.state.single_link_selected}/>
+ <IconButton id="auto-align" icon="fa fa-magic" onClick={this.onAutoDistribute} title={gettext('Auto align')}
+ shortcut={this.state.preferences.auto_align} />
+ <DetailsToggleButton id="more-details" onClick={this.onDetailsToggle} showDetails={this.state.show_details}
+ shortcut={this.state.preferences.show_details} />
+ </ButtonGroup>
+ <ButtonGroup>
+ <IconButton id="zoom-to-fit" icon="fa fa-compress" onClick={this.diagram.zoomToFit} title={gettext('Zoom to fit')}
+ shortcut={this.state.preferences.zoom_to_fit}/>
+ <IconButton id="zoom-in" icon="fa fa-search-plus" onClick={this.diagram.zoomIn} title={gettext('Zoom in')}
+ shortcut={this.state.preferences.zoom_in}/>
+ <IconButton id="zoom-out" icon="fa fa-search-minus" onClick={this.diagram.zoomOut} title={gettext('Zoom out')}
+ shortcut={this.state.preferences.zoom_out}/>
+ </ButtonGroup>
+ <ButtonGroup>
+ <IconButton id="help" icon="fa fa-question" onClick={this.onHelpClick} title={gettext('Help')} />
+ </ButtonGroup>
+ </ToolBar>
+ <ConnectionBar statusId="btn-conn-status" status={this.state.conn_status} bgcolor={this.props.params.bgcolor}
+ fgcolor={this.props.params.fgcolor} title={this.props.params.title}/>
+ <FloatingNote open={this.state.note_open} onClose={this.onNoteClose}
+ reference={this.noteRefEle} noteNode={this.state.note_node} appendTo={this.diagramContainerRef.current} rows={8}/>
+ <div className="diagram-container" ref={this.diagramContainerRef}>
+ <Loader message={this.state.loading_msg} autoEllipsis={true}/>
+ <CanvasWidget className="diagram-canvas flex-grow-1" ref={(ele)=>{this.canvasEle = ele?.ref?.current;}} engine={this.diagram.getEngine()} />
+ </div>
</>
);
}
@@ -892,4 +892,5 @@ BodyWidget.propTypes = {
pgWindow: PropTypes.object.isRequired,
pgAdmin: PropTypes.object.isRequired,
alertify: PropTypes.object.isRequired,
+ panel: PropTypes.object,
};
diff --git a/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/ToolBar.jsx b/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/ToolBar.jsx
index fe4280af3..655a4aee9 100644
--- a/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/ToolBar.jsx
+++ b/web/pgadmin/tools/erd/static/js/erd_tool/ui_components/ToolBar.jsx
@@ -28,6 +28,7 @@ const BaseIconButton = forwardRef((props, ref)=>{
</button>
);
});
+BaseIconButton.displayName = 'BaseIconButton';
BaseIconButton.propTypes = {
icon: PropTypes.string,
@@ -88,6 +89,7 @@ export const IconButton = forwardRef((props, ref) => {
return <BaseIconButton ref={ref} className='btn btn-sm btn-primary-icon' {...otherProps}/>;
}
});
+IconButton.displayName = 'IconButton';
IconButton.propTypes = {
title: PropTypes.string,
@@ -120,6 +122,10 @@ export function ButtonGroup({className, children}) {
ButtonGroup.propTypes = {
className: PropTypes.string,
+ children: PropTypes.oneOfType([
+ PropTypes.arrayOf(PropTypes.node),
+ PropTypes.node
+ ]),
};
/* Toolbar container */
@@ -131,6 +137,10 @@ export default function ToolBar({id, children}) {
);
}
-ButtonGroup.propTypes = {
+ToolBar.propTypes = {
id: PropTypes.string,
+ children: PropTypes.oneOfType([
+ PropTypes.arrayOf(PropTypes.node),
+ PropTypes.node
+ ]),
};
^ permalink raw reply [nested|flat] 2+ messages in thread
* Re: [pgAdmin][patch] Linter for JSX files
@ 2021-04-08 12:46 Akshay Joshi <[email protected]>
parent: Aditya Toshniwal <[email protected]>
0 siblings, 0 replies; 2+ messages in thread
From: Akshay Joshi @ 2021-04-08 12:46 UTC (permalink / raw)
To: Aditya Toshniwal <[email protected]>; +Cc: pgadmin-hackers
Thanks, patch applied.
On Thu, Apr 8, 2021 at 4:06 PM Aditya Toshniwal <
[email protected]> wrote:
> Hi Hackers,
>
> Attached patch contains the required changes for including JSX files in
> linter checks.
> Please review.
>
> --
> Thanks,
> Aditya Toshniwal
> pgAdmin hacker | Sr. Software Engineer | *edbpostgres.com*
> <http://edbpostgres.com;
> "Don't Complain about Heat, Plant a TREE"
>
--
*Thanks & Regards*
*Akshay Joshi*
*pgAdmin Hacker | Principal Software Architect*
*EDB Postgres <http://edbpostgres.com>*
*Mobile: +91 976-788-8246*
^ permalink raw reply [nested|flat] 2+ messages in thread
end of thread, other threads:[~2021-04-08 12:46 UTC | newest]
Thread overview: 2+ messages (download: mbox mbox.gz follow: Atom feed)
-- links below jump to the message on this page --
2021-04-08 10:35 [pgAdmin][patch] Linter for JSX files Aditya Toshniwal <[email protected]>
2021-04-08 12:46 ` Akshay Joshi <[email protected]>
This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox