chore: refactor

app/components/entities-map-comp.jsx

@@ -5,14 +5,23 @@ import EntitiesMap from './map/entities-map';
 
 //destructure props
 export default function EntitiesMapComp({entities}){
+    if(entities.length>0){
     return (
 	<>
-	    <h2>Map</h2>
-	    <h3>Entity Map</h3>
+	    <h1>Map</h1>
+	    <h2>Entity Map</h2>
 	    <EntitiesMap entities={entities}/>
 
 	</>
     );
+    }else{
+	return (
+	    <>
+		<h1>Map</h1>
+		<p>EntitiesMap loading...</p>
+	    </>
+	);
+    }
 }
 EntitiesMapComp.propTypes = {
     entities: PropTypes.array

app/components/list.jsx

@@ -3,10 +3,11 @@ import PropTypes from 'prop-types';
 
 //destructure props
 export default function List({entities}){
+    if(entities.length>0){
     return (
 	<>
-	    <h2>List</h2>
-	    <h3>Entity List</h3>
+	    <h1>List</h1>
+	    <h2>Entity List</h2>
 	    <table>
 		<thead>
 		    <tr>
@@ -32,6 +33,14 @@ export default function List({entities}){
 	    </table>
 	</>
     );
+    }else{
+	return (
+	    <>
+		<h1>List</h1>
+		<p>List loading...</p>
+	    </>
+	);
+    }
 }
 List.propTypes = {
     entities: PropTypes.array,

app/components/relations-map-comp.jsx

@@ -21,16 +21,16 @@ export default function RelationsMapComp({entities,relations}){
     if(rltns.length===0){
 	return (
 	<>
-	    <h2>Map</h2>
-	    <h3>Relations Map</h3>
-	    <p>RelationsMapComp loading...</p>;
+	    <h1>Map</h1>
+	    <h2>Relations Map</h2>
+	    <p>RelationsMap loading...</p>
 	</>
 	);
     }else{
 	return (
 	<>
-	    <h2>Map</h2>
-	    <h3>Relations Map</h3>
+	    <h1>Map</h1>
+	    <h2>Relations Map</h2>
 	    <RelationsMap relations={rltns}/>
 	</>
 	);

app/pages/home.jsx

@@ -41,16 +41,24 @@ export default function Home(){
 	fetchRelations();
     },[]);
 
-    //return
-    return (
-	<>
-	    <h1>Home</h1>
-	    <List entities={entities} />
-	    <EntitiesMap entities={entities} />
-	    <RelationsMap
-		entities={entities}
-		relations={relations}
-	    />
-	</>
-    );
+    if(entities.length>0){
+	return (
+	    <>
+		<h1>Home</h1>
+		<List entities={entities} />
+		<EntitiesMap entities={entities} />
+		<RelationsMap
+		    entities={entities}
+		    relations={relations}
+		/>
+	    </>
+	);
+    }else{
+	return (
+	    <>
+		<h1>Home</h1>
+		<p>Home loading...</p>
+	    </>
+	);
+    }
 }