Web console: Button to pretty print Druid JSON query (#8724)

* Add button and functionality to pretty format Rune JSON

* Removed console log

* Fix lgtm error about updating state

* Update test snapshot
This commit is contained in:
Evan Ren 2019-10-23 20:24:47 -07:00 committed by Vadim Ogievetsky
parent 137c2a6025
commit fdbc4ae147
4 changed files with 14 additions and 0 deletions

View File

@ -38,6 +38,7 @@ exports[`sql view matches snapshot 1`] = `
onEditContext={[Function]} onEditContext={[Function]}
onExplain={[Function]} onExplain={[Function]}
onHistory={[Function]} onHistory={[Function]}
onPrettier={[Function]}
onQueryContextChange={[Function]} onQueryContextChange={[Function]}
onRun={[Function]} onRun={[Function]}
queryContext={Object {}} queryContext={Object {}}

View File

@ -352,6 +352,12 @@ export class QueryView extends React.PureComponent<QueryViewProps, QueryViewStat
this.explainQueryManager.terminate(); this.explainQueryManager.terminate();
} }
prettyPrintJson(): void {
this.setState(prevState => ({
queryString: Hjson.stringify(Hjson.parse(prevState.queryString)),
}));
}
handleDownload = (filename: string, format: string) => { handleDownload = (filename: string, format: string) => {
const { result } = this.state; const { result } = this.state;
if (!result) return; if (!result) return;
@ -516,6 +522,7 @@ export class QueryView extends React.PureComponent<QueryViewProps, QueryViewStat
onRun={emptyQuery ? undefined : this.handleRun} onRun={emptyQuery ? undefined : this.handleRun}
onExplain={emptyQuery ? undefined : this.handleExplain} onExplain={emptyQuery ? undefined : this.handleExplain}
onHistory={() => this.setState({ historyDialogOpen: true })} onHistory={() => this.setState({ historyDialogOpen: true })}
onPrettier={() => this.prettyPrintJson()}
/> />
{this.renderAutoRunSwitch()} {this.renderAutoRunSwitch()}
{this.renderWrapQueryLimitSelector()} {this.renderWrapQueryLimitSelector()}

View File

@ -32,6 +32,7 @@ describe('run button', () => {
onQueryContextChange={() => {}} onQueryContextChange={() => {}}
onRun={() => {}} onRun={() => {}}
onExplain={() => {}} onExplain={() => {}}
onPrettier={() => {}}
/> />
); );

View File

@ -53,6 +53,7 @@ export interface RunButtonProps {
onExplain: (() => void) | undefined; onExplain: (() => void) | undefined;
onEditContext: () => void; onEditContext: () => void;
onHistory: () => void; onHistory: () => void;
onPrettier: () => void;
} }
@HotkeysTarget @HotkeysTarget
@ -85,6 +86,7 @@ export class RunButton extends React.PureComponent<RunButtonProps> {
onQueryContextChange, onQueryContextChange,
onEditContext, onEditContext,
onHistory, onHistory,
onPrettier,
} = this.props; } = this.props;
const useCache = getUseCache(queryContext); const useCache = getUseCache(queryContext);
@ -139,6 +141,9 @@ export class RunButton extends React.PureComponent<RunButtonProps> {
labelElement={numContextKeys ? pluralIfNeeded(numContextKeys, 'key') : undefined} labelElement={numContextKeys ? pluralIfNeeded(numContextKeys, 'key') : undefined}
/> />
)} )}
{runeMode && (
<MenuItem icon={IconNames.PRINT} text="Pretty print JSON" onClick={onPrettier} />
)}
</Menu> </Menu>
); );
} }