refactor: useEntity

packages/entity/src/entity-renderer/view/index.jsx

@@ -1,28 +1,12 @@
 import './index.scss';
 
 import {PropTypes, React} from '@latus/react';
-import {useLatus} from '@latus/react/client';
 
+import useEntity from '../../hooks/use-entity';
 import Stage from '../stage';
 
-const {
-  useEffect,
-  useRef,
-  useState,
-} = React;
-
 const View = ({json}) => {
-  const latus = useLatus();
-  const ref = useRef();
-  const {Entity} = latus.get('%resources');
-  const [entity, setEntity] = useState();
-  useEffect(() => {
-    setEntity();
-    const loadEntity = async () => {
-      setEntity(await Entity.load(json));
-    };
-    loadEntity();
-  }, [Entity, json, ref]);
+  const entity = useEntity(json);
   let output;
   if (!entity) {
     output = null;

packages/entity/src/hooks/use-entity.js

@@ -0,0 +1,21 @@
+import {React} from '@latus/react';
+import {useLatus} from '@latus/react/client';
+
+const {
+  useEffect,
+  useState,
+} = React;
+
+export default (json) => {
+  const latus = useLatus();
+  const {Entity} = latus.get('%resources');
+  const [entity, setEntity] = useState();
+  useEffect(() => {
+    setEntity();
+    const loadEntity = async () => {
+      setEntity(await Entity.load(json));
+    };
+    loadEntity();
+  }, [Entity, json]);
+  return entity;
+};