@reltio/components 1.4.897 → 1.4.898

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -37,7 +37,7 @@ exports.PivotingTooltipContent = void 0;
37
37
  var react_1 = __importStar(require("react"));
38
38
  var react_redux_1 = require("react-redux");
39
39
  var ui_i18n_1 = __importDefault(require("ui-i18n"));
40
- var mdm_module_1 = __importDefault(require("@reltio/mdm-module"));
40
+ var mdm_module_1 = __importStar(require("@reltio/mdm-module"));
41
41
  var mdm_sdk_1 = require("@reltio/mdm-sdk");
42
42
  var EntityAvatar_1 = __importDefault(require("../../EntityAvatar/EntityAvatar"));
43
43
  var EntityUriLink_1 = __importDefault(require("../../EntityUriLink/EntityUriLink"));
@@ -51,9 +51,11 @@ var PivotingTooltipContent = function (_a) {
51
51
  var _d = react_1.useState(0), total = _d[0], setTotal = _d[1];
52
52
  var entity = react_redux_1.useSelector(mdm_module_1.default.selectors.getEntity) || {};
53
53
  var safePromise = hooks_1.useSafePromise();
54
+ var dispatch = react_redux_1.useDispatch();
54
55
  var styles = styles_1.useStyles();
55
56
  var globalSearchRequestOptions = react_redux_1.useSelector(mdm_module_1.default.selectors.getGlobalSearchRequestOptions) || {};
56
57
  var entityType = config.entityType || entity.type;
58
+ var shouldShowSeeAllButton = total > MAX_ENTITIES_PIVOTING_TOOLTIP;
57
59
  react_1.useEffect(function () {
58
60
  var filters = helpers_1.getParamsFilteringEntities(value, attributeType, entityType);
59
61
  var options = __assign({ max: MAX_ENTITIES_PIVOTING_TOOLTIP }, globalSearchRequestOptions);
@@ -68,6 +70,12 @@ var PivotingTooltipContent = function (_a) {
68
70
  setTotal(0);
69
71
  });
70
72
  }, []);
73
+ var handleClickSeeAll = function () {
74
+ var generatedValue = Array.isArray(value)
75
+ ? helpers_1.convertNestedAttributePivotingValue(value)
76
+ : helpers_1.convertSimpleAttributePivotingValue(attributeType, value);
77
+ dispatch(mdm_module_1.ui.actions.openPivotingPerspective({ value: generatedValue, attributeType: attributeType }));
78
+ };
71
79
  var hasEntityTypeLabel = Boolean(config.label);
72
80
  return (react_1.default.createElement("div", { className: styles.container },
73
81
  react_1.default.createElement("div", { className: styles.header },
@@ -78,7 +86,7 @@ var PivotingTooltipContent = function (_a) {
78
86
  react_1.default.createElement("div", { className: styles.body }, entities.map(function (visibleEntity) { return (react_1.default.createElement("div", { key: visibleEntity.uri, className: styles.entityContainer },
79
87
  react_1.default.createElement(EntityAvatar_1.default, { entity: visibleEntity, avatarClassName: styles.profileIcon }),
80
88
  react_1.default.createElement(EntityUriLink_1.default, { className: styles.entityLabel, value: mdm_sdk_1.getEntityUriForLink(visibleEntity) }, mdm_sdk_1.getLabel(visibleEntity.label)))); })),
81
- react_1.default.createElement("div", { className: styles.footer },
82
- react_1.default.createElement("a", null, ui_i18n_1.default.text('See all')))));
89
+ shouldShowSeeAllButton && (react_1.default.createElement("div", { className: styles.footer },
90
+ react_1.default.createElement("a", { className: styles.seeAllButton, onClick: handleClickSeeAll }, ui_i18n_1.default.text('See all'))))));
83
91
  };
84
92
  exports.PivotingTooltipContent = PivotingTooltipContent;
@@ -4,4 +4,8 @@ export declare type PivotingValue = {
4
4
  };
5
5
  export declare const getParamsFilteringEntities: (values: string | number | boolean | PivotingValue[], attributeType: AttributeType, entityType?: string) => SearchFilter[];
6
6
  export declare const generatePivotingValue: (attributeType: AttributeType, value: RecordAttributesType, pivotingAttributes: PivotingAttribute[], metadata: Metadata) => PivotingValue[];
7
+ export declare const convertSimpleAttributePivotingValue: (attrType: AttributeType, value: string | number | boolean) => {
8
+ [x: string]: string | number | boolean;
9
+ }[];
10
+ export declare const convertNestedAttributePivotingValue: (values: PivotingValue[]) => any[];
7
11
  export declare const preparePivotingAttributeValue: (value: any, attributeType: any) => any;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.preparePivotingAttributeValue = exports.generatePivotingValue = exports.getParamsFilteringEntities = void 0;
3
+ exports.preparePivotingAttributeValue = exports.convertNestedAttributePivotingValue = exports.convertSimpleAttributePivotingValue = exports.generatePivotingValue = exports.getParamsFilteringEntities = void 0;
4
4
  var mdm_sdk_1 = require("@reltio/mdm-sdk");
5
5
  var ramda_1 = require("ramda");
6
6
  var getParamsFilteringEntities = function (values, attributeType, entityType) {
@@ -82,6 +82,22 @@ var generatePivotingValue = function (attributeType, value, pivotingAttributes,
82
82
  }, []);
83
83
  };
84
84
  exports.generatePivotingValue = generatePivotingValue;
85
+ var convertSimpleAttributePivotingValue = function (attrType, value) {
86
+ var _a;
87
+ return [
88
+ (_a = {}, _a[attrType.name] = value, _a)
89
+ ];
90
+ };
91
+ exports.convertSimpleAttributePivotingValue = convertSimpleAttributePivotingValue;
92
+ var convertNestedAttributePivotingValue = function (values) {
93
+ return values.map(function (value) {
94
+ return Object.fromEntries(Object.entries(value).map(function (_a) {
95
+ var key = _a[0], value = _a[1];
96
+ return [mdm_sdk_1.getLastUriPart(key), value];
97
+ }));
98
+ });
99
+ };
100
+ exports.convertNestedAttributePivotingValue = convertNestedAttributePivotingValue;
85
101
  var valueToString = function (values, metadata, pivotingAttributes) {
86
102
  if (!values || values.length === 0)
87
103
  return;
@@ -1,2 +1,2 @@
1
- export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"content" | "body" | "entityTypeLabel" | "title" | "icon" | "footer" | "header" | "entityLabel" | "container" | "divider" | "headerCount" | "profileIcon" | "entityContainer">;
1
+ export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"content" | "body" | "entityTypeLabel" | "title" | "icon" | "footer" | "header" | "entityLabel" | "container" | "divider" | "headerCount" | "profileIcon" | "entityContainer" | "seeAllButton">;
2
2
  export declare const usePivotingTooltipStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"tooltip" | "arrow">;
@@ -77,6 +77,9 @@ exports.useStyles = styles_1.makeStyles(function (theme) { return ({
77
77
  },
78
78
  content: {
79
79
  color: theme.palette.primary.main
80
+ },
81
+ seeAllButton: {
82
+ cursor: 'pointer'
80
83
  }
81
84
  }); });
82
85
  exports.usePivotingTooltipStyles = styles_1.makeStyles({
@@ -10,14 +10,14 @@ var __assign = (this && this.__assign) || function () {
10
10
  return __assign.apply(this, arguments);
11
11
  };
12
12
  import React, { useEffect, useState } from 'react';
13
- import { useSelector } from 'react-redux';
13
+ import { useDispatch, useSelector } from 'react-redux';
14
14
  import i18n from 'ui-i18n';
15
- import mdm from '@reltio/mdm-module';
15
+ import mdm, { ui as mdmModuleUi } from '@reltio/mdm-module';
16
16
  import { getEntityUriForLink, getFilteredEntities, getLabel, getTotals } from '@reltio/mdm-sdk';
17
17
  import EntityAvatar from '../../EntityAvatar/EntityAvatar';
18
18
  import EntityUriLink from '../../EntityUriLink/EntityUriLink';
19
19
  import { useStyles } from './styles';
20
- import { getParamsFilteringEntities } from './helpers';
20
+ import { convertNestedAttributePivotingValue, convertSimpleAttributePivotingValue, getParamsFilteringEntities } from './helpers';
21
21
  import { useSafePromise } from '../../../hooks';
22
22
  var MAX_ENTITIES_PIVOTING_TOOLTIP = 6;
23
23
  export var PivotingTooltipContent = function (_a) {
@@ -26,9 +26,11 @@ export var PivotingTooltipContent = function (_a) {
26
26
  var _d = useState(0), total = _d[0], setTotal = _d[1];
27
27
  var entity = useSelector(mdm.selectors.getEntity) || {};
28
28
  var safePromise = useSafePromise();
29
+ var dispatch = useDispatch();
29
30
  var styles = useStyles();
30
31
  var globalSearchRequestOptions = useSelector(mdm.selectors.getGlobalSearchRequestOptions) || {};
31
32
  var entityType = config.entityType || entity.type;
33
+ var shouldShowSeeAllButton = total > MAX_ENTITIES_PIVOTING_TOOLTIP;
32
34
  useEffect(function () {
33
35
  var filters = getParamsFilteringEntities(value, attributeType, entityType);
34
36
  var options = __assign({ max: MAX_ENTITIES_PIVOTING_TOOLTIP }, globalSearchRequestOptions);
@@ -43,6 +45,12 @@ export var PivotingTooltipContent = function (_a) {
43
45
  setTotal(0);
44
46
  });
45
47
  }, []);
48
+ var handleClickSeeAll = function () {
49
+ var generatedValue = Array.isArray(value)
50
+ ? convertNestedAttributePivotingValue(value)
51
+ : convertSimpleAttributePivotingValue(attributeType, value);
52
+ dispatch(mdmModuleUi.actions.openPivotingPerspective({ value: generatedValue, attributeType: attributeType }));
53
+ };
46
54
  var hasEntityTypeLabel = Boolean(config.label);
47
55
  return (React.createElement("div", { className: styles.container },
48
56
  React.createElement("div", { className: styles.header },
@@ -53,6 +61,6 @@ export var PivotingTooltipContent = function (_a) {
53
61
  React.createElement("div", { className: styles.body }, entities.map(function (visibleEntity) { return (React.createElement("div", { key: visibleEntity.uri, className: styles.entityContainer },
54
62
  React.createElement(EntityAvatar, { entity: visibleEntity, avatarClassName: styles.profileIcon }),
55
63
  React.createElement(EntityUriLink, { className: styles.entityLabel, value: getEntityUriForLink(visibleEntity) }, getLabel(visibleEntity.label)))); })),
56
- React.createElement("div", { className: styles.footer },
57
- React.createElement("a", null, i18n.text('See all')))));
64
+ shouldShowSeeAllButton && (React.createElement("div", { className: styles.footer },
65
+ React.createElement("a", { className: styles.seeAllButton, onClick: handleClickSeeAll }, i18n.text('See all'))))));
58
66
  };
@@ -4,4 +4,8 @@ export declare type PivotingValue = {
4
4
  };
5
5
  export declare const getParamsFilteringEntities: (values: string | number | boolean | PivotingValue[], attributeType: AttributeType, entityType?: string) => SearchFilter[];
6
6
  export declare const generatePivotingValue: (attributeType: AttributeType, value: RecordAttributesType, pivotingAttributes: PivotingAttribute[], metadata: Metadata) => PivotingValue[];
7
+ export declare const convertSimpleAttributePivotingValue: (attrType: AttributeType, value: string | number | boolean) => {
8
+ [x: string]: string | number | boolean;
9
+ }[];
10
+ export declare const convertNestedAttributePivotingValue: (values: PivotingValue[]) => any[];
7
11
  export declare const preparePivotingAttributeValue: (value: any, attributeType: any) => any;
@@ -1,4 +1,4 @@
1
- import { attributeUriToSearchUri, DataTypes, findAttributeTypeByUri, getAttributeSource, isOv, FilterOptions } from '@reltio/mdm-sdk';
1
+ import { attributeUriToSearchUri, DataTypes, findAttributeTypeByUri, getAttributeSource, isOv, FilterOptions, getLastUriPart } from '@reltio/mdm-sdk';
2
2
  import { isNil } from 'ramda';
3
3
  export var getParamsFilteringEntities = function (values, attributeType, entityType) {
4
4
  if (entityType === void 0) { entityType = ''; }
@@ -77,6 +77,20 @@ export var generatePivotingValue = function (attributeType, value, pivotingAttri
77
77
  return acc;
78
78
  }, []);
79
79
  };
80
+ export var convertSimpleAttributePivotingValue = function (attrType, value) {
81
+ var _a;
82
+ return [
83
+ (_a = {}, _a[attrType.name] = value, _a)
84
+ ];
85
+ };
86
+ export var convertNestedAttributePivotingValue = function (values) {
87
+ return values.map(function (value) {
88
+ return Object.fromEntries(Object.entries(value).map(function (_a) {
89
+ var key = _a[0], value = _a[1];
90
+ return [getLastUriPart(key), value];
91
+ }));
92
+ });
93
+ };
80
94
  var valueToString = function (values, metadata, pivotingAttributes) {
81
95
  if (!values || values.length === 0)
82
96
  return;
@@ -1,2 +1,2 @@
1
- export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"content" | "body" | "entityTypeLabel" | "title" | "icon" | "footer" | "header" | "entityLabel" | "container" | "divider" | "headerCount" | "profileIcon" | "entityContainer">;
1
+ export declare const useStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"content" | "body" | "entityTypeLabel" | "title" | "icon" | "footer" | "header" | "entityLabel" | "container" | "divider" | "headerCount" | "profileIcon" | "entityContainer" | "seeAllButton">;
2
2
  export declare const usePivotingTooltipStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"tooltip" | "arrow">;
@@ -74,6 +74,9 @@ export var useStyles = makeStyles(function (theme) { return ({
74
74
  },
75
75
  content: {
76
76
  color: theme.palette.primary.main
77
+ },
78
+ seeAllButton: {
79
+ cursor: 'pointer'
77
80
  }
78
81
  }); });
79
82
  export var usePivotingTooltipStyles = makeStyles({
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.897",
3
+ "version": "1.4.898",
4
4
  "license": "SEE LICENSE IN LICENSE FILE",
5
5
  "main": "./cjs/index.js",
6
6
  "module": "./esm/index.js",
7
7
  "dependencies": {
8
8
  "@date-io/moment": "^1.3.5",
9
9
  "@react-google-maps/api": "^2.7.0",
10
- "@reltio/mdm-module": "^1.4.897",
11
- "@reltio/mdm-sdk": "^1.4.897",
10
+ "@reltio/mdm-module": "^1.4.898",
11
+ "@reltio/mdm-sdk": "^1.4.898",
12
12
  "classnames": "^2.2.5",
13
13
  "d3-cloud": "^1.2.5",
14
14
  "d3-geo": "^2.0.1",