random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2026-01-01 07:11:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

babel version update

Browse Source
This commit is contained in:
hardiknai-techm
2021-05-13 17:30:08 +05:30
parent 349a4bb0f2
commit b4461ddf5d
32 changed files with 1308 additions and 1515 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/Explorer/Controls/CommandButton/CommandButtonComponent.tsx
View File

@@ -214,11 +214,9 @@ export class CommandButtonComponent extends React.Component<CommandButtonCompone
}}
>
<div className="commandDropdown">
{this.props.children.map(
(c: CommandButtonComponentProps, index: number): JSX.Element => {
return CommandButtonComponent.renderButton(c, `${index}`);
}
)}
{this.props.children.map((c: CommandButtonComponentProps, index: number): JSX.Element => {
return CommandButtonComponent.renderButton(c, `${index}`);
})}
</div>
</div>
</div>

14
src/Explorer/Controls/Directory/DefaultDirectoryDropdownComponent.tsx
View File

@@ -21,14 +21,12 @@ export class DefaultDirectoryDropdownComponent extends React.Component<DefaultDi
key: DefaultDirectoryDropdownComponent.lastVisitedKey,
text: "Sign in to your last visited directory",
};
const directoryOptions: Array<IDropdownOption> = this.props.directories.map(
(dirc): IDropdownOption => {
return {
key: dirc.tenantId,
text: `${dirc.displayName}(${dirc.tenantId})`,
};
}
);
const directoryOptions: Array<IDropdownOption> = this.props.directories.map((dirc): IDropdownOption => {
return {
key: dirc.tenantId,
text: `${dirc.displayName}(${dirc.tenantId})`,
};
});
const dropDownOptions: Array<IDropdownOption> = [lastVisitedOption, ...directoryOptions];
const dropDownProps: IDropdownProps = {
label: "Set your default directory",

4
src/Explorer/Controls/Notebook/NotebookTerminalComponent.test.tsx
View File

@@ -111,9 +111,7 @@ describe("NotebookTerminalComponent", () => {
const terminal: NotebookTerminalComponent = createTerminal();
const params: Map<string, string> = terminal.getTerminalParams();
expect(params).toEqual(
new Map<string, string>([["terminal", "true"]])
);
expect(params).toEqual(new Map<string, string>([["terminal", "true"]]));
});
it("getTerminalParams: Test for Mongo 3.2 terminal", () => {

3
src/Explorer/Controls/NotebookViewer/NotebookViewerComponent.tsx
View File

@@ -44,7 +44,8 @@ interface NotebookViewerComponentState {
export class NotebookViewerComponent
extends React.Component<NotebookViewerComponentProps, NotebookViewerComponentState>
implements DialogHost {
implements DialogHost
{
private clientManager: NotebookClientV2;
private notebookComponentBootstrapper: NotebookComponentBootstrapper;

4
src/Explorer/Controls/Settings/TestUtils.tsx
View File

@@ -5,7 +5,7 @@ import ko from "knockout";
export const container = new Explorer();
export const collection = ({
export const collection = {
container: container,
databaseId: "test",
id: ko.observable<string>("test"),
@@ -43,4 +43,4 @@ export const collection = ({
readSettings: () => {
return;
},
} as unknown) as ViewModels.Collection;
} as unknown as ViewModels.Collection;

13
src/Explorer/Explorer.tsx
View File

@@ -1067,9 +1067,9 @@ export default class Explorer {
}
public findSelectedCollection(): ViewModels.Collection {
return (this.selectedNode().nodeKind === "Collection"
? this.selectedNode()
: this.selectedNode().collection) as ViewModels.Collection;
return (
this.selectedNode().nodeKind === "Collection" ? this.selectedNode() : this.selectedNode().collection
) as ViewModels.Collection;
}
public closeAllPanes(): void {
@@ -1165,9 +1165,10 @@ export default class Explorer {
return true;
}
private getDeltaDatabases(
updatedDatabaseList: DataModels.Database[]
): { toAdd: ViewModels.Database[]; toDelete: ViewModels.Database[] } {
private getDeltaDatabases(updatedDatabaseList: DataModels.Database[]): {
toAdd: ViewModels.Database[];
toDelete: ViewModels.Database[];
} {
const newDatabases: DataModels.Database[] = _.filter(updatedDatabaseList, (database: DataModels.Database) => {
const databaseExists = _.some(
this.databases(),

8
src/Explorer/Graph/GraphExplorerComponent/GraphExplorer.test.tsx
View File

@@ -206,11 +206,9 @@ describe("GraphExplorer", () => {
const gVRU = 123.456;
const disableMonacoEditor = (graphExplorer: GraphExplorer) => {
renderResultAsJsonStub = sinon.stub(graphExplorer, "renderResultAsJson").callsFake(
(): JSX.Element => {
return <div>[Monaco Editor Stub]</div>;
}
);
renderResultAsJsonStub = sinon.stub(graphExplorer, "renderResultAsJson").callsFake((): JSX.Element => {
return <div>[Monaco Editor Stub]</div>;
});
};
interface AjaxResponse {

77
src/Explorer/Graph/GraphExplorerComponent/GraphExplorer.tsx
View File

@@ -637,40 +637,38 @@ export class GraphExplorer extends React.Component<GraphExplorerProps, GraphExpl
promise = Q.resolve(0);
}
promise = promise.then(
(outEPairsNb: number): Q.Promise<number> => {
const inEdgesToFetch = totalEdgesToFetch - outEPairsNb;
if (!vertex._inEAllLoaded && inEdgesToFetch > 0) {
let start: number;
if (offsetIndex <= vertex._outEdgeIds.length) {
start = 0;
} else {
start = offsetIndex - vertex._outEdgeIds.length;
}
return this.fetchEdgeVertexPairs(false, vertex, start, inEdgesToFetch).then(
(pairs: EdgeVertexPair[]): number => {
vertex._inEAllLoaded = pairs.length < inEdgesToFetch;
const pairsToAdd = pairs.slice(0, GraphExplorer.LOAD_PAGE_SIZE - outEPairsNb);
pairsToAdd.forEach((p: EdgeVertexPair) => {
GraphData.GraphData.addInE(vertex, p.e.label, p.e);
GraphUtil.addRootChildToGraph(vertex, p.v, graphData);
graphData.addEdge(p.e);
vertex._inEdgeIds.push(p.e.id);
// Cache results (graphdata now contains a vertex with outE's filled in)
this.edgeInfoCache.addVertex(graphData.getVertexById(p.v.id));
});
addedEdgesNb += pairsToAdd.length;
return outEPairsNb + pairs.length;
}
);
promise = promise.then((outEPairsNb: number): Q.Promise<number> => {
const inEdgesToFetch = totalEdgesToFetch - outEPairsNb;
if (!vertex._inEAllLoaded && inEdgesToFetch > 0) {
let start: number;
if (offsetIndex <= vertex._outEdgeIds.length) {
start = 0;
} else {
return Q.resolve(outEPairsNb);
start = offsetIndex - vertex._outEdgeIds.length;
}
return this.fetchEdgeVertexPairs(false, vertex, start, inEdgesToFetch).then(
(pairs: EdgeVertexPair[]): number => {
vertex._inEAllLoaded = pairs.length < inEdgesToFetch;
const pairsToAdd = pairs.slice(0, GraphExplorer.LOAD_PAGE_SIZE - outEPairsNb);
pairsToAdd.forEach((p: EdgeVertexPair) => {
GraphData.GraphData.addInE(vertex, p.e.label, p.e);
GraphUtil.addRootChildToGraph(vertex, p.v, graphData);
graphData.addEdge(p.e);
vertex._inEdgeIds.push(p.e.id);
// Cache results (graphdata now contains a vertex with outE's filled in)
this.edgeInfoCache.addVertex(graphData.getVertexById(p.v.id));
});
addedEdgesNb += pairsToAdd.length;
return outEPairsNb + pairs.length;
}
);
} else {
return Q.resolve(outEPairsNb);
}
);
});
return promise.then((nbPairsFetched: number) => {
if (offsetIndex >= GraphExplorer.LOAD_PAGE_SIZE || !vertex._outEAllLoaded || !vertex._inEAllLoaded) {
@@ -1210,16 +1208,13 @@ export class GraphExplorer extends React.Component<GraphExplorerProps, GraphExpl
private getPossibleRootNodes(): LeftPane.CaptionId[] {
const key = this.props.graphConfigUiData.nodeCaptionChoice();
return $.map(
this.state.rootMap,
(value: any, index: number): LeftPane.CaptionId => {
let result = GraphData.GraphData.getNodePropValue(value, key);
return {
caption: result !== undefined ? result : value.id,
id: value.id,
};
}
);
return $.map(this.state.rootMap, (value: any, index: number): LeftPane.CaptionId => {
let result = GraphData.GraphData.getNodePropValue(value, key);
return {
caption: result !== undefined ? result : value.id,
id: value.id,
};
});
}
/**

240
src/Explorer/Graph/GraphExplorerComponent/GremlinSimpleClient.test.ts
View File

@@ -94,236 +94,16 @@ describe("Gremlin Simple Client", () => {
result: { data: ["é"], meta: {} },
};
const expectedDecodedUint8ArrayValues = [
123,
34,
114,
101,
113,
117,
101,
115,
116,
73,
100,
34,
58,
34,
100,
55,
55,
50,
102,
56,
57,
55,
45,
48,
100,
52,
100,
45,
52,
99,
100,
49,
45,
98,
51,
54,
48,
45,
100,
100,
102,
54,
99,
56,
54,
98,
57,
51,
97,
51,
34,
44,
34,
115,
116,
97,
116,
117,
115,
34,
58,
123,
34,
99,
111,
100,
101,
34,
58,
50,
48,
48,
44,
34,
97,
116,
116,
114,
105,
98,
117,
116,
101,
115,
34,
58,
123,
34,
103,
114,
97,
112,
104,
69,
120,
101,
99,
117,
116,
105,
111,
110,
83,
116,
97,
116,
117,
115,
34,
58,
50,
48,
48,
44,
34,
83,
116,
111,
114,
97,
103,
101,
82,
85,
34,
58,
50,
46,
50,
57,
44,
34,
67,
111,
109,
112,
117,
116,
101,
82,
85,
34,
58,
49,
46,
48,
55,
44,
34,
80,
101,
114,
80,
97,
114,
116,
105,
116,
105,
111,
110,
67,
111,
109,
112,
117,
116,
101,
67,
104,
97,
114,
103,
101,
115,
34,
58,
123,
125,
125,
44,
34,
109,
101,
115,
115,
97,
103,
101,
34,
58,
34,
34,
125,
44,
34,
114,
101,
115,
117,
108,
116,
34,
58,
123,
34,
100,
97,
116,
97,
34,
58,
91,
34,
195,
169,
34,
93,
44,
34,
109,
101,
116,
97,
34,
58,
123,
125,
125,
125,
123, 34, 114, 101, 113, 117, 101, 115, 116, 73, 100, 34, 58, 34, 100, 55, 55, 50, 102, 56, 57, 55, 45, 48, 100,
52, 100, 45, 52, 99, 100, 49, 45, 98, 51, 54, 48, 45, 100, 100, 102, 54, 99, 56, 54, 98, 57, 51, 97, 51, 34, 44,
34, 115, 116, 97, 116, 117, 115, 34, 58, 123, 34, 99, 111, 100, 101, 34, 58, 50, 48, 48, 44, 34, 97, 116, 116,
114, 105, 98, 117, 116, 101, 115, 34, 58, 123, 34, 103, 114, 97, 112, 104, 69, 120, 101, 99, 117, 116, 105, 111,
110, 83, 116, 97, 116, 117, 115, 34, 58, 50, 48, 48, 44, 34, 83, 116, 111, 114, 97, 103, 101, 82, 85, 34, 58, 50,
46, 50, 57, 44, 34, 67, 111, 109, 112, 117, 116, 101, 82, 85, 34, 58, 49, 46, 48, 55, 44, 34, 80, 101, 114, 80,
97, 114, 116, 105, 116, 105, 111, 110, 67, 111, 109, 112, 117, 116, 101, 67, 104, 97, 114, 103, 101, 115, 34, 58,
123, 125, 125, 44, 34, 109, 101, 115, 115, 97, 103, 101, 34, 58, 34, 34, 125, 44, 34, 114, 101, 115, 117, 108,
116, 34, 58, 123, 34, 100, 97, 116, 97, 34, 58, 91, 34, 195, 169, 34, 93, 44, 34, 109, 101, 116, 97, 34, 58, 123,
125, 125, 125,
];
// We do our best here to emulate what the server should return
const gremlinResponseData = new Uint8Array(<any>expectedDecodedUint8ArrayValues).buffer;

270
src/Explorer/Menus/CommandBar/CommandBarUtil.tsx
View File

@@ -27,154 +27,152 @@ export const convertButton = (btns: CommandButtonComponentProps[], backgroundCol
return btns
.filter((btn) => btn)
.map(
(btn: CommandButtonComponentProps, index: number): ICommandBarItemProps => {
if (btn.isDivider) {
return createDivider(btn.commandButtonLabel);
}
.map((btn: CommandButtonComponentProps, index: number): ICommandBarItemProps => {
if (btn.isDivider) {
return createDivider(btn.commandButtonLabel);
}
const isSplit = !!btn.children && btn.children.length > 0;
const label = btn.commandButtonLabel || btn.tooltipText;
const result: ICommandBarItemProps = {
iconProps: {
style: {
width: StyleConstants.CommandBarIconWidth, // 16
alignSelf: btn.iconName ? "baseline" : undefined,
},
imageProps: btn.iconSrc ? { src: btn.iconSrc, alt: btn.iconAlt } : undefined,
iconName: btn.iconName,
const isSplit = !!btn.children && btn.children.length > 0;
const label = btn.commandButtonLabel || btn.tooltipText;
const result: ICommandBarItemProps = {
iconProps: {
style: {
width: StyleConstants.CommandBarIconWidth, // 16
alignSelf: btn.iconName ? "baseline" : undefined,
},
onClick: (ev?: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>) => {
btn.onCommandClick(ev);
TelemetryProcessor.trace(Action.ClickCommandBarButton, ActionModifiers.Mark, { label });
imageProps: btn.iconSrc ? { src: btn.iconSrc, alt: btn.iconAlt } : undefined,
iconName: btn.iconName,
},
onClick: (ev?: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>) => {
btn.onCommandClick(ev);
TelemetryProcessor.trace(Action.ClickCommandBarButton, ActionModifiers.Mark, { label });
},
key: `${btn.commandButtonLabel}${index}`,
text: label,
"data-test": label,
title: btn.tooltipText,
name: label,
disabled: btn.disabled,
ariaLabel: btn.ariaLabel,
buttonStyles: {
root: {
backgroundColor: backgroundColor,
height: buttonHeightPx,
paddingRight: 0,
paddingLeft: 0,
minWidth: 24,
marginLeft: isSplit ? 0 : 5,
marginRight: isSplit ? 0 : 5,
},
key: `${btn.commandButtonLabel}${index}`,
text: label,
"data-test": label,
title: btn.tooltipText,
name: label,
disabled: btn.disabled,
ariaLabel: btn.ariaLabel,
buttonStyles: {
root: {
backgroundColor: backgroundColor,
height: buttonHeightPx,
paddingRight: 0,
paddingLeft: 0,
minWidth: 24,
marginLeft: isSplit ? 0 : 5,
marginRight: isSplit ? 0 : 5,
rootDisabled: {
backgroundColor: backgroundColor,
pointerEvents: "auto",
},
splitButtonMenuButton: {
backgroundColor: backgroundColor,
selectors: {
":hover": { backgroundColor: StyleConstants.AccentLight },
},
rootDisabled: {
backgroundColor: backgroundColor,
pointerEvents: "auto",
width: 16,
},
label: { fontSize: StyleConstants.mediumFontSize },
rootHovered: { backgroundColor: StyleConstants.AccentLight },
rootPressed: { backgroundColor: StyleConstants.AccentLight },
splitButtonMenuButtonExpanded: {
backgroundColor: StyleConstants.AccentExtra,
selectors: {
":hover": { backgroundColor: StyleConstants.AccentLight },
},
splitButtonMenuButton: {
backgroundColor: backgroundColor,
},
splitButtonDivider: {
display: "none",
},
icon: {
paddingLeft: 0,
paddingRight: 0,
},
splitButtonContainer: {
marginLeft: 5,
marginRight: 5,
},
},
className: btn.className,
id: btn.id,
};
if (isSplit) {
// It's a split button
result.split = true;
result.subMenuProps = {
items: convertButton(btn.children, backgroundColor),
styles: {
list: {
// TODO Figure out how to do it the proper way with subComponentStyles.
// TODO Remove all this crazy styling once we adopt Ui-Fabric Azure themes
selectors: {
":hover": { backgroundColor: StyleConstants.AccentLight },
},
width: 16,
},
label: { fontSize: StyleConstants.mediumFontSize },
rootHovered: { backgroundColor: StyleConstants.AccentLight },
rootPressed: { backgroundColor: StyleConstants.AccentLight },
splitButtonMenuButtonExpanded: {
backgroundColor: StyleConstants.AccentExtra,
selectors: {
":hover": { backgroundColor: StyleConstants.AccentLight },
".ms-ContextualMenu-itemText": { fontSize: StyleConstants.mediumFontSize },
".ms-ContextualMenu-link:hover": { backgroundColor: StyleConstants.AccentLight },
".ms-ContextualMenu-icon": { width: 16, height: 16 },
},
},
splitButtonDivider: {
display: "none",
},
icon: {
paddingLeft: 0,
paddingRight: 0,
},
splitButtonContainer: {
marginLeft: 5,
marginRight: 5,
},
},
className: btn.className,
id: btn.id,
};
if (isSplit) {
// It's a split button
result.split = true;
result.subMenuProps = {
items: convertButton(btn.children, backgroundColor),
styles: {
list: {
// TODO Figure out how to do it the proper way with subComponentStyles.
// TODO Remove all this crazy styling once we adopt Ui-Fabric Azure themes
selectors: {
".ms-ContextualMenu-itemText": { fontSize: StyleConstants.mediumFontSize },
".ms-ContextualMenu-link:hover": { backgroundColor: StyleConstants.AccentLight },
".ms-ContextualMenu-icon": { width: 16, height: 16 },
},
},
},
};
result.menuIconProps = {
iconType: IconType.image,
style: {
width: 12,
paddingLeft: 1,
paddingTop: 6,
},
imageProps: { src: ChevronDownIcon, alt: btn.iconAlt },
};
}
if (btn.isDropdown) {
const selectedChild = _.find(btn.children, (child) => child.dropdownItemKey === btn.dropdownSelectedKey);
result.name = selectedChild?.commandButtonLabel || btn.dropdownPlaceholder;
const dropdownStyles: Partial<IDropdownStyles> = {
root: { margin: 5 },
dropdown: { width: btn.dropdownWidth },
title: { fontSize: 12, height: 30, lineHeight: 28 },
dropdownItem: { fontSize: 12, lineHeight: 28, minHeight: 30 },
dropdownItemSelected: { fontSize: 12, lineHeight: 28, minHeight: 30 },
};
const onDropdownChange = (
event: React.FormEvent<HTMLDivElement>,
option?: IDropdownOption,
index?: number
): void => {
btn.children[index].onCommandClick(event);
TelemetryProcessor.trace(Action.ClickCommandBarButton, ActionModifiers.Mark, { label: option.text });
};
result.commandBarButtonAs = (props: IComponentAsProps<ICommandBarItemProps>) => {
return (
<Dropdown
placeholder={btn.dropdownPlaceholder}
defaultSelectedKey={btn.dropdownSelectedKey}
onChange={onDropdownChange}
options={btn.children.map((child: CommandButtonComponentProps) => ({
key: child.dropdownItemKey,
text: child.commandButtonLabel,
}))}
styles={dropdownStyles}
/>
);
};
}
if (btn.isArcadiaPicker && btn.arcadiaProps) {
result.commandBarButtonAs = () => <ArcadiaMenuPicker {...btn.arcadiaProps} />;
}
return result;
result.menuIconProps = {
iconType: IconType.image,
style: {
width: 12,
paddingLeft: 1,
paddingTop: 6,
},
imageProps: { src: ChevronDownIcon, alt: btn.iconAlt },
};
}
);
if (btn.isDropdown) {
const selectedChild = _.find(btn.children, (child) => child.dropdownItemKey === btn.dropdownSelectedKey);
result.name = selectedChild?.commandButtonLabel || btn.dropdownPlaceholder;
const dropdownStyles: Partial<IDropdownStyles> = {
root: { margin: 5 },
dropdown: { width: btn.dropdownWidth },
title: { fontSize: 12, height: 30, lineHeight: 28 },
dropdownItem: { fontSize: 12, lineHeight: 28, minHeight: 30 },
dropdownItemSelected: { fontSize: 12, lineHeight: 28, minHeight: 30 },
};
const onDropdownChange = (
event: React.FormEvent<HTMLDivElement>,
option?: IDropdownOption,
index?: number
): void => {
btn.children[index].onCommandClick(event);
TelemetryProcessor.trace(Action.ClickCommandBarButton, ActionModifiers.Mark, { label: option.text });
};
result.commandBarButtonAs = (props: IComponentAsProps<ICommandBarItemProps>) => {
return (
<Dropdown
placeholder={btn.dropdownPlaceholder}
defaultSelectedKey={btn.dropdownSelectedKey}
onChange={onDropdownChange}
options={btn.children.map((child: CommandButtonComponentProps) => ({
key: child.dropdownItemKey,
text: child.commandButtonLabel,
}))}
styles={dropdownStyles}
/>
);
};
}
if (btn.isArcadiaPicker && btn.arcadiaProps) {
result.commandBarButtonAs = () => <ArcadiaMenuPicker {...btn.arcadiaProps} />;
}
return result;
});
};
export const createDivider = (key: string): ICommandBarItemProps => {

12
src/Explorer/Menus/NavBar/ControlBarComponent.tsx
View File

@@ -14,13 +14,11 @@ export interface ControlBarComponentProps {
export class ControlBarComponent extends React.Component<ControlBarComponentProps> {
private static renderButtons(commandButtonOptions: CommandButtonComponentProps[]): JSX.Element[] {
return commandButtonOptions.map(
(btn: CommandButtonComponentProps, index: number): JSX.Element => {
// Remove label
btn.commandButtonLabel = undefined;
return CommandButtonComponent.renderButton(btn, `${index}`);
}
);
return commandButtonOptions.map((btn: CommandButtonComponentProps, index: number): JSX.Element => {
// Remove label
btn.commandButtonLabel = undefined;
return CommandButtonComponent.renderButton(btn, `${index}`);
});
}
public render(): JSX.Element {

10
src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx
View File

@@ -106,10 +106,12 @@ export class NotificationConsoleComponent extends React.Component<
const numInProgress = this.state.allConsoleData.filter(
(data: ConsoleData) => data.type === ConsoleDataType.InProgress
).length;
const numErroredItems = this.state.allConsoleData.filter((data: ConsoleData) => data.type === ConsoleDataType.Error)
.length;
const numInfoItems = this.state.allConsoleData.filter((data: ConsoleData) => data.type === ConsoleDataType.Info)
.length;
const numErroredItems = this.state.allConsoleData.filter(
(data: ConsoleData) => data.type === ConsoleDataType.Error
).length;
const numInfoItems = this.state.allConsoleData.filter(
(data: ConsoleData) => data.type === ConsoleDataType.Info
).length;
return (
<div className="notificationConsoleContainer">

56
src/Explorer/Notebook/NotebookClientV2.ts
View File

@@ -192,36 +192,36 @@ export class NotebookClientV2 {
* is triggered for *any* state change).
* TODO: Use react-redux connect() to subscribe to state changes?
*/
const cacheKernelSpecsMiddleware: Middleware = <D extends Dispatch<AnyAction>, S extends AppState>({
dispatch,
getState,
}: MiddlewareAPI<D, S>) => (next: Dispatch<AnyAction>) => <A extends AnyAction>(action: A): A => {
switch (action.type) {
case actions.FETCH_KERNELSPECS_FULFILLED: {
const payload = ((action as unknown) as actions.FetchKernelspecsFulfilled).payload;
const defaultKernelName = payload.defaultKernelName;
this.kernelSpecsForDisplay = Object.values(payload.kernelspecs)
.filter((spec) => !spec.metadata?.hasOwnProperty("hidden"))
.map((spec) => ({
name: spec.name,
displayName: spec.displayName,
}))
.sort((a: KernelSpecsDisplay, b: KernelSpecsDisplay) => {
// Put default at the top, otherwise lexicographically compare
if (a.displayName === defaultKernelName) {
return -1;
} else if (b.name === defaultKernelName) {
return 1;
} else {
return a.displayName.localeCompare(b.displayName);
}
});
break;
const cacheKernelSpecsMiddleware: Middleware =
<D extends Dispatch<AnyAction>, S extends AppState>({ dispatch, getState }: MiddlewareAPI<D, S>) =>
(next: Dispatch<AnyAction>) =>
<A extends AnyAction>(action: A): A => {
switch (action.type) {
case actions.FETCH_KERNELSPECS_FULFILLED: {
const payload = (action as unknown as actions.FetchKernelspecsFulfilled).payload;
const defaultKernelName = payload.defaultKernelName;
this.kernelSpecsForDisplay = Object.values(payload.kernelspecs)
.filter((spec) => !spec.metadata?.hasOwnProperty("hidden"))
.map((spec) => ({
name: spec.name,
displayName: spec.displayName,
}))
.sort((a: KernelSpecsDisplay, b: KernelSpecsDisplay) => {
// Put default at the top, otherwise lexicographically compare
if (a.displayName === defaultKernelName) {
return -1;
} else if (b.name === defaultKernelName) {
return 1;
} else {
return a.displayName.localeCompare(b.displayName);
}
});
break;
}
}
}
return next(action);
};
return next(action);
};
const traceErrorFct = (title: string, message: string) => {
TelemetryProcessor.traceFailure(Action.NotebookErrorNotification, {

20
src/Explorer/Notebook/NotebookComponent/store.ts
View File

@@ -21,16 +21,16 @@ export default function configureStore(
/**
* Catches errors in reducers
*/
const catchErrorMiddleware: Middleware = <D extends Dispatch<AnyAction>, S extends AppState>({
dispatch,
getState,
}: MiddlewareAPI<D, S>) => (next: Dispatch<AnyAction>) => <A extends AnyAction>(action: A): any => {
try {
next(action);
} catch (error) {
traceFailure("Reducer failure", error);
}
};
const catchErrorMiddleware: Middleware =
<D extends Dispatch<AnyAction>, S extends AppState>({ dispatch, getState }: MiddlewareAPI<D, S>) =>
(next: Dispatch<AnyAction>) =>
<A extends AnyAction>(action: A): any => {
try {
next(action);
} catch (error) {
traceFailure("Reducer failure", error);
}
};
const protect = (epic: Epic) => {
return (action$: Observable<any>, state$: any, dependencies: any) =>

11
src/Explorer/Notebook/NotebookRenderer/decorators/kbd-shortcuts/index.tsx
View File

@@ -52,15 +52,8 @@ export class KeyboardShortcuts extends React.Component<Props> {
return;
}
const {
executeFocusedCell,
focusNextCell,
focusNextCellEditor,
contentRef,
cellOrder,
focusedCell,
cellMap,
} = this.props;
const { executeFocusedCell, focusNextCell, focusNextCellEditor, contentRef, cellOrder, focusedCell, cellMap } =
this.props;
let ctrlKeyPressed = e.ctrlKey;
// Allow cmd + enter (macOS) to operate like ctrl + enter

1
src/Explorer/OpenFullScreen.test.tsx
View File

@@ -1,6 +1,7 @@
jest.mock("../hooks/useFullScreenURLs");
import "@testing-library/jest-dom";
import { render, screen } from "@testing-library/react";
import React from "react";
import { useFullScreenURLs } from "../hooks/useFullScreenURLs";
import { OpenFullScreen } from "./OpenFullScreen";

72
src/Explorer/Panes/AddCollectionPanel.tsx
View File

@@ -471,44 +471,42 @@ export class AddCollectionPanel extends React.Component<AddCollectionPanelProps,
</TooltipHost>
</Stack>
{this.state.uniqueKeys.map(
(uniqueKey: string, i: number): JSX.Element => {
return (
<Stack style={{ marginBottom: 8 }} key={`uniqueKey${i}`} horizontal>
<input
type="text"
autoComplete="off"
placeholder={
userContext.apiType === "Mongo"
? "Comma separated paths e.g. firstName,address.zipCode"
: "Comma separated paths e.g. /firstName,/address/zipCode"
}
className="panelTextField"
autoFocus
value={uniqueKey}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
const uniqueKeys = this.state.uniqueKeys.map((uniqueKey: string, j: number) => {
if (i === j) {
return event.target.value;
}
return uniqueKey;
});
this.setState({ uniqueKeys });
}}
/>
{this.state.uniqueKeys.map((uniqueKey: string, i: number): JSX.Element => {
return (
<Stack style={{ marginBottom: 8 }} key={`uniqueKey${i}`} horizontal>
<input
type="text"
autoComplete="off"
placeholder={
userContext.apiType === "Mongo"
? "Comma separated paths e.g. firstName,address.zipCode"
: "Comma separated paths e.g. /firstName,/address/zipCode"
}
className="panelTextField"
autoFocus
value={uniqueKey}
onChange={(event: React.ChangeEvent<HTMLInputElement>) => {
const uniqueKeys = this.state.uniqueKeys.map((uniqueKey: string, j: number) => {
if (i === j) {
return event.target.value;
}
return uniqueKey;
});
this.setState({ uniqueKeys });
}}
/>
<IconButton
iconProps={{ iconName: "Delete" }}
style={{ height: 27 }}
onClick={() => {
const uniqueKeys = this.state.uniqueKeys.filter((uniqueKey, j) => i !== j);
this.setState({ uniqueKeys });
}}
/>
</Stack>
);
}
)}
<IconButton
iconProps={{ iconName: "Delete" }}
style={{ height: 27 }}
onClick={() => {
const uniqueKeys = this.state.uniqueKeys.filter((uniqueKey, j) => i !== j);
this.setState({ uniqueKeys });
}}
/>
</Stack>
);
})}
<ActionButton
iconProps={{ iconName: "Add" }}

6
src/Explorer/Panes/Tables/AddTableEntityPanel.tsx
View File

@@ -67,10 +67,8 @@ export const AddTableEntityPanel: FunctionComponent<AddTableEntityPanelProps> =
const [selectedRow, setSelectedRow] = useState<number>(0);
const [entityAttributeValue, setEntityAttributeValue] = useState<string>("");
const [entityAttributeProperty, setEntityAttributeProperty] = useState<string>("");
const [
isEntityValuePanelOpen,
{ setTrue: setIsEntityValuePanelTrue, setFalse: setIsEntityValuePanelFalse },
] = useBoolean(false);
const [isEntityValuePanelOpen, { setTrue: setIsEntityValuePanelTrue, setFalse: setIsEntityValuePanelFalse }] =
useBoolean(false);
/* Get default and previous saved entity headers */
useEffect(() => {

8
src/Explorer/Panes/Tables/EditTableEntityPanel.tsx
View File

@@ -67,10 +67,8 @@ export const EditTableEntityPanel: FunctionComponent<EditTableEntityPanelProps>
const [originalDocument, setOriginalDocument] = useState<Entities.ITableEntity>({});
const [entityAttributeProperty, setEntityAttributeProperty] = useState<string>("");
const [
isEntityValuePanelOpen,
{ setTrue: setIsEntityValuePanelTrue, setFalse: setIsEntityValuePanelFalse },
] = useBoolean(false);
const [isEntityValuePanelOpen, { setTrue: setIsEntityValuePanelTrue, setFalse: setIsEntityValuePanelFalse }] =
useBoolean(false);
useEffect(() => {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -111,7 +109,7 @@ export const EditTableEntityPanel: FunctionComponent<EditTableEntityPanelProps>
const nonEditableType: boolean =
entityAttributeType === TableConstants.CassandraType.Blob ||
entityAttributeType === TableConstants.CassandraType.Inet;
const isDisable = !_.contains<string>(cassandraKeys, key) && !nonEditableType;
const isDisable = !_.contains<string>(cassandraKeys[0], key) && !nonEditableType;
const time =
entityAttributeType === TableConstants.TableType.DateTime ? getFormattedTime(displayValue) : "";
displayedAttributes.push({

17
src/Explorer/Panes/Tables/Validators/EntityTableHelper.tsx
View File

@@ -19,21 +19,8 @@ export const options = [
{ key: Int64, text: Int64 },
];
const {
Text,
Ascii,
Bigint,
Blob,
Decimal,
Float,
Int,
Uuid,
Varchar,
Varint,
Inet,
Smallint,
Tinyint,
} = TableConstants.CassandraType;
const { Text, Ascii, Bigint, Blob, Decimal, Float, Int, Uuid, Varchar, Varint, Inet, Smallint, Tinyint } =
TableConstants.CassandraType;
export const cassandraOptions = [
{ key: Text, text: Text },
{ key: Ascii, text: Ascii },

5
src/Explorer/Tables/DataTable/DataTableBindingManager.ts
View File

@@ -277,8 +277,9 @@ function updateTableScrollableRegionWidth(): void {
}
var bodyWidth = $(window).width();
var dataTablesScrollBodyPosLeft = $(tabElement).find(Constants.htmlSelectors.dataTableScrollBodySelector).offset()
.left;
var dataTablesScrollBodyPosLeft = $(tabElement)
.find(Constants.htmlSelectors.dataTableScrollBodySelector)
.offset().left;
var scrollWidth = bodyWidth - dataTablesScrollBodyPosLeft;
// jquery datatables automatically sets width:100% to both the header and the body when we use it's column autoWidth feature.

4
src/Explorer/Tables/QueryBuilder/QueryClauseViewModel.ts
View File

@@ -172,8 +172,8 @@ export default class QueryClauseViewModel {
} else {
this.resetFromTimestamp();
if (userContext.apiType === "Cassandra") {
const cassandraSchema = this._queryBuilderViewModel.tableEntityListViewModel.queryTablesTab.collection
.cassandraSchema;
const cassandraSchema =
this._queryBuilderViewModel.tableEntityListViewModel.queryTablesTab.collection.cassandraSchema;
for (let i = 0, len = cassandraSchema.length; i < len; i++) {
if (cassandraSchema[i].property === this.field()) {
this.type(cassandraSchema[i].type);

7
src/Explorer/Tree/Database.ts
View File

@@ -259,9 +259,10 @@ export default class Database implements ViewModels.Database {
}
}
private getDeltaCollections(
updatedCollectionsList: DataModels.Collection[]
): { toAdd: DataModels.Collection[]; toDelete: Collection[] } {
private getDeltaCollections(updatedCollectionsList: DataModels.Collection[]): {
toAdd: DataModels.Collection[];
toDelete: Collection[];
} {
const collectionsToAdd: DataModels.Collection[] = _.filter(
updatedCollectionsList,
(collection: DataModels.Collection) => {

20
src/Explorer/Tree/ResourceTreeAdapter.test.ts
View File

@@ -6,7 +6,7 @@ import { ResourceTreeAdapter } from "./ResourceTreeAdapter";
describe("ResourceTreeAdapter", () => {
const mockContainer = (): Explorer =>
(({
({
selectedNode: ko.observable<ViewModels.TreeNode>({
nodeKind: "nodeKind",
rid: "rid",
@@ -19,7 +19,7 @@ describe("ResourceTreeAdapter", () => {
},
isNotebookEnabled: ko.observable<boolean>(true),
databases: ko.observable<ViewModels.Database[]>([]),
} as unknown) as Explorer);
} as unknown as Explorer);
// TODO isDataNodeSelected needs a better design and refactor, but for now, we protect some of the code paths
describe("isDataNodeSelected", () => {
@@ -48,12 +48,12 @@ describe("ResourceTreeAdapter", () => {
it("should select if correct database node regardless of subnodekinds", () => {
const subNodeKind = ViewModels.CollectionTabKind.Documents;
const explorer = mockContainer();
explorer.selectedNode(({
explorer.selectedNode({
nodeKind: "Database",
rid: "dbrid",
id: ko.observable<string>("dbid"),
selectedSubnodeKind: ko.observable<ViewModels.CollectionTabKind>(subNodeKind),
} as unknown) as ViewModels.TreeNode);
} as unknown as ViewModels.TreeNode);
const resourceTreeAdapter = new ResourceTreeAdapter(explorer);
const isDataNodeSelected = resourceTreeAdapter.isDataNodeSelected("dbid", undefined, [
ViewModels.CollectionTabKind.Documents,
@@ -67,13 +67,13 @@ describe("ResourceTreeAdapter", () => {
explorer.tabsManager.activeTab({
tabKind: subNodeKind,
} as TabsBase);
explorer.selectedNode(({
explorer.selectedNode({
nodeKind: "Collection",
rid: "collrid",
databaseId: "dbid",
id: ko.observable<string>("collid"),
selectedSubnodeKind: ko.observable<ViewModels.CollectionTabKind>(subNodeKind),
} as unknown) as ViewModels.TreeNode);
} as unknown as ViewModels.TreeNode);
const resourceTreeAdapter = new ResourceTreeAdapter(explorer);
let isDataNodeSelected = resourceTreeAdapter.isDataNodeSelected("dbid", "collid", [subNodeKind]);
expect(isDataNodeSelected).toBeTruthy();
@@ -82,26 +82,26 @@ describe("ResourceTreeAdapter", () => {
explorer.tabsManager.activeTab({
tabKind: subNodeKind,
} as TabsBase);
explorer.selectedNode(({
explorer.selectedNode({
nodeKind: "Collection",
rid: "collrid",
databaseId: "dbid",
id: ko.observable<string>("collid"),
selectedSubnodeKind: ko.observable<ViewModels.CollectionTabKind>(subNodeKind),
} as unknown) as ViewModels.TreeNode);
} as unknown as ViewModels.TreeNode);
isDataNodeSelected = resourceTreeAdapter.isDataNodeSelected("dbid", "collid", [subNodeKind]);
expect(isDataNodeSelected).toBeTruthy();
});
it("should not select incorrect collection node (e.g. Settings)", () => {
const explorer = mockContainer();
explorer.selectedNode(({
explorer.selectedNode({
nodeKind: "Collection",
rid: "collrid",
databaseId: "dbid",
id: ko.observable<string>("collid"),
selectedSubnodeKind: ko.observable<ViewModels.CollectionTabKind>(ViewModels.CollectionTabKind.Documents),
} as unknown) as ViewModels.TreeNode);
} as unknown as ViewModels.TreeNode);
explorer.tabsManager.activeTab({
tabKind: ViewModels.CollectionTabKind.Documents,
} as TabsBase);