Add empty state to featuregrid widget

geosolutions-it · Apr 6, 2018 · 9e10728 · 9e10728
1 parent 7bdff39
commit 9e10728
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 75 deletions.
diff --git a/TableWidget.jsx b/TableWidget.jsx
diff --git a/web/client/components/widgets/widget/TableWidget.jsx b/web/client/components/widgets/widget/TableWidget.jsx
@@ -9,6 +9,7 @@ const React = require('react');
 const Message = require('../../I18N/Message');
 const BorderLayout = require('../../layout/BorderLayout');
 const LoadingSpinner = require('../../misc/LoadingSpinner');
+const EmptyRowsView = require('../../data/featuregrid/EmptyRowsView');
 const loadingState = require('../../misc/enhancers/loadingState');
 const errorChartState = require('../enhancers/errorChartState');
 
@@ -76,6 +77,7 @@ module.exports = ({
                     </div>) : null}
         >
         <FeatureGrid
+            emptyRowsView={() => <EmptyRowsView loading={loading} />}
             gridEvents={gridEvents}
             sortable={false}
             defaultSize={false}

diff --git a/web/client/components/widgets/widget/__tests__/TableWidget-test.jsx b/web/client/components/widgets/widget/__tests__/TableWidget-test.jsx
@@ -18,7 +18,8 @@ const React = require('react');
 const ReactDOM = require('react-dom');
 const ReactTestUtils = require('react-dom/test-utils');
 const expect = require('expect');
-const TableWidget = require('../ChartWidget');
+const TableWidget = require('../TableWidget');
+const describePois = require('json-loader!../../../../test-resources/wfs/describe-pois.json');
 
 describe('TableWidget component', () => {
     beforeEach((done) => {
@@ -47,4 +48,17 @@ describe('TableWidget component', () => {
         ReactTestUtils.Simulate.click(el); // <-- trigger event callback
         expect(spyonEdit).toHaveBeenCalled();
     });
+    it('TableWidget loading', () => {
+        ReactDOM.render(<TableWidget loading />, document.getElementById("container"));
+        const container = document.getElementById('container');
+        const el = container.querySelector('.loader-container');
+        expect(el).toExist();
+    });
+    it('TableWidget empty', () => {
+        ReactDOM.render(<TableWidget describeFeatureType={describePois} features={[]} />, document.getElementById("container"));
+        const container = document.getElementById('container');
+        const el = container.querySelector('.react-grid-Empty');
+        expect(el).toExist();
+    });
+
 });