Merge pull request #73 from qlik-oss/DEB-250/ImprovedSelection

Selecting with backendApi instead of Field

src/data-table/data-cell.jsx

@@ -1,4 +1,3 @@
-import qlik from 'qlik';
 import React from 'react';
 import PropTypes from 'prop-types';
 import Tooltip from '../tooltip/index.jsx';
@@ -12,10 +11,8 @@ class DataCell extends React.PureComponent {
   handleSelect () {
     const {
       data: {
-        headers,
         meta: {
-          dimensionCount,
-          altState
+          dimensionCount
         }
       },
       general: {
@@ -30,13 +27,9 @@ class DataCell extends React.PureComponent {
       return;
     }
 
-    const app = qlik.currApp(component);
-    app.field(headers.dimension1[0].name, altState)
-      .select([measurement.parents.dimension1.elementNumber], false, false);
-
+    component.backendApi.selectValues(0, [measurement.parents.dimension1.elementNumber], false);
     if (hasSecondDimension) {
-      app.field(headers.dimension2[0].name, altState)
-        .select([measurement.parents.dimension2.elementNumber], false, false);
+      component.backendApi.selectValues(1, [measurement.parents.dimension2.elementNumber], false);
     }
   }
 
@@ -105,11 +98,9 @@ DataCell.propTypes = {
   cellWidth: PropTypes.string.isRequired,
   data: PropTypes.shape({
     headers: PropTypes.shape({
-      dimension1: PropTypes.array.isRequired,
       measurements: PropTypes.array.isRequired
     }).isRequired,
     meta: PropTypes.shape({
-      altState: PropTypes.string.isRequired,
       dimensionCount: PropTypes.number.isRequired
     }).isRequired
   }).isRequired,
@@ -119,7 +110,16 @@ DataCell.propTypes = {
     name: PropTypes.string,
     value: PropTypes.any
   }).isRequired,
-  component: PropTypes.shape({}).isRequired,
+  component: PropTypes.shape({
+    backendApi: PropTypes.shape({
+      selectValues: function (props, propName) {
+        if (props.isSnapshot || typeof props[propName] === 'function') {
+          return null;
+        }
+        return new Error('Missing implementation of qlik.backendApi.selectValues.');
+      }
+    }).isRequired
+  }).isRequired,
   styleBuilder: PropTypes.shape({
     hasComments: PropTypes.func.isRequired
   }).isRequired,

src/data-table/index.jsx

@@ -58,7 +58,6 @@ class DataTable extends React.PureComponent {
                 <tr key={dimensionEntry.displayValue}>
                   {!renderData ?
                     <RowHeader
-                      altState={data.meta.altState}
                       component={component}
                       entry={dimensionEntry}
                       rowStyle={rowStyle}

src/data-table/row-header.jsx

@@ -1,4 +1,3 @@
-import qlik from 'qlik';
 import React from 'react';
 import PropTypes from 'prop-types';
 import HeaderPadding from './header-padding.jsx';
@@ -12,9 +11,8 @@ class RowHeader extends React.PureComponent {
   }
 
   handleSelect () {
-    const { entry, altState, component } = this.props;
-    const app = qlik.currApp(component);
-    app.field(entry.name, altState).select([entry.elementNumber], false, false);
+    const { component, entry } = this.props;
+    component.backendApi.selectValues(0, [entry.elementNumber], false);
   }
 
   render () {
@@ -46,11 +44,18 @@ class RowHeader extends React.PureComponent {
 RowHeader.propTypes = {
   entry: PropTypes.shape({
     displayValue: PropTypes.string.isRequired,
-    elementNumber: PropTypes.number.isRequired,
-    name: PropTypes.string.isRequired
+    elementNumber: PropTypes.number.isRequired
+  }).isRequired,
+  component: PropTypes.shape({
+    backendApi: PropTypes.shape({
+      selectValues: function (props, propName) {
+        if (props.isSnapshot || typeof props[propName] === 'function') {
+          return null;
+        }
+        return new Error('Missing implementation of qlik.backendApi.selectValues.');
+      }
+    }).isRequired
   }).isRequired,
-  altState: PropTypes.string.isRequired,
-  component: PropTypes.shape({}).isRequired,
   rowStyle: PropTypes.shape({}).isRequired,
   styleBuilder: PropTypes.shape({}).isRequired,
   styling: PropTypes.shape({}).isRequired

src/dataset.js

@@ -36,10 +36,11 @@ export async function initializeDataCube (component, layout) {
   const properties = (await component.backendApi.getProperties());
 
   // If this is a master object, fetch the hyperCubeDef of the original object
-  const hyperCubeDef = properties.qExtendsId
+  let hyperCubeDef = properties.qExtendsId
     ? (await app.getObjectProperties(properties.qExtendsId)).properties.qHyperCubeDef
     : properties.qHyperCubeDef;
-  hyperCubeDef.qStateName = layout.qStateName || "";
+  hyperCubeDef = JSON.parse(JSON.stringify(hyperCubeDef));
+  hyperCubeDef.qStateName = layout.qStateName;
 
   return buildDataCube(hyperCubeDef, layout.qHyperCube.qDimensionInfo.length === 2, app);
 }

src/headers-table/column-header.jsx

@@ -1,4 +1,3 @@
-import qlik from 'qlik';
 import React from 'react';
 import PropTypes from 'prop-types';
 import { HEADER_FONT_SIZE } from '../initialize-transformed';
@@ -11,9 +10,8 @@ class ColumnHeader extends React.PureComponent {
   }
 
   handleSelect () {
-    const { entry, altState, component } = this.props;
-    const app = qlik.currApp(component);
-    app.field(entry.name, altState).select([entry.elementNumber], false, false);
+    const { component, entry } = this.props;
+    component.backendApi.selectValues(1, [entry.elementNumber], false);
   }
 
   render () {
@@ -57,13 +55,20 @@ ColumnHeader.propTypes = {
   baseCSS: PropTypes.shape({}).isRequired,
   cellWidth: PropTypes.string.isRequired,
   colSpan: PropTypes.number,
+  component: PropTypes.shape({
+    backendApi: PropTypes.shape({
+      selectValues: function (props, propName) {
+        if (props.isSnapshot || typeof props[propName] === 'function') {
+          return null;
+        }
+        return new Error('Missing implementation of qlik.backendApi.selectValues.');
+      }
+    }).isRequired
+  }).isRequired,
   entry: PropTypes.shape({
     displayValue: PropTypes.string.isRequired,
-    elementNumber: PropTypes.number.isRequired,
-    name: PropTypes.string.isRequired
+    elementNumber: PropTypes.number.isRequired
   }).isRequired,
-  altState: PropTypes.string.isRequired,
-  component: PropTypes.shape({}).isRequired,
   styling: PropTypes.shape({
     headerOptions: PropTypes.shape({
       fontSizeAdjustment: PropTypes.number.isRequired

src/headers-table/index.jsx

@@ -75,7 +75,6 @@ class HeadersTable extends React.PureComponent {
                 }
                 return (
                   <ColumnHeader
-                    altState={data.meta.altState}
                     baseCSS={baseCSS}
                     cellWidth={cellWidth}
                     colSpan={measurements.length}
@@ -128,9 +127,6 @@ HeadersTable.propTypes = {
       dimension1: PropTypes.array,
       dimension2: PropTypes.array,
       measurements: PropTypes.array
-    }),
-    meta: PropTypes.shape({
-      altState: PropTypes.string.isRequired
     })
   }).isRequired,
   general: PropTypes.shape({}).isRequired,

src/initialize-transformed.js

@@ -250,8 +250,7 @@ function initializeTransformed ({ $element, component, dataCube, designList, lay
       },
       matrix, // 2d array of all rows/cells to render in body of datatable
       meta: {
-        dimensionCount: dimensionsInformation.length,
-        altState: layout.qStateName || ""
+        dimensionCount: dimensionsInformation.length
       }
     },
     general: {