Skip to content

Commit 97d7018

Browse files
committed
Add a manage query view to dataservices
1 parent 6735fb8 commit 97d7018

File tree

19 files changed

+757
-46
lines changed

19 files changed

+757
-46
lines changed

workspaces/common-libs/service-designer/src/definitions.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,17 @@ export interface Resource {
7373
additionalActions?: Item[]; // Additional actions for the resource
7474
}
7575

76+
export interface Query {
77+
name: string;
78+
methods: any[];
79+
isOpen?: boolean;
80+
expandable?: boolean;
81+
additionalInfo?: JSX.Element; // Additional information to be displayed in the resource expanded view
82+
additionalActions?: Item[]; // Additional actions for the resource
83+
params?: ParameterConfig[];
84+
advancedParams?: Map<string, ParameterConfig>;
85+
}
86+
7687
export interface PathConfig {
7788
path: string;
7889
resources: ParameterConfig[];

workspaces/mi/mi-core/src/state-machine-types.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,8 @@ export enum MACHINE_VIEW {
6565
DefaultEndpointForm = "Default Endpoint Form",
6666
DataServiceForm = "Data Service Form",
6767
DssDataSourceForm = "DSS Data Source Form",
68-
DSSServiceDesigner = "Data Service Designer",
68+
DSSResourceServiceDesigner = "DSSResourceDesigner",
69+
DSSQueryServiceDesigner = "DSS Query Designer",
6970
ProjectCreationForm = "Project Creation Form",
7071
ImportProjectForm = "Import Project Form",
7172
LocalEntryForm = "Local Entry Form",

workspaces/mi/mi-diagram/src/components/Form/common.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -139,11 +139,13 @@ export const getParamManagerFromValues = (values: any[], keyIndex?: number, valu
139139

140140
if (typeof value === 'object' && value !== null) {
141141
const paramValues = getParamValues(value);
142+
const key = keyIndex != undefined && keyIndex >= 0 ? typeof value[keyIndex] === 'object' ? value[keyIndex].value : value[keyIndex] : index + 1;
142143
return {
143144
id: index,
144-
key: keyIndex != undefined && keyIndex >= 0 ? typeof value[keyIndex] === 'object' ? value[keyIndex].value : value[keyIndex] : index + 1,
145-
value: typeof value[valueIndex] === 'object' ? value[valueIndex].value : value[valueIndex],
146-
icon: 'query', paramValues
145+
key: key,
146+
value: (key === "Query" && valueIndex == 4) ? (typeof value[1] === 'object' ? value[1].value : value[1]) :
147+
(typeof value[valueIndex] === 'object' ? value[valueIndex].value : value[valueIndex]),
148+
paramValues
147149
};
148150
} else {
149151
return { value };

workspaces/mi/mi-diagram/src/components/nodes/ReferenceNode/ReferenceNodeModel.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export class ReferenceNodeModel extends BaseNodeModel {
5656
rpcClient.getMiVisualizerRpcClient().openView({
5757
type: EVENT_TYPE.OPEN_VIEW,
5858
location: {
59-
view: MACHINE_VIEW.DSSServiceDesigner,
59+
view: MACHINE_VIEW.DSSResourceServiceDesigner,
6060
documentUri: uri
6161
}
6262
});

workspaces/mi/mi-diagram/src/components/sidePanel/dataServices/query.tsx

Lines changed: 5 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -68,8 +68,8 @@ const QueryForm = (props: AddMediatorProps) => {
6868
returnGeneratedKeys: sidePanelContext?.formValues?.returnGeneratedKeys || false,
6969
keyColumns: sidePanelContext?.formValues?.keyColumns || "",
7070
returnUpdatedRowCount: sidePanelContext?.formValues?.returnUpdatedRowCount || false,
71-
forceStoredProc: sidePanelContext?.formValues?.forceStoredProc || false,
72-
forceJdbcBatchRequests: sidePanelContext?.formValues?.forceJdbcBatchRequests || false,
71+
forceStoredProc: sidePanelContext?.formValues?.forceStoredProc === "true" || false,
72+
forceJDBCBatchRequests: sidePanelContext?.formValues?.forceJDBCBatchRequests === "true" || false,
7373
});
7474
setIsLoading(false);
7575
}, []);
@@ -89,7 +89,7 @@ const QueryForm = (props: AddMediatorProps) => {
8989
queryProperties.maxFieldSize = values.maxFieldSize;
9090
queryProperties.maxRows = values.maxRows;
9191
queryProperties.forceStoredProc = values.forceStoredProc;
92-
queryProperties.forceJDBCBatchRequests = values.forceJdbcBatchRequests;
92+
queryProperties.forceJDBCBatchRequests = values.forceJDBCBatchRequests;
9393
queryProperties = Object.entries(queryProperties)
9494
.filter(([_, value]) => value !== "").map(([key, value]) => ({ key, value }));
9595
const updatedQuery = sidePanelContext?.formValues?.queryObject;
@@ -184,18 +184,6 @@ const QueryForm = (props: AddMediatorProps) => {
184184
<>
185185
<Typography sx={{ padding: "10px 20px", borderBottom: "1px solid var(--vscode-editorWidget-border)" }} variant="body3"></Typography>
186186
<div style={{ padding: "20px" }}>
187-
188-
<Field>
189-
<Controller
190-
name="queryId"
191-
control={control}
192-
render={({ field }) => (
193-
<TextField {...field} label="Query ID" size={50} placeholder="" />
194-
)}
195-
/>
196-
{errors.queryId && <Error>{errors.queryId.message.toString()}</Error>}
197-
</Field>
198-
199187
<Field>
200188
<Controller
201189
name="datasource"
@@ -335,13 +323,13 @@ const QueryForm = (props: AddMediatorProps) => {
335323

336324
<Field>
337325
<Controller
338-
name="forceJdbcBatchRequests"
326+
name="forceJDBCBatchRequests"
339327
control={control}
340328
render={({ field }) => (
341329
<VSCodeCheckbox {...field} type="checkbox" checked={field.value} onChange={(e: any) => { field.onChange(e.target.checked) }}>Force JDBC Batch Requests</VSCodeCheckbox>
342330
)}
343331
/>
344-
{errors.forceJdbcBatchRequests && <Error>{errors.forceJdbcBatchRequests.message.toString()}</Error>}
332+
{errors.forceJDBCBatchRequests && <Error>{errors.forceJDBCBatchRequests.message.toString()}</Error>}
345333
</Field>
346334

347335
</ComponentCard>

workspaces/mi/mi-extension/src/project-explorer/activate.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -382,7 +382,7 @@ export async function activateProjectExplorer(treeviewId: string, context: Exten
382382
commands.registerCommand(COMMANDS.OPEN_DSS_SERVICE_DESIGNER, async (entry: ProjectExplorerEntry | Uri) => {
383383
revealWebviewPanel(false);
384384
const documentUri = entry instanceof ProjectExplorerEntry ? entry.info?.path : entry.fsPath;
385-
openView(EVENT_TYPE.OPEN_VIEW, { view: MACHINE_VIEW.DSSServiceDesigner, documentUri });
385+
openView(EVENT_TYPE.OPEN_VIEW, { view: MACHINE_VIEW.DSSResourceServiceDesigner, documentUri });
386386
});
387387

388388
commands.registerCommand(COMMANDS.EDIT_K8_CONFIGURATION_COMMAND, async () => {

workspaces/mi/mi-visualizer/src/MainPanel.tsx

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@ import React, { useEffect, useState, Suspense } from 'react';
22
import { POPUP_EVENT_TYPE, PopupMachineStateValue, MACHINE_VIEW, Platform, VisualizerLocation } from '@wso2/mi-core';
33
import { useVisualizerContext } from '@wso2/mi-rpc-client';
44
import { ServiceDesignerView } from './views/ServiceDesigner';
5-
import { DSSServiceDesignerView } from './views/Forms/DataServiceForm/ServiceDesigner';
5+
import { DSSResourceServiceDesignerView } from './views/Forms/DataServiceForm/ResourceServiceDesigner';
6+
import { DSSQueryServiceDesignerView } from './views/Forms/DataServiceForm/QueryServiceDesigner';
67
import { APIWizard, APIWizardProps } from './views/Forms/APIform';
78
import { EndpointWizard } from './views/Forms/EndpointForm';
89
import { SequenceWizard } from './views/Forms/SequenceForm';
@@ -376,8 +377,11 @@ const MainPanel = (props: MainPanelProps) => {
376377
case MACHINE_VIEW.MockService:
377378
setViewComponent(<MockServiceForm filePath={visualizerState.documentUri} stNode={visualizerState.stNode as MockService} isWindows={isWindows} />);
378379
break;
379-
case MACHINE_VIEW.DSSServiceDesigner:
380-
setViewComponent(<DSSServiceDesignerView syntaxTree={visualizerState.stNode} documentUri={visualizerState.documentUri} />);
380+
case MACHINE_VIEW.DSSResourceServiceDesigner:
381+
setViewComponent(<DSSResourceServiceDesignerView syntaxTree={visualizerState.stNode} documentUri={visualizerState.documentUri} />);
382+
break;
383+
case MACHINE_VIEW.DSSQueryServiceDesigner:
384+
setViewComponent(<DSSQueryServiceDesignerView syntaxTree={visualizerState.stNode} documentUri={visualizerState.documentUri} />);
381385
break;
382386
case MACHINE_VIEW.Welcome:
383387
setViewComponent(<WelcomeView />);

workspaces/mi/mi-visualizer/src/constants/index.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,10 @@ export const DSS_TEMPLATES = {
6969
EDIT_OPERATION: "edit-dss-operation",
7070
EDIT_DESCRIPTION: "edit-dss-description",
7171
ADD_QUERY: "add-dss-query",
72+
ADD_FULL_QUERY: "add-full-dss-query",
73+
UPDATE_QUERY_CONFIG: "update-query-config",
74+
UPDATE_QUERY: "update-query",
75+
EDIT_QUERY_REFERENCE: "edit-query-reference"
7276
} as const;
7377

7478
export enum EndpointTypes {

workspaces/mi/mi-visualizer/src/utils/DSSResourceForm.ts

Lines changed: 129 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,13 @@
1515
* specific language governing permissions and limitations
1616
* under the License.
1717
*/
18-
import { Range, DSSResource, DSSOperation } from "@wso2/mi-syntax-tree/lib/src";
18+
import { Range, DSSResource, DSSOperation, DSSQuery } from "@wso2/mi-syntax-tree/lib/src";
1919
import { RpcClient } from "@wso2/mi-rpc-client";
2020
import { DSS_TEMPLATES } from "../constants";
2121
import { getXML } from "./template-engine/mustache-templates/templateUtils";
2222
import { ResourceFormData, ResourceType } from "../views/Forms/DataServiceForm/SidePanelForms/ResourceForm";
2323
import { OperationFormData, OperationType } from "../views/Forms/DataServiceForm/SidePanelForms/OperationForm";
24+
import { QueryFormData, QueryType } from "../views/Forms/DataServiceForm/SidePanelForms/QueryForm";
2425

2526
export const generateResourceData = (model: DSSResource): ResourceType => {
2627

@@ -29,7 +30,8 @@ export const generateResourceData = (model: DSSResource): ResourceType => {
2930
resourceMethod: model.method,
3031
description: model.description,
3132
enableStreaming: model.enableStreaming,
32-
returnRequestStatus: model.returnRequestStatus
33+
returnRequestStatus: model.returnRequestStatus,
34+
queryId: model.queryId
3335
};
3436
return resourceData;
3537
};
@@ -39,14 +41,26 @@ export const generateOperationData = (model: DSSOperation): OperationType => {
3941
const operationData: OperationType = {
4042
operationName: model.name,
4143
description: model.description,
42-
enableStreaming: model.enableStreaming
44+
enableStreaming: model.enableStreaming,
45+
queryId: model.queryId
4346
};
4447
return operationData;
4548
};
4649

50+
export const generateQueryData = (model: DSSQuery): QueryType => {
51+
52+
const queryData: QueryType = {
53+
name: model.name,
54+
datasource: model.datasource,
55+
query: model.query,
56+
};
57+
return queryData;
58+
};
59+
4760
export const onResourceCreate = (data: ResourceFormData, range: Range, documentUri: string, rpcClient: RpcClient, dbName: string) => {
4861

49-
const queryName = data.resourceMethod.toLowerCase() + "_" + data.resourcePath.replace(/[^a-zA-Z]/g, '').toLowerCase() + "_query";
62+
const queryName = data.queryId !== "" ? data.queryId :data.resourceMethod.toLowerCase() + "_" + data.resourcePath.replace(/[^a-zA-Z]/g, '').toLowerCase() + "_query";
63+
const shouldCreateQuery = data.queryId === "";
5064

5165
const formValues = {
5266
path: data.resourcePath,
@@ -57,7 +71,7 @@ export const onResourceCreate = (data: ResourceFormData, range: Range, documentU
5771
query: queryName
5872
};
5973

60-
const queryContent = getXML(DSS_TEMPLATES.ADD_QUERY, { name: queryName, dbName: dbName });
74+
const queryContent = shouldCreateQuery ? getXML(DSS_TEMPLATES.ADD_QUERY, { name: queryName, dbName: dbName }) : "";
6175
const resourceContent = getXML(DSS_TEMPLATES.ADD_RESOURCE, formValues);
6276
rpcClient.getMiDiagramRpcClient().applyEdit({
6377
text: queryContent + resourceContent,
@@ -77,7 +91,8 @@ export const onResourceCreate = (data: ResourceFormData, range: Range, documentU
7791

7892
export const onOperationCreate = (data: OperationFormData, range: Range, documentUri: string, rpcClient: RpcClient, dbName: string) => {
7993

80-
const queryName = data.operationName.replace(/[^a-zA-Z]/g, '').toLowerCase() + "_query";
94+
const queryName = data.queryId !== "" ? data.queryId : data.operationName.replace(/[^a-zA-Z]/g, '').toLowerCase() + "_query";
95+
const shouldCreateQuery = data.queryId === "";
8196

8297
const formValues = {
8398
name: data.operationName,
@@ -86,7 +101,7 @@ export const onOperationCreate = (data: OperationFormData, range: Range, documen
86101
query: queryName
87102
};
88103

89-
const queryContent = getXML(DSS_TEMPLATES.ADD_QUERY, { name: queryName, dbName: dbName });
104+
const queryContent = shouldCreateQuery ? getXML(DSS_TEMPLATES.ADD_QUERY, { name: queryName, dbName: dbName }) : "";
90105
const operationContent = getXML(DSS_TEMPLATES.ADD_OPERATION, formValues);
91106
rpcClient.getMiDiagramRpcClient().applyEdit({
92107
text: queryContent + operationContent,
@@ -104,10 +119,45 @@ export const onOperationCreate = (data: OperationFormData, range: Range, documen
104119
});
105120
};
106121

122+
export const onQueryCreate = (data: QueryFormData, range: Range, documentUri: string, rpcClient: RpcClient, dbName: string) => {
123+
124+
const formValues = {
125+
name: data.name,
126+
datasource: data.datasource,
127+
query: data.query
128+
};
129+
130+
getQueryType(rpcClient, documentUri, data.datasource)
131+
.then((queryType) => {
132+
const queryContent = getXML(DSS_TEMPLATES.ADD_FULL_QUERY, {
133+
...formValues,
134+
isExpression: queryType === "expression"
135+
});
136+
137+
return rpcClient.getMiDiagramRpcClient().applyEdit({
138+
text: queryContent,
139+
documentUri,
140+
range: {
141+
start: {
142+
line: range.end.line,
143+
character: range.end.character,
144+
},
145+
end: {
146+
line: range.end.line,
147+
character: range.end.character,
148+
}
149+
}
150+
});
151+
});
152+
153+
};
154+
107155
export const onResourceEdit = (data: ResourceFormData, selectedResource: any, documentUri: string, rpcClient: RpcClient) => {
108156
const resourceStartTagRange = selectedResource.range.startTagRange;
109157
const descriptionStartTagRange = selectedResource.description ? selectedResource.description.range.startTagRange : undefined;
110158
const descriptionEndTagRange = selectedResource.description ? selectedResource.description.range.endTagRange : undefined;
159+
const referenceQueryTagRange = selectedResource.callQuery ? selectedResource.callQuery.range.startTagRange : undefined;
160+
const isReferenceSelfClosed = selectedResource.callQuery?.selfClosed ?? true;
111161
const formValues = {
112162
path: data.resourcePath,
113163
method: data.resourceMethod,
@@ -118,6 +168,7 @@ export const onResourceEdit = (data: ResourceFormData, selectedResource: any, do
118168
const resourceXML = getXML(DSS_TEMPLATES.EDIT_RESOURCE, formValues);
119169
const descriptionXML = data.description === "" ? "" :
120170
getXML(DSS_TEMPLATES.EDIT_DESCRIPTION, {description: data.description});
171+
const queryReferenceXML = getXML(DSS_TEMPLATES.EDIT_QUERY_REFERENCE, { queryId: data.queryId, isSelfClosed: isReferenceSelfClosed });
121172

122173
rpcClient.getMiDiagramRpcClient().applyEdit({
123174
text: resourceXML,
@@ -132,13 +183,23 @@ export const onResourceEdit = (data: ResourceFormData, selectedResource: any, do
132183
end: descriptionEndTagRange ? descriptionEndTagRange.end : resourceStartTagRange.end
133184
}
134185
})
135-
})
186+
}).then(async () => {
187+
if (referenceQueryTagRange) {
188+
await rpcClient.getMiDiagramRpcClient().applyEdit({
189+
text: queryReferenceXML,
190+
documentUri: documentUri,
191+
range: referenceQueryTagRange
192+
})
193+
}
194+
});
136195
};
137196

138197
export const onOperationEdit = (data: OperationFormData, selectedOperation: any, documentUri: string, rpcClient: RpcClient) => {
139198
const operationStartTagRange = selectedOperation.range.startTagRange;
140199
const descriptionStartTagRange = selectedOperation.description ? selectedOperation.description.range.startTagRange : undefined;
141200
const descriptionEndTagRange = selectedOperation.description ? selectedOperation.description.range.endTagRange : undefined;
201+
const referenceQueryTagRange = selectedOperation.callQuery ? selectedOperation.callQuery.range.startTagRange : undefined;
202+
const isReferenceSelfClosed = selectedOperation.callQuery?.selfClosed ?? true;
142203
const formValues = {
143204
name: data.operationName,
144205
enableStreaming: data.enableStreaming ? undefined : !data.enableStreaming,
@@ -147,6 +208,7 @@ export const onOperationEdit = (data: OperationFormData, selectedOperation: any,
147208
const operationXML = getXML(DSS_TEMPLATES.EDIT_OPERATION, formValues);
148209
const descriptionXML = data.description === "" ? "" :
149210
getXML(DSS_TEMPLATES.EDIT_DESCRIPTION, {description: data.description});
211+
const queryReferenceXML = getXML(DSS_TEMPLATES.EDIT_QUERY_REFERENCE, { queryId: data.queryId, isSelfClosed: isReferenceSelfClosed });
150212

151213
rpcClient.getMiDiagramRpcClient().applyEdit({
152214
text: operationXML,
@@ -160,6 +222,64 @@ export const onOperationEdit = (data: OperationFormData, selectedOperation: any,
160222
start: descriptionStartTagRange ? descriptionStartTagRange.start : operationStartTagRange.end,
161223
end: descriptionEndTagRange ? descriptionEndTagRange.end : operationStartTagRange.end
162224
}
163-
})
225+
}).then(async () => {
226+
if (referenceQueryTagRange) {
227+
await rpcClient.getMiDiagramRpcClient().applyEdit({
228+
text: queryReferenceXML,
229+
documentUri: documentUri,
230+
range: referenceQueryTagRange
231+
})
232+
}
233+
});
164234
})
165235
};
236+
237+
export const onQueryEdit = (data: QueryFormData, selectedQuery: any, documentUri: string, rpcClient: RpcClient) => {
238+
const sqlStartTagRange = selectedQuery.sql ? selectedQuery.sql.range.startTagRange : undefined;
239+
const sqlEndTagRange = selectedQuery.sql ? selectedQuery.sql.range.endTagRange : undefined;
240+
const formValues = {
241+
name: data.name,
242+
datasource: data.datasource,
243+
query: data.query
244+
};
245+
246+
getQueryType(rpcClient, documentUri, data.datasource)
247+
.then((queryType) => {
248+
return rpcClient.getMiDiagramRpcClient().applyEdit({
249+
text: getXML(DSS_TEMPLATES.UPDATE_QUERY_CONFIG, formValues),
250+
documentUri,
251+
range: selectedQuery.range.startTagRange,
252+
}).then(() => ({ queryType }));
253+
})
254+
.then(({ queryType }) => {
255+
return rpcClient.getMiDiagramRpcClient().applyEdit({
256+
text: getXML(DSS_TEMPLATES.UPDATE_QUERY, {
257+
query: data.query,
258+
isExpression: queryType === "expression"
259+
}),
260+
documentUri,
261+
range: {
262+
start: sqlStartTagRange ? sqlStartTagRange.start : selectedQuery.range.startTagRange.end,
263+
end: sqlEndTagRange ? sqlEndTagRange.end : selectedQuery.range.startTagRange.end
264+
}
265+
});
266+
});
267+
268+
};
269+
270+
async function getQueryType(rpcClient: RpcClient, documentUri: string, datasource: string): Promise<string> {
271+
let queryType = "sql";
272+
const existingDataService = await rpcClient.getMiDiagramRpcClient().getDataService({ path: documentUri });
273+
existingDataService.datasources.forEach((ds) => {
274+
if (ds.dataSourceName === datasource) {
275+
const propertyKeys: string[] = [];
276+
ds.datasourceProperties.forEach((attr: any) => {
277+
propertyKeys.push(attr.key);
278+
});
279+
if (propertyKeys.includes("mongoDB_servers")) {
280+
queryType = "expression";
281+
}
282+
}
283+
});
284+
return queryType;
285+
}

0 commit comments

Comments
 (0)