Skip to content

Commit

Permalink
ui styling fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
rrmerugu committed May 30, 2021
1 parent a45f75d commit 32d767f
Show file tree
Hide file tree
Showing 4 changed files with 10 additions and 70 deletions.
40 changes: 2 additions & 38 deletions src/web/viewlets/canvas/graph-canvas.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
import React from "react";
import CanvasConsoleOptions from "./canvas-console-options";
import PropTypes from "prop-types";
import QueryConsole from "./query-console";
import Welcome from "../welcome/welcome";
import DefaultRemoteComponent from "../../layouts/default-remote";
import RequestHistoryView from "./query-history";
// import CanvasArtBoard from "./canvas-art-board";
import VisJsGraphCanvasUtils from "./canvas-utils";
import {getAllNodeShapes, invertColor} from "../../interface/utils";
import {GRAPH_CANVAS_SETTINGS} from "../../../settings/canvas";
Expand All @@ -21,38 +19,24 @@ import CanvasDisplaySettings from "./canvas-display-settings";
import LoadingDiv from "./loading";
import LambdaSettingsView from "./lambda-settings";
import ResponseViewer from "./response-viewer";
import PropTypes from "prop-types";


export default class GraphCanvas extends DefaultRemoteComponent {


static propTypes = {
showWelcome: PropTypes.bool,
// canvasQueryString: PropTypes.string,
showWelcome: PropTypes.bool
}

// constructor(props) {
// super(props);
// this.state = {
// showQueryConsole: false,
// showQueryHistory: false,
//
// canvasQueryString: null,
// showWelcome: true
// }
// }
constructor(props) {
// super(props);
super(props);
// super.constructor(props);
this.state = {
...this.state,


canvasQueryString: null,
showWelcome: true,


lastResponseStatusCode: null,

nodes: [],
Expand All @@ -75,7 +59,6 @@ export default class GraphCanvas extends DefaultRemoteComponent {

lastResponse: null,


leftContentName: false, // query-console, query-history, canvas-display-settings, graph-management
}
this.canvasUtils = new VisJsGraphCanvasUtils();
Expand All @@ -89,24 +72,6 @@ export default class GraphCanvas extends DefaultRemoteComponent {
}


//
// processResponse(response) {
// console.log("processResponse", response, this.state.queryObject);
// const lastResponse = response.getResponseResult();
// console.log("lastResponse", lastResponse);
// const data = response.getResponseResult(this.state.queryObject.queryKey);
// // separate nodes and edges
// if (lastResponse) {
// const {nodes, edges} = this.separateNodesAndEdges(data);
// this.addNewData(nodes, edges);
// this.setState({lastResponseStatusCode: response.transporterStatusCode});
// if (response.transporterStatusCode !== 200) {
// this.setState({rightContentName: "response-viewer"})
// }
// this.setState({lastResponse: response.response});
// }
// }

startNewQueryInConsole(queryString) {
this.setState({canvasQueryString: queryString, leftContentName: "query-console"});
}
Expand All @@ -119,7 +84,6 @@ export default class GraphCanvas extends DefaultRemoteComponent {
this.setState({showWelcome: welcomeStatus});
}


removeItemArray(arr, value) {
let i = 0;
while (i < arr.length) {
Expand Down
30 changes: 3 additions & 27 deletions src/web/viewlets/canvas/lambda-settings.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,28 +87,22 @@ export default class LambdaSettingsView extends React.Component {
<Card.Body className={"p-0 "}>
<div className={"pl-3 pr-3 pb-0"}>
<div className="row">
<div className="col col-7">
<div className="col col-8">
<p className={" text-muted small mt-2 mb-0"}>
showing {this.state.showStartCount} to {this.state.showEndCount} entries
of {lambdaData.length}
</p>

</div>
<div className="col col-5">


<div className="col col-4">
<div className="float-right">

{lambdaDataToShow.length > 0
?
<React.Fragment>
? <React.Fragment>
<Button variant={"link"} type={"button"}
className={"pr-2 pl-2 mr-2 rounded-0 border-0"}
disabled={!(this.state.showStartCount > 0)}
onClick={() => this.showPrev()}>
<FontAwesomeIcon icon={faChevronLeft}/>
</Button>

<Button variant={"link"} type={"button"}
className={"pr-2 pl-2 mr-2 rounded-0 border-0"}
disabled={!(lambdaData.length > this.state.showEndCount)}
Expand All @@ -118,19 +112,14 @@ export default class LambdaSettingsView extends React.Component {
</React.Fragment>
: <React.Fragment/>
}

<Button variant={"link"} type={"button"}
className={"pr-2 pl-2 button-hover-bg-disable rounded-0 border-0"}
onClick={() => this.props.onClose()}>
<FontAwesomeIcon icon={faWindowClose}/>
</Button>
</div>

</div>

</div>


</div>
<div style={this.props.cardBodyStyle} className={"mb-3"}>
{lambdaDataToShow.length > 0
Expand All @@ -146,13 +135,7 @@ export default class LambdaSettingsView extends React.Component {
style={{"backgroundColor": "#efefef"}}>
{this.extractRawQuery(lambdaDataItem.query)}
</pre>
{/*<pre className={"mb-0"}>{JSON.stringify(lambdaDataItem.query, null, 2)}</pre>*/}

<div className={"pr-3 pl-3 pt-1 pb-1 "}>
{/*<button className={"btn btn-dark btn-sm small "}*/}
{/* onClick={() => this.props.makeQuery(this.extractRawQuery(lambdaDataItem.query), {source: 'console'})}>*/}
{/* Run Again*/}
{/*</button>*/}
<button className={"btn btn-link small mt-0 " +
"font-weight-bold btn-sm p-0 display-inline mr-3"}
onClick={() => this.props.startNewQueryInConsole(this.extractRawQuery(lambdaDataItem.query))}>
Expand All @@ -172,18 +155,14 @@ export default class LambdaSettingsView extends React.Component {
_this.setState(_this.state);

}

}}>
<FontAwesomeIcon icon={faTrashAlt}/>
</button>
<small className={"ml-3"}>
{/*created at */}
{lambdaDataItem.dt}
</small>
<div className="border-bottom pt-3"/>

</div>

</li>
)
})
Expand All @@ -192,11 +171,8 @@ export default class LambdaSettingsView extends React.Component {
: <p className={"p-3 text-muted"}>No Gremlin lambdas were saved!.</p>
}
</div>


</Card.Body>
</Card>

</div>
</div>
)
Expand Down
6 changes: 3 additions & 3 deletions src/web/viewlets/canvas/query-history.js
Original file line number Diff line number Diff line change
Expand Up @@ -80,12 +80,12 @@ export default class RequestHistoryView extends React.Component {
<Card.Body className={"p-0 "}>
<div className={"pl-3 pr-3"}>
<div className="row">
<div className="col col-7">
<div className="col col-8">
<p className={" text-muted small mt-2 mb-0"}>
showing {this.state.showStartCount} to {this.state.showEndCount} entries of {existingHistory.length}
</p>
</div>
<div className="col col-5">
<div className="col col-4">

<div className="float-right">
<Button variant={"link"} type={"button"}
Expand Down Expand Up @@ -162,7 +162,7 @@ export default class RequestHistoryView extends React.Component {
})
}
</ul>
: <p className={"p-3 text-muted"}>Hm! No query history found!.</p>
: <p className={"text-muted"}>Hm! No query history found!.</p>
}
</div>
</Card.Body>
Expand Down
4 changes: 2 additions & 2 deletions src/web/viewlets/welcome/welcome.js
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ export default class Welcome extends DefaultRemoteComponent {
</p>
</Col>
<Col md={"7"}>
<div className="border-left">
<div className="border-left" style={{"minHeight": "260px"}}>
<p className={"font-weight-bold pl-2 pb-2 border-bottom text-uppercase"}>Recent
queries :
</p>
Expand Down Expand Up @@ -95,7 +95,7 @@ export default class Welcome extends DefaultRemoteComponent {
})
}
</ul>
: <p className={"p-3 text-muted"}>Hm! No query history found!.</p>
: <p className={"p-2 text-muted"}>Hm! No query history found!.</p>
}
</div>
</div>
Expand Down

0 comments on commit 32d767f

Please sign in to comment.