diff --git a/licenses.yaml b/licenses.yaml index 0300dc77d0b0..b521443d2487 100644 --- a/licenses.yaml +++ b/licenses.yaml @@ -4931,6 +4931,15 @@ version: 3.26.1 --- +name: "@blueprintjs/popover2" +license_category: binary +module: web-console +license_name: Apache License version 2.0 +copyright: Palantir Technologies +version: 0.10.1 + +--- + name: "@hypnosphi/create-react-context" license_category: binary module: web-console @@ -4941,6 +4950,16 @@ license_file_path: licenses/bin/@hypnosphi-create-react-context.MIT --- +name: "@popperjs/core" +license_category: binary +module: web-console +license_name: MIT License +copyright: Federico Zivolo +version: 2.9.2 +license_file_path: licenses/bin/@popperjs-core.MIT + +--- + name: "@types/dom4" license_category: binary module: web-console @@ -5498,6 +5517,16 @@ license_file_path: licenses/bin/react-dom.MIT --- +name: "react-fast-compare" +license_category: binary +module: web-console +license_name: MIT License +copyright: Chris Bolin +version: 3.2.0 +license_file_path: licenses/bin/react-fast-compare.MIT + +--- + name: "react-is" license_category: binary module: web-console diff --git a/licenses/bin/@popperjs-core.MIT b/licenses/bin/@popperjs-core.MIT new file mode 100644 index 000000000000..0370c4581eb5 --- /dev/null +++ b/licenses/bin/@popperjs-core.MIT @@ -0,0 +1,20 @@ +The MIT License (MIT) + +Copyright (c) 2019 Federico Zivolo + +Permission is hereby granted, free of charge, to any person obtaining a copy of +this software and associated documentation files (the "Software"), to deal in +the Software without restriction, including without limitation the rights to +use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of +the Software, and to permit persons to whom the Software is furnished to do so, +subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS +FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR +COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER +IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN +CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/licenses/bin/react-fast-compare.MIT b/licenses/bin/react-fast-compare.MIT new file mode 100644 index 000000000000..948353952d26 --- /dev/null +++ b/licenses/bin/react-fast-compare.MIT @@ -0,0 +1,22 @@ +MIT License + +Copyright (c) 2018 Formidable Labs +Copyright (c) 2017 Evgeny Poberezkin + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/web-console/package-lock.json b/web-console/package-lock.json index eaeec9fb19b5..1e009c8d1d86 100644 --- a/web-console/package-lock.json +++ b/web-console/package-lock.json @@ -3077,6 +3077,36 @@ } } }, + "@blueprintjs/popover2": { + "version": "0.10.1", + "resolved": "https://registry.npmjs.org/@blueprintjs/popover2/-/popover2-0.10.1.tgz", + "integrity": "sha512-5zo4TsoGO79yA/CCsENE7cVuSk3BEMzS99iWDdesyh9I9AU0rkSYcaKbAmpIrWfO9Oe4s8lRPms0OrXF2fs94Q==", + "requires": { + "@blueprintjs/core": "^3.45.0", + "@popperjs/core": "^2.5.4", + "classnames": "^2.2", + "dom4": "^2.1.5", + "react-popper": "^2.2.4", + "resize-observer-polyfill": "^1.5.1", + "tslib": "~1.13.0" + }, + "dependencies": { + "react-popper": { + "version": "2.2.5", + "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz", + "integrity": "sha512-kxGkS80eQGtLl18+uig1UIf9MKixFSyPxglsgLBxlYnyDf65BiY9B3nZSc6C9XUNDgStROB0fMQlTEz1KxGddw==", + "requires": { + "react-fast-compare": "^3.0.1", + "warning": "^4.0.2" + } + }, + "tslib": { + "version": "1.13.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.13.0.tgz", + "integrity": "sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q==" + } + } + }, "@cnakazawa/watch": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.4.tgz", @@ -4294,6 +4324,11 @@ "integrity": "sha512-6RglhutqrGFMO1MNUXp95RBuYIuc8wTnMAV5MUhLmjTOy78ncwOw7RgeQ/HeymkKXRhZd0s2DNrM1rL7unk3MQ==", "dev": true }, + "@popperjs/core": { + "version": "2.9.2", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.9.2.tgz", + "integrity": "sha512-VZMYa7+fXHdwIq1TDhSXoVmSPEGM/aa+6Aiq3nVVJ9bXr24zScr+NlKFKC3iPljA7ho/GAZr+d2jOf5GIRC30Q==" + }, "@sheerun/mutationobserver-shim": { "version": "0.3.2", "resolved": "https://registry.npmjs.org/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz", @@ -18325,6 +18360,11 @@ } } }, + "react-fast-compare": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz", + "integrity": "sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA==" + }, "react-is": { "version": "16.8.6", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz", diff --git a/web-console/package.json b/web-console/package.json index 54e4e83f6982..9d687ecde741 100644 --- a/web-console/package.json +++ b/web-console/package.json @@ -69,6 +69,7 @@ "@blueprintjs/core": "^3.45.0", "@blueprintjs/datetime": "^3.23.4", "@blueprintjs/icons": "^3.26.1", + "@blueprintjs/popover2": "^0.10.1", "axios": "^0.21.1", "brace": "^0.11.1", "classnames": "^2.2.6", diff --git a/web-console/src/components/action-cell/action-cell.tsx b/web-console/src/components/action-cell/action-cell.tsx index 2bc8988df005..9863e616aabb 100644 --- a/web-console/src/components/action-cell/action-cell.tsx +++ b/web-console/src/components/action-cell/action-cell.tsx @@ -16,8 +16,9 @@ * limitations under the License. */ -import { Popover, Position } from '@blueprintjs/core'; +import { Position } from '@blueprintjs/core'; import { IconNames } from '@blueprintjs/icons'; +import { Popover2 } from '@blueprintjs/popover2'; import React from 'react'; import { BasicAction, basicActionsToMenu } from '../../utils/basic-action'; @@ -42,9 +43,9 @@ export const ActionCell = React.memo(function ActionCell(props: ActionCellProps)
{onDetail && } {actionsMenu && ( - + - + )}
); diff --git a/web-console/src/components/auto-form/auto-form.scss b/web-console/src/components/auto-form/auto-form.scss index b880b55e94e5..94ce1f32fef6 100644 --- a/web-console/src/components/auto-form/auto-form.scss +++ b/web-console/src/components/auto-form/auto-form.scss @@ -24,14 +24,6 @@ .bp3-text-muted { position: absolute; right: 0; - - .bp3-popover-wrapper { - display: inline; - - .bp3-popover-target { - display: inline; - } - } } } } diff --git a/web-console/src/components/form-group-with-info/__snapshots__/form-group-with-info.spec.tsx.snap b/web-console/src/components/form-group-with-info/__snapshots__/form-group-with-info.spec.tsx.snap index e73b8fb1fbd0..1d9546429547 100644 --- a/web-console/src/components/form-group-with-info/__snapshots__/form-group-with-info.spec.tsx.snap +++ b/web-console/src/components/form-group-with-info/__snapshots__/form-group-with-info.spec.tsx.snap @@ -13,30 +13,26 @@ exports[`form group with info matches snapshot 1`] = ` class="bp3-text-muted" > - - - - info-sign - - - - + + info-sign + + + diff --git a/web-console/src/components/form-group-with-info/form-group-with-info.scss b/web-console/src/components/form-group-with-info/form-group-with-info.scss index ddde9ec3dd78..4d61773bb0cf 100644 --- a/web-console/src/components/form-group-with-info/form-group-with-info.scss +++ b/web-console/src/components/form-group-with-info/form-group-with-info.scss @@ -17,13 +17,17 @@ */ .form-group-with-info { + .bp3-text-muted .bp3-popover2-target { + margin-top: 0; + } + .bp3-form-content { position: relative; - & > .bp3-popover-wrapper { + & > .bp3-popover2-target { position: absolute; right: 0; - top: 7px; + top: 5px; } } } diff --git a/web-console/src/components/form-group-with-info/form-group-with-info.tsx b/web-console/src/components/form-group-with-info/form-group-with-info.tsx index 6ef8fa6f24fa..c6113b21a8d7 100644 --- a/web-console/src/components/form-group-with-info/form-group-with-info.tsx +++ b/web-console/src/components/form-group-with-info/form-group-with-info.tsx @@ -16,8 +16,9 @@ * limitations under the License. */ -import { FormGroup, Icon, Popover } from '@blueprintjs/core'; +import { FormGroup, Icon } from '@blueprintjs/core'; import { IconNames } from '@blueprintjs/icons'; +import { Popover2 } from '@blueprintjs/popover2'; import React from 'react'; import './form-group-with-info.scss'; @@ -35,9 +36,9 @@ export const FormGroupWithInfo = React.memo(function FormGroupWithInfo( const { label, info, inlineInfo, children } = props; const popover = ( - + - + ); return ( diff --git a/web-console/src/components/header-bar/__snapshots__/header-bar.spec.tsx.snap b/web-console/src/components/header-bar/__snapshots__/header-bar.spec.tsx.snap index c2448c78a321..84072b8e8a20 100644 --- a/web-console/src/components/header-bar/__snapshots__/header-bar.spec.tsx.snap +++ b/web-console/src/components/header-bar/__snapshots__/header-bar.spec.tsx.snap @@ -77,8 +77,8 @@ exports[`header bar matches snapshot 1`] = ` } } /> - @@ -166,21 +166,20 @@ exports[`header bar matches snapshot 1`] = ` inheritDarkTheme={true} interactionKind="click" minimal={false} - modifiers={Object {}} openOnTargetFocus={true} position="bottom-right" + positioningStrategy="absolute" targetTagName="span" transitionDuration={300} usePortal={true} - wrapperTagName="span" > - - + @@ -244,19 +243,18 @@ exports[`header bar matches snapshot 1`] = ` inheritDarkTheme={true} interactionKind="click" minimal={false} - modifiers={Object {}} openOnTargetFocus={true} position="bottom-right" + positioningStrategy="absolute" targetTagName="span" transitionDuration={300} usePortal={true} - wrapperTagName="span" > - + `; diff --git a/web-console/src/components/header-bar/header-bar.tsx b/web-console/src/components/header-bar/header-bar.tsx index b068e66847a5..f2050d26d713 100644 --- a/web-console/src/components/header-bar/header-bar.tsx +++ b/web-console/src/components/header-bar/header-bar.tsx @@ -27,10 +27,10 @@ import { Navbar, NavbarDivider, NavbarGroup, - Popover, Position, } from '@blueprintjs/core'; import { IconNames } from '@blueprintjs/icons'; +import { Popover2 } from '@blueprintjs/popover2'; import React, { useState } from 'react'; import { @@ -175,7 +175,7 @@ const RestrictedMode = React.memo(function RestrictedMode(props: RestrictedModeP } return ( -

The console is running in restricted mode.

@@ -192,7 +192,7 @@ const RestrictedMode = React.memo(function RestrictedMode(props: RestrictedModeP position={Position.BOTTOM_RIGHT} > - + + calendar + + + + + diff --git a/web-console/src/components/interval-input/interval-input.scss b/web-console/src/components/interval-input/interval-input.scss deleted file mode 100644 index f07522cd181c..000000000000 --- a/web-console/src/components/interval-input/interval-input.scss +++ /dev/null @@ -1,23 +0,0 @@ -/* - * Licensed to the Apache Software Foundation (ASF) under one - * or more contributor license agreements. See the NOTICE file - * distributed with this work for additional information - * regarding copyright ownership. The ASF licenses this file - * to you under the Apache License, Version 2.0 (the - * "License"); you may not use this file except in compliance - * with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -.calendar { - .bp3-popover-content { - right: 310px; - } -} diff --git a/web-console/src/components/interval-input/interval-input.spec.tsx b/web-console/src/components/interval-input/interval-input.spec.tsx index 9900566d2e9b..3af6cb78f301 100644 --- a/web-console/src/components/interval-input/interval-input.spec.tsx +++ b/web-console/src/components/interval-input/interval-input.spec.tsx @@ -22,7 +22,7 @@ import React from 'react'; import { IntervalInput } from './interval-input'; -describe('interval calendar component', () => { +describe('IntervalInput', () => { it('matches snapshot', () => { const intervalInput = ( - - + + more + + + + + `; exports[`more button matches snapshot (full) 1`] = ` - - - + + more + + + + + `; diff --git a/web-console/src/components/more-button/more-button.tsx b/web-console/src/components/more-button/more-button.tsx index 4bcef07225f9..a7ac38a6c22c 100644 --- a/web-console/src/components/more-button/more-button.tsx +++ b/web-console/src/components/more-button/more-button.tsx @@ -16,8 +16,9 @@ * limitations under the License. */ -import { Button, Menu, Popover, Position } from '@blueprintjs/core'; +import { Button, Menu, Position } from '@blueprintjs/core'; import { IconNames } from '@blueprintjs/icons'; +import { Popover2 } from '@blueprintjs/popover2'; import React, { useState } from 'react'; type OpenState = 'open' | 'alt-open'; @@ -39,7 +40,7 @@ export const MoreButton = React.memo(function MoreButton(props: MoreButtonProps) }); return ( - - + + caret-down + + + + + diff --git a/web-console/src/components/suggestible-input/suggestible-input.tsx b/web-console/src/components/suggestible-input/suggestible-input.tsx index 2b2ea25c1da9..dc34f075d38b 100644 --- a/web-console/src/components/suggestible-input/suggestible-input.tsx +++ b/web-console/src/components/suggestible-input/suggestible-input.tsx @@ -23,10 +23,10 @@ import { Intent, Menu, MenuItem, - Popover, Position, } from '@blueprintjs/core'; import { IconNames } from '@blueprintjs/icons'; +import { Popover2 } from '@blueprintjs/popover2'; import classNames from 'classnames'; import React, { useRef } from 'react'; @@ -82,8 +82,7 @@ export const SuggestibleInput = React.memo(function SuggestibleInput(props: Sugg }} rightElement={ suggestions && ( - {suggestions.map(suggestion => { @@ -123,7 +122,7 @@ export const SuggestibleInput = React.memo(function SuggestibleInput(props: Sugg autoFocus={false} > - + + caret-down + + + + + `; diff --git a/web-console/src/components/table-column-selector/table-column-selector.tsx b/web-console/src/components/table-column-selector/table-column-selector.tsx index 5ce6db555d8b..2a0c2b5a4762 100644 --- a/web-console/src/components/table-column-selector/table-column-selector.tsx +++ b/web-console/src/components/table-column-selector/table-column-selector.tsx @@ -16,8 +16,9 @@ * limitations under the License. */ -import { Button, Menu, Popover, Position } from '@blueprintjs/core'; +import { Button, Menu, Position } from '@blueprintjs/core'; import { IconNames } from '@blueprintjs/icons'; +import { Popover2 } from '@blueprintjs/popover2'; import React, { useState } from 'react'; import { MenuCheckbox } from '../menu-checkbox/menu-checkbox'; @@ -60,7 +61,7 @@ export const TableColumnSelector = React.memo(function TableColumnSelector( const counterText = `(${columns.filter(isColumnShown).length}/${columns.length})`; return ( - Columns {counterText} - + ); }); diff --git a/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap b/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap index 960ce42757a9..4f88968e7555 100644 --- a/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap +++ b/web-console/src/components/timed-button/__snapshots__/timed-button.spec.tsx.snap @@ -7,8 +7,8 @@ exports[`TimedButton matches snapshot 1`] = ` - @@ -35,16 +35,15 @@ exports[`TimedButton matches snapshot 1`] = ` inheritDarkTheme={true} interactionKind="click" minimal={false} - modifiers={Object {}} openOnTargetFocus={true} + positioningStrategy="absolute" targetTagName="span" transitionDuration={300} usePortal={true} - wrapperTagName="span" > - + `; diff --git a/web-console/src/components/timed-button/timed-button.tsx b/web-console/src/components/timed-button/timed-button.tsx index fe7a990843cd..ffda0a98853a 100644 --- a/web-console/src/components/timed-button/timed-button.tsx +++ b/web-console/src/components/timed-button/timed-button.tsx @@ -16,16 +16,9 @@ * limitations under the License. */ -import { - Button, - ButtonGroup, - IButtonProps, - Menu, - MenuDivider, - MenuItem, - Popover, -} from '@blueprintjs/core'; +import { Button, ButtonGroup, ButtonProps, Menu, MenuDivider, MenuItem } from '@blueprintjs/core'; import { IconNames } from '@blueprintjs/icons'; +import { Popover2 } from '@blueprintjs/popover2'; import React, { useState } from 'react'; import { useInterval } from '../../hooks'; @@ -36,7 +29,7 @@ export interface DelayLabel { delay: number; } -export interface TimedButtonProps extends IButtonProps { +export interface TimedButtonProps extends ButtonProps { delays: DelayLabel[]; onRefresh: (auto: boolean) => void; localStorageKey?: LocalStorageKeys; @@ -77,7 +70,7 @@ export const TimedButton = React.memo(function TimedButton(props: TimedButtonPro return ( - + + caret-down + + + + +
diff --git a/web-console/src/dialogs/query-history-dialog/query-plan-history.spec.tsx b/web-console/src/dialogs/query-history-dialog/query-history-dialog.spec.tsx similarity index 96% rename from web-console/src/dialogs/query-history-dialog/query-plan-history.spec.tsx rename to web-console/src/dialogs/query-history-dialog/query-history-dialog.spec.tsx index d164c3e01718..e5cd42d74d1b 100644 --- a/web-console/src/dialogs/query-history-dialog/query-plan-history.spec.tsx +++ b/web-console/src/dialogs/query-history-dialog/query-history-dialog.spec.tsx @@ -21,7 +21,7 @@ import React from 'react'; import { QueryHistoryDialog } from './query-history-dialog'; -describe('query plan dialog', () => { +describe('QueryHistoryDialog', () => { it('matches snapshot', () => { const queryPlanDialog = ( null} queryRecords={[]} onClose={() => {}} /> diff --git a/web-console/src/dialogs/query-plan-dialog/__snapshots__/query-plan-dialog.spec.tsx.snap b/web-console/src/dialogs/query-plan-dialog/__snapshots__/query-plan-dialog.spec.tsx.snap deleted file mode 100644 index e5e442ef9359..000000000000 --- a/web-console/src/dialogs/query-plan-dialog/__snapshots__/query-plan-dialog.spec.tsx.snap +++ /dev/null @@ -1,86 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`query plan dialog matches snapshot 1`] = ` -
-
-
-
-
-
-

- Query plan -

- -
-
-
- test -
-
- -
-
-
-
-`; diff --git a/web-console/src/dialogs/query-plan-dialog/query-plan-dialog.spec.tsx b/web-console/src/dialogs/query-plan-dialog/query-plan-dialog.spec.tsx deleted file mode 100644 index 92b8a0f05c80..000000000000 --- a/web-console/src/dialogs/query-plan-dialog/query-plan-dialog.spec.tsx +++ /dev/null @@ -1,37 +0,0 @@ -/* - * Licensed to the Apache Software Foundation (ASF) under one - * or more contributor license agreements. See the NOTICE file - * distributed with this work for additional information - * regarding copyright ownership. The ASF licenses this file - * to you under the Apache License, Version 2.0 (the - * "License"); you may not use this file except in compliance - * with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { render } from '@testing-library/react'; -import React from 'react'; - -import { QueryPlanDialog } from './query-plan-dialog'; - -describe('query plan dialog', () => { - it('matches snapshot', () => { - const queryPlanDialog = ( - null} - explainResult="test" - explainError={undefined} - onClose={() => {}} - /> - ); - render(queryPlanDialog); - expect(document.body.lastChild).toMatchSnapshot(); - }); -}); diff --git a/web-console/src/dialogs/query-plan-dialog/query-plan-dialog.tsx b/web-console/src/dialogs/query-plan-dialog/query-plan-dialog.tsx deleted file mode 100644 index 7a01dd1db08a..000000000000 --- a/web-console/src/dialogs/query-plan-dialog/query-plan-dialog.tsx +++ /dev/null @@ -1,151 +0,0 @@ -/* - * Licensed to the Apache Software Foundation (ASF) under one - * or more contributor license agreements. See the NOTICE file - * distributed with this work for additional information - * regarding copyright ownership. The ASF licenses this file - * to you under the Apache License, Version 2.0 (the - * "License"); you may not use this file except in compliance - * with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { - Button, - Classes, - Dialog, - FormGroup, - InputGroup, - Intent, - TextArea, -} from '@blueprintjs/core'; -import * as JSONBig from 'json-bigint-native'; -import React from 'react'; - -import { BasicQueryExplanation, SemiJoinQueryExplanation } from '../../utils'; - -import './query-plan-dialog.scss'; - -export interface QueryPlanDialogProps { - explainResult?: BasicQueryExplanation | SemiJoinQueryExplanation | string; - explainError?: Error; - onClose: () => void; - setQueryString: (queryString: string) => void; -} - -export const QueryPlanDialog = React.memo(function QueryPlanDialog(props: QueryPlanDialogProps) { - const { explainResult, explainError, onClose, setQueryString } = props; - - let content: JSX.Element; - let queryString: string | undefined; - - if (explainError) { - content =
{explainError.message}
; - } else if (!explainResult) { - content =
; - } else if ((explainResult as BasicQueryExplanation).query) { - let signature: JSX.Element | undefined; - if ((explainResult as BasicQueryExplanation).signature) { - const signatureContent = (explainResult as BasicQueryExplanation).signature || ''; - signature = ( - - - - ); - } - - queryString = JSONBig.stringify( - (explainResult as BasicQueryExplanation).query[0], - undefined, - 2, - ); - content = ( -
- -