mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2025-12-20 09:20:16 +00:00
Prettier 2.0 (#393)
This commit is contained in:
Steve Faulkner
GitHub
@@ -1,174 +1,174 @@
|
||||
import * as ko from "knockout";
|
||||
import _ from "underscore";
|
||||
import * as Constants from "../../Tables/Constants";
|
||||
import QueryViewModel from "../../Tables/QueryBuilder/QueryViewModel";
|
||||
import * as ViewModels from "../../../Contracts/ViewModels";
|
||||
import { ContextualPaneBase } from "../ContextualPaneBase";
|
||||
|
||||
export interface ISelectColumn {
|
||||
columnName: ko.Observable<string>;
|
||||
selected: ko.Observable<boolean>;
|
||||
editable: ko.Observable<boolean>;
|
||||
}
|
||||
|
||||
export class QuerySelectPane extends ContextualPaneBase {
|
||||
public titleLabel: string = "Select Columns";
|
||||
public instructionLabel: string = "Select the columns that you want to query.";
|
||||
public availableColumnsTableQueryLabel: string = "Available Columns";
|
||||
public noColumnSelectedWarning: string = "At least one column should be selected.";
|
||||
|
||||
public columnOptions: ko.ObservableArray<ISelectColumn>;
|
||||
public anyColumnSelected: ko.Computed<boolean>;
|
||||
public canSelectAll: ko.Computed<boolean>;
|
||||
public allSelected: ko.Computed<boolean>;
|
||||
|
||||
private selectedColumnOption: ISelectColumn = null;
|
||||
|
||||
public queryViewModel: QueryViewModel;
|
||||
|
||||
constructor(options: ViewModels.PaneOptions) {
|
||||
super(options);
|
||||
|
||||
this.columnOptions = ko.observableArray<ISelectColumn>();
|
||||
this.anyColumnSelected = ko.computed<boolean>(() => {
|
||||
return _.some(this.columnOptions(), (value: ISelectColumn) => {
|
||||
return value.selected();
|
||||
});
|
||||
});
|
||||
|
||||
this.canSelectAll = ko.computed<boolean>(() => {
|
||||
return _.some(this.columnOptions(), (value: ISelectColumn) => {
|
||||
return !value.selected();
|
||||
});
|
||||
});
|
||||
|
||||
this.allSelected = ko.pureComputed<boolean>({
|
||||
read: () => {
|
||||
return !this.canSelectAll();
|
||||
},
|
||||
write: value => {
|
||||
if (value) {
|
||||
this.selectAll();
|
||||
} else {
|
||||
this.clearAll();
|
||||
}
|
||||
},
|
||||
owner: this
|
||||
});
|
||||
}
|
||||
|
||||
public submit() {
|
||||
this.queryViewModel.selectText(this.getParameters());
|
||||
this.queryViewModel.getSelectMessage();
|
||||
this.close();
|
||||
}
|
||||
|
||||
public open() {
|
||||
this.setTableColumns(this.queryViewModel.columnOptions());
|
||||
this.setDisplayedColumns(this.queryViewModel.selectText(), this.columnOptions());
|
||||
super.open();
|
||||
}
|
||||
|
||||
private getParameters(): string[] {
|
||||
if (this.canSelectAll() === false) {
|
||||
return [];
|
||||
}
|
||||
|
||||
var selectedColumns = this.columnOptions().filter((value: ISelectColumn) => value.selected() === true);
|
||||
|
||||
var columns: string[] = selectedColumns.map((value: ISelectColumn) => {
|
||||
var name: string = value.columnName();
|
||||
return name;
|
||||
});
|
||||
|
||||
return columns;
|
||||
}
|
||||
|
||||
public setTableColumns(columnNames: string[]): void {
|
||||
var columns: ISelectColumn[] = columnNames.map((value: string) => {
|
||||
var columnOption: ISelectColumn = {
|
||||
columnName: ko.observable<string>(value),
|
||||
selected: ko.observable<boolean>(true),
|
||||
editable: ko.observable<boolean>(this.isEntityEditable(value))
|
||||
};
|
||||
return columnOption;
|
||||
});
|
||||
|
||||
this.columnOptions(columns);
|
||||
}
|
||||
|
||||
public setDisplayedColumns(querySelect: string[], columns: ISelectColumn[]): void {
|
||||
if (querySelect == null || _.isEmpty(querySelect)) {
|
||||
return;
|
||||
}
|
||||
this.setSelected(querySelect, columns);
|
||||
}
|
||||
|
||||
private setSelected(querySelect: string[], columns: ISelectColumn[]): void {
|
||||
this.clearAll();
|
||||
querySelect &&
|
||||
querySelect.forEach((value: string) => {
|
||||
for (var i = 0; i < columns.length; i++) {
|
||||
if (value === columns[i].columnName()) {
|
||||
columns[i].selected(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
public availableColumnsCheckboxClick(): boolean {
|
||||
if (this.canSelectAll()) {
|
||||
return this.selectAll();
|
||||
} else {
|
||||
return this.clearAll();
|
||||
}
|
||||
}
|
||||
|
||||
public selectAll(): boolean {
|
||||
const columnOptions = this.columnOptions && this.columnOptions();
|
||||
columnOptions &&
|
||||
columnOptions.forEach((value: ISelectColumn) => {
|
||||
value.selected(true);
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
public clearAll(): boolean {
|
||||
const columnOptions = this.columnOptions && this.columnOptions();
|
||||
columnOptions &&
|
||||
columnOptions.forEach((column: ISelectColumn) => {
|
||||
if (this.isEntityEditable(column.columnName())) {
|
||||
column.selected(false);
|
||||
} else {
|
||||
column.selected(true);
|
||||
}
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
public handleClick = (data: ISelectColumn, event: KeyboardEvent): boolean => {
|
||||
this.selectTargetItem($(event.currentTarget), data);
|
||||
return true;
|
||||
};
|
||||
|
||||
private selectTargetItem($target: JQuery, targetColumn: ISelectColumn): void {
|
||||
this.selectedColumnOption = targetColumn;
|
||||
|
||||
$(".list-item.selected").removeClass("selected");
|
||||
$target.addClass("selected");
|
||||
}
|
||||
|
||||
private isEntityEditable(name: string) {
|
||||
if (this.queryViewModel.queryTablesTab.container.isPreferredApiCassandra()) {
|
||||
const cassandraKeys = this.queryViewModel.queryTablesTab.collection.cassandraKeys.partitionKeys
|
||||
.concat(this.queryViewModel.queryTablesTab.collection.cassandraKeys.clusteringKeys)
|
||||
.map(key => key.property);
|
||||
return !_.contains<string>(cassandraKeys, name);
|
||||
}
|
||||
return !(
|
||||
name === Constants.EntityKeyNames.PartitionKey ||
|
||||
name === Constants.EntityKeyNames.RowKey ||
|
||||
name === Constants.EntityKeyNames.Timestamp
|
||||
);
|
||||
}
|
||||
}
|
||||
import * as ko from "knockout";
|
||||
import _ from "underscore";
|
||||
import * as Constants from "../../Tables/Constants";
|
||||
import QueryViewModel from "../../Tables/QueryBuilder/QueryViewModel";
|
||||
import * as ViewModels from "../../../Contracts/ViewModels";
|
||||
import { ContextualPaneBase } from "../ContextualPaneBase";
|
||||
|
||||
export interface ISelectColumn {
|
||||
columnName: ko.Observable<string>;
|
||||
selected: ko.Observable<boolean>;
|
||||
editable: ko.Observable<boolean>;
|
||||
}
|
||||
|
||||
export class QuerySelectPane extends ContextualPaneBase {
|
||||
public titleLabel: string = "Select Columns";
|
||||
public instructionLabel: string = "Select the columns that you want to query.";
|
||||
public availableColumnsTableQueryLabel: string = "Available Columns";
|
||||
public noColumnSelectedWarning: string = "At least one column should be selected.";
|
||||
|
||||
public columnOptions: ko.ObservableArray<ISelectColumn>;
|
||||
public anyColumnSelected: ko.Computed<boolean>;
|
||||
public canSelectAll: ko.Computed<boolean>;
|
||||
public allSelected: ko.Computed<boolean>;
|
||||
|
||||
private selectedColumnOption: ISelectColumn = null;
|
||||
|
||||
public queryViewModel: QueryViewModel;
|
||||
|
||||
constructor(options: ViewModels.PaneOptions) {
|
||||
super(options);
|
||||
|
||||
this.columnOptions = ko.observableArray<ISelectColumn>();
|
||||
this.anyColumnSelected = ko.computed<boolean>(() => {
|
||||
return _.some(this.columnOptions(), (value: ISelectColumn) => {
|
||||
return value.selected();
|
||||
});
|
||||
});
|
||||
|
||||
this.canSelectAll = ko.computed<boolean>(() => {
|
||||
return _.some(this.columnOptions(), (value: ISelectColumn) => {
|
||||
return !value.selected();
|
||||
});
|
||||
});
|
||||
|
||||
this.allSelected = ko.pureComputed<boolean>({
|
||||
read: () => {
|
||||
return !this.canSelectAll();
|
||||
},
|
||||
write: (value) => {
|
||||
if (value) {
|
||||
this.selectAll();
|
||||
} else {
|
||||
this.clearAll();
|
||||
}
|
||||
},
|
||||
owner: this,
|
||||
});
|
||||
}
|
||||
|
||||
public submit() {
|
||||
this.queryViewModel.selectText(this.getParameters());
|
||||
this.queryViewModel.getSelectMessage();
|
||||
this.close();
|
||||
}
|
||||
|
||||
public open() {
|
||||
this.setTableColumns(this.queryViewModel.columnOptions());
|
||||
this.setDisplayedColumns(this.queryViewModel.selectText(), this.columnOptions());
|
||||
super.open();
|
||||
}
|
||||
|
||||
private getParameters(): string[] {
|
||||
if (this.canSelectAll() === false) {
|
||||
return [];
|
||||
}
|
||||
|
||||
var selectedColumns = this.columnOptions().filter((value: ISelectColumn) => value.selected() === true);
|
||||
|
||||
var columns: string[] = selectedColumns.map((value: ISelectColumn) => {
|
||||
var name: string = value.columnName();
|
||||
return name;
|
||||
});
|
||||
|
||||
return columns;
|
||||
}
|
||||
|
||||
public setTableColumns(columnNames: string[]): void {
|
||||
var columns: ISelectColumn[] = columnNames.map((value: string) => {
|
||||
var columnOption: ISelectColumn = {
|
||||
columnName: ko.observable<string>(value),
|
||||
selected: ko.observable<boolean>(true),
|
||||
editable: ko.observable<boolean>(this.isEntityEditable(value)),
|
||||
};
|
||||
return columnOption;
|
||||
});
|
||||
|
||||
this.columnOptions(columns);
|
||||
}
|
||||
|
||||
public setDisplayedColumns(querySelect: string[], columns: ISelectColumn[]): void {
|
||||
if (querySelect == null || _.isEmpty(querySelect)) {
|
||||
return;
|
||||
}
|
||||
this.setSelected(querySelect, columns);
|
||||
}
|
||||
|
||||
private setSelected(querySelect: string[], columns: ISelectColumn[]): void {
|
||||
this.clearAll();
|
||||
querySelect &&
|
||||
querySelect.forEach((value: string) => {
|
||||
for (var i = 0; i < columns.length; i++) {
|
||||
if (value === columns[i].columnName()) {
|
||||
columns[i].selected(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
public availableColumnsCheckboxClick(): boolean {
|
||||
if (this.canSelectAll()) {
|
||||
return this.selectAll();
|
||||
} else {
|
||||
return this.clearAll();
|
||||
}
|
||||
}
|
||||
|
||||
public selectAll(): boolean {
|
||||
const columnOptions = this.columnOptions && this.columnOptions();
|
||||
columnOptions &&
|
||||
columnOptions.forEach((value: ISelectColumn) => {
|
||||
value.selected(true);
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
public clearAll(): boolean {
|
||||
const columnOptions = this.columnOptions && this.columnOptions();
|
||||
columnOptions &&
|
||||
columnOptions.forEach((column: ISelectColumn) => {
|
||||
if (this.isEntityEditable(column.columnName())) {
|
||||
column.selected(false);
|
||||
} else {
|
||||
column.selected(true);
|
||||
}
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
public handleClick = (data: ISelectColumn, event: KeyboardEvent): boolean => {
|
||||
this.selectTargetItem($(event.currentTarget), data);
|
||||
return true;
|
||||
};
|
||||
|
||||
private selectTargetItem($target: JQuery, targetColumn: ISelectColumn): void {
|
||||
this.selectedColumnOption = targetColumn;
|
||||
|
||||
$(".list-item.selected").removeClass("selected");
|
||||
$target.addClass("selected");
|
||||
}
|
||||
|
||||
private isEntityEditable(name: string) {
|
||||
if (this.queryViewModel.queryTablesTab.container.isPreferredApiCassandra()) {
|
||||
const cassandraKeys = this.queryViewModel.queryTablesTab.collection.cassandraKeys.partitionKeys
|
||||
.concat(this.queryViewModel.queryTablesTab.collection.cassandraKeys.clusteringKeys)
|
||||
.map((key) => key.property);
|
||||
return !_.contains<string>(cassandraKeys, name);
|
||||
}
|
||||
return !(
|
||||
name === Constants.EntityKeyNames.PartitionKey ||
|
||||
name === Constants.EntityKeyNames.RowKey ||
|
||||
name === Constants.EntityKeyNames.Timestamp
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user