{ return [{ text: 'Remove', onClick: () => onRemoveReference(reference) }]; }, columnMenu: ({ designer, designerId, column, foreignKey }) => { const node = root?.findNodeByDesignerId(designerId); const child = node?.childNodes?.find(x => x.columnName == column.columnName); return getPerspectiveNodeMenu({ config, setConfig, conid, database, root, node: child, designerId, }); }, tableMenu: ({ designer, designerId, onRemoveTable }) => { const node = root?.findNodeByDesignerId(designerId); return [ { text: 'Remove', onClick: () => onRemoveTable({ designerId }) }, getPerspectiveNodeMenu({ config, setConfig, conid, database, root, node, designerId, }), ]; }, createReferenceText: reference => (reference.isAutoGenerated ? 'FK' : 'Custom'), isColumnChecked: (designerId, column) => { return config.nodes.find(x => x.designerId == designerId)?.checkedColumns?.includes(column.columnName); }, setColumnChecked: (designerId, column, value) => { setConfig(cfg => ({ ...cfg, nodes: cfg.nodes.map(node => node.designerId == designerId ? { ...node, checkedColumns: value ? [...(node.checkedColumns || []), column.columnName] : (node.checkedColumns || []).filter(x => x != column.columnName), } : node ), })); }, isTableChecked: designerId => config.nodes?.find(x => x.designerId == designerId)?.isNodeChecked, setTableChecked: (designerId, value) => { setConfig(cfg => ({ ...cfg, nodes: cfg.nodes.map(node => node.designerId == designerId ? { ...node, isNodeChecked: value, } : node ), })); }, getSortOrderProps: (designerId, columnName) => { const sort = config.nodes.find(x => x.designerId == designerId)?.sort; const order = sort?.find(x => x.columnName == columnName)?.order; if (!order) return null; const orderIndex = sort.length > 1 ? _.findIndex(sort, x => x.columnName == columnName) : -1; return { order, orderIndex }; }, getColumnIconOverride: (designerId, columnName) => { const pattern = dataPatterns?.[designerId]; const column = pattern?.columns.find(x => x.name == columnName); if (column?.types?.includes('json')) { return 'img json'; } return null; }, isColumnFiltered: (designerId, columnName) => { return !!config.nodes.find(x => x.designerId == designerId)?.filters?.[columnName]; }, getMainTableIcon: designerId => { const node = root?.findNodeByDesignerId(designerId); if (!node) return null; const level = node?.level + 1; if (level == 1) return `icon num-${level}`; if (level <= 9) return `icon num-${level}-outline`; return 'icon num-9-plus'; }, sortAutoLayoutReferences: references => { // console.log('sortAutoLayoutReferences', root, references.length); return _.sortBy(references, reference => { const node1 = root?.findNodeByDesignerId(reference.sourceId); const node2 = root?.findNodeByDesignerId(reference.targetId); if (!node1 || !node2) return 10000; if (node1.level > node2.level) reference = switchPerspectiveReferenceDirection(reference); const index = _.findIndex(node1.childNodes, x => x.columnName == reference.columns[0].source); return index; }); }, referencePaintSettings: { buswi: 10, extwi: 10, }, canAddDesignerForeignKey: (designerId, columnName) => { const node = root?.findNodeByDesignerId(designerId); const child = node?.childNodes?.find(x => x.columnName == columnName); return child?.isExpandable && !child?.designerId && !child?.isCircular; }, addDesignerForeignKey: (designerId, columnName) => { const node = root?.findNodeByDesignerId(designerId); const child = node?.childNodes?.find(x => x.columnName == columnName); child?.toggleCheckedNode(true); }, tableSpecificDb: designerId => { const node = config.nodes.find(x => x.designerId == designerId); if (node?.conid || node?.database) { return { conid: node.conid, database: node.database, }; } }, hasFilterParentRowsFlag: designerId => !!config.nodes.find(x => x.designerId == designerId)?.isParentFilter, isGrayedTable: designerId => { const node = root?.findNodeByDesignerId(designerId); if (!node) return true; if (node?.hasUncheckedNodeInPath) return true; return false; }, onClickTableHeader, isColumnExpandable: column => !!column.getChildColumns, isColumnExpanded: column => column.isExpanded, columnExpandLevel: column => column.expandLevel, toggleExpandedColumn: (column, value) => column.toggleExpanded(value), getColumnDisplayName: column => column.shortName || column.columnName, getParentColumnName: getPerspectiveParentColumnName, getMutliColumnFilter: designerId => config.nodes.find(x => x.designerId == designerId).multiColumnFilter, setMutliColumnFilter: (designerId, multiColumnFilter) => { setConfig(cfg => ({ ...cfg, nodes: cfg.nodes.map(node => node.designerId == designerId ? { ...node, multiColumnFilter, } : node ), })); }, }} referenceComponent={QueryDesignerReference} value={createDesignerModel(config, dbInfos, dataPatterns)} onChange={handleChange} />