fix(vis-schema): catching up with develop

apps/web-graphpolaris/src/components/schema/schema.stories.tsx

@@ -3,7 +3,6 @@ import {
   SchemaFromBackend,
   schemaSlice,
   setSchema,
-  store,
 } from '@graphpolaris/shared/data-access/store';
 import {
   movieSchema,
@@ -44,6 +43,111 @@ const Mockstore = configureStore({
 export const TestWithSchema = Template.bind({});
 
 TestWithSchema.play = async () => {
-  const parsed = parseSchemaFromBackend(twitterSchema as SchemaFromBackend);
-  Mockstore.dispatch(setSchema(parsed.export()));
+  const dispatch = Mockstore.dispatch;
+
+  const schema = SchemaUtils.ParseSchemaFromBackend({
+    nodes: [
+      {
+        name: 'Thijs',
+        attributes: [],
+      },
+      {
+        name: 'Airport',
+        attributes: [
+          { name: 'city', type: 'string' },
+          { name: 'vip', type: 'bool' },
+          { name: 'state', type: 'string' },
+        ],
+      },
+      {
+        name: 'Airport2',
+        attributes: [
+          { name: 'city', type: 'string' },
+          { name: 'vip', type: 'bool' },
+          { name: 'state', type: 'string' },
+        ],
+      },
+      {
+        name: 'Plane',
+        attributes: [
+          { name: 'type', type: 'string' },
+          { name: 'maxFuelCapacity', type: 'int' },
+        ],
+      },
+      { name: 'Staff', attributes: [] },
+    ],
+    edges: [
+      {
+        name: 'Airport2:Airport',
+        from: 'Airport2',
+        to: 'Airport',
+        collection: 'flights',
+        attributes: [
+          { name: 'arrivalTime', type: 'int' },
+          { name: 'departureTime', type: 'int' },
+        ],
+      },
+      {
+        name: 'Airport:Staff',
+        from: 'Airport',
+        to: 'Staff',
+        collection: 'flights',
+        attributes: [{ name: 'salary', type: 'int' }],
+      },
+      {
+        name: 'Plane:Airport',
+        from: 'Plane',
+        to: 'Airport',
+        collection: 'flights',
+        attributes: [],
+      },
+      {
+        name: 'Airport:Thijs',
+        from: 'Airport',
+        to: 'Thijs',
+        collection: 'flights',
+        attributes: [{ name: 'hallo', type: 'string' }],
+      },
+      {
+        name: 'Thijs:Airport',
+        from: 'Thijs',
+        to: 'Airport',
+        collection: 'flights',
+        attributes: [{ name: 'hallo', type: 'string' }],
+      },
+      {
+        name: 'Staff:Plane',
+        from: 'Staff',
+        to: 'Plane',
+        collection: 'flights',
+        attributes: [{ name: 'hallo', type: 'string' }],
+      },
+      {
+        name: 'Staff:Airport2',
+        from: 'Staff',
+        to: 'Airport2',
+        collection: 'flights',
+        attributes: [{ name: 'hallo', type: 'string' }],
+      },
+      {
+        name: 'Airport2:Plane',
+        from: 'Airport2',
+        to: 'Plane',
+        collection: 'flights',
+        attributes: [{ name: 'hallo', type: 'string' }],
+      },
+
+      {
+        name: 'Airport:Airport',
+        from: 'Airport',
+        to: 'Airport',
+        collection: 'flights',
+        attributes: [{ name: 'test', type: 'string' }],
+      },
+    ],
+  });
+
+  console.info('dispatch dummy schema', schema.order);
+  dispatch(setSchema(schema.export()));
+  // handleSchemaLayout(schema);
 };

apps/web-graphpolaris/src/components/schema/schema.tsx

-import { createReactFlowElements } from '@graphpolaris/schema/schema-usecases';
+import { AllLayoutAlgorithms, LayoutFactory } from '@graphpolaris/graph-layout';
+import { createReactFlowElements } from '@graphpolaris/schema/usecases';
 import {
   useSchema,
   useSchemaLayout,
 } from '@graphpolaris/shared/data-access/store';
-import {
-  AllLayoutAlgorithms,
-  LayoutFactory,
-} from '@graphpolaris/shared/graph-layout';
-import { Attributes } from 'graphology-types';
+import { MultiGraph } from 'graphology';
+// import { AllLayoutAlgorithms, LayoutFactory } from '@graphpolaris/graph-layout';
 import { useEffect, useState } from 'react';
 import ReactFlow, {
   Node,
@@ -32,9 +30,15 @@ const Schema = (props: Props) => {
   const schemaLayout = useSchemaLayout();
 
   useEffect(() => {
-    const layoutFactory = new LayoutFactory();
+    console.log('dbSchema', dbschema, dbschema.order);
+  }, [dbschema]);
 
-    // console.log('schema Layout', schemaLayout);
+  useEffect(() => {
+    if (dbschema == undefined || dbschema.order == 0) {
+      return;
+    }
+    const layoutFactory = new LayoutFactory();
+    console.log('schema Layout', schemaLayout, 'order', dbschema.order);
     const layout = layoutFactory.createLayout(
       // schemaLayout as AllLayoutAlgorithms
       'Graphology_noverlap'