Few more changes

This commit is contained in:
vaidankarswapnil 2021-07-26 13:47:50 +05:30
parent 079593cec4
commit 3bce7f764e

View File

@ -127,6 +127,7 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
isSelected: false, isSelected: false,
}, },
}; };
this.state.tableEntityListViewModel.queryTablesTab = this.props.queryTablesTab;
// console.log( // console.log(
// "🚀 ~ file: QueryTablesTabComponent.tsx ~ line 24 ~ QueryTablesTabComponent ~ constructor ~ props", // "🚀 ~ file: QueryTablesTabComponent.tsx ~ line 24 ~ QueryTablesTabComponent ~ constructor ~ props",
// props // props
@ -137,9 +138,12 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
", ", ", ",
this.state.queryViewModel.queryBuilderViewModel().andLabel, this.state.queryViewModel.queryBuilderViewModel().andLabel,
", ", ", ",
this.state.queryViewModel.queryBuilderViewModel().clauseArray() this.state.queryViewModel.queryBuilderViewModel().clauseArray(),
", ",
this.state.tableEntityListViewModel.items()
); );
const x = this.state.tableEntityListViewModel.items();
console.log("🚀 ~ file: QueryTablesTabComponent.tsx ~ line 146 ~ QueryTablesTabComponent ~ constructor ~ x", x);
this.andLabel = this.state.queryViewModel.queryBuilderViewModel().andLabel; this.andLabel = this.state.queryViewModel.queryBuilderViewModel().andLabel;
this.actionLabel = this.state.queryViewModel.queryBuilderViewModel().actionLabel; this.actionLabel = this.state.queryViewModel.queryBuilderViewModel().actionLabel;
this.fieldLabel = this.state.queryViewModel.queryBuilderViewModel().fieldLabel; this.fieldLabel = this.state.queryViewModel.queryBuilderViewModel().fieldLabel;
@ -148,7 +152,19 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
this.valueLabel = this.state.queryViewModel.queryBuilderViewModel().valueLabel; this.valueLabel = this.state.queryViewModel.queryBuilderViewModel().valueLabel;
useCommandBar.getState().setContextButtons(this.getTabsButtons()); useCommandBar.getState().setContextButtons(this.getTabsButtons());
this.state.tableEntityListViewModel.items.subscribe(() => {
console.log(
"🚀 ~ file: QueryTablesTab.tsx ~ line 54 ~ QueryTablesTab ~ sampleQuerySubscription ~ this.tableEntityListViewModel().items().length",
this.state.tableEntityListViewModel.items()
);
if (this.state.tableEntityListViewModel.items().length > 0 && userContext.apiType === "Tables") {
// this.state.queryViewModel.queryBuilderViewModel.setExample();
// console.log(
// "🚀 ~ file: QueryTablesTab.tsx ~ line 55 ~ QueryTablesTab ~ sampleQuerySubscription ~ this.queryViewModel().queryBuilderViewModel().setExample()",
// this.state.queryViewModel.queryBuilderViewModel.setExample()
// );
}
});
this.buildCommandBarOptions(); this.buildCommandBarOptions();
} }
@ -273,32 +289,37 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
} }
render(): JSX.Element { render(): JSX.Element {
useCommandBar.getState().setContextButtons(this.getTabsButtons()); // useCommandBar.getState().setContextButtons(this.getTabsButtons());
return ( return (
<div className="tab-pane tableContainer" data-bind="attr:{id: tabId}" role="tabpanel"> <div className="tab-pane tableContainer" id={this.props.tabsBaseInstance.tabId} role="tabpanel">
<div className="query-builder"> <div className="query-builder">
<div className="error-bar"> <div className="error-bar">
<div className="error-message" aria-label="Error Message"> {this.state.queryViewModel.hasQueryError() && (
<span> <div className="error-message" aria-label="Error Message">
<img className="entity-error-Img" src={ErrorRed} /> <span>
</span> <img className="entity-error-Img" src={ErrorRed} />
<span className="error-text" role="alert"></span> </span>
</div> <span className="error-text" role="alert"></span>
</div>
)}
</div> </div>
<div className="query-editor-panel"> {this.state.queryViewModel.isEditorActive() && (
<div> <div className="query-editor-panel">
<textarea <div>
className="query-editor-text" <textarea
data-bind="textInput: queryText, className={`query-editor-text ${
css: { 'query-editor-text-invalid': hasQueryError }, this.state.queryViewModel.hasQueryError() ? "query-editor-text-invalid" : ""
readOnly: true" } `}
name="query-editor" value={this.state.queryText}
rows="5" readOnly={true}
cols="100" name="query-editor"
></textarea> rows={5}
cols={100}
></textarea>
</div>
</div> </div>
</div> )}
{this.state.queryViewModel.isHelperActive() && ( {this.state.queryViewModel.isHelperActive() && (
<div style={{ paddingLeft: "13px" }}> <div style={{ paddingLeft: "13px" }}>
<div className="clause-table"> <div className="clause-table">
@ -338,6 +359,7 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
<div <div
className="addClause" className="addClause"
role="button" role="button"
onClick={this.state.queryViewModel.queryBuilderViewModel().addNewClause}
// data-bind="click: addNewClause, event: { keydown: onAddNewClauseKeyDown }, attr: { title: addNewClauseLine }" // data-bind="click: addNewClause, event: { keydown: onAddNewClauseKeyDown }, attr: { title: addNewClauseLine }"
tabIndex={0} tabIndex={0}
> >
@ -352,7 +374,9 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
<span <span
style={{ marginLeft: "5px" }} style={{ marginLeft: "5px" }}
// data-bind="text: addNewClauseLine" // data-bind="text: addNewClauseLine"
></span> >
{this.state.queryViewModel.queryBuilderViewModel().addNewClauseLine}
</span>
</span> </span>
</div> </div>
</div> </div>