Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

chore: Moved tern server to worker (#18464)

Browse Source 
* Fixes autocomplete on first page load.
This commit is contained in:
arunvjn 2022-11-27 11:41:01 +05:30 committed by GitHub
parent 49a98b5048
commit abf54ec84f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
66 changed files with 279 additions and 133 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/client/src/components/editorComponents/ActionCreator/viewComponents/TextView/index.tsx
View File

@ -4,7 +4,7 @@ import {
FieldWrapper,
} from "components/propertyControls/StyledControls";
import { InputText } from "components/propertyControls/InputTextControl";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import React from "react";
export function TextView(props: TextViewProps) {

2
app/client/src/components/editorComponents/CodeEditor/EditorConfig.ts
View File

@ -1,7 +1,7 @@
import CodeMirror from "codemirror";
import { DataTree, ENTITY_TYPE } from "entities/DataTree/dataTreeFactory";
import { AdditionalDynamicDataTree } from "utils/autocomplete/customTreeTypeDefCreator";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
export enum EditorModes {
TEXT = "text/plain",

2
app/client/src/components/editorComponents/CodeEditor/commandsHelper.ts
View File

@ -3,7 +3,7 @@ import { HintHelper } from "components/editorComponents/CodeEditor/EditorConfig"
import {
AutocompleteDataType,
CommandsCompletion,
} from "utils/autocomplete/TernServer";
} from "utils/autocomplete/CodemirrorTernService";
import { generateQuickCommands } from "./generateQuickCommands";
import { Datasource } from "entities/Datasource";
import AnalyticsUtil from "utils/AnalyticsUtil";

2
app/client/src/components/editorComponents/CodeEditor/generateQuickCommands.tsx
View File

@ -3,7 +3,7 @@ import React from "react";
import {
AutocompleteDataType,
CommandsCompletion,
} from "utils/autocomplete/TernServer";
} from "utils/autocomplete/CodemirrorTernService";
import ReactDOM from "react-dom";
import sortBy from "lodash/sortBy";
import { PluginType, SlashCommand, SlashCommandPayload } from "entities/Action";

14
app/client/src/components/editorComponents/CodeEditor/hintHelpers.ts
View File

@ -1,5 +1,5 @@
import CodeMirror from "codemirror";
import TernServer from "utils/autocomplete/TernServer";
import CodemirrorTernService from "utils/autocomplete/CodemirrorTernService";
import KeyboardShortcuts from "constants/KeyboardShortcuts";
import { HintHelper } from "components/editorComponents/CodeEditor/EditorConfig";
import AnalyticsUtil from "utils/AnalyticsUtil";
@ -11,12 +11,12 @@ export const bindingHint: HintHelper = (editor) => {
// @ts-expect-error: Types are not available
...editor.options.extraKeys,
[KeyboardShortcuts.CodeEditor.OpenAutocomplete]: (cm: CodeMirror.Editor) =>
checkIfCursorInsideBinding(cm) && TernServer.complete(cm),
checkIfCursorInsideBinding(cm) && CodemirrorTernService.complete(cm),
[KeyboardShortcuts.CodeEditor.ShowTypeAndInfo]: (cm: CodeMirror.Editor) => {
TernServer.showType(cm);
CodemirrorTernService.showType(cm);
},
[KeyboardShortcuts.CodeEditor.OpenDocsLink]: (cm: CodeMirror.Editor) => {
TernServer.showDocs(cm);
CodemirrorTernService.showDocs(cm);
},
});
return {
@ -26,12 +26,12 @@ export const bindingHint: HintHelper = (editor) => {
additionalData,
): boolean => {
if (additionalData && additionalData.blockCompletions) {
TernServer.setEntityInformation({
CodemirrorTernService.setEntityInformation({
...entityInformation,
blockCompletions: additionalData.blockCompletions,
});
} else {
TernServer.setEntityInformation(entityInformation);
CodemirrorTernService.setEntityInformation(entityInformation);
}
const entityType = entityInformation?.entityType;
@ -43,7 +43,7 @@ export const bindingHint: HintHelper = (editor) => {
}
if (shouldShow) {
AnalyticsUtil.logEvent("AUTO_COMPLETE_SHOW", {});
TernServer.complete(editor);
CodemirrorTernService.complete(editor);
return true;
}
// @ts-expect-error: Types are not available

2
app/client/src/components/editorComponents/CodeEditor/index.tsx
View File

@ -80,7 +80,7 @@ import { Button } from "design-system";
import { getPluginIdToImageLocation } from "sagas/selectors";
import { ExpectedValueExample } from "utils/validation/common";
import { getRecentEntityIds } from "selectors/globalSearchSelectors";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { Placement } from "@blueprintjs/popover2";
import { getLintAnnotations, getLintTooltipDirection } from "./lintHelpers";
import { executeCommandAction } from "actions/apiPaneActions";

2
app/client/src/components/editorComponents/form/fields/KeyValueFieldArray.tsx
View File

@ -11,7 +11,7 @@ import {
EditorTheme,
} from "components/editorComponents/CodeEditor/EditorConfig";
import { Case, Classes, Icon, IconSize, Text, TextType } from "design-system";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import DynamicDropdownField from "./DynamicDropdownField";
import {
DEFAULT_MULTI_PART_DROPDOWN_PLACEHOLDER,

2
app/client/src/components/propertyControls/ChartDataControl.tsx
View File

@ -15,7 +15,7 @@ import {
import { Size, Category } from "design-system";
import { AllChartData, ChartData } from "widgets/ChartWidget/constants";
import { generateReactKey } from "utils/generators";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import CodeEditor from "components/editorComponents/LazyCodeEditorWrapper";
const Wrapper = styled.div`

2
app/client/src/pages/Editor/APIEditor/GraphQL/VariableEditor.tsx
View File

@ -10,7 +10,7 @@ import styled from "styled-components";
import { Colors } from "constants/Colors";
import { Text, TextType } from "design-system";
import DynamicTextField from "components/editorComponents/form/fields/DynamicTextField";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
const VariableWrapper = styled.div`
display: flex;

2
app/client/src/pages/Editor/APIEditor/PostBodyData.tsx
View File

@ -21,7 +21,7 @@ import {
import { Classes, MultiSwitch } from "design-system";
import { updateBodyContentType } from "actions/apiPaneActions";
import { CodeEditorExpected } from "components/editorComponents/CodeEditor";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { createMessage, API_PANE_NO_BODY } from "@appsmith/constants/messages";
const PostBodyContainer = styled.div`

2
app/client/src/pages/Editor/PropertyPane/PropertyControl.tsx
View File

@ -45,7 +45,7 @@ import { ENTITY_TYPE } from "entities/AppsmithConsole";
import LOG_TYPE from "entities/AppsmithConsole/logtype";
import { getExpectedValue } from "utils/validation/common";
import { ControlData } from "components/propertyControls/BaseControl";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { getSelectedAppTheme } from "selectors/appThemingSelectors";
import { TooltipComponent } from "design-system";
import { ReactComponent as ResetIcon } from "assets/icons/control/undo_2.svg";

7
app/client/src/sagas/EvaluationsSaga.ts
View File

@ -216,7 +216,12 @@ function* evaluateTreeSaga(
isCreateFirstTree,
);
yield fork(updateTernDefinitions, updatedDataTree, unEvalUpdates);
yield fork(
updateTernDefinitions,
updatedDataTree,
unEvalUpdates,
isCreateFirstTree,
);
}
yield put(setDependencyMap(dependencies));
if (postEvalActions && postEvalActions.length) {

77
app/client/src/sagas/PostEvaluationSagas.ts
View File

@ -41,7 +41,7 @@ import { AppState } from "@appsmith/reducers";
import { getAppMode } from "selectors/applicationSelectors";
import { APP_MODE } from "entities/App";
import { dataTreeTypeDefCreator } from "utils/autocomplete/dataTreeTypeDefCreator";
import TernServer from "utils/autocomplete/TernServer";
import CodemirrorTernService from "utils/autocomplete/CodemirrorTernService";
import { selectFeatureFlags } from "selectors/usersSelectors";
import FeatureFlags from "entities/FeatureFlags";
import { JSAction } from "entities/JSCollection";
@ -337,55 +337,36 @@ export function* postEvalActionDispatcher(actions: Array<AnyReduxAction>) {
// is accurate
export function* updateTernDefinitions(
dataTree: DataTree,
updates?: DataTreeDiff[],
updates: DataTreeDiff[],
isCreateFirstTree: boolean,
) {
let shouldUpdate: boolean;
// No updates, means it was a first Eval
if (!updates) {
shouldUpdate = true;
} else if (updates.length === 0) {
// update length is 0 means no significant updates
shouldUpdate = false;
} else {
// Only when new field is added or deleted, we want to re-create the def
shouldUpdate = some(updates, (update) => {
if (
update.event === DataTreeDiffEvent.NEW ||
update.event === DataTreeDiffEvent.DELETE
) {
return true;
}
if (update.event === DataTreeDiffEvent.NOOP) {
const { entityName } = getEntityNameAndPropertyPath(
update.payload.propertyPath,
);
const entity = dataTree[entityName];
if (entity && isWidget(entity)) {
// if widget property name is modified then update tern def
return isWidgetPropertyNamePath(entity, update.payload.propertyPath);
}
}
return false;
const shouldUpdate: boolean =
isCreateFirstTree ||
some(updates, (update) => {
if (update.event === DataTreeDiffEvent.NEW) return true;
if (update.event === DataTreeDiffEvent.DELETE) return true;
if (update.event === DataTreeDiffEvent.EDIT) return false;
const { entityName } = getEntityNameAndPropertyPath(
update.payload.propertyPath,
);
const entity = dataTree[entityName];
if (!entity || !isWidget(entity)) return false;
return isWidgetPropertyNamePath(entity, update.payload.propertyPath);
});
}
if (shouldUpdate) {
const start = performance.now();
// remove private widgets from dataTree used for autocompletion
const treeWithoutPrivateWidgets = getDataTreeWithoutPrivateWidgets(
dataTree,
);
const featureFlags: FeatureFlags = yield select(selectFeatureFlags);
const { def, entityInfo } = dataTreeTypeDefCreator(
treeWithoutPrivateWidgets,
!!featureFlags.JS_EDITOR,
);
TernServer.updateDef("DATA_TREE", def, entityInfo);
const end = performance.now();
log.debug("Tern", { updates });
log.debug("Tern definitions updated took ", (end - start).toFixed(2));
}
if (!shouldUpdate) return;
const start = performance.now();
// remove private widgets from dataTree used for autocompletion
const treeWithoutPrivateWidgets = getDataTreeWithoutPrivateWidgets(dataTree);
const featureFlags: FeatureFlags = yield select(selectFeatureFlags);
const { def, entityInfo } = dataTreeTypeDefCreator(
treeWithoutPrivateWidgets,
!!featureFlags.JS_EDITOR,
);
CodemirrorTernService.updateDef("DATA_TREE", def, entityInfo);
const end = performance.now();
log.debug("Tern", { updates });
log.debug("Tern definitions updated took ", (end - start).toFixed(2));
}
export function* handleJSFunctionExecutionErrorLog(

2
app/client/src/utils/autocomplete/AutocompleteSortRules.ts
View File

@ -5,7 +5,7 @@ import {
Completion,
createCompletionHeader,
DataTreeDefEntityInformation,
} from "./TernServer";
} from "./CodemirrorTernService";
interface AutocompleteRule {
computeScore(completion: Completion): number;

17
app/client/src/utils/autocomplete/TernServer.ts → app/client/src/utils/autocomplete/CodemirrorTernService.ts
View File

@ -21,6 +21,7 @@ import { FieldEntityInformation } from "components/editorComponents/CodeEditor/E
import { ENTITY_TYPE } from "entities/DataTree/dataTreeFactory";
import { AutocompleteSorter } from "./AutocompleteSortRules";
import { getCompletionsForKeyword } from "./keywordCompletion";
import TernWorkerServer from "./TernWorkerService";
const DEFS: Def[] = [
// @ts-expect-error: Types are not available
@ -129,7 +130,7 @@ export function typeToIcon(type: string, isKeyword: boolean) {
return cls + "completion " + cls + "completion-" + suffix;
}
class TernServer {
class CodeMirrorTernService {
server: Server;
docs: TernDocs = Object.create(null);
cachedArgHints: ArgHints | null = null;
@ -139,12 +140,11 @@ class TernServer {
string,
DataTreeDefEntityInformation
>();
options: { async: boolean; defs: Def[] };
constructor() {
this.server = new tern.Server({
async: true,
defs: DEFS,
});
constructor(options: { async: boolean; defs: Def[] }) {
this.options = options;
this.server = new TernWorkerServer(this);
}
resetServer() {
@ -846,4 +846,7 @@ export const createCompletionHeader = (name: string): Completion => ({
isHeader: true,
});
export default new TernServer();
export default new CodeMirrorTernService({
async: true,
defs: DEFS,
});

24
app/client/src/utils/autocomplete/TernServer.test.ts
View File

@ -1,9 +1,9 @@
import TernServer, {
import CodemirrorTernService, {
AutocompleteDataType,
Completion,
createCompletionHeader,
DataTreeDefEntityInformation,
} from "./TernServer";
} from "./CodemirrorTernService";
import { MockCodemirrorEditor } from "../../../test/__mocks__/CodeMirrorEditorMock";
import { ENTITY_TYPE } from "entities/DataTree/dataTreeFactory";
import _ from "lodash";
@ -63,7 +63,9 @@ describe("Tern server", () => {
];
testCases.forEach((testCase) => {
const { value } = TernServer.getFocusedDocValueAndPos(testCase.input);
const { value } = CodemirrorTernService.getFocusedDocValueAndPos(
testCase.input,
);
expect(value).toBe(testCase.expectedOutput);
});
});
@ -125,13 +127,12 @@ describe("Tern server", () => {
];
testCases.forEach((testCase) => {
const request = TernServer.buildRequest(testCase.input, {});
const request = CodemirrorTernService.buildRequest(testCase.input, {});
expect(request.query.end).toEqual(testCase.expectedOutput);
});
});
it(`Check whether the position is evaluated correctly for placing the selected
autocomplete value`, () => {
it(`Check whether the position is evaluated correctly for placing the selected autocomplete value`, () => {
const testCases = [
{
input: {
@ -186,13 +187,18 @@ describe("Tern server", () => {
testCase.input.codeEditor.doc,
);
const value: any = TernServer.requestCallback(
const mockAddFile = jest.fn();
CodemirrorTernService.server.addFile = mockAddFile;
const value: any = CodemirrorTernService.requestCallback(
null,
testCase.input.requestCallbackData,
(MockCodemirrorEditor as unknown) as CodeMirror.Editor,
() => null,
);
expect(mockAddFile).toBeCalled();
expect(value.from).toEqual(testCase.expectedOutput);
});
});
@ -342,12 +348,12 @@ describe("Tern server sorting", () => {
];
it("shows best match results", () => {
TernServer.setEntityInformation({
CodemirrorTernService.setEntityInformation({
entityName: "sameEntity",
entityType: ENTITY_TYPE.WIDGET,
expectedType: AutocompleteDataType.OBJECT,
});
TernServer.defEntityInformation = defEntityInformation;
CodemirrorTernService.defEntityInformation = defEntityInformation;
const sortedCompletions = AutocompleteSorter.sort(
_.shuffle(completions),
{

82
app/client/src/utils/autocomplete/TernWorkerService.ts Normal file
View File

@ -0,0 +1,82 @@
import { Def, Server } from "tern";
import { CallbackFn, TernWorkerAction } from "./types";
const ternWorker = new Worker(
new URL("../../workers/Tern/tern.worker.ts", import.meta.url),
{
name: "TernWorker",
type: "module",
},
);
function getFile(ts: any, name: string, c: CallbackFn) {
const buf = ts.docs[name];
if (buf) c(ts.docValue(ts, buf));
else if (ts.options.getFile) ts.options.getFile(name, c);
else c(null);
}
type TernWorkerServerConstructor = {
(ts: any): void;
new (ts: any): Server;
};
function TernWorkerServer(this: any, ts: any) {
const worker = (ts.worker = ternWorker);
worker.postMessage({
type: TernWorkerAction.INIT,
defs: ts.options.defs,
plugins: ts.options.plugins,
scripts: ts.options.workerDeps,
});
let msgId = 0;
let pending: { [x: number]: CallbackFn } = {};
function send(data: any, c?: CallbackFn) {
if (c) {
data.id = ++msgId;
pending[msgId] = c;
}
worker.postMessage(data);
}
worker.onmessage = function(e) {
const data = e.data;
if (data.type == TernWorkerAction.GET_FILE) {
getFile(ts, data.name, function(err, text) {
send({
type: TernWorkerAction.GET_FILE,
err: String(err),
text: text,
id: data.id,
});
});
} else if (data.type == TernWorkerAction.DEBUG) {
window.console.log(data.message);
} else if (data.id && pending[data.id]) {
pending[data.id](data.err, data.body);
delete pending[data.id];
}
};
worker.onerror = function(e) {
for (const id in pending) pending[id](e);
pending = {};
};
this.addFile = function(name: string, text: string) {
send({ type: TernWorkerAction.ADD_FILE, name: name, text: text });
};
this.delFile = function(name: string) {
send({ type: TernWorkerAction.DELETE_FILE, name: name });
};
this.request = function(body: any, c: CallbackFn) {
send({ type: TernWorkerAction.REQUEST, body: body }, c);
};
this.addDefs = function(defs: Def) {
send({ type: TernWorkerAction.ADD_DEF, defs });
};
this.deleteDefs = function(name: string) {
send({ type: TernWorkerAction.DELETE_DEF, name });
};
}
export default TernWorkerServer as TernWorkerServerConstructor;

8
app/client/src/utils/autocomplete/customDefUtils.ts
View File

@ -5,7 +5,7 @@ import {
AdditionalDynamicDataTree,
customTreeTypeDefCreator,
} from "./customTreeTypeDefCreator";
import TernServer from "./TernServer";
import CodemirrorTernService from "./CodemirrorTernService";
class CustomDef {
private static lastCustomDataDef: AdditionalDynamicDataTree | undefined;
@ -16,7 +16,7 @@ class CustomDef {
if (!equal(CustomDef.lastCustomDataDef, customDataDef)) {
const start = performance.now();
TernServer.updateDef("customDataTree", customDataDef);
CodemirrorTernService.updateDef("customDataTree", customDataDef);
debug(
"Tern: updateDef for customDataTree took",
@ -28,7 +28,7 @@ class CustomDef {
}
} else if (CustomDef.lastCustomDataDef) {
const start = performance.now();
TernServer.removeDef("customDataTree");
CodemirrorTernService.removeDef("customDataTree");
debug(
"Tern: removeDef for customDataTree took",
(performance.now() - start).toFixed(),
@ -40,7 +40,7 @@ class CustomDef {
}
/**
* This method is responsible for both add and remove def in TernServer for customDataTree.
* This method is responsible for both add and remove def in CodemirrorTernService for customDataTree.
*
* if customData is not defined then check if lastCustomDataDef was present and remove it.
*

2
app/client/src/utils/autocomplete/dataTreeTypeDefCreator.ts
View File

@ -10,7 +10,7 @@ import {
isTrueObject,
isWidget,
} from "workers/Evaluation/evaluationUtils";
import { DataTreeDefEntityInformation } from "utils/autocomplete/TernServer";
import { DataTreeDefEntityInformation } from "utils/autocomplete/CodemirrorTernService";
export type ExtraDef = Record<string, Def | string>;

2
app/client/src/utils/autocomplete/dataTypeSortRules.ts
View File

@ -1,4 +1,4 @@
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
export const PriorityOrder: Record<AutocompleteDataType, string[]> = {
STRING: ["selectedRow", "data", "text"],

2
app/client/src/utils/autocomplete/keywordCompletion.ts
View File

@ -1,4 +1,4 @@
import { Completion } from "./TernServer";
import { Completion } from "./CodemirrorTernService";
export const getCompletionsForKeyword = (
completion: Completion,

12
app/client/src/utils/autocomplete/types.ts Normal file
View File

@ -0,0 +1,12 @@
export enum TernWorkerAction {
INIT = "INIT",
ADD_FILE = "ADD_FILE",
DELETE_FILE = "DELETE_FILE",
REQUEST = "REQUEST",
GET_FILE = "GET_FILE",
DELETE_DEF = "DELETE_DEF",
ADD_DEF = "ADD_DEF",
DEBUG = "DEBUG",
}
export type CallbackFn = (...args: any) => any;

2
app/client/src/utils/helpers.test.ts
View File

@ -1,7 +1,7 @@
import { RenderModes } from "constants/WidgetConstants";
import { ValidationTypes } from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { AutocompleteDataType } from "./autocomplete/TernServer";
import { AutocompleteDataType } from "./autocomplete/CodemirrorTernService";
import {
flattenObject,
getLocale,

2
app/client/src/utils/validation/common.ts
View File

@ -7,7 +7,7 @@ import { ValidationTypes } from "constants/WidgetValidation";
import moment from "moment";
import { sample } from "lodash";
import { CodeEditorExpected } from "components/editorComponents/CodeEditor";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
export const required = (value: any) => {
if (value === undefined || value === null || value === "") {

2
app/client/src/widgets/AudioWidget/widget/index.tsx
View File

@ -6,7 +6,7 @@ import { ValidationTypes } from "constants/WidgetValidation";
import Skeleton from "components/utils/Skeleton";
import { retryPromise } from "utils/AppsmithUtils";
import ReactPlayer from "react-player";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
const AudioComponent = lazy(() => retryPromise(() => import("../component")));

2
app/client/src/widgets/CategorySliderWidget/widget/propertyConfig/contentConfig.ts
View File

@ -1,5 +1,5 @@
import { LabelPosition } from "components/constants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { Alignment } from "@blueprintjs/core";
import { ValidationTypes } from "constants/WidgetValidation";

2
app/client/src/widgets/CheckboxGroupWidget/widget/index.tsx
View File

@ -4,7 +4,7 @@ import { TextSize, WidgetType } from "constants/WidgetConstants";
import { DerivedPropertiesMap } from "utils/WidgetFactory";
import BaseWidget, { WidgetProps, WidgetState } from "widgets/BaseWidget";
import { EventType } from "constants/AppsmithActionConstants/ActionConstants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { Alignment } from "@blueprintjs/core";
import { GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";

2
app/client/src/widgets/CircularProgressWidget/widget/index.tsx
View File

@ -2,7 +2,7 @@ import * as React from "react";
import { ValidationTypes } from "constants/WidgetValidation";
import BaseWidget, { WidgetProps, WidgetState } from "widgets/BaseWidget";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import CircularProgressComponent, {
CircularProgressComponentProps,
} from "../component";

2
app/client/src/widgets/CurrencyInputWidget/widget/index.tsx
View File

@ -18,7 +18,7 @@ import {
CurrencyDropdownOptions,
getCountryCodeFromCurrencyCode,
} from "../component/CurrencyCodeDropdown";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import _ from "lodash";
import derivedProperties from "./parsedDerivedProperties";
import BaseInputWidget from "widgets/BaseInputWidget";

2
app/client/src/widgets/DatePickerWidget/widget/index.tsx
View File

@ -11,7 +11,7 @@ import {
import { DerivedPropertiesMap } from "utils/WidgetFactory";
import moment from "moment";
import { DatePickerType } from "../constants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
function defaultDateValidation(
value: unknown,

2
app/client/src/widgets/DatePickerWidget2/widget/index.tsx
View File

@ -6,7 +6,7 @@ import DatePickerComponent from "../component";
import { ValidationTypes } from "constants/WidgetValidation";
import { DerivedPropertiesMap } from "utils/WidgetFactory";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import derivedProperties from "./parseDerivedProperties";
import { DatePickerType, TimePrecision } from "../constants";

2
app/client/src/widgets/DocumentViewerWidget/widget/index.tsx
View File

@ -5,7 +5,7 @@ import {
ValidationTypes,
ValidationResponse,
} from "constants/WidgetValidation";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
export function documentUrlValidation(value: unknown): ValidationResponse {
// applied validations if value exist

2
app/client/src/widgets/DropdownWidget/widget/index.tsx
View File

@ -10,7 +10,7 @@ import {
ValidationTypes,
} from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { MinimumPopupRows, GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";
import { LabelPosition } from "components/constants";
import { Alignment } from "@blueprintjs/core";

2
app/client/src/widgets/InputWidget/widget/index.tsx
View File

@ -22,7 +22,7 @@ import { InputType, InputTypes } from "../constants";
import { GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";
import { ISDCodeDropdownOptions } from "../component/ISDCodeDropdown";
import { CurrencyDropdownOptions } from "../component/CurrencyCodeDropdown";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import {
formatCurrencyNumber,
getDecimalSeparator,

2
app/client/src/widgets/InputWidgetV2/widget/index.tsx
View File

@ -17,7 +17,7 @@ import {
} from "@appsmith/constants/messages";
import { DerivedPropertiesMap } from "utils/WidgetFactory";
import { GRID_DENSITY_MIGRATION_V1, ICON_NAMES } from "widgets/constants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import BaseInputWidget from "widgets/BaseInputWidget";
import { isNil, isNumber, merge, toString } from "lodash";
import derivedProperties from "./parsedDerivedProperties";

2
app/client/src/widgets/JSONFormWidget/widget/propertyConfig.ts
View File

@ -1,7 +1,7 @@
import { Alignment } from "@blueprintjs/core";
import generatePanelPropertyConfig from "./propertyConfig/generatePanelPropertyConfig";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { JSONFormWidgetProps } from ".";
import { ROOT_SCHEMA_KEY } from "../constants";

2
app/client/src/widgets/JSONFormWidget/widget/propertyConfig/properties/common.ts
View File

@ -4,7 +4,7 @@ import {
} from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { get } from "lodash";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import {
ARRAY_ITEM_KEY,
FIELD_EXPECTING_OPTIONS,

2
app/client/src/widgets/JSONFormWidget/widget/propertyConfig/properties/input.ts
View File

@ -1,4 +1,4 @@
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { CurrencyDropdownOptions } from "widgets/CurrencyInputWidget/component/CurrencyCodeDropdown";
import { FieldType, INPUT_TYPES } from "widgets/JSONFormWidget/constants";
import {

2
app/client/src/widgets/JSONFormWidget/widget/propertyConfig/properties/multiSelect.ts
View File

@ -10,7 +10,7 @@ import {
ValidationResponse,
ValidationTypes,
} from "constants/WidgetValidation";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { JSONFormWidgetProps } from "../..";
export function defaultOptionValueValidation(

2
app/client/src/widgets/JSONFormWidget/widget/propertyConfig/properties/radioGroup.ts
View File

@ -3,7 +3,7 @@ import {
ValidationTypes,
} from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { FieldType } from "widgets/JSONFormWidget/constants";
import { optionsCustomValidation } from "widgets/RadioGroupWidget/widget";
import {

2
app/client/src/widgets/JSONFormWidget/widget/propertyConfig/properties/select.ts
View File

@ -11,7 +11,7 @@ import {
ValidationTypes,
} from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
export function defaultOptionValueValidation(
inputValue: unknown,

2
app/client/src/widgets/ListWidget/widget/propertyConfig.ts
View File

@ -5,7 +5,7 @@ import { ListWidgetProps } from "../constants";
import { ValidationTypes } from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { EVAL_VALUE_PATH } from "utils/DynamicBindingUtils";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
export const PropertyPaneContentConfig = [
{

2
app/client/src/widgets/MapChartWidget/widget/index.tsx
View File

@ -21,7 +21,7 @@ import {
MapTypes,
} from "../constants";
import { MapType } from "../component";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
const MapChartComponent = lazy(() =>
retryPromise(() =>

2
app/client/src/widgets/MultiSelectTreeWidget/widget/index.tsx
View File

@ -12,7 +12,7 @@ import { DefaultValueType } from "rc-tree-select/lib/interface";
import { Layers } from "constants/Layers";
import { CheckedStrategy } from "rc-tree-select/lib/utils/strategyUtil";
import { GRID_DENSITY_MIGRATION_V1, MinimumPopupRows } from "widgets/constants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import MultiTreeSelectComponent from "../component";
import { LabelPosition } from "components/constants";
import { Alignment } from "@blueprintjs/core";

2
app/client/src/widgets/MultiSelectWidget/widget/index.tsx
View File

@ -11,7 +11,7 @@ import {
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import MultiSelectComponent from "../component";
import { Layers } from "constants/Layers";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { MinimumPopupRows, GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";
import { LabelPosition } from "components/constants";
import { Alignment } from "@blueprintjs/core";

2
app/client/src/widgets/MultiSelectWidgetV2/widget/index.tsx
View File

@ -16,7 +16,7 @@ import { Layers } from "constants/Layers";
import { MinimumPopupRows, GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";
import { LabelPosition } from "components/constants";
import { Alignment } from "@blueprintjs/core";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { isAutoHeightEnabledForWidget } from "widgets/WidgetUtils";
export function defaultOptionValueValidation(

2
app/client/src/widgets/NumberSliderWidget/widget/propertyConfig/contentConfig.ts
View File

@ -1,7 +1,7 @@
import { Alignment } from "@blueprintjs/core";
import { LabelPosition } from "components/constants";
import { ValidationTypes } from "constants/WidgetValidation";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { NumberSliderWidgetProps } from "..";
import {
defaultValueValidation,

2
app/client/src/widgets/PhoneInputWidget/widget/index.tsx
View File

@ -16,7 +16,7 @@ import {
getCountryCode,
ISDCodeDropdownOptions,
} from "../component/ISDCodeDropdown";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import _ from "lodash";
import BaseInputWidget from "widgets/BaseInputWidget";
import derivedProperties from "./parsedDerivedProperties";

2
app/client/src/widgets/QRGeneratorWidget/widget/index.tsx
View File

@ -10,7 +10,7 @@ import { Color } from "constants/Colors";
import BaseWidget, { WidgetProps, WidgetState } from "widgets/BaseWidget";
import TextComponent, { TextAlign } from "../component";
import { ContainerStyle } from "widgets/ContainerWidget/component";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { OverflowTypes } from "../constants";
import WidgetStyleContainer from "components/designSystems/appsmith/WidgetStyleContainer";
import { pick } from "lodash";

2
app/client/src/widgets/RadioGroupWidget/widget/index.tsx
View File

@ -4,7 +4,7 @@ import { isArray, compact, isNumber } from "lodash";
import BaseWidget, { WidgetProps, WidgetState } from "../../BaseWidget";
import { TextSize, WidgetType } from "constants/WidgetConstants";
import { GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { EventType } from "constants/AppsmithActionConstants/ActionConstants";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { RadioOption } from "../constants";

2
app/client/src/widgets/RangeSliderWidget/widget/propertyConfig/contentConfig.ts
View File

@ -1,4 +1,4 @@
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { ValidationTypes } from "constants/WidgetValidation";
import { LabelPosition } from "components/constants";
import { Alignment } from "@blueprintjs/core";

2
app/client/src/widgets/RateWidget/widget/index.tsx
View File

@ -7,7 +7,7 @@ import RateComponent from "../component";
import { ValidationTypes } from "constants/WidgetValidation";
import { DerivedPropertiesMap } from "utils/WidgetFactory";
import { EventType } from "constants/AppsmithActionConstants/ActionConstants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
function validateDefaultRate(value: unknown, props: any, _: any) {
try {

2
app/client/src/widgets/SelectWidget/widget/index.tsx
View File

@ -12,7 +12,7 @@ import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { MinimumPopupRows, GRID_DENSITY_MIGRATION_V1 } from "widgets/constants";
import { LabelPosition } from "components/constants";
import { Alignment } from "@blueprintjs/core";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import {
findIndex,
isArray,

2
app/client/src/widgets/SingleSelectTreeWidget/widget/index.tsx
View File

@ -10,7 +10,7 @@ import {
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { DefaultValueType } from "rc-tree-select/lib/interface";
import { Layers } from "constants/Layers";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { GRID_DENSITY_MIGRATION_V1, MinimumPopupRows } from "widgets/constants";
import SingleSelectTreeComponent from "../component";
import { LabelPosition } from "components/constants";

2
app/client/src/widgets/TableWidget/widget/propertyConfig.ts
View File

@ -2,7 +2,7 @@ import { get } from "lodash";
import { TableWidgetProps } from "../constants";
import { ValidationTypes } from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { PropertyPaneConfig } from "constants/PropertyControlConstants";
import { ButtonVariantTypes } from "components/constants";
import {

2
app/client/src/widgets/TableWidgetV2/widget/propertyConfig/PanelConfig/ColumnControl.ts
View File

@ -15,7 +15,7 @@ import {
updateNumberColumnTypeTextAlignment,
updateThemeStylesheetsInColumns,
} from "../../propertyUtils";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { isColumnTypeEditable } from "../../utilities";
import { composePropertyUpdateHook } from "widgets/WidgetUtils";

2
app/client/src/widgets/TableWidgetV2/widget/propertyConfig/PanelConfig/Data.ts
View File

@ -13,7 +13,7 @@ import {
updateNumberColumnTypeTextAlignment,
updateThemeStylesheetsInColumns,
} from "../../propertyUtils";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { composePropertyUpdateHook } from "widgets/WidgetUtils";
export default {

2
app/client/src/widgets/TableWidgetV2/widget/propertyConfig/contentConfig.ts
View File

@ -1,6 +1,6 @@
import { ValidationTypes } from "constants/WidgetValidation";
import { EvaluationSubstitutionType } from "entities/DataTree/dataTreeFactory";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import {
InlineEditingSaveOptions,
TableWidgetProps,

2
app/client/src/widgets/TabsMigrator/widget/index.tsx
View File

@ -10,7 +10,7 @@ import { cloneDeep, get } from "lodash";
import { ValidationTypes } from "constants/WidgetValidation";
import { generateReactKey } from "utils/generators";
import { EVAL_VALUE_PATH } from "utils/DynamicBindingUtils";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
class TabsMigratorWidget extends BaseWidget<
TabsWidgetProps<TabContainerWidgetProps>,

2
app/client/src/widgets/TabsWidget/widget/index.tsx
View File

@ -9,7 +9,7 @@ import {
} from "constants/WidgetValidation";
import { EventType } from "constants/AppsmithActionConstants/ActionConstants";
import { TabContainerWidgetProps, TabsWidgetProps } from "../constants";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { WidgetProperties } from "selectors/propertyPaneSelectors";
import { WIDGET_PADDING } from "constants/WidgetConstants";
import derivedProperties from "./parseDerivedProperties";

2
app/client/src/widgets/TextWidget/widget/index.tsx
View File

@ -10,7 +10,7 @@ import { Color } from "constants/Colors";
import BaseWidget, { WidgetProps, WidgetState } from "widgets/BaseWidget";
import TextComponent, { TextAlign } from "../component";
import { ContainerStyle } from "widgets/ContainerWidget/component";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { OverflowTypes } from "../constants";
import WidgetStyleContainer from "components/designSystems/appsmith/WidgetStyleContainer";
import { pick } from "lodash";

2
app/client/src/widgets/VideoWidget/widget/index.tsx
View File

@ -6,7 +6,7 @@ import { ValidationTypes } from "constants/WidgetValidation";
import Skeleton from "components/utils/Skeleton";
import { retryPromise } from "utils/AppsmithUtils";
import ReactPlayer from "react-player";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
import { ButtonBorderRadius } from "components/constants";
const VideoComponent = lazy(() => retryPromise(() => import("../component")));

2
app/client/src/workers/Evaluation/__tests__/validations.test.ts
View File

@ -6,7 +6,7 @@ import { WidgetProps } from "widgets/BaseWidget";
import { RenderModes } from "constants/WidgetConstants";
import { ValidationTypes } from "constants/WidgetValidation";
import moment from "moment";
import { AutocompleteDataType } from "utils/autocomplete/TernServer";
import { AutocompleteDataType } from "utils/autocomplete/CodemirrorTernService";
const DUMMY_WIDGET: WidgetProps = {
bottomRow: 0,

57
app/client/src/workers/Tern/tern.worker.ts Normal file
View File

@ -0,0 +1,57 @@
import tern, { Server, Def } from "tern";
import { CallbackFn, TernWorkerAction } from "utils/autocomplete/types";
let server: Server;
let nextId = 0;
const pending: { [x: number]: CallbackFn } = {};
self.onmessage = function(e) {
const data = e.data;
switch (data.type) {
case TernWorkerAction.INIT:
return startServer(data.defs, data.plugins, data.scripts);
case TernWorkerAction.ADD_FILE:
return server.addFile(data.name, data.text);
case TernWorkerAction.DELETE_FILE:
return server.delFile(data.name);
case TernWorkerAction.REQUEST:
return server.request(data.body, function(err, reqData) {
postMessage({ id: data.id, body: reqData, err: err && String(err) });
});
case TernWorkerAction.GET_FILE:
const c = pending[data.id];
delete pending[data.id];
return c(data.err, data.text);
case TernWorkerAction.DELETE_DEF:
return server.deleteDefs(data.name);
case TernWorkerAction.ADD_DEF:
return server.addDefs(data.defs);
default:
throw new Error("Unknown message type: " + data.type);
}
};
function getFile(file: string, c: CallbackFn) {
postMessage({ type: TernWorkerAction.GET_FILE, name: file, id: ++nextId });
pending[nextId] = c;
}
function startServer(defs: Def[], plugins = {}, scripts?: string[]) {
//@ts-expect-error test
if (scripts) self.importScripts.apply(null, scripts);
server = new tern.Server({
getFile: getFile,
async: true,
defs: defs,
plugins: plugins,
});
}
self.console = {
...self.console,
log: function(v) {
postMessage({ type: TernWorkerAction.DEBUG, message: v });
},
};

2
contributions/AppsmithWidgetDevelopmentGuide.md
View File

@ -353,7 +353,7 @@ Properties can be required to be validated when an Appsmith developer is allowed
- `expected` (required for `ValidationTypes.FUNCTION`, [CodeEditorExpected](https://github.com/appsmithorg/appsmith/blob/e772fd4ff96accfb94818fa9f0b58dc6851a1cf0/app/client/src/components/editorComponents/CodeEditor/index.tsx#L107)): A structure that describes the expected type, example and autocomplete data type.
- `type`(required, string): The type of the property to be shown to the Appsmith developer
- `example`(required, [ExpectedValueExample](https://github.com/appsmithorg/appsmith/blob/e772fd4ff96accfb94818fa9f0b58dc6851a1cf0/app/client/src/utils/validation/common.ts#L16)): An example of the value expected for the property.
- `autocompleteDataType`(required, [AutocompleteDataType](https://github.com/appsmithorg/appsmith/blob/e772fd4ff96accfb94818fa9f0b58dc6851a1cf0/app/client/src/utils/autocomplete/TernServer.ts#L64)): Describes how the auto-complete feature for this property should work.
- `autocompleteDataType`(required, [AutocompleteDataType](https://github.com/appsmithorg/appsmith/blob/e772fd4ff96accfb94818fa9f0b58dc6851a1cf0/app/client/src/utils/autocomplete/CodemirrorTernService.ts#L64)): Describes how the auto-complete feature for this property should work.
- `strict` (optional, boolean): If set to `true`, values in `ValidationTypes.TEXT`, will not be cast to a string before validating.
- `ignoreCase` (optional, boolean): If set to `true`, keys will be matched while ignoring case in `allowedKeys` parameter of the `ValidationTypes.OBJECT`.
- `ValidationTypes.FUNCTION` is meant to be used sparingly, and as an escape hatch when the other `ValidationTypes` do not fit the requirements of validation.

2
contributions/CustomJsLibrary.md
View File

@ -23,7 +23,7 @@ const extraLibraries = [
},
]
```
3. To make this show up in autocomplete of appsmith we will need to add this to the Tern server file `app/client/src/utils/autocomplete/TernServer.ts`
3. To make this show up in autocomplete of appsmith we will need to add this to the Tern server file `app/client/src/utils/autocomplete/CodemirrorTernService.ts`
- Add a new def file for your library usages [ref](https://ternjs.net/doc/manual.html#typedef) under `app/client/src/constants/defs/`
- Import that file in the Tern Server file and add the def in the `DEFS` array right at the top of file
```