ywana-core8 0.0.298 → 0.0.299

package/package.json

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

package/src/domain/TablePage.css

@@ -66,4 +66,13 @@ main.table-filters {
 
 td.entity-cell {
     background-color: rgba(240,240,240,.4);
+}
+
+.table-queries-item {
+    display: flex;
+    align-items: center;
+}
+
+.table-queries-item>label {
+    flex: 1;
 }

package/src/domain/TablePage.js

@@ -22,7 +22,8 @@ export const TablePage = (props) => {
         autosave = true, delay = 1000,
         editable,
         actions = [], dev = false, tableActions, selectionActions = [],
-        canFilter = false, canQuery = false, canAdd = true, canDelete = true, canEdit = true,
+        canFilter = false, canAdd = true, canDelete = true, canEdit = true,
+        canQuery = false, urlQuery,
         groupBy, validator, scenario,
         formFilter, tableFilter, editorFilter = false
     } = props
@@ -63,7 +64,7 @@ export const TablePage = (props) => {
     function saveQuery(filters) {
         const onOK = async (form) => {
             form.filters = filters
-            await pageContext.createQuery(form)
+            await pageContext.createQuery(form, urlQuery)
             setPageContext(Object.assign({}, pageContext))
         }
         site.openDialog(<CreateContentDialog label="Nueva query" type={QUERY} onOK={onOK} />)
@@ -135,7 +136,7 @@ export const TablePage = (props) => {
             </Header>
             {canQuery || canFilter ? (
                 <menu className="table-page">
-                    {canQuery ? <TableQueries schema={schema} /> : null}
+                    {canQuery ? <TableQueries schema={schema} url={urlQuery}/> : null}
                     {canFilter ? <TableFilters schema={schema} onSave={saveQuery}/> : null}
                 </menu>
             ) : null }
@@ -209,26 +210,34 @@ const TableSelector = (props) => {
  */
 const TableQueries = (props) => {
 
-    function remove(id) {
-        alert("TODO: remove query")
-    }
-
-    const queries = [
+    const [pageContext, setPageContext] = useContext(PageContext)
+    const { queries= [
         { name: "Query 1", filters: {}},
         { name: "Query 2", filters: {}},
         { name: "Query 3", filters: {}},
-    ]
+    ] } = pageContext
+
+    useEffect(() => {
+        pageContext.loadQueries()
+    }, [])
+
+    
+    async function remove(id) {
+        await pageContext.removeQuery(id)
+        setPageContext(Object.assign({}, pageContext))
+    }
+    
     return (
         <Fragment>
             <Header className="table-queries" title={<Text>Queries</Text>} />
             <main className="table-queries">
-                {queries.map(query => (
+                {queries ? queries.map(query => (
                     <div className="table-queries-item">
                         <Icon icon="star" />
                         <label>{query.name}</label>
                         <Icon icon="close" clickable size="small" action={() => remove(query.id)} />
                     </div>
-                ))}
+                )) : <div>...empty...</div>}
             </main>
         </Fragment>
     )