[GitHub] [incubator-druid] vogievetsky commented on a change in pull request #8322: Web-console: gate auto complete on current table and schema

2019-08-15 Thread GitBox
vogievetsky commented on a change in pull request #8322: Web-console: gate auto 
complete on current table and schema
URL: https://github.com/apache/incubator-druid/pull/8322#discussion_r314573911
 
 

 ##
 File path: web-console/src/views/query-view/query-input/query-input.tsx
 ##
 @@ -25,45 +25,137 @@ import AceEditor from 'react-ace';
 import { SQL_DATE_TYPES, SQL_FUNCTIONS, SyntaxDescription } from 
'../../../../lib/sql-function-doc';
 import { uniq } from '../../../utils';
 import { ColumnMetadata } from '../../../utils/column-metadata';
-import { ColumnTreeProps, ColumnTreeState } from '../column-tree/column-tree';
 
 import { SQL_CONSTANTS, SQL_DYNAMICS, SQL_EXPRESSION_PARTS, SQL_KEYWORDS } 
from './keywords';
 
 import './query-input.scss';
 
 const langTools = ace.acequire('ace/ext/language_tools');
 
+function addFunctionAutoCompleter(): void {
+  if (!langTools) return;
+
+  const functionList: any[] = SQL_FUNCTIONS.map((entry: SyntaxDescription) => {
+const funcName: string = entry.syntax.replace(/\(.*\)/, '()');
+return {
+  value: funcName,
+  score: 80,
+  meta: 'function',
+  syntax: entry.syntax,
+  description: entry.description,
+  completer: {
+insertMatch: (editor: any, data: any) => {
+  editor.completer.insertMatch({ value: data.caption });
+  const pos = editor.getCursorPosition();
+  editor.gotoLine(pos.row + 1, pos.column - 1);
+},
+  },
+};
+  });
+
+  langTools.addCompleter({
+getCompletions: (_editor: any, _session: any, _pos: any, _prefix: any, 
callback: any) => {
+  callback(null, functionList);
+},
+getDocTooltip: (item: any) => {
+  if (item.meta === 'function') {
+const functionName = item.caption.slice(0, -2);
+item.docHTML = `
+
+  
+${escape(functionName)}
+  
+  
+  
+Syntax:
+  
+  ${escape(item.syntax)}
+  
+  
+Description:
+  
+  ${escape(item.description)}
+`;
+  }
+},
+  });
+}
+
+function replaceDefaultAutoCompleter(): void {
 
 Review comment:
   it would be neater to make this a `static` at least


This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


With regards,
Apache Git Services

-
To unsubscribe, e-mail: commits-unsubscr...@druid.apache.org
For additional commands, e-mail: commits-h...@druid.apache.org



[GitHub] [incubator-druid] vogievetsky commented on a change in pull request #8322: Web-console: gate auto complete on current table and schema

2019-08-15 Thread GitBox
vogievetsky commented on a change in pull request #8322: Web-console: gate auto 
complete on current table and schema
URL: https://github.com/apache/incubator-druid/pull/8322#discussion_r314573877
 
 

 ##
 File path: web-console/src/views/query-view/query-input/query-input.tsx
 ##
 @@ -25,45 +25,137 @@ import AceEditor from 'react-ace';
 import { SQL_DATE_TYPES, SQL_FUNCTIONS, SyntaxDescription } from 
'../../../../lib/sql-function-doc';
 import { uniq } from '../../../utils';
 import { ColumnMetadata } from '../../../utils/column-metadata';
-import { ColumnTreeProps, ColumnTreeState } from '../column-tree/column-tree';
 
 import { SQL_CONSTANTS, SQL_DYNAMICS, SQL_EXPRESSION_PARTS, SQL_KEYWORDS } 
from './keywords';
 
 import './query-input.scss';
 
 const langTools = ace.acequire('ace/ext/language_tools');
 
+function addFunctionAutoCompleter(): void {
+  if (!langTools) return;
+
+  const functionList: any[] = SQL_FUNCTIONS.map((entry: SyntaxDescription) => {
+const funcName: string = entry.syntax.replace(/\(.*\)/, '()');
+return {
+  value: funcName,
+  score: 80,
+  meta: 'function',
+  syntax: entry.syntax,
+  description: entry.description,
+  completer: {
+insertMatch: (editor: any, data: any) => {
+  editor.completer.insertMatch({ value: data.caption });
+  const pos = editor.getCursorPosition();
+  editor.gotoLine(pos.row + 1, pos.column - 1);
+},
+  },
+};
+  });
+
+  langTools.addCompleter({
+getCompletions: (_editor: any, _session: any, _pos: any, _prefix: any, 
callback: any) => {
+  callback(null, functionList);
+},
+getDocTooltip: (item: any) => {
+  if (item.meta === 'function') {
+const functionName = item.caption.slice(0, -2);
+item.docHTML = `
+
+  
+${escape(functionName)}
+  
+  
+  
+Syntax:
+  
+  ${escape(item.syntax)}
+  
+  
+Description:
+  
+  ${escape(item.description)}
+`;
+  }
+},
+  });
+}
+
+function replaceDefaultAutoCompleter(): void {
+  if (!langTools) return;
+
+  const keywordList = ([] as any[]).concat(
+SQL_KEYWORDS.map(v => ({ name: v, value: v, score: 0, meta: 'keyword' })),
+SQL_EXPRESSION_PARTS.map(v => ({ name: v, value: v, score: 0, meta: 
'keyword' })),
+SQL_CONSTANTS.map(v => ({ name: v, value: v, score: 0, meta: 'constant' 
})),
+SQL_DYNAMICS.map(v => ({ name: v, value: v, score: 0, meta: 'dynamic' })),
+SQL_DATE_TYPES.map(v => ({ name: v.syntax, value: v.syntax, score: 0, 
meta: 'keyword' })),
+  );
+
+  const keywordCompleter = {
+getCompletions: (_editor: any, _session: any, _pos: any, _prefix: any, 
callback: any) => {
+  return callback(null, keywordList);
+},
+  };
+
+  langTools.setCompleters([langTools.snippetCompleter, 
langTools.textCompleter, keywordCompleter]);
+}
+
 export interface QueryInputProps {
   queryString: string;
   onQueryStringChange: (newQueryString: string) => void;
   runeMode: boolean;
   columnMetadata?: ColumnMetadata[];
+  currentSchema?: string;
+  currentTable?: string;
 }
 
 export interface QueryInputState {
   // For reasons (https://github.com/securingsincity/react-ace/issues/415) 
react ace editor needs an explicit height
   // Since this component will grown and shrink dynamically we will measure 
its height and then set it.
   editorHeight: number;
   prevColumnMetadata?: ColumnMetadata[];
+  prevCurrentTable?: string;
+  prevCurrentSchema?: string;
 }
 
 export class QueryInput extends React.PureComponent {
-  static getDerivedStateFromProps(props: ColumnTreeProps, state: 
ColumnTreeState) {
-const { columnMetadata } = props;
+  static getDerivedStateFromProps(props: QueryInputProps, state: 
QueryInputState) {
+const { columnMetadata, currentSchema, currentTable } = props;
+
+if (
+  columnMetadata &&
+  (columnMetadata !== state.prevColumnMetadata ||
+currentSchema !== state.prevCurrentSchema ||
+currentTable !== state.prevCurrentTable)
+) {
+  replaceDefaultAutoCompleter();
+  addFunctionAutoCompleter();
 
 Review comment:
   why is this being done on every prop change now?


This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
us...@infra.apache.org


With regards,
Apache Git Services

-
To unsubscribe, e-mail: commits-unsubscr...@druid.apache.org
For additional commands, e-mail: commits-h...@druid.apache.org