Merge pull request #164 from jeff-phillips-18/nested-level-fix

chore(demo): fix for nested levels in package demo
patternfly · Mar 25, 2024 · 3b004ac · 3b004ac
2 parents e16b23a + 8cd1ae6
commit 3b004ac
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 20 deletions.
diff --git a/packages/demo-app-ts/src/demos/topologyPackageDemo/DemoContext.tsx b/packages/demo-app-ts/src/demos/topologyPackageDemo/DemoContext.tsx
@@ -23,11 +23,11 @@ export class DemoModel {
     showTags: false,
     terminalTypes: false,
   };
-  protected nestedLevelP: number = 0;
-  protected creationCountsP: { numNodes: number; numEdges: number; numGroups: number } = {
+  protected creationCountsP: { numNodes: number; numEdges: number; numGroups: number, nestedLevel: number } = {
     numNodes: 6,
     numEdges: 2,
     numGroups: 1,
+    nestedLevel: 0
   };
   protected layoutP: string = 'ColaNoForce';
   protected medScaleP: number = 0.5;
@@ -38,29 +38,25 @@ export class DemoModel {
       DemoModel,
       | 'nodeOptionsP'
       | 'edgeOptionsP'
-      | 'nestedLevelP'
       | 'creationCountsP'
       | 'layoutP'
       | 'medScaleP'
       | 'lowScaleP'
       | 'setNodeOptions'
       | 'setEdgeOptions'
-      | 'setNestedLevel'
       | 'setCreationCounts'
       | 'setLayout'
       | 'setMedScale'
       | 'setLowScale'
       >(this, {
       nodeOptionsP: observable.ref,
       edgeOptionsP: observable.shallow,
-      nestedLevelP: observable,
       creationCountsP: observable.shallow,
       layoutP: observable,
       medScaleP: observable,
       lowScaleP: observable,
       setNodeOptions: action,
       setEdgeOptions: action,
-      setNestedLevel: action,
       setCreationCounts: action,
       setLayout: action,
       setMedScale: action,
@@ -82,17 +78,11 @@ export class DemoModel {
     this.edgeOptionsP = options;
   }
 
-  public get nestedLevel(): number {
-    return this.nestedLevelP;
-  }
-  public setNestedLevel = (show: number): void => {
-    this.nestedLevelP = show;
-  }
-
-  public get creationCounts(): { numNodes: number; numEdges: number; numGroups: number } {
+  public get creationCounts(): { numNodes: number; numEdges: number; numGroups: number, nestedLevel: number } {
     return this.creationCountsP;
   }
-  public setCreationCounts = (counts: { numNodes: number; numEdges: number; numGroups: number }): void => {
+
+  public setCreationCounts = (counts: { numNodes: number; numEdges: number; numGroups: number, nestedLevel: number }): void => {
     this.creationCountsP = counts;
   }
 

diff --git a/packages/demo-app-ts/src/demos/topologyPackageDemo/OptionsContextBar.tsx b/packages/demo-app-ts/src/demos/topologyPackageDemo/OptionsContextBar.tsx
@@ -21,7 +21,7 @@ const OptionsContextBar: React.FC = observer(() => {
   const [numNodes, setNumNodes] = React.useState<number>(options.creationCounts.numNodes);
   const [numEdges, setNumEdges] = React.useState<number>(options.creationCounts.numEdges);
   const [numGroups, setNumGroups] = React.useState<number>(options.creationCounts.numGroups);
-  const [nestedLevel, setNestedLevel] = React.useState<number>(options.nestedLevel);
+  const [nestedLevel, setNestedLevel] = React.useState<number>(options.creationCounts.nestedLevel);
 
   const renderNodeOptionsDropdown = () => {
     const nodeOptionsToggle = (toggleRef: React.Ref<MenuToggleElement>) => (
@@ -268,7 +268,7 @@ const OptionsContextBar: React.FC = observer(() => {
             <Button
               variant="link"
               isDisabled={numNodes === undefined || numNodes < 1 || numEdges === undefined || numGroups === undefined}
-              onClick={() => options.setCreationCounts({ numNodes, numEdges, numGroups })}
+              onClick={() => options.setCreationCounts({ numNodes, numEdges, numGroups, nestedLevel })}
             >
               Apply
             </Button>

diff --git a/packages/demo-app-ts/src/demos/topologyPackageDemo/TopologyPackage.tsx b/packages/demo-app-ts/src/demos/topologyPackageDemo/TopologyPackage.tsx
@@ -41,7 +41,7 @@ const TopologyViewComponent: React.FunctionComponent<TopologyViewComponentProps>
       options.creationCounts.numNodes,
       options.creationCounts.numGroups,
       options.creationCounts.numEdges,
-      options.nestedLevel,
+      options.creationCounts.nestedLevel,
     );
 
     const model = {
@@ -54,7 +54,7 @@ const TopologyViewComponent: React.FunctionComponent<TopologyViewComponentProps>
     };
 
     controller.fromModel(model, true);
-  }, [controller, options.creationCounts, options.layout, options.nestedLevel]);
+  }, [controller, options.creationCounts, options.layout]);
 
   useEventListener<SelectionEventListener>(SELECTION_EVENT, ids => {
     setSelectedIds(ids);

diff --git a/packages/demo-app-ts/src/demos/topologyPackageDemo/generator.ts b/packages/demo-app-ts/src/demos/topologyPackageDemo/generator.ts
@@ -138,7 +138,7 @@ export const generateDataModel = (
       type: 'group',
       group: true,
       label: id,
-      style: { padding: 15 },
+      style: { padding: 45 },
       data: {
         objectType: 'GN',
       }