ywana-core8 0.0.560 → 0.0.563

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.560",
+  "version": "0.0.563",
   "description": "ywana-core8",
   "homepage": "https://ywana.github.io/workspace",
   "author": "Ernesto Roldan Garcia",

package/src/domain/CollectionPage.js

@@ -40,6 +40,11 @@ export const CollectionPage = (props) => {
         setPageContext(Object.assign({}, pageContext))
     }
 
+    async function reloadSelection() {
+        await pageContext.reloadSelection()
+        setPageContext(Object.assign({}, pageContext))
+    }
+
     function add() {
         const onOK = async (form) => {
             await pageContext.create(form);
@@ -71,7 +76,7 @@ export const CollectionPage = (props) => {
                 {levels ? <CollectionTree icon={icon} levels={levels} onSelect={onSelect} sorter={sorter} searchBy={searchBy} /> : <CollectionList groupBy={groupBy} onSelect={onSelect} searchBy={searchBy} />}
             </menu>
             <main key={id} className={`collection-page ${className}`}>
-                <CollectionEditor icon={icon} schema={schema} layout={editor} autosave={autosave} delay={delay} canDelete={canDelete} canEdit={canEdit} />
+                <CollectionEditor icon={icon} schema={schema} layout={editor} autosave={autosave} delay={delay} canDelete={canDelete} canEdit={canEdit} onReload={reloadSelection} />
                 {children ? <article>{children}</article> : null}
             </main>
         </Fragment>
@@ -133,7 +138,7 @@ export const CollectionFilters = (props) => {
  */
 const CollectionList = (props) => {
 
-    const { groupBy, onSelect, searchBy=[] } = props
+    const { groupBy, onSelect, searchBy = [] } = props
     const [pageContext, setPageContext] = useContext(PageContext)
     const { all = [] } = pageContext
     const [filter, setFilter] = useState()
@@ -192,7 +197,7 @@ const CollectionList = (props) => {
  */
 export const CollectionTree = (props) => {
 
-    const { icon = "description", levels, onSelect, sorter, searchBy=[] } = props
+    const { icon = "description", levels, onSelect, sorter, searchBy = [] } = props
     const [pageContext, setPageContext] = useContext(PageContext)
     const { all = [] } = pageContext
     const [filter, setFilter] = useState()
@@ -283,7 +288,7 @@ export const CollectionTree = (props) => {
 const CollectionEditor = (props) => {
     const [pageContext, setPageContext] = useContext(PageContext)
     const { selected } = pageContext
-    const { icon, schema, layout, autosave = false, delay = 1000, canDelete, canEdit } = props
+    const { icon, schema, layout, autosave = false, delay = 1000, canDelete, canEdit, onReload } = props
     const timer = useRef(null)
     const [form, setForm] = useState(selected)
 
@@ -328,9 +333,9 @@ const CollectionEditor = (props) => {
     function renderEditor() {
         const content = new Content(schema, form)
         switch (layout) {
-            case 'TABBED': return <TabbedContentEditor {...props} content={content} onChange={change} />
-            case 'TREEDED': return <TreededContentEditor {...props} content={content} onChange={change} />
-            default: return <ContentEditor {...props} content={content} onChange={change} />
+            case 'TABBED': return <TabbedContentEditor {...props} content={content} onChange={change} onReload={onReload} />
+            case 'TREEDED': return <TreededContentEditor {...props} content={content} onChange={change} onReload={onReload} />
+            default: return <ContentEditor {...props} content={content} onChange={change} onReload={onReload} />
         }
     }
 
@@ -340,7 +345,7 @@ const CollectionEditor = (props) => {
                 <Icon icon="close" clickable action={clear} />
                 <MenuIcon align="alignRight">
                     <Menu>
-                        { canDelete ? <MenuItem label="Eliminar" onSelect={remove} /> : null }
+                        {canDelete ? <MenuItem label="Eliminar" onSelect={remove} /> : null}
                     </Menu>
                 </MenuIcon>
                 {autosave === true ? null : <Button icon="save" label="Guardar Cambios" raised disabled={!canSave()} action={save} />}
@@ -382,6 +387,11 @@ export const CollectionContext = (url, field, host, page, fetching) => {
             }
         },
 
+        async reloadSelection() {
+            const result = await this.fetch(selected.id)
+            this.selected = result
+        },
+
         async fetch(id) {
             try {
                 const result = await API.find(id)

package/src/domain/ContentEditor.js

@@ -8,13 +8,17 @@ import './ContentEditor.css';
 /**
  * Content Editor
  */
-export const ContentEditor = ({ content, filter, outlined = true, className, onChange }) => {
+export const ContentEditor = ({ content, filter, outlined = true, className, onChange, onReload }) => {
 
   function change(id, value) {
     const nextValue = Object.assign({}, content.value(), { [id]: value })
     if (onChange) onChange(nextValue)
   }
 
+  function reload() {
+    if (onReload) onReload()
+  }
+
   const sections = content.sections()
 
   return (
@@ -30,7 +34,7 @@ export const ContentEditor = ({ content, filter, outlined = true, className, onC
           <section key={title}>
             {title && title.length > 0 ? <header>{title}</header> : null}
             <main>
-              {filtered.map((field) => <FieldEditor key={field.id} field={field} onChange={change} outlined={outlined} content={content} />)}
+              {filtered.map((field) => <FieldEditor key={field.id} field={field} onChange={change} onReload={reload} outlined={outlined} content={content} />)}
             </main>
           </section>
         ) : null
@@ -43,7 +47,7 @@ export const ContentEditor = ({ content, filter, outlined = true, className, onC
 /**
  * Tabbed Content Editor
  */
-export const TabbedContentEditor = ({ content, filter, grouped = false, onChange }) => {
+export const TabbedContentEditor = ({ content, filter, grouped = false, onChange, onReload }) => {
 
   const [tab, setTab] = useState(0)
 
@@ -91,7 +95,7 @@ export const TabbedContentEditor = ({ content, filter, grouped = false, onChange
                             group.fields
                               .filter(field => field.id !== 'id')
                               .filter(field => filter ? filter(field) : true)
-                              .map((field) => <FieldEditor key={field.id} field={field} onChange={change} content={content} />)
+                              .map((field) => <FieldEditor key={field.id} field={field} onChange={change} content={content} onReload={onReload} />)
                           }
                         </Fragment>
                       )
@@ -100,7 +104,7 @@ export const TabbedContentEditor = ({ content, filter, grouped = false, onChange
                   fields
                     .filter(field => field.id !== 'id')
                     .filter(field => filter ? filter(field) : true)
-                    .map((field) => <FieldEditor key={field.id} field={field} onChange={change} content={content} />)
+                    .map((field) => <FieldEditor key={field.id} field={field} onChange={change} content={content} onReload={onReload}/>)
               }
             </section>
           )
@@ -152,7 +156,7 @@ export const TreededContentEditor = ({ content, filter, onChange }) => {
         </Tree>
       </menu>
       <div>
-        {selected ? <TabbedContentEditor content={selected.item} onChange={change} /> : "select"}
+        {selected ? <TabbedContentEditor content={selected.item} onChange={change} onReload={reload}/> : "select"}
       </div>
     </div>
   )
@@ -161,13 +165,17 @@ export const TreededContentEditor = ({ content, filter, onChange }) => {
 /**
  * FieldEditor
  */
-export const FieldEditor = ({ field, onChange, content, outlined = false }) => {
+export const FieldEditor = ({ field, onChange, content, outlined = false, onReload }) => {
   const { id, type, item, label, editable, options, hidden = false } = field
 
   function change(id, value) {
     if (onChange) onChange(id, value)
   }
 
+  function reload() {
+    onReload()
+  }
+
   function renderField() {
     const value1 = field.value || field.value === "" ? field.value : field.default
     const isHidden = CHECK['isFunction'](hidden) ? hidden(field, value1) : hidden
@@ -186,7 +194,7 @@ export const FieldEditor = ({ field, onChange, content, outlined = false }) => {
         case TYPES.ARRAY:
           return item === TYPES.STRING ?
             options ? <MultiSelectionEditor content={content} field={field} value={value1} onChange={change} /> : <ListEditor field={field} value={value1} onChange={change} />
-            : <CollectionEditor field={field} value={value1} onChange={change} />
+            : <CollectionEditor field={field} value={value1} onChange={change} onReload={reload}/>
         default:
           return <div>{label}</div>
       }
@@ -372,7 +380,7 @@ export const MultiSelectionEditor = ({ field, value = [], content, onChange }) =
 /**
  * Collection Editor
  */
-export const CollectionEditor = ({ field, value = [], onChange }) => {
+export const CollectionEditor = ({ field, value = [], onChange, onReload }) => {
 
   const { id, item, label, Feeder, Renderer, Adder = true, editable = true } = field
 
@@ -398,6 +406,10 @@ export const CollectionEditor = ({ field, value = [], onChange }) => {
     }
   }
 
+  function reload() {
+    if (onReload) onReload()
+  }
+
   const columns = Object.values(item)
     .filter(field => field.column === true)
     .map((item) => ({ ...item, onChange: change }))
@@ -423,7 +435,7 @@ export const CollectionEditor = ({ field, value = [], onChange }) => {
 
       }
       <footer>
-        {Feeder ? <Feeder onAdd={add} /> : null}
+        {Feeder ? <Feeder onAdd={add} onReload={reload} /> : null}
         {Adder ? <CollectionAdder item={item} onAdd={add} /> : null}
       </footer>
     </div>