ywana-core8 0.0.194 → 0.0.195

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.194",
+  "version": "0.0.195",
   "description": "ywana-core8",
   "author": "Ernesto Roldan Garcia",
   "license": "MIT",

package/src/domain/ContentViewer.css

@@ -0,0 +1,3 @@
+.content-viewer>main>.property {
+    border-bottom: solid 1px var(--divider-color);
+}

package/src/domain/ContentViewer.js

@@ -22,7 +22,7 @@ export const ContentViewer = (props) => {
             {sections.map(section => {
                 const { title, fields } = section
                 return (
-                    <section key={title}>
+                    <section key={title} className="content-viewer">
                         <header>
                             {title}
                         </header>
@@ -36,6 +36,11 @@ export const ContentViewer = (props) => {
     )
 }
 
+/**
+ * Field Viewer
+ * @param {} props 
+ * @returns 
+ */
 const FieldViewer = (props) => {
 
     const { field, value } = props
@@ -46,7 +51,30 @@ const FieldViewer = (props) => {
     switch(type) {
         case TYPES.STRING:
             return <Property label={label} value={value} />
+        case TYPES.ENTITY:
+            return <EntityViewer field={field} value={value} />
         default:
             return <div>{label}</div>
     }
+}
+
+/**
+ * EntityViewer
+ */
+const EntityViewer = (props) => {
+    const { field, value } = props
+    const { item, label } = field
+    const content = new Content(item, value)
+    const form = content.form()
+    const fields = Object.keys(form).map(key => form[key])
+    return (
+        <div className='entity-viewer'>
+            <header>
+                {label}
+            </header>
+            <main>
+                { fields.map( field => <FieldViewer field={field} value={value[field.id]} /> )}
+            </main>
+        </div>
+    )
 }