ywana-core8 0.0.694 → 0.0.696

package/package.json

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

package/src/domain/CollectionPage.js

@@ -350,7 +350,6 @@ const CollectionEditor = (props) => {
     const [form, setForm] = useState(selected)
 
     useEffect(() => {
-        console.log(selected)
         setForm(selected)
     }, [selected])
 
@@ -429,6 +428,7 @@ const CollectionEditor = (props) => {
                         {canDelete ? <MenuItem label="Eliminar" onSelect={remove} /> : null}
                     </Menu>
                 </MenuIcon>
+                <Icon icon="refresh" clickable action={onReload} />
                 {autosave === true ? null : <Button icon="save" label="Guardar Cambios" raised disabled={!canSave()} action={save} />}
                 {renderActions()}
             </Header>

package/src/html/table.js

@@ -164,6 +164,8 @@ const DataTableCell = ({ index, row, column, cell, editable }) => {
 
     const render = (type) => {
         const { id, disabled = false, min, max, onChange, format, options, item } = column
+
+        
         if (id === "checked") {
             return <CheckBox id={id} value={cell} onChange={(id, value) => onChange(row.id, id, value)} />
         } else if (editable && onChange) {

package/src/incubator/task-test.js

@@ -0,0 +1,45 @@
+import { useContext, useState } from "react"
+import { Button } from "../html"
+import { TaskContext, TaskContextProvider, TaskMonitor } from "./task"
+
+const CreateTaskButton = (props) => {
+
+    const taskContext = useContext(TaskContext)
+
+    async function run() {
+
+        const task = await taskContext.createTask({
+            description: "Test Task " + Date.now(),
+            init: new Date().toString(),
+        })
+
+        taskContext.addListener(task.id, (task) => { 
+            console.log(task.description + " " + task.state)
+        })
+    }
+
+    return (
+        <Button label="NEW TASK" action={run} />
+    )
+}
+
+
+const TaskTest = (props) => {
+
+    const [events, setEvents] = useState([])
+
+    function addEvent(event) {
+        setEvents([...events, event])
+    }
+
+    return (
+        <TaskContextProvider host="http://localhost:3001">
+            <TaskMonitor />
+            <CreateTaskButton onSuccess={addEvent}/>
+            {events.map((event, index) => (
+                <div key={index}>{event}</div>
+            ))}
+        </TaskContextProvider>
+
+    )
+}

package/src/incubator/task.js

@@ -1,5 +1,6 @@
 import React, { useEffect, useContext, useState } from 'react'
 import { CollectionAPI } from '../domain/CollectionAPI'
+import { FORMATS, TYPES } from '../domain/ContentType'
 import { LinearProgress, Header, DataTable, Icon } from '../html'
 import "./task.css"
 
@@ -12,9 +13,10 @@ export const TaskContext = React.createContext({})
  * Task Provider
  */
 export const TaskContextProvider = (props) => {
-
-    const { host, url = "/tasks", children } = props
+    
+    const { host, url = "/tasks", frequency = 5000, children } = props
     const API = CollectionAPI(url, host)
+    const [listeners, setListeners] = useState([])
 
     async function tasks(filters, likes) {
         try {
@@ -34,9 +36,10 @@ export const TaskContextProvider = (props) => {
         }
     }
 
-    async function createTask(task) {
+    async function createTask(task, listener) {
         try {
             const response = await API.create(task);
+            if (listener) addListener(response.id, listener)
             return response;
         } catch (error) {
             console.log("createTask error", error);
@@ -45,6 +48,7 @@ export const TaskContextProvider = (props) => {
 
     async function removeTask(id) {
         try {
+            removeTaskListeners(id)
             const response = await API.remove(id);
             return response;
         } catch (error) {
@@ -52,11 +56,35 @@ export const TaskContextProvider = (props) => {
         }
     }
 
+    function addListener(taskId, listener) {
+        const listenerId = listeners.length
+        listeners.push({ taskId, listener })
+        return listenerId
+    }
+
+    function removeTaskListeners(taskId) {
+        const newListeners = listeners.filter(listener => listener.taskId !== taskId)
+        setListeners(newListeners)
+    }
+
+    useEffect(() => {
+        const interval = setInterval(async () => {
+            const tasks = await API.all()
+            listeners.forEach(({ taskId, listener }) => {
+                const task = tasks.find(task => task.id === taskId)
+                if (task) listener(task)
+            })
+        }, frequency)
+        return () => clearInterval(interval)
+    }, [])
+
+
     const value = {
         tasks,
         task,
         createTask,
         removeTask,
+        addListener,
     };
 
     return (
@@ -129,8 +157,8 @@ export const TaskMonitor = (props) => {
             { id: "description", label: "Descripcion" },
             { id: "progress", label: "%" },
             { id: "percentage", label: "" },
-            { id: "init", label: "Inicio" },
-            { id: "end", label: "Fin" },
+            { id: "init", label: "Inicio", type: TYPES.STRING, format: FORMATS.DATE },
+            { id: "end", label: "Fin", type: TYPES.STRING, format: FORMATS.DATE },
             { id: "resourceID", label: "Recurso" },
             { id: "owner", label: "Propietario" },
             { id: "actions", label: "" }