diff --git a/examples/simple-react/src/App.tsx b/examples/simple-react/src/App.tsx
index 681f09d..0c4cb72 100644
--- a/examples/simple-react/src/App.tsx
+++ b/examples/simple-react/src/App.tsx
@@ -1,11 +1,11 @@
 import { Switch, Route, Link } from 'react-router-dom';
-import SimpleApp from './SimpleApp';
-import SimpleSystem from './SimpleSystem';
-import SimpleAsyncapi from './SimpleAsyncapi';
-import GamingapiSystem from './gamingapi/System';
-import GamingapiApplication from './gamingapi/Application';
-import SocialMediaSystem from './social_media/System';
-import SocialMediaApplication from './social_media/Application';
+import SimpleApp from './simpleApp';
+import SimpleSystem from './simpleSystem';
+import SimpleAsyncapi from './simpleAsyncapi';
+import GamingapiSystem from './gamingapi/system';
+import GamingapiApplication from './gamingapi/application';
+import SocialMediaSystem from './social_media/system';
+import SocialMediaApplication from './social_media/application';
 
 export const App = () => {
   return (
diff --git a/examples/simple-react/src/SimpleSystem.tsx b/examples/simple-react/src/SimpleSystem.tsx
deleted file mode 100644
index 0a61d72..0000000
--- a/examples/simple-react/src/SimpleSystem.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-import { SystemView } from '@lagoni/edavisualiser';
-
-function App() {
-  return (
-    <div className="App">
-      <SystemView
-        applications={[
-          {
-            application: {
-              id: "string",
-              defaultContentType: "string",
-              description: "string",
-              title: "string",
-              version: "string",
-              license: {
-                name: 'string',
-                url: 'string',
-              },
-              externalDocs: "string",
-              servers: [
-                {
-                  name: 'string',
-                  url: 'string',
-                  description: 'string',
-                  protocol: 'string',
-                  protocolVersion: 'string',
-                },
-              ],
-            },
-            incomingOperations: [
-              {
-                channel: "Test/test/",
-                description: "Test description",
-                id: "testid",
-                messages: [{ title: 'test' }],
-                forApplication: 'string',
-              }
-            ],
-            outgoingOperations: [
-              {
-                channel: "Test/test/test",
-                description: "Test description",
-                id: "testid2",
-                messages: [{ title: 'test' }],
-                forApplication: 'string',
-              }
-            ],
-          },
-          {
-            application: {
-              id: "string2",
-              defaultContentType: "string",
-              description: "string",
-              title: "string",
-              version: "string",
-              license: {
-                name: 'string',
-                url: 'string',
-              },
-              externalDocs: "string",
-              servers: [
-                {
-                  name: 'string',
-                  url: 'string',
-                  description: 'string',
-                  protocol: 'string',
-                  protocolVersion: 'string',
-                },
-              ],
-            },
-            outgoingOperations: [
-              {
-                channel: "Test/test/",
-                description: "Test description",
-                id: "testid",
-                messages: [{ title: 'test' }],
-                forApplication: 'string2',
-              }
-            ],
-            incomingOperations: [
-              {
-                channel: "Test/test/test",
-                description: "Test description",
-                id: "testid2",
-                messages: [{ title: 'test' }],
-                forApplication: 'string2',
-              }
-            ],
-          }
-        ]}
-      />
-    </div>
-  );
-}
-
-export default App;
diff --git a/examples/simple-react/src/gamingapi/Application.tsx b/examples/simple-react/src/gamingapi/Application.tsx
deleted file mode 100644
index 9701287..0000000
--- a/examples/simple-react/src/gamingapi/Application.tsx
+++ /dev/null
@@ -1,70 +0,0 @@
-import { useState, useEffect } from 'react';
-import { useParams } from 'react-router-dom';
-import { ApplicationFocusView } from '@lagoni/edavisualiser';
-import '@asyncapi/parser/dist/bundle';
-import { apps } from './apps';
-
-import '@lagoni/edavisualiser/styles/default.css';
-
-function Asyncapi() {
-  const [externalApplications, setAsyncapiDocuments] = useState<Array<{ parsedDoc: any, name: string }>>([]);
-  const [focusedApplication, setFocusedApplication] = useState<{ parsedDoc: any, name: string }>();
-  let { application } = useParams<{ application: string }>();
-
-  useEffect(() => {
-    const fetchData = async () => {
-      const data = [];
-      const parser = (window as any)['AsyncAPIParser'];
-      for (const [name, asyncapiUrl] of Object.entries(apps)) {
-        if (application === name) {
-          const parsedDoc = await parser.parseFromUrl(asyncapiUrl);
-          setFocusedApplication({ parsedDoc, name });
-        } else {
-          const parsedDoc = await parser.parseFromUrl(asyncapiUrl);
-          data.push({ parsedDoc, name });
-        }
-      }
-      setAsyncapiDocuments(data);
-    };
-
-    fetchData().catch(console.error);
-  }, [application]);
-
-  let node;
-  if (externalApplications.length > 0 && focusedApplication !== undefined) {
-    node = (
-      <ApplicationFocusView
-        asyncapi={{ document: focusedApplication.parsedDoc }}
-        external={externalApplications.map(({ parsedDoc, name }) => {
-          return {
-            asyncapi: {
-              document: parsedDoc,
-              topExtended: (
-                <div className="flex justify-between mb-4">
-                  <a
-                    className="leading-6 text-gray-900 uppercase text-xs font-light"
-                    href={'/gamingapi/application/' + name}
-                  >
-                    <button
-                      style={{
-                        backgroundColor: 'rgba(110, 231, 183, 1)',
-                        padding: '0 10px',
-                      }}
-                    >
-                      Focus application
-                    </button>
-                  </a>
-                </div>
-              )
-            }
-          }
-        })}
-      />
-    );
-  } else {
-    node = <h1>Wait...</h1>;
-  }
-  return <div className="App">{node}</div>;
-}
-
-export default Asyncapi;
diff --git a/examples/simple-react/src/index.tsx b/examples/simple-react/src/index.tsx
index 220c7a3..91895b4 100644
--- a/examples/simple-react/src/index.tsx
+++ b/examples/simple-react/src/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { BrowserRouter } from 'react-router-dom';
-import { App } from './App';
+import { App } from './app';
 
 import './index.css';
 import '@lagoni/edavisualiser/styles/default.css';
diff --git a/examples/simple-react/src/social_media/Application.tsx b/examples/simple-react/src/social_media/Application.tsx
deleted file mode 100644
index c35895b..0000000
--- a/examples/simple-react/src/social_media/Application.tsx
+++ /dev/null
@@ -1,72 +0,0 @@
-import { useState, useEffect } from 'react';
-import { Menu } from './Menu';
-import { useParams } from 'react-router-dom';
-import { ApplicationFocusView } from '@lagoni/edavisualiser';
-import { apps } from './apps';
-import '@asyncapi/parser/dist/bundle';
-
-import '@lagoni/edavisualiser/styles/default.css';
-
-function Asyncapi() {
-  const [externalApplications, setAsyncapiDocuments] = useState<Array<{ parsedDoc: any, name: string }>>([]);
-  const [focusedApplication, setFocusedApplication] = useState<{ parsedDoc: any, name: string }>();
-  let { application } = useParams<{ application: string }>();
-
-  useEffect(() => {
-    const fetchData = async () => {
-      const data = [];
-      const parser = (window as any)['AsyncAPIParser'];
-      for (const [name, asyncapi] of Object.entries(apps)) {
-        if (application === name) {
-          const parsedDoc = await parser.parse(asyncapi);
-          setFocusedApplication({ parsedDoc, name });
-        } else {
-          const parsedDoc = await parser.parse(asyncapi);
-          data.push({ parsedDoc, name });
-        }
-      }
-      setAsyncapiDocuments(data);
-    };
-
-    fetchData().catch(console.error);
-  }, [application]);
-
-  let node;
-  if (externalApplications.length > 0 && focusedApplication !== undefined) {
-    node = (
-      <ApplicationFocusView
-        sideMenu={() => Menu}
-        asyncapi={{ document: focusedApplication.parsedDoc }}
-        external={externalApplications.map(({ parsedDoc, name }) => {
-          return {
-            asyncapi: {
-              document: parsedDoc,
-              topExtended: (
-                <div className="flex justify-between mb-4">
-                  <a
-                    className="leading-6 text-gray-900 uppercase text-xs font-light"
-                    href={'/social-media/application/' + name}
-                  >
-                    <button
-                      style={{
-                        backgroundColor: 'rgba(110, 231, 183, 1)',
-                        padding: '0 10px',
-                      }}
-                    >
-                      Focus application
-                    </button>
-                  </a>
-                </div>
-              )
-            }
-          }
-        })}
-      />
-    );
-  } else {
-    node = <h1>Wait...</h1>;
-  }
-  return <div className="App">{node}</div>;
-}
-
-export default Asyncapi;
diff --git a/examples/simple-react/src/social_media/Menu.tsx b/examples/simple-react/src/social_media/Menu.tsx
deleted file mode 100644
index 8780779..0000000
--- a/examples/simple-react/src/social_media/Menu.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-export function Menu() {
-  return (
-    <div className="absolute top-0 left-0 bg-white grid grid-cols-1 gap-4" style={{zIndex: 10000}}>
-      <div className="space-x-2 py-2 m-4 inline-block text-lg px-2 text-gray-800">
-        <span className="font-bold">Visualiser</span>
-      </div>
-      <div style={{padding: "0 30px"}}><a href="/social-media/system" className="font-light capitalize">View system</a></div>
-      <div style={{padding: "0 30px"}}><a href="/social-media/application/frontend" className="font-light capitalize">View frontend application</a></div>
-      <div style={{padding: "0 30px"}}><a href="/social-media/application/backend" className="font-light capitalize">View backend application</a></div>
-      <div style={{padding: "0 30px"}}><a href="/social-media/application/comments_service" className="font-light capitalize">View comments application</a></div>
-      <div style={{padding: "0 30px"}}><a href="/social-media/application/notification_service" className="font-light capitalize">View notification application</a></div>
-      <div style={{padding: "0 30px"}}><a href="/social-media/application/public_api" className="font-light capitalize">View public application</a></div>
-    </div>
-  );
-}
\ No newline at end of file
diff --git a/library/src/visualiser/helpers/collect-nodes.ts b/library/src/visualiser/helpers/collect-nodes.ts
index 543cfb9..298385f 100644
--- a/library/src/visualiser/helpers/collect-nodes.ts
+++ b/library/src/visualiser/helpers/collect-nodes.ts
@@ -1,7 +1,5 @@
 import { getUniqueConnectionId } from './relation-finder';
-import { ArrowHeadType } from 'react-flow-renderer';
-
-import { Node, Edge, FlowElement } from 'react-flow-renderer';
+import { Node, Edge, FlowElement, ArrowHeadType } from 'react-flow-renderer';
 import {
   ApplicationViewData,
   ApplicationFocusViewData,