Skip to content
Merged
Show file tree
Hide file tree
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 7 additions & 1 deletion src/containers/Tenant/Query/QueryEditor/QueryEditor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,7 @@ export default function QueryEditor(props: QueryEditorProps) {
const [lastUsedQueryAction, setLastUsedQueryAction] = useSetting<QueryAction>(
LAST_USED_QUERY_ACTION_KEY,
);
const [lastExecutedQueryText, setLastExecutedQueryText] = React.useState<string>('');

const [sendQuery] = queryApi.useUseSendQueryMutation();

Expand Down Expand Up @@ -140,6 +141,7 @@ export default function QueryEditor(props: QueryEditorProps) {
const query = text ?? input;

setLastUsedQueryAction(QUERY_ACTIONS.execute);
setLastExecutedQueryText(query);
if (!isEqual(lastQueryExecutionSettings, querySettings)) {
resetBanner();
setLastQueryExecutionSettings(querySettings);
Expand Down Expand Up @@ -172,7 +174,7 @@ export default function QueryEditor(props: QueryEditorProps) {

const handleGetExplainQueryClick = useEventHandler(() => {
setLastUsedQueryAction(QUERY_ACTIONS.explain);

setLastExecutedQueryText(input);
if (!isEqual(lastQueryExecutionSettings, querySettings)) {
resetBanner();
setLastQueryExecutionSettings(querySettings);
Expand Down Expand Up @@ -368,6 +370,7 @@ export default function QueryEditor(props: QueryEditorProps) {
tenantName={tenantName}
path={path}
showPreview={showPreview}
queryText={lastExecutedQueryText}
/>
</div>
</SplitPane>
Expand All @@ -386,6 +389,7 @@ interface ResultProps {
tenantName: string;
path: string;
showPreview?: boolean;
queryText: string;
}
function Result({
resultVisibilityState,
Expand All @@ -397,6 +401,7 @@ function Result({
tenantName,
path,
showPreview,
queryText,
}: ResultProps) {
if (showPreview) {
return <Preview database={tenantName} path={path} type={type} />;
Expand All @@ -412,6 +417,7 @@ function Result({
isResultsCollapsed={resultVisibilityState.collapsed}
onExpandResults={onExpandResultHandler}
onCollapseResults={onCollapseResultHandler}
queryText={queryText}
/>
);
}
Expand Down
28 changes: 24 additions & 4 deletions src/containers/Tenant/Query/QueryResult/QueryResultViewer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ import {isQueryCancelledError} from '../utils/isQueryCancelledError';

import {Ast} from './components/Ast/Ast';
import {Graph} from './components/Graph/Graph';
import {PlanToSvgButton} from './components/PlanToSvgButton/PlanToSvgButton';
import {QueryInfoDropdown} from './components/QueryInfoDropdown/QueryInfoDropdown';
import {QueryJSONViewer} from './components/QueryJSONViewer/QueryJSONViewer';
import {QueryResultError} from './components/QueryResultError/QueryResultError';
import {ResultSetsViewer} from './components/ResultSetsViewer/ResultSetsViewer';
Expand Down Expand Up @@ -83,6 +83,7 @@ interface ExecuteResultProps {
tenantName: string;
onCollapseResults: VoidFunction;
onExpandResults: VoidFunction;
queryText?: string;
}

export function QueryResultViewer({
Expand All @@ -91,6 +92,7 @@ export function QueryResultViewer({
isResultsCollapsed,
theme,
tenantName,
queryText,
onCollapseResults,
onExpandResults,
}: ExecuteResultProps) {
Expand Down Expand Up @@ -180,6 +182,26 @@ export function QueryResultViewer({
);
};

const renderQueryInfoDropdown = () => {
if (isLoading || isQueryCancelledError(error)) {
return null;
}

return (
<QueryInfoDropdown
queryResultsInfo={{
queryText,
ast: data.ast,
stats: data.stats,
plan: data.plan,
}}
error={error}
database={tenantName}
hasPlanToSvg={Boolean(data?.plan && useShowPlanToSvg && isExecute)}
/>
);
};

const renderStubMessage = () => {
return (
<StubMessage
Expand Down Expand Up @@ -268,16 +290,14 @@ export function QueryResultViewer({
{data?.traceId && isExecute ? (
<TraceButton traceId={data.traceId} isTraceReady={result.isTraceReady} />
) : null}
{data?.plan && useShowPlanToSvg && isExecute ? (
<PlanToSvgButton plan={data?.plan} database={tenantName} />
) : null}
</div>
);
};

const renderRightControls = () => {
return (
<div className={b('controls-right')}>
{renderQueryInfoDropdown()}
{renderClipboardButton()}
<EnableFullscreenButton />
<PaneVisibilityToggleButtons
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.query-info-dropdown {
&__menu-item {
align-items: start;
}

&__menu-item-content {
display: flex;
flex-direction: column;

padding: var(--g-spacing-1) 0;
}

&__icon {
margin-top: var(--g-spacing-2);
margin-right: var(--g-spacing-2);
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import {Ellipsis} from '@gravity-ui/icons';
import type {ButtonProps} from '@gravity-ui/uikit';
import {Button, DropdownMenu} from '@gravity-ui/uikit';

import {useQueryInfoMenuItems} from './useQueryInfoMenuItems';
import type {QueryResultsInfo} from './utils';

import './QueryInfoDropdown.scss';

export interface QueryInfoDropdownProps {
queryResultsInfo: QueryResultsInfo;
database: string;
hasPlanToSvg: boolean;
error?: unknown;
}

export function QueryInfoDropdown({
queryResultsInfo,
database,
hasPlanToSvg,
error,
}: QueryInfoDropdownProps) {
const {isLoading, items} = useQueryInfoMenuItems({
queryResultsInfo,
database,
hasPlanToSvg,
error,
});

const renderSwitcher = (props: ButtonProps) => {
return (
<Button view="flat-secondary" loading={isLoading} disabled={isLoading} {...props}>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Lets add ActionTooltip for title.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

added

<Button.Icon>
<Ellipsis />
</Button.Icon>
</Button>
);
};

if (!items.length) {
return null;
}

return (
<DropdownMenu
popupProps={{
placement: ['bottom-end', 'left'],
}}
renderSwitcher={renderSwitcher}
items={items}
size="xl"
/>
);
}
Loading
Loading