Skip to content

Commit

Permalink
lambda settings UI updates
Browse files Browse the repository at this point in the history
  • Loading branch information
@rrmerugu
rrmerugu committed May 29, 2021
1 parent dba6c00 commit 20bd95f
Show file tree
Hide file tree
Showing 4 changed files with 64 additions and 33 deletions.
4 changes: 4 additions & 0 deletions src/App.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,3 +67,7 @@ button {
.bg-dark {
background: #4e4f55;
}
.button-hover-bg-disable:hover{
background: transparent !important;
color: inherit !important;
}
4 changes: 4 additions & 0 deletions src/web/viewlets/canvas/graph-canvas.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -735,6 +735,10 @@ export default class GraphCanvas extends DefaultRemoteComponent {
"width": "420px", "top": "90px", "zIndex": 100001,
"maxHeight": "calc(100vh - 250px)"
}}
cardBodyStyle={{
"overflow": "scroll",
"maxHeight": "calc(100vh - 215px)"
}}
onClose={() => {
_this.setLeftContentName(null)
}}
Expand Down
87 changes: 55 additions & 32 deletions src/web/viewlets/canvas/lambda-settings.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import {
} from "../../../utils/localStorage";
import {LAMBDA_SETTINGS} from "../../../settings/lambda";
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
import {faPencilAlt, faTrashAlt} from "@fortawesome/free-solid-svg-icons";
import {faChevronLeft, faChevronRight, faPencilAlt, faTrashAlt, faWindowClose} from "@fortawesome/free-solid-svg-icons";

export default class LambdaSettingsView extends React.Component {

Expand All @@ -27,7 +27,9 @@ export default class LambdaSettingsView extends React.Component {
startNewQueryInConsole: PropTypes.func,
query: PropTypes.string,
onClose: PropTypes.func,
style: PropTypes.object
style: PropTypes.object,
cardBodyStyle: PropTypes.object

};

constructor(props) {
Expand Down Expand Up @@ -83,7 +85,53 @@ export default class LambdaSettingsView extends React.Component {
<span className={"font-weight-bold"}>λ</span> Lambda Settings
</Card.Header>
<Card.Body className={"p-0 "}>
<div>
<div className={"pl-3 pr-3 pb-0"}>
<div className="row">
<div className="col col-7">
<p className={" text-muted small mt-2 mb-0"}>
showing {this.state.showStartCount} to {this.state.showEndCount} of {lambdaData.length}
</p>

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


<div className="float-right">

{lambdaDataToShow.length > 0
?
<React.Fragment>
<Button variant={"outline-secondary"} 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={"outline-secondary"} type={"button"}
className={"pr-2 pl-2 mr-2 rounded-0 border-0"}
disabled={!(lambdaData.length > this.state.showEndCount)}
onClick={() => this.showNext()}>
<FontAwesomeIcon icon={faChevronRight}/>
</Button>
</React.Fragment>
: <React.Fragment/>
}

<Button variant={"outline-secondary"} 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}>
{lambdaDataToShow.length > 0
?
<ul className={"list-group rounded-0"}>
Expand All @@ -92,14 +140,14 @@ export default class LambdaSettingsView extends React.Component {
return (
<li className={"list-group-item border-0 p-0"}
key={i}>
<h6 className={"font-weight-bold ml-2 mr-2 mt-2 mt-0 mb-0"}>{lambdaDataItem.name}</h6>
<pre className={" ml-2 mr-2 mt-2 p-3 mt-0 mb-0"}
<h6 className={"font-weight-bold ml-3 mr-3 mt-2 mt-0 mb-0"}>{lambdaDataItem.name}</h6>
<pre className={" ml-3 mr-3 mt-2 p-3 mt-0 mb-0"}
style={{"backgroundColor": "#efefef"}}>
{this.extractRawQuery(lambdaDataItem.query)}
</pre>
{/*<pre className={"mb-0"}>{JSON.stringify(lambdaDataItem.query, null, 2)}</pre>*/}

<div className={"pr-2 pl-2 pt-1 pb-1 "}>
<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*/}
Expand Down Expand Up @@ -131,7 +179,7 @@ export default class LambdaSettingsView extends React.Component {
{/*created at */}
{lambdaDataItem.dt}
</small>
<div className="border-bottom"/>
<div className="border-bottom pt-3"/>

</div>

Expand All @@ -143,31 +191,6 @@ export default class LambdaSettingsView extends React.Component {
: <p className={"p-3 text-muted"}>No Gremlin lambdas were saved!.</p>
}
</div>
<div className={"p-2"}>
<Button variant={"outline-secondary mt-2 mr-2"} type={"button"}
className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
onClick={() => this.props.onClose()}>close
</Button>

<Button variant={"outline-secondary mt-2"} type={"button"}
className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
disabled={!(this.state.showStartCount > 0)}

onClick={() => this.showPrev()}>prev
</Button>

<Button variant={"outline-secondary mt-2"} type={"button"}
className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
disabled={!(lambdaData.length > this.state.showEndCount)}

onClick={() => this.showNext()}>next </Button>

<span className={"float-right text-muted small"}>
showing {this.state.showStartCount} to {this.state.showEndCount} of {lambdaData.length}
</span>


</div>


</Card.Body>
Expand Down
2 changes: 1 addition & 1 deletion src/web/viewlets/canvas/query-history.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@ export default class RequestHistoryView extends React.Component {
<FontAwesomeIcon icon={faHistory}/> Query History
</Card.Header>
<Card.Body className={"p-0 "}>
<div className={"pl-2 pr-2 pb-2 pt-1"}>
<div className={"p-2"}>
<Button variant={"outline-secondary mt-2 mr-2"} type={"button"}
className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
onClick={() => this.props.onClose()}>close
Expand Down

0 comments on commit 20bd95f

Please sign in to comment.