fix(arch): async/await fixes for drawText changes

This commit is contained in:
NicolasNewman
2024-08-14 10:32:56 -05:00
parent 1df90b4a05
commit d36522648f
2 changed files with 209 additions and 205 deletions

View File

@@ -455,13 +455,13 @@ export const draw: DrawDefinition = async (text, id, _version, diagObj: Diagram)
const groupElem = svg.append('g'); const groupElem = svg.append('g');
groupElem.attr('class', 'architecture-groups'); groupElem.attr('class', 'architecture-groups');
drawServices(db, servicesElem, services); await drawServices(db, servicesElem, services);
drawJunctions(db, servicesElem, junctions); drawJunctions(db, servicesElem, junctions);
const cy = await layoutArchitecture(services, junctions, groups, edges, ds); const cy = await layoutArchitecture(services, junctions, groups, edges, ds);
drawEdges(edgesElem, cy); await drawEdges(edgesElem, cy);
drawGroups(groupElem, cy); await drawGroups(groupElem, cy);
positionNodes(db, cy); positionNodes(db, cy);
setupGraphViewbox(undefined, svg, getConfigField('padding'), getConfigField('useMaxWidth')); setupGraphViewbox(undefined, svg, getConfigField('padding'), getConfigField('useMaxWidth'));

View File

@@ -22,14 +22,15 @@ import { getIcon } from '../../rendering-util/svgRegister.js';
import { db, getConfigField } from './architectureDb.js'; import { db, getConfigField } from './architectureDb.js';
import { getConfig } from '../../diagram-api/diagramAPI.js'; import { getConfig } from '../../diagram-api/diagramAPI.js';
export const drawEdges = function (edgesEl: D3Element, cy: cytoscape.Core) { export const drawEdges = async function (edgesEl: D3Element, cy: cytoscape.Core) {
const padding = getConfigField('padding'); const padding = getConfigField('padding');
const iconSize = getConfigField('iconSize'); const iconSize = getConfigField('iconSize');
const halfIconSize = iconSize / 2; const halfIconSize = iconSize / 2;
const arrowSize = iconSize / 6; const arrowSize = iconSize / 6;
const halfArrowSize = arrowSize / 2; const halfArrowSize = arrowSize / 2;
cy.edges().map((edge) => { await Promise.all(
cy.edges().map(async (edge) => {
const { const {
source, source,
sourceDir, sourceDir,
@@ -134,7 +135,7 @@ export const drawEdges = function (edgesEl: D3Element, cy: cytoscape.Core) {
} }
const textElem = g.append('g'); const textElem = g.append('g');
createText( await createText(
textElem, textElem,
label, label,
{ {
@@ -179,10 +180,11 @@ export const drawEdges = function (edgesEl: D3Element, cy: cytoscape.Core) {
} }
} }
} }
}); })
);
}; };
export const drawGroups = function (groupsEl: D3Element, cy: cytoscape.Core) { export const drawGroups = async function (groupsEl: D3Element, cy: cytoscape.Core) {
const padding = getConfigField('padding'); const padding = getConfigField('padding');
const groupIconSize = padding * 0.75; const groupIconSize = padding * 0.75;
@@ -191,7 +193,8 @@ export const drawGroups = function (groupsEl: D3Element, cy: cytoscape.Core) {
const iconSize = getConfigField('iconSize'); const iconSize = getConfigField('iconSize');
const halfIconSize = iconSize / 2; const halfIconSize = iconSize / 2;
cy.nodes().map((node) => { await Promise.all(
cy.nodes().map(async (node) => {
const data = nodeData(node); const data = nodeData(node);
if (data.type === 'group') { if (data.type === 'group') {
const { h, w, x1, y1 } = node.boundingBox(); const { h, w, x1, y1 } = node.boundingBox();
@@ -226,7 +229,7 @@ export const drawGroups = function (groupsEl: D3Element, cy: cytoscape.Core) {
} }
if (data.label) { if (data.label) {
const textElem = groupLabelContainer.append('g'); const textElem = groupLabelContainer.append('g');
createText( await createText(
textElem, textElem,
data.label, data.label,
{ {
@@ -252,21 +255,22 @@ export const drawGroups = function (groupsEl: D3Element, cy: cytoscape.Core) {
); );
} }
} }
}); })
);
}; };
export const drawServices = function ( export const drawServices = async function (
db: ArchitectureDB, db: ArchitectureDB,
elem: D3Element, elem: D3Element,
services: ArchitectureService[] services: ArchitectureService[]
): number { ): Promise<number> {
services.forEach((service) => { for (const service of services) {
const serviceElem = elem.append('g'); const serviceElem = elem.append('g');
const iconSize = getConfigField('iconSize'); const iconSize = getConfigField('iconSize');
if (service.title) { if (service.title) {
const textElem = serviceElem.append('g'); const textElem = serviceElem.append('g');
createText( await createText(
textElem, textElem,
service.title, service.title,
{ {
@@ -331,7 +335,7 @@ export const drawServices = function (
service.width = width; service.width = width;
service.height = height; service.height = height;
db.setElementForId(service.id, serviceElem); db.setElementForId(service.id, serviceElem);
}); }
return 0; return 0;
}; };