Use native sorting, filtering and paging, allow get query

.eslintrc.json

@@ -1,13 +1,13 @@
 {
   "extends": [
-    "standard",
-    "standard-react",
-    "prettier",
-    "prettier/react"
+//    "standard",
+//    "standard-react"
+//    "prettier",
+//    "prettier/react"
   ],
   "plugins": [
-    "prettier",
-    "react"
+//    "prettier",
+//    "react"
   ],
   "parser": "babel-eslint",
   "rules": {
@@ -16,20 +16,20 @@
     "react/jsx-filename-extension": "off",
     "react/no-array-index-key": "off",
     "no-console": "off",
-    "camelcase": "off",
-    "prettier/prettier": [
-      "error",
-      {
-        "printWidth": 120,
-        "tabWidth": 2,
-        "singleQuote": true,
-        "trailingComma": "none",
-        "bracketSpacing": true,
-        "jsxBracketSameLine": false,
-        "parser": "flow",
-        "semi": true
-      }
-    ]
+    "camelcase": "off"
+//    "prettier/prettier": [
+//      "error",
+//      {
+//        "printWidth": 120,
+//        "tabWidth": 2,
+//        "singleQuote": true,
+//        "trailingComma": "none",
+//        "bracketSpacing": true,
+//        "jsxBracketSameLine": false,
+//        "parser": "flow",
+//        "semi": true
+//      }
+//    ]
   },
   "parserOptions": {
     "ecmaVersion": 2016,

package.json

@@ -92,10 +92,11 @@
   },
   "dependencies": {
     "firebase": "^6.6.1",
+    "flat": "^5.0.0",
     "prop-types": "^15.7.2",
+    "ra-realtime": "^2.8.6",
     "react": "16.9.0",
-    "react-admin": "^2.9.6",
     "react-dom": "^16.9.0",
-    "sort-by": "^1.2.0"
+    "react-router-redux": "~5.0.0-alpha.9"
   }
 }

src/demo/App.js

@@ -1,11 +1,12 @@
 import React from 'react';
 import { Admin, Resource } from 'react-admin';
-import { RestProvider, AuthProvider, base64Uploader } from '../lib';
+// import { RestProvider, AuthProvider, base64Uploader } from '../lib';
+import { RestProvider, base64Uploader, createRealtimeSaga } from '../lib';
 
 import { PostList, PostEdit, PostCreate } from './Posts';
 import { UserList, UserEdit, UserCreate } from './Users';
 
-const firebaseConfig = {
+let firebaseConfig = {
   apiKey: 'AIzaSyASpb1daoPZdpzY_-d1mkzgO-sxoBw6i9o',
   authDomain: 'react-admin-firestore-client.firebaseapp.com',
   databaseURL: 'https://react-admin-firestore-client.firebaseio.com',
@@ -14,19 +15,32 @@ const firebaseConfig = {
   messagingSenderId: '796768771332'
 };
 
+firebaseConfig = {
+  apiKey: 'AIzaSyBPTNjD4I30GyYSpD4ixjY2ZQC7pGCyFEA',
+  authDomain: 'mlbot-257017.firebaseapp.com',
+  databaseURL: 'https://mlbot-257017.firebaseio.com',
+  projectId: 'mlbot-257017',
+  storageBucket: 'mlbot-257017.appspot.com',
+  messagingSenderId: '995641416070',
+  appId: '1:995641416070:web:aec2eea9eebd6b98b93407',
+  measurementId: 'G-G324D9KTNP'
+};
+
 const trackedResources = [{ name: 'posts' }, { name: 'users' }];
 
-const authConfig = {
-  userProfilePath: '/users/',
-  userAdminProp: 'isAdmin'
-};
+// const authConfig = {
+//   userProfilePath: '/users/',
+//   userAdminProp: 'isAdmin'
+// };
 
 // to run this demo locally, please feel free to disable authProvider to bypass login page
 
 const dataProvider = base64Uploader(RestProvider(firebaseConfig, { trackedResources }));
+const realtimeSaga = createRealtimeSaga(dataProvider);
+
 const App = () => (
-  <Admin dataProvider={dataProvider} authProvider={AuthProvider(authConfig)}>
-    <Resource name="posts" list={PostList} edit={PostEdit} create={PostCreate} />
+  <Admin dataProvider={dataProvider} customSagas={[]}>
+    <Resource name=".posts" list={PostList} edit={PostEdit} create={PostCreate} />
     <Resource name="users" list={UserList} edit={UserEdit} create={UserCreate} />
   </Admin>
 );

src/demo/Posts.js

@@ -14,11 +14,20 @@ import {
   SimpleForm,
   TextInput,
   ImageInput,
-  ImageField
+  ImageField,
+    Filter
 } from 'react-admin';
 
+import Pagination from '../lib/Pagination';
+
+const PostListFilter = props => (
+    <Filter {...props}>
+      <TextInput label="test" source=" .price>"/>
+    </Filter>
+);
+
 export const PostList = props => (
-  <List {...props}>
+  <List {...props} pagination={<Pagination/>} filters={<PostListFilter/>}>
     <Datagrid>
       <TextField source="id" />
       <ReferenceField label="User" source="userId" reference="users" allowEmpty>
@@ -58,3 +67,25 @@ export const PostCreate = props => (
     </SimpleForm>
   </Create>
 );
+
+/*
+MACRO:
+PIB
+TX JUROS
+CONSUMO
+DEFICIT PUBLICO
+CAMBIO
+EMPREGO
+INFLACAO
+
+SETORIAL:
+
+BALANCA DE PAGAMENTOS
+PAUTA DE IN/OUT
+
+CONTABILIDADE SA'S
+
+EXTRATIVISTA
+MINERAL
+PAPEL-CELULOSE
+*/

src/demo/Users.js

@@ -12,8 +12,10 @@ import {
   ImageField
 } from 'react-admin';
 
+import Pagination from '../lib/Pagination';
+
 export const UserList = props => (
-  <List title="All users" {...props}>
+  <List title="All users" {...props} pagination={<Pagination />}>
     <Datagrid>
       <TextField source="id" />
       <TextField source="name" />

src/lib/CollectionGroupButtons.js

@@ -0,0 +1,9 @@
+import React from "react";
+import {
+    ShowButton,
+    CloneButton,
+    EditButton,
+    DeleteButton,
+    DeleteWithUndoButton,
+    DeleteWithConfirmButton
+} from 'react-admin';

src/lib/Pagination.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import Button from '@material-ui/core/Button';
+import ChevronLeft from '@material-ui/icons/ChevronLeft';
+import ChevronRight from '@material-ui/icons/ChevronRight';
+import Toolbar from '@material-ui/core/Toolbar';
+
+export default ({ page, perPage, total, setPage, ...props }) => {
+    // console.log(props);
+    return (
+        <Toolbar>
+            {page > 1 &&
+            <Button color="primary" key="prev" icon={<ChevronLeft />} onClick={() => setPage(page - 1)}>
+                Prev
+            </Button>
+            }
+            {total > (perPage * page) &&
+            <Button color="primary" key="next" icon={<ChevronRight />} onClick={() => setPage(page + 1)} labelposition="before">
+                Next
+            </Button>
+            }
+        </Toolbar>
+    );
+};

src/lib/createRealtimeSaga.js

@@ -0,0 +1,67 @@
+import realtimeSaga from 'ra-realtime';
+import Methods from './methods.js';
+
+const observeRequest = (dataProvider, onDataUpdated) => (type, resource, params) => {
+  return {
+    subscribe(observer) {
+      const snapshotParams = Object.assign({}, params);
+
+      snapshotParams[Methods.snapshotFlag] = true;
+
+      let isFirst = true;
+
+      const cancelSnapshotsPromise = dataProvider(type, resource, snapshotParams).then(query => {
+        return query.onSnapshot(
+          snapshot => {
+            if (!isFirst) {
+              if (onDataUpdated) onDataUpdated(type, resource);
+
+              // New data received, notify the observer
+              if (snapshot.docs) {
+                const docs = snapshot.docs.slice(params.pagination.perPage * (params.pagination.page - 1));
+
+                observer.next({
+                  data: docs.map(doc => {
+                    const data = doc.data();
+
+                    data.id = data.id || doc.id;
+
+                    return data
+                  }),
+                  total: docs.length
+                });
+              } else {
+
+                const data = snapshot.data();
+
+                data.id = data.id || snapshot.id;
+
+                observer.next({ data });
+              }
+            }
+
+            isFirst = false;
+          },
+          error => {
+            observer.error(error); // Ouch, an error occured, notify the observer
+          }
+        );
+      });
+
+      const subscription = {
+        unsubscribe() {
+          // Clean up after ourselves
+          cancelSnapshotsPromise.then(cancelSnapshots => {
+            cancelSnapshots();
+            // Notify the saga that we cleaned up everything
+            observer.complete();
+          });
+        }
+      };
+
+      return subscription;
+    }
+  };
+};
+
+export default (dataProvider, onDataUpdated) => realtimeSaga(observeRequest(dataProvider, onDataUpdated));

src/lib/index.js

@@ -2,5 +2,7 @@ import RestProvider from './RestProvider';
 import AuthProvider from './AuthProvider';
 import * as RAFirebaseMethods from './methods';
 import base64Uploader from './Base64Uploader';
+// import Pagination from './Pagination';
+import createRealtimeSaga from './createRealtimeSaga';
 
-export { RestProvider, AuthProvider, RAFirebaseMethods, base64Uploader };
+export { RestProvider, AuthProvider, RAFirebaseMethods, base64Uploader, createRealtimeSaga };