[WIP]Cleanup/removed knockout database confirmation panel (#546)
* complete delete database component ui in react * fixed functional issue and added feedback input * test cases for deleteDatabaseConfirmationPanel * Removed Q and fixed PR change request * removed knockout database confirmation panel and references * delete deleteDatabaseConfirmationPane.html * remove test Co-authored-by: Steve Faulkner <471400+southpolesteve@users.noreply.github.com>
This commit is contained in:
Sunil Kumar Yadav
GitHub
parent
dc20aa96d2
commit
75ea475217
|
|
@ -88,7 +88,6 @@ export interface Database extends TreeNode {
|
|||
loadCollections(): Promise<void>;
|
||||
findCollectionWithId(collectionId: string): Collection;
|
||||
openAddCollection(database: Database, event: MouseEvent): void;
|
||||
onDeleteDatabaseContextMenuClick(source: Database, event: MouseEvent | KeyboardEvent): void;
|
||||
onSettingsClick: () => void;
|
||||
loadOffer(): Promise<void>;
|
||||
getPendingThroughputSplitNotification(): Promise<DataModels.Notification>;
|
||||
|
|
|
|||
|
|
@ -77,10 +77,6 @@ describe("Component Registerer", () => {
|
|||
expect(ko.components.isRegistered("delete-collection-confirmation-pane")).toBe(true);
|
||||
});
|
||||
|
||||
it("should register delete-database-confirmation-pane component", () => {
|
||||
expect(ko.components.isRegistered("delete-database-confirmation-pane")).toBe(true);
|
||||
});
|
||||
|
||||
it("should register save-query-pane component", () => {
|
||||
expect(ko.components.isRegistered("save-query-pane")).toBe(true);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -64,10 +64,7 @@ ko.components.register(
|
|||
"delete-collection-confirmation-pane",
|
||||
new PaneComponents.DeleteCollectionConfirmationPaneComponent()
|
||||
);
|
||||
ko.components.register(
|
||||
"delete-database-confirmation-pane",
|
||||
new PaneComponents.DeleteDatabaseConfirmationPaneComponent()
|
||||
);
|
||||
|
||||
ko.components.register("graph-new-vertex-pane", new PaneComponents.GraphNewVertexPaneComponent());
|
||||
ko.components.register("graph-styling-pane", new PaneComponents.GraphStylingPaneComponent());
|
||||
ko.components.register("table-add-entity-pane", new PaneComponents.TableAddEntityPaneComponent());
|
||||
|
|
|
|||
|
|
@ -1,17 +1,19 @@
|
|||
import { shallow } from "enzyme";
|
||||
import React from "react";
|
||||
import { SettingsComponentProps, SettingsComponent, SettingsComponentState } from "./SettingsComponent";
|
||||
import * as ViewModels from "../../../Contracts/ViewModels";
|
||||
import { CollectionSettingsTabV2 } from "../../Tabs/SettingsTabV2";
|
||||
import { collection } from "./TestUtils";
|
||||
import * as DataModels from "../../../Contracts/DataModels";
|
||||
import ko from "knockout";
|
||||
import { TtlType, isDirty } from "./SettingsUtils";
|
||||
import React from "react";
|
||||
import { updateCollection, updateMongoDBCollectionThroughRP } from "../../../Common/dataAccess/updateCollection";
|
||||
import { updateOffer } from "../../../Common/dataAccess/updateOffer";
|
||||
import * as DataModels from "../../../Contracts/DataModels";
|
||||
import * as ViewModels from "../../../Contracts/ViewModels";
|
||||
import { MongoDBCollectionResource } from "../../../Utils/arm/generatedClients/2020-04-01/types";
|
||||
import Explorer from "../../Explorer";
|
||||
import { CollectionSettingsTabV2 } from "../../Tabs/SettingsTabV2";
|
||||
import { SettingsComponent, SettingsComponentProps, SettingsComponentState } from "./SettingsComponent";
|
||||
import { isDirty, TtlType } from "./SettingsUtils";
|
||||
import { collection } from "./TestUtils";
|
||||
jest.mock("../../../Common/dataAccess/getIndexTransformationProgress", () => ({
|
||||
getIndexTransformationProgress: jest.fn().mockReturnValue(undefined),
|
||||
}));
|
||||
import { updateCollection, updateMongoDBCollectionThroughRP } from "../../../Common/dataAccess/updateCollection";
|
||||
jest.mock("../../../Common/dataAccess/updateCollection", () => ({
|
||||
updateCollection: jest.fn().mockReturnValue({
|
||||
id: undefined,
|
||||
|
|
@ -29,8 +31,6 @@ jest.mock("../../../Common/dataAccess/updateCollection", () => ({
|
|||
analyticalStorageTtl: undefined,
|
||||
} as MongoDBCollectionResource),
|
||||
}));
|
||||
import { updateOffer } from "../../../Common/dataAccess/updateOffer";
|
||||
import { MongoDBCollectionResource } from "../../../Utils/arm/generatedClients/2020-04-01/types";
|
||||
jest.mock("../../../Common/dataAccess/updateOffer", () => ({
|
||||
updateOffer: jest.fn().mockReturnValue({} as DataModels.Offer),
|
||||
}));
|
||||
|
|
@ -134,7 +134,6 @@ describe("SettingsComponent", () => {
|
|||
loadCollections: undefined,
|
||||
findCollectionWithId: undefined,
|
||||
openAddCollection: undefined,
|
||||
onDeleteDatabaseContextMenuClick: undefined,
|
||||
readSettings: undefined,
|
||||
onSettingsClick: undefined,
|
||||
loadOffer: undefined,
|
||||
|
|
|
|||
|
|
@ -1,23 +1,23 @@
|
|||
import { collection } from "./TestUtils";
|
||||
import ko from "knockout";
|
||||
import * as DataModels from "../../../Contracts/DataModels";
|
||||
import * as ViewModels from "../../../Contracts/ViewModels";
|
||||
import {
|
||||
getMongoIndexType,
|
||||
getMongoIndexTypeText,
|
||||
getMongoNotification,
|
||||
getSanitizedInputValue,
|
||||
hasDatabaseSharedThroughput,
|
||||
isDirty,
|
||||
isIndexTransforming,
|
||||
MongoIndexTypes,
|
||||
MongoNotificationType,
|
||||
MongoWildcardPlaceHolder,
|
||||
parseConflictResolutionMode,
|
||||
parseConflictResolutionProcedure,
|
||||
MongoWildcardPlaceHolder,
|
||||
getMongoIndexTypeText,
|
||||
SingleFieldText,
|
||||
WildcardText,
|
||||
isIndexTransforming,
|
||||
} from "./SettingsUtils";
|
||||
import * as DataModels from "../../../Contracts/DataModels";
|
||||
import * as ViewModels from "../../../Contracts/ViewModels";
|
||||
import ko from "knockout";
|
||||
import { collection } from "./TestUtils";
|
||||
|
||||
describe("SettingsUtils", () => {
|
||||
it("hasDatabaseSharedThroughput", () => {
|
||||
|
|
@ -42,7 +42,6 @@ describe("SettingsUtils", () => {
|
|||
loadCollections: undefined,
|
||||
findCollectionWithId: undefined,
|
||||
openAddCollection: undefined,
|
||||
onDeleteDatabaseContextMenuClick: undefined,
|
||||
readSettings: undefined,
|
||||
onSettingsClick: undefined,
|
||||
loadOffer: undefined,
|
||||
|
|
|
|||
|
|
@ -172,21 +172,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -737,21 +722,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
@ -1188,21 +1158,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -1753,21 +1708,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
@ -2217,21 +2157,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -2782,21 +2707,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
@ -3233,21 +3143,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -3798,21 +3693,6 @@ exports[`SettingsComponent renders 1`] = `
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
|
|||
|
|
@ -55,7 +55,6 @@ import CassandraAddCollectionPane from "./Panes/CassandraAddCollectionPane";
|
|||
import { ContextualPaneBase } from "./Panes/ContextualPaneBase";
|
||||
import DeleteCollectionConfirmationPane from "./Panes/DeleteCollectionConfirmationPane";
|
||||
import { DeleteCollectionConfirmationPanel } from "./Panes/DeleteCollectionConfirmationPanel";
|
||||
import DeleteDatabaseConfirmationPane from "./Panes/DeleteDatabaseConfirmationPane";
|
||||
import { DeleteDatabaseConfirmationPanel } from "./Panes/DeleteDatabaseConfirmationPanel";
|
||||
import { ExecuteSprocParamsPanel } from "./Panes/ExecuteSprocParamsPanel";
|
||||
import GraphStylingPane from "./Panes/GraphStylingPane";
|
||||
|
|
@ -204,7 +203,6 @@ export default class Explorer {
|
|||
public addDatabasePane: AddDatabasePane;
|
||||
public addCollectionPane: AddCollectionPane;
|
||||
public deleteCollectionConfirmationPane: DeleteCollectionConfirmationPane;
|
||||
public deleteDatabaseConfirmationPane: DeleteDatabaseConfirmationPane;
|
||||
public graphStylingPane: GraphStylingPane;
|
||||
public addTableEntityPane: AddTableEntityPane;
|
||||
public editTableEntityPane: EditTableEntityPane;
|
||||
|
|
@ -564,13 +562,6 @@ export default class Explorer {
|
|||
container: this,
|
||||
});
|
||||
|
||||
this.deleteDatabaseConfirmationPane = new DeleteDatabaseConfirmationPane({
|
||||
id: "deletedatabaseconfirmationpane",
|
||||
visible: ko.observable<boolean>(false),
|
||||
|
||||
container: this,
|
||||
});
|
||||
|
||||
this.graphStylingPane = new GraphStylingPane({
|
||||
id: "graphstylingpane",
|
||||
visible: ko.observable<boolean>(false),
|
||||
|
|
@ -661,7 +652,6 @@ export default class Explorer {
|
|||
this.addDatabasePane,
|
||||
this.addCollectionPane,
|
||||
this.deleteCollectionConfirmationPane,
|
||||
this.deleteDatabaseConfirmationPane,
|
||||
this.graphStylingPane,
|
||||
this.addTableEntityPane,
|
||||
this.editTableEntityPane,
|
||||
|
|
@ -767,8 +757,6 @@ export default class Explorer {
|
|||
this.editTableEntityPane.title("Edit Table Row");
|
||||
this.deleteCollectionConfirmationPane.title("Delete Table");
|
||||
this.deleteCollectionConfirmationPane.collectionIdConfirmationText("Confirm by typing the table id");
|
||||
this.deleteDatabaseConfirmationPane.title("Delete Keyspace");
|
||||
this.deleteDatabaseConfirmationPane.databaseIdConfirmationText("Confirm by typing the keyspace id");
|
||||
this.tableDataClient = new CassandraAPIDataClient();
|
||||
break;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,109 +0,0 @@
|
|||
<div data-bind="visible: visible, event: { keydown: onPaneKeyDown }">
|
||||
<div
|
||||
class="contextual-pane-out"
|
||||
data-bind="
|
||||
click: cancel,
|
||||
clickBubble: false"
|
||||
></div>
|
||||
<div class="contextual-pane" id="deletedatabaseconfirmationpane">
|
||||
<!-- Delete Databaes Confirmation form - Start -->
|
||||
<div class="contextual-pane-in">
|
||||
<form
|
||||
class="paneContentContainer"
|
||||
data-bind="
|
||||
submit: submit"
|
||||
>
|
||||
<!-- Delete Database Confirmation header - Start -->
|
||||
<div class="firstdivbg headerline">
|
||||
<span role="heading" aria-level="2" data-bind="text: title"></span>
|
||||
<div
|
||||
class="closeImg"
|
||||
role="button"
|
||||
aria-label="Close pane"
|
||||
tabindex="0"
|
||||
data-bind="
|
||||
click: cancel, event: { keypress: onCloseKeyPress }"
|
||||
>
|
||||
<img src="../../../images/close-black.svg" title="Close" alt="Close" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- Delete Database Confirmation header - End -->
|
||||
|
||||
<div class="warningErrorContainer" data-bind="visible: !formErrors()">
|
||||
<div class="warningErrorContent">
|
||||
<span><img class="paneWarningIcon" src="/warning.svg" alt="Warning" /></span>
|
||||
<span class="warningErrorDetailsLinkContainer">
|
||||
Warning! The action you are about to take cannot be undone. Continuing will permanently delete this
|
||||
resource and all of its children resources.
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Delete Database Confirmation errors - Start -->
|
||||
<div
|
||||
class="warningErrorContainer"
|
||||
aria-live="assertive"
|
||||
data-bind="
|
||||
visible: formErrors() && formErrors() !== ''"
|
||||
>
|
||||
<div class="warningErrorContent">
|
||||
<span><img class="paneErrorIcon" src="/error_red.svg" alt="Error" /></span>
|
||||
<span class="warningErrorDetailsLinkContainer">
|
||||
<span class="formErrors" data-bind="text: formErrors, attr: { title: formErrors }"></span>
|
||||
<a class="errorLink" role="link" data-bind="click: showErrorDetails">More details</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Delete Database Confirmation errors - End -->
|
||||
|
||||
<!-- Delete Database Confirmation inputs - Start -->
|
||||
<div class="paneMainContent">
|
||||
<div>
|
||||
<span class="mandatoryStar">*</span> <span data-bind="text: databaseIdConfirmationText"></span>
|
||||
<p>
|
||||
<input
|
||||
type="text"
|
||||
name="databaseIdConfirmation"
|
||||
data-test="confirmDatabaseId"
|
||||
required
|
||||
class="collid"
|
||||
data-bind="value: databaseIdConfirmation, hasFocus: firstFieldHasFocus"
|
||||
aria-label="Confirm by typing the database id"
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
<div data-bind="visible: recordDeleteFeedback">
|
||||
<div>Help us improve Azure Cosmos DB!</div>
|
||||
<div>What is the reason why you are deleting this database?</div>
|
||||
<p>
|
||||
<textarea
|
||||
type="text"
|
||||
data-test="databaseDeleteFeedback"
|
||||
name="databaseDeleteFeedback"
|
||||
rows="3"
|
||||
cols="53"
|
||||
maxlength="512"
|
||||
class="collid"
|
||||
data-bind="value: databaseDeleteFeedback"
|
||||
aria-label="Help us improve Azure Cosmos DB! What is the reason why you are deleting this database?"
|
||||
>
|
||||
</textarea>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="paneFooter">
|
||||
<div class="leftpanel-okbut">
|
||||
<input type="submit" data-test="deleteDatabase" value="OK" class="btncreatecoll1" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- Delete Database Confirmation inputs - End -->
|
||||
</form>
|
||||
</div>
|
||||
<!-- Delete Database Confirmation form - Start -->
|
||||
<!-- Loader - Start -->
|
||||
<div class="dataExplorerLoaderContainer dataExplorerPaneLoaderContainer" data-bind="visible: isExecuting">
|
||||
<img class="dataExplorerLoader" src="/LoadingIndicator_3Squares.gif" />
|
||||
</div>
|
||||
<!-- Loader - End -->
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,127 +0,0 @@
|
|||
jest.mock("../../Common/dataAccess/deleteDatabase");
|
||||
jest.mock("../../Shared/Telemetry/TelemetryProcessor");
|
||||
import * as ko from "knockout";
|
||||
import Q from "q";
|
||||
import { Action, ActionModifiers } from "../../Shared/Telemetry/TelemetryConstants";
|
||||
import * as DataModels from "../../Contracts/DataModels";
|
||||
import * as ViewModels from "../../Contracts/ViewModels";
|
||||
import DeleteDatabaseConfirmationPane from "./DeleteDatabaseConfirmationPane";
|
||||
import DeleteFeedback from "../../Common/DeleteFeedback";
|
||||
import Explorer from "../Explorer";
|
||||
import * as TelemetryProcessor from "../../Shared/Telemetry/TelemetryProcessor";
|
||||
import { TreeNode } from "../../Contracts/ViewModels";
|
||||
import { TabsManager } from "../Tabs/TabsManager";
|
||||
import { deleteDatabase } from "../../Common/dataAccess/deleteDatabase";
|
||||
|
||||
describe("Delete Database Confirmation Pane", () => {
|
||||
describe("Explorer.isLastDatabase() and Explorer.isLastNonEmptyDatabase()", () => {
|
||||
let explorer: Explorer;
|
||||
|
||||
beforeAll(() => {
|
||||
(deleteDatabase as jest.Mock).mockResolvedValue(undefined);
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
explorer = new Explorer();
|
||||
});
|
||||
|
||||
it("should be true if only 1 database", () => {
|
||||
let database = {} as ViewModels.Database;
|
||||
explorer.databases = ko.observableArray<ViewModels.Database>([database]);
|
||||
expect(explorer.isLastDatabase()).toBe(true);
|
||||
});
|
||||
|
||||
it("should be false if only 2 databases", () => {
|
||||
let database = {} as ViewModels.Database;
|
||||
let database2 = {} as ViewModels.Database;
|
||||
explorer.databases = ko.observableArray<ViewModels.Database>([database, database2]);
|
||||
expect(explorer.isLastDatabase()).toBe(false);
|
||||
});
|
||||
|
||||
it("should be false if not last empty database", () => {
|
||||
let database = {} as ViewModels.Database;
|
||||
explorer.databases = ko.observableArray<ViewModels.Database>([database]);
|
||||
expect(explorer.isLastNonEmptyDatabase()).toBe(false);
|
||||
});
|
||||
|
||||
it("should be true if last non empty database", () => {
|
||||
let database = {} as ViewModels.Database;
|
||||
database.collections = ko.observableArray<ViewModels.Collection>([{} as ViewModels.Collection]);
|
||||
explorer.databases = ko.observableArray<ViewModels.Database>([database]);
|
||||
expect(explorer.isLastNonEmptyDatabase()).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe("shouldRecordFeedback()", () => {
|
||||
it("should return true if last non empty database or is last database that has shared throughput, else false", () => {
|
||||
let fakeExplorer = {} as Explorer;
|
||||
|
||||
let pane = new DeleteDatabaseConfirmationPane({
|
||||
id: "deletedatabaseconfirmationpane",
|
||||
visible: ko.observable<boolean>(false),
|
||||
container: fakeExplorer as any,
|
||||
});
|
||||
|
||||
fakeExplorer.isLastNonEmptyDatabase = () => true;
|
||||
pane.container = fakeExplorer as any;
|
||||
expect(pane.shouldRecordFeedback()).toBe(true);
|
||||
|
||||
fakeExplorer.isLastDatabase = () => true;
|
||||
fakeExplorer.isSelectedDatabaseShared = () => true;
|
||||
pane.container = fakeExplorer as any;
|
||||
expect(pane.shouldRecordFeedback()).toBe(true);
|
||||
|
||||
fakeExplorer.isLastNonEmptyDatabase = () => false;
|
||||
fakeExplorer.isLastDatabase = () => true;
|
||||
fakeExplorer.isSelectedDatabaseShared = () => false;
|
||||
pane.container = fakeExplorer as any;
|
||||
expect(pane.shouldRecordFeedback()).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe("submit()", () => {
|
||||
it("on submit() it should log feedback if last non empty database or is last database that has shared throughput", () => {
|
||||
let selectedDatabaseId = "testDB";
|
||||
let fakeExplorer = {} as Explorer;
|
||||
fakeExplorer.findSelectedDatabase = () => {
|
||||
return {
|
||||
id: ko.observable<string>(selectedDatabaseId),
|
||||
rid: "test",
|
||||
collections: ko.observableArray<ViewModels.Collection>(),
|
||||
} as ViewModels.Database;
|
||||
};
|
||||
fakeExplorer.refreshAllDatabases = () => Q.resolve();
|
||||
fakeExplorer.selectedDatabaseId = ko.computed<string>(() => selectedDatabaseId);
|
||||
fakeExplorer.isSelectedDatabaseShared = () => false;
|
||||
const SubscriptionId = "testId";
|
||||
const AccountName = "testAccount";
|
||||
fakeExplorer.databaseAccount = ko.observable<DataModels.DatabaseAccount>({
|
||||
id: SubscriptionId,
|
||||
name: AccountName,
|
||||
} as DataModels.DatabaseAccount);
|
||||
fakeExplorer.defaultExperience = ko.observable<string>("DocumentDB");
|
||||
fakeExplorer.isPreferredApiCassandra = ko.computed(() => {
|
||||
return false;
|
||||
});
|
||||
fakeExplorer.selectedNode = ko.observable<TreeNode>();
|
||||
fakeExplorer.tabsManager = new TabsManager();
|
||||
fakeExplorer.isLastNonEmptyDatabase = () => true;
|
||||
|
||||
let pane = new DeleteDatabaseConfirmationPane({
|
||||
id: "deletedatabaseconfirmationpane",
|
||||
visible: ko.observable<boolean>(false),
|
||||
container: fakeExplorer as any,
|
||||
});
|
||||
pane.databaseIdConfirmation = ko.observable<string>(selectedDatabaseId);
|
||||
const Feedback = "my feedback";
|
||||
pane.databaseDeleteFeedback(Feedback);
|
||||
|
||||
return pane.submit().then(() => {
|
||||
let deleteFeedback = new DeleteFeedback(SubscriptionId, AccountName, DataModels.ApiKind.SQL, Feedback);
|
||||
expect(TelemetryProcessor.trace).toHaveBeenCalledWith(Action.DeleteDatabase, ActionModifiers.Mark, {
|
||||
message: JSON.stringify(deleteFeedback, Object.getOwnPropertyNames(deleteFeedback)),
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -1,143 +0,0 @@
|
|||
import * as ko from "knockout";
|
||||
import Q from "q";
|
||||
import * as Constants from "../../Common/Constants";
|
||||
import * as ViewModels from "../../Contracts/ViewModels";
|
||||
import { Action, ActionModifiers } from "../../Shared/Telemetry/TelemetryConstants";
|
||||
import { CassandraAPIDataClient } from "../Tables/TableDataClient";
|
||||
import { ConsoleDataType } from "../Menus/NotificationConsole/NotificationConsoleComponent";
|
||||
import { ContextualPaneBase } from "./ContextualPaneBase";
|
||||
import { DefaultExperienceUtility } from "../../Shared/DefaultExperienceUtility";
|
||||
import DeleteFeedback from "../../Common/DeleteFeedback";
|
||||
|
||||
import * as NotificationConsoleUtils from "../../Utils/NotificationConsoleUtils";
|
||||
import * as TelemetryProcessor from "../../Shared/Telemetry/TelemetryProcessor";
|
||||
import { deleteDatabase } from "../../Common/dataAccess/deleteDatabase";
|
||||
import { ARMError } from "../../Utils/arm/request";
|
||||
import { getErrorMessage, getErrorStack } from "../../Common/ErrorHandlingUtils";
|
||||
|
||||
export default class DeleteDatabaseConfirmationPane extends ContextualPaneBase {
|
||||
public databaseIdConfirmationText: ko.Observable<string>;
|
||||
public databaseIdConfirmation: ko.Observable<string>;
|
||||
public databaseDeleteFeedback: ko.Observable<string>;
|
||||
public recordDeleteFeedback: ko.Observable<boolean>;
|
||||
|
||||
constructor(options: ViewModels.PaneOptions) {
|
||||
super(options);
|
||||
this.databaseIdConfirmationText = ko.observable<string>("Confirm by typing the database id");
|
||||
this.databaseIdConfirmation = ko.observable<string>();
|
||||
this.databaseDeleteFeedback = ko.observable<string>();
|
||||
this.recordDeleteFeedback = ko.observable<boolean>(false);
|
||||
this.title("Delete Database");
|
||||
this.resetData();
|
||||
}
|
||||
|
||||
public submit(): Q.Promise<any> {
|
||||
if (!this._isValid()) {
|
||||
const selectedDatabase: ViewModels.Database = this.container.findSelectedDatabase();
|
||||
this.formErrors("Input database name does not match the selected database");
|
||||
NotificationConsoleUtils.logConsoleMessage(
|
||||
ConsoleDataType.Error,
|
||||
`Error while deleting collection ${selectedDatabase && selectedDatabase.id()}: ${this.formErrors()}`
|
||||
);
|
||||
return Q.resolve();
|
||||
}
|
||||
|
||||
this.formErrors("");
|
||||
this.isExecuting(true);
|
||||
const selectedDatabase = this.container.findSelectedDatabase();
|
||||
const startKey: number = TelemetryProcessor.traceStart(Action.DeleteDatabase, {
|
||||
databaseId: selectedDatabase.id(),
|
||||
dataExplorerArea: Constants.Areas.ContextualPane,
|
||||
paneTitle: this.title(),
|
||||
});
|
||||
return Q(
|
||||
deleteDatabase(selectedDatabase.id()).then(
|
||||
() => {
|
||||
this.isExecuting(false);
|
||||
this.close();
|
||||
this.container.refreshAllDatabases();
|
||||
this.container.tabsManager.closeTabsByComparator((tab) => tab.node?.id() === selectedDatabase.id());
|
||||
this.container.selectedNode(null);
|
||||
selectedDatabase
|
||||
.collections()
|
||||
.forEach((collection: ViewModels.Collection) =>
|
||||
this.container.tabsManager.closeTabsByComparator(
|
||||
(tab) =>
|
||||
tab.node?.id() === collection.id() &&
|
||||
(tab.node as ViewModels.Collection).databaseId === collection.databaseId
|
||||
)
|
||||
);
|
||||
this.resetData();
|
||||
TelemetryProcessor.traceSuccess(
|
||||
Action.DeleteDatabase,
|
||||
{
|
||||
databaseId: selectedDatabase.id(),
|
||||
dataExplorerArea: Constants.Areas.ContextualPane,
|
||||
paneTitle: this.title(),
|
||||
},
|
||||
startKey
|
||||
);
|
||||
|
||||
if (this.shouldRecordFeedback()) {
|
||||
let deleteFeedback = new DeleteFeedback(
|
||||
this.container.databaseAccount().id,
|
||||
this.container.databaseAccount().name,
|
||||
DefaultExperienceUtility.getApiKindFromDefaultExperience(this.container.defaultExperience()),
|
||||
this.databaseDeleteFeedback()
|
||||
);
|
||||
|
||||
TelemetryProcessor.trace(Action.DeleteDatabase, ActionModifiers.Mark, {
|
||||
message: JSON.stringify(deleteFeedback, Object.getOwnPropertyNames(deleteFeedback)),
|
||||
});
|
||||
|
||||
this.databaseDeleteFeedback("");
|
||||
}
|
||||
},
|
||||
(error: any) => {
|
||||
this.isExecuting(false);
|
||||
const errorMessage = getErrorMessage(error);
|
||||
this.formErrors(errorMessage);
|
||||
this.formErrorsDetails(errorMessage);
|
||||
TelemetryProcessor.traceFailure(
|
||||
Action.DeleteDatabase,
|
||||
{
|
||||
databaseId: selectedDatabase.id(),
|
||||
dataExplorerArea: Constants.Areas.ContextualPane,
|
||||
paneTitle: this.title(),
|
||||
error: errorMessage,
|
||||
errorStack: getErrorStack(error),
|
||||
},
|
||||
startKey
|
||||
);
|
||||
}
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
public resetData() {
|
||||
this.databaseIdConfirmation("");
|
||||
super.resetData();
|
||||
}
|
||||
|
||||
public async open() {
|
||||
await this.container.loadSelectedDatabaseOffer();
|
||||
this.recordDeleteFeedback(this.shouldRecordFeedback());
|
||||
super.open();
|
||||
}
|
||||
|
||||
public shouldRecordFeedback(): boolean {
|
||||
return (
|
||||
this.container.isLastNonEmptyDatabase() ||
|
||||
(this.container.isLastDatabase() && this.container.isSelectedDatabaseShared())
|
||||
);
|
||||
}
|
||||
|
||||
private _isValid(): boolean {
|
||||
const selectedDatabase = this.container.findSelectedDatabase();
|
||||
if (!selectedDatabase) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return this.databaseIdConfirmation() === selectedDatabase.id();
|
||||
}
|
||||
}
|
||||
|
|
@ -3,7 +3,6 @@ import AddDatabasePaneTemplate from "./AddDatabasePane.html";
|
|||
import BrowseQueriesPaneTemplate from "./BrowseQueriesPane.html";
|
||||
import CassandraAddCollectionPaneTemplate from "./CassandraAddCollectionPane.html";
|
||||
import DeleteCollectionConfirmationPaneTemplate from "./DeleteCollectionConfirmationPane.html";
|
||||
import DeleteDatabaseConfirmationPaneTemplate from "./DeleteDatabaseConfirmationPane.html";
|
||||
import GitHubReposPaneTemplate from "./GitHubReposPane.html";
|
||||
import GraphNewVertexPaneTemplate from "./GraphNewVertexPane.html";
|
||||
import GraphStylingPaneTemplate from "./GraphStylingPane.html";
|
||||
|
|
@ -49,15 +48,6 @@ export class DeleteCollectionConfirmationPaneComponent {
|
|||
}
|
||||
}
|
||||
|
||||
export class DeleteDatabaseConfirmationPaneComponent {
|
||||
constructor() {
|
||||
return {
|
||||
viewModel: PaneComponent,
|
||||
template: DeleteDatabaseConfirmationPaneTemplate,
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export class GraphNewVertexPaneComponent {
|
||||
constructor() {
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -148,21 +148,6 @@ exports[`Settings Pane should render Default properly 1`] = `
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -713,21 +698,6 @@ exports[`Settings Pane should render Default properly 1`] = `
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
@ -1252,21 +1222,6 @@ exports[`Settings Pane should render Gremlin properly 1`] = `
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -1817,21 +1772,6 @@ exports[`Settings Pane should render Gremlin properly 1`] = `
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
|
|||
|
|
@ -148,21 +148,6 @@ exports[`Upload Items Pane should render Default properly 1`] = `
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -713,21 +698,6 @@ exports[`Upload Items Pane should render Default properly 1`] = `
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
|
|||
|
|
@ -149,21 +149,6 @@ exports[`Delete Database Confirmation Pane submit() Should call delete database
|
|||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
GraphStylingPane {
|
||||
"container": [Circular],
|
||||
"firstFieldHasFocus": [Function],
|
||||
|
|
@ -714,21 +699,6 @@ exports[`Delete Database Confirmation Pane submit() Should call delete database
|
|||
"visible": [Function],
|
||||
},
|
||||
"deleteCollectionText": [Function],
|
||||
"deleteDatabaseConfirmationPane": DeleteDatabaseConfirmationPane {
|
||||
"container": [Circular],
|
||||
"databaseDeleteFeedback": [Function],
|
||||
"databaseIdConfirmation": [Function],
|
||||
"databaseIdConfirmationText": [Function],
|
||||
"firstFieldHasFocus": [Function],
|
||||
"formErrors": [Function],
|
||||
"formErrorsDetails": [Function],
|
||||
"id": "deletedatabaseconfirmationpane",
|
||||
"isExecuting": [Function],
|
||||
"isTemplateReady": [Function],
|
||||
"recordDeleteFeedback": [Function],
|
||||
"title": [Function],
|
||||
"visible": [Function],
|
||||
},
|
||||
"deleteDatabaseText": [Function],
|
||||
"editTableEntityPane": EditTableEntityPane {
|
||||
"addButtonLabel": "Add Property",
|
||||
|
|
|
|||
|
|
@ -142,10 +142,6 @@ export default class Database implements ViewModels.Database {
|
|||
);
|
||||
}
|
||||
|
||||
public onDeleteDatabaseContextMenuClick(source: ViewModels.Database, event: MouseEvent | KeyboardEvent) {
|
||||
this.container.deleteDatabaseConfirmationPane.open();
|
||||
}
|
||||
|
||||
public selectDatabase() {
|
||||
this.container.selectedNode(this);
|
||||
TelemetryProcessor.trace(Action.SelectItem, ActionModifiers.Mark, {
|
||||
|
|
|
|||
|
|
@ -232,7 +232,6 @@ const App: React.FunctionComponent = () => {
|
|||
<div data-bind='component: { name: "add-database-pane", params: {data: addDatabasePane} }' />
|
||||
<div data-bind='component: { name: "add-collection-pane", params: { data: addCollectionPane} }' />
|
||||
<div data-bind='component: { name: "delete-collection-confirmation-pane", params: { data: deleteCollectionConfirmationPane} }' />
|
||||
<div data-bind='component: { name: "delete-database-confirmation-pane", params: { data: deleteDatabaseConfirmationPane} }' />
|
||||
<div data-bind='component: { name: "graph-new-vertex-pane", params: { data: newVertexPane} }' />
|
||||
<div data-bind='component: { name: "graph-styling-pane", params: { data: graphStylingPane} }' />
|
||||
<div data-bind='component: { name: "table-add-entity-pane", params: { data: addTableEntityPane} }' />
|
||||
|
|
|
|||
Loading…
Reference in New Issue