@balena/ui-shared-components 15.2.3-build-material-7-5b444ad090f70e211345857a9993c33674539765-1 → 15.2.3-build-drop-some-lodash-for-native-alternatives-9e9fabf4a86078fc34348c4aac2a6320be175a84-1
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.
- package/dist/components/DownloadImageDialog/index.js +6 -7
- package/dist/components/DownloadImageDialog/version.js +1 -1
- package/dist/components/DropDownButton/index.js +7 -7
- package/dist/components/Form/FieldTemplates/ObjectFieldTemplate.js +4 -4
- package/dist/components/Form/Widgets/FileWidget.js +1 -1
- package/dist/components/Form/index.js +1 -1
- package/dist/components/RJST/DataTypes/object.js +18 -9
- package/dist/components/RJST/Filters/utils.js +3 -3
- package/dist/components/RJST/Lenses/index.js +1 -2
- package/dist/components/RJST/components/Filters/FiltersDialog.js +27 -30
- package/dist/components/RJST/components/Table/useTagActions.js +1 -1
- package/dist/components/RJST/components/Widget/Formats/TxtWidget.js +1 -2
- package/dist/components/RJST/components/Widget/index.js +2 -2
- package/dist/components/RJST/models/helpers.js +1 -2
- package/dist/components/RJST/utils.js +2 -2
- package/dist/components/TagManagementDialog/AddTagForm.js +3 -8
- package/dist/components/TagManagementDialog/index.js +2 -2
- package/dist/components/TagManagementDialog/tag-management-service.js +5 -6
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/dist/theme.d.ts +11 -10
- package/dist/theme.js +1 -1
- package/dist/utils/arrays.d.ts +2 -0
- package/dist/utils/arrays.js +6 -0
- package/package.json +11 -13
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Avatar, DialogActions, DialogContent, Divider, Grid, Stack, Typography, } from '@mui/material';
|
|
2
|
+
import { Avatar, DialogActions, DialogContent, Divider, Grid2 as Grid, Stack, Typography, } from '@mui/material';
|
|
3
3
|
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
4
4
|
import { FALLBACK_LOGO_UNKNOWN_DEVICE, isUrlAccessible, stripVersionBuild, } from './utils';
|
|
5
5
|
import { GENERIC_X86_MINIMUM_SUPPORTED_SECUREBOOT_VERSION, GENERIC_X86_SLUG, ImageForm, } from './ImageForm';
|
|
@@ -7,9 +7,8 @@ import { ApplicationInstructions } from './ApplicationInstructions';
|
|
|
7
7
|
import { DropDownButton } from '../DropDownButton';
|
|
8
8
|
import pickBy from 'lodash/pickBy';
|
|
9
9
|
import debounce from 'lodash/debounce';
|
|
10
|
-
import isEmpty from 'lodash/isEmpty';
|
|
11
10
|
import { OsTypesEnum } from './models';
|
|
12
|
-
import uniq from '
|
|
11
|
+
import { uniq } from '../../utils/arrays';
|
|
13
12
|
import { enqueueSnackbar } from 'notistack';
|
|
14
13
|
import { DialogWithCloseButton } from '../DialogWithCloseButton';
|
|
15
14
|
import { Callout } from '../Callout';
|
|
@@ -26,9 +25,9 @@ export var ActionType;
|
|
|
26
25
|
ActionType["downloadConfigFile"] = "download_config_file";
|
|
27
26
|
})(ActionType || (ActionType = {}));
|
|
28
27
|
const getUniqueOsTypes = (osVersions, deviceTypeSlug) => {
|
|
29
|
-
if (
|
|
28
|
+
if (Object.keys(osVersions).length === 0 ||
|
|
30
29
|
!deviceTypeSlug ||
|
|
31
|
-
|
|
30
|
+
osVersions[deviceTypeSlug].length === 0) {
|
|
32
31
|
return [];
|
|
33
32
|
}
|
|
34
33
|
return uniq(osVersions[deviceTypeSlug].map((x) => x.osType));
|
|
@@ -98,7 +97,7 @@ export const DownloadImageDialog = ({ open, applicationId, releaseId, compatible
|
|
|
98
97
|
[initialDeviceType.slug]: osTypes.includes(OsTypesEnum.ESR),
|
|
99
98
|
}
|
|
100
99
|
: {});
|
|
101
|
-
const [isFetching, setIsFetching] = useState(
|
|
100
|
+
const [isFetching, setIsFetching] = useState(Object.keys(osVersions).length === 0);
|
|
102
101
|
const [downloadSize, setDownloadSize] = useState(null);
|
|
103
102
|
const [isValidatingUrl, setIsValidatingUrl] = useState(false);
|
|
104
103
|
const defaultDisplayName = useMemo(() => { var _a, _b; return (_b = (_a = formModel.deviceType) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : '-'; }, [(_a = formModel.deviceType) === null || _a === void 0 ? void 0 : _a.name]);
|
|
@@ -265,7 +264,7 @@ export const DownloadImageDialog = ({ open, applicationId, releaseId, compatible
|
|
|
265
264
|
sm: 12,
|
|
266
265
|
md: 6,
|
|
267
266
|
lg: 7,
|
|
268
|
-
}, children: isFetching ? (_jsx(Spinner, {})) : (_jsxs(_Fragment, { children: [
|
|
267
|
+
}, children: isFetching ? (_jsx(Spinner, {})) : (_jsxs(_Fragment, { children: [Object.keys(osVersions).length === 0 && (_jsx(Callout, { severity: "warning", children: "No OS versions available for download" })), !!osType && !!compatibleDeviceTypes && (_jsx(ImageForm, { applicationId: applicationId, releaseId: releaseId, compatibleDeviceTypes: compatibleDeviceTypes, osVersions: osVersions, isInitialDefault: isInitialDefault, hasEsrVersions: deviceTypeHasEsr[formModel.deviceType.slug], formElement: formElement, downloadUrl: downloadUrl, authToken: authToken, osType: osType, osTypes: osTypes, model: formModel, onSelectedOsTypeChange: setOsTypeCallback, onChange: handleChange }))] })) }), _jsxs(Grid, { pb: 0, size: {
|
|
269
268
|
xs: 12,
|
|
270
269
|
sm: 12,
|
|
271
270
|
md: 6,
|
|
@@ -5,7 +5,6 @@ import { Button, ButtonGroup, MenuItem, Menu } from '@mui/material';
|
|
|
5
5
|
import { ButtonWithTracking } from '../ButtonWithTracking';
|
|
6
6
|
import { useAnalyticsContext } from '../../contexts/AnalyticsContext';
|
|
7
7
|
import groupBy from 'lodash/groupBy';
|
|
8
|
-
import flatMap from 'lodash/flatMap';
|
|
9
8
|
import { Tooltip } from '../Tooltip';
|
|
10
9
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
11
10
|
import { faCaretDown, faCaretUp, faChevronDown, faChevronUp, } from '@fortawesome/free-solid-svg-icons';
|
|
@@ -22,16 +21,17 @@ export const DropDownButton = (_a) => {
|
|
|
22
21
|
// const items = [{...menuItem, section: 'test1'}, {...menuItem, section: 'test2'}];
|
|
23
22
|
// <Dropdown groupByProp='section' .../>
|
|
24
23
|
const memoizedItems = useMemo(() => {
|
|
24
|
+
var _a;
|
|
25
25
|
if (!groupByProp) {
|
|
26
26
|
return items;
|
|
27
27
|
}
|
|
28
28
|
const grouped = groupBy(items, (item) => item[groupByProp]);
|
|
29
|
-
const
|
|
30
|
-
const lastKey =
|
|
31
|
-
return
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
const entries = Object.entries(grouped);
|
|
30
|
+
const lastKey = (_a = entries.at(-1)) === null || _a === void 0 ? void 0 : _a[0];
|
|
31
|
+
return entries
|
|
32
|
+
.flatMap(([key, value]) => value.map((v, index) => key !== lastKey && index === value.length - 1
|
|
33
|
+
? Object.assign(Object.assign({}, v), { divider: true }) : v))
|
|
34
|
+
.filter(Boolean);
|
|
35
35
|
}, [items, groupByProp]);
|
|
36
36
|
const handleClick = (event) => {
|
|
37
37
|
var _a, _b, _c;
|
|
@@ -3,15 +3,15 @@ import Grid from '@mui/material/Grid';
|
|
|
3
3
|
import { canExpand, descriptionId, getTemplate, getUiOptions, titleId, } from '@rjsf/utils';
|
|
4
4
|
export const ObjectFieldTemplate = (props) => {
|
|
5
5
|
var _a, _b;
|
|
6
|
-
const { description, title, properties, required, disabled, readonly, uiSchema,
|
|
6
|
+
const { description, title, properties, required, disabled, readonly, uiSchema, idSchema, schema, formData, onAddClick, registry, } = props;
|
|
7
7
|
const uiOptions = getUiOptions(uiSchema);
|
|
8
8
|
const TitleFieldTemplate = getTemplate('TitleFieldTemplate', registry, uiOptions);
|
|
9
9
|
const DescriptionFieldTemplate = getTemplate('DescriptionFieldTemplate', registry, uiOptions);
|
|
10
10
|
const { ButtonTemplates: { AddButton }, } = registry.templates;
|
|
11
|
-
return (_jsxs(_Fragment, { children: [title && (_jsx(TitleFieldTemplate, { id: titleId(
|
|
11
|
+
return (_jsxs(_Fragment, { children: [title && (_jsx(TitleFieldTemplate, { id: titleId(idSchema), title: title, required: required, schema: schema, uiSchema: uiSchema, registry: registry })), description && (_jsx(DescriptionFieldTemplate, { id: descriptionId(idSchema), description: description, schema: schema, uiSchema: uiSchema, registry: registry })), _jsxs(Grid, Object.assign({ container: true, spacing: 2, style: { marginTop: '10px' } }, ((_b = (_a = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:grid']) === null || _a === void 0 ? void 0 : _a.container) !== null && _b !== void 0 ? _b : {}), { children: [properties.map((element, index) => {
|
|
12
12
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
13
|
-
return element.hidden ? (element.content) : (_jsx(Grid, Object.assign({ item: true,
|
|
14
|
-
}), canExpand(schema, uiSchema, formData) && (_jsx(Grid, { container: true, justifyContent: "flex-end", children: _jsx(Grid, { children: _jsx(AddButton, { className: "object-property-expand", onClick:
|
|
13
|
+
return element.hidden ? (element.content) : (_jsx(Grid, Object.assign({ item: true, xs: 12, sx: { marginBottom: '10px' } }, ((_g = (_e = (_c = (_b = (_a = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema[element.name]) === null || _a === void 0 ? void 0 : _a['ui:grid']) === null || _b === void 0 ? void 0 : _b.item) !== null && _c !== void 0 ? _c : (_d = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:grid']) === null || _d === void 0 ? void 0 : _d[element.name]) !== null && _e !== void 0 ? _e : (_f = uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:grid']) === null || _f === void 0 ? void 0 : _f.item) !== null && _g !== void 0 ? _g : {}), { children: element.content }), index));
|
|
14
|
+
}), canExpand(schema, uiSchema, formData) && (_jsx(Grid, { container: true, justifyContent: "flex-end", children: _jsx(Grid, { item: true, children: _jsx(AddButton, { className: "object-property-expand", onClick: onAddClick(schema),
|
|
15
15
|
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- If `disabled` is false, we still want to disable the button if `readonly` is true
|
|
16
16
|
disabled: disabled || readonly, uiSchema: uiSchema, registry: registry }) }) }))] }))] }));
|
|
17
17
|
};
|
|
@@ -7,7 +7,7 @@ import { IconButtonWithTracking, Tooltip } from '../../..';
|
|
|
7
7
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
8
8
|
import { faCircleExclamation, faFile, faFileImage, faTrash, faUpload, } from '@fortawesome/free-solid-svg-icons';
|
|
9
9
|
import { useRandomUUID } from '../../../hooks/useRandomUUID';
|
|
10
|
-
import uniq from '
|
|
10
|
+
import { uniq } from '../../../utils/arrays';
|
|
11
11
|
import { token } from '../../../utils/token';
|
|
12
12
|
const restingStyle = {
|
|
13
13
|
borderColor: token('color.border'),
|
|
@@ -16,7 +16,7 @@ const internalWidgets = {
|
|
|
16
16
|
};
|
|
17
17
|
const FormWrapper = styled('div')({
|
|
18
18
|
// Target the Paper component within the array container
|
|
19
|
-
'& .
|
|
19
|
+
'& .field-array .MuiPaper-root.MuiPaper-elevation': {
|
|
20
20
|
boxShadow: 'none',
|
|
21
21
|
},
|
|
22
22
|
});
|
|
@@ -1,22 +1,31 @@
|
|
|
1
|
-
import find from 'lodash/find';
|
|
2
1
|
import { getDataTypeSchema, regexEscape } from './utils';
|
|
3
2
|
import { FULL_TEXT_SLUG, createModelFilter, } from '../components/Filters/SchemaSieve';
|
|
4
3
|
import { isJSONSchema, getRefSchema } from '../schemaOps';
|
|
5
|
-
import findKey from 'lodash/findKey';
|
|
6
4
|
import pick from 'lodash/pick';
|
|
7
5
|
import mapValues from 'lodash/mapValues';
|
|
6
|
+
const findValueByDescription = (obj, description) => {
|
|
7
|
+
return Object.values(obj !== null && obj !== void 0 ? obj : {}).find((property) => typeof property === 'object' &&
|
|
8
|
+
'description' in property &&
|
|
9
|
+
property.description === description);
|
|
10
|
+
};
|
|
11
|
+
const findKeyByDescription = (obj, description) => {
|
|
12
|
+
var _a;
|
|
13
|
+
return (_a = Object.entries(obj !== null && obj !== void 0 ? obj : {}).find(([, value]) => typeof value === 'object' &&
|
|
14
|
+
'description' in value &&
|
|
15
|
+
value.description === description)) === null || _a === void 0 ? void 0 : _a[0];
|
|
16
|
+
};
|
|
8
17
|
const getKeyLabel = (schema) => {
|
|
9
18
|
var _a;
|
|
10
|
-
const s =
|
|
19
|
+
const s = findValueByDescription(schema.properties, 'key');
|
|
11
20
|
return (_a = s === null || s === void 0 ? void 0 : s.title) !== null && _a !== void 0 ? _a : 'key';
|
|
12
21
|
};
|
|
13
22
|
const getValueLabel = (schema) => {
|
|
14
23
|
var _a;
|
|
15
|
-
const s =
|
|
24
|
+
const s = findValueByDescription(schema.properties, 'value');
|
|
16
25
|
return (_a = s === null || s === void 0 ? void 0 : s.title) !== null && _a !== void 0 ? _a : 'value';
|
|
17
26
|
};
|
|
18
|
-
export const isKeyValueObj = (schema) => !!
|
|
19
|
-
!!
|
|
27
|
+
export const isKeyValueObj = (schema) => !!findValueByDescription(schema.properties, 'key') ||
|
|
28
|
+
!!findValueByDescription(schema.properties, 'value');
|
|
20
29
|
export const operators = (s) => {
|
|
21
30
|
return Object.assign({ is: 'is', is_not: 'is not' }, (!isKeyValueObj(s)
|
|
22
31
|
? {
|
|
@@ -73,7 +82,7 @@ const getValueForOperation = (operator, schema, value) => {
|
|
|
73
82
|
? 'value'
|
|
74
83
|
: null;
|
|
75
84
|
const schemaProperty = schemaField
|
|
76
|
-
?
|
|
85
|
+
? findKeyByDescription(schema.properties, schemaField)
|
|
77
86
|
: null;
|
|
78
87
|
// Return the appropriate value format based on the operation type
|
|
79
88
|
return schemaProperty
|
|
@@ -141,8 +150,8 @@ export const createFilter = (field, operator, value, schema) => {
|
|
|
141
150
|
}
|
|
142
151
|
// TODO: this case does not cover complex objects for FULL_TEXT_SLUG
|
|
143
152
|
if (operator === FULL_TEXT_SLUG && schema.properties) {
|
|
144
|
-
const schemaKey =
|
|
145
|
-
const schemaValue =
|
|
153
|
+
const schemaKey = findKeyByDescription(schema.properties, 'key');
|
|
154
|
+
const schemaValue = findKeyByDescription(schema.properties, 'value');
|
|
146
155
|
const properties = [schemaKey, schemaValue]
|
|
147
156
|
.map((key) => key
|
|
148
157
|
? {
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { convertRefSchemeToSchemaPath, getRefSchemeTitle, getRefSchemePrefix, isJSONSchema, parseDescription, parseDescriptionProperty, } from '../schemaOps';
|
|
2
|
-
import isEmpty from 'lodash/isEmpty';
|
|
3
2
|
import get from 'lodash/get';
|
|
4
3
|
const X_FOREIGN_KEY_SCHEMA_SEPARATOR = '___ref_scheme_separator_';
|
|
5
4
|
export const removeFieldsWithNoFilter = (schema) => {
|
|
6
5
|
const processProperties = (properties, parentXNoFilterSet) => {
|
|
6
|
+
var _a;
|
|
7
7
|
if (!properties) {
|
|
8
8
|
return undefined;
|
|
9
9
|
}
|
|
@@ -40,10 +40,10 @@ export const removeFieldsWithNoFilter = (schema) => {
|
|
|
40
40
|
newValue.items = Object.assign(Object.assign({}, value.items), { properties: processProperties(value.items.properties, xNoFilterSet) });
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
|
-
const hasEmptyProperties = newValue.properties &&
|
|
43
|
+
const hasEmptyProperties = newValue.properties && Object.keys(newValue.properties).length === 0;
|
|
44
44
|
const hasEmptyItemsProperties = isJSONSchema(newValue.items) &&
|
|
45
45
|
'properties' in newValue.items &&
|
|
46
|
-
|
|
46
|
+
Object.keys((_a = newValue.items.properties) !== null && _a !== void 0 ? _a : {}).length === 0;
|
|
47
47
|
if (hasEmptyProperties || hasEmptyItemsProperties) {
|
|
48
48
|
continue;
|
|
49
49
|
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as types from './types';
|
|
2
|
-
import uniq from 'lodash/uniq';
|
|
3
2
|
const lenses = Object.values(types);
|
|
4
3
|
// Returns an array of lenses that can be used to render `data`.
|
|
5
4
|
export const getLenses = (data, customLenses) => {
|
|
@@ -8,7 +7,7 @@ export const getLenses = (data, customLenses) => {
|
|
|
8
7
|
}
|
|
9
8
|
const concatenatedLenses = lenses.concat(customLenses !== null && customLenses !== void 0 ? customLenses : []);
|
|
10
9
|
const slugs = concatenatedLenses.map((lens) => lens.slug);
|
|
11
|
-
if (slugs.length >
|
|
10
|
+
if (slugs.length > new Set(slugs).size) {
|
|
12
11
|
throw new Error('Lenses must have unique slugs');
|
|
13
12
|
}
|
|
14
13
|
return concatenatedLenses;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { useTranslation } from '../../../../hooks/useTranslations';
|
|
4
4
|
import { getDataModel, getPropertySchemaAndModel } from '../../DataTypes';
|
|
@@ -15,28 +15,26 @@ import { DialogWithCloseButton } from '../../../DialogWithCloseButton';
|
|
|
15
15
|
import { RJSForm } from '../../../Form';
|
|
16
16
|
const ArrayFieldTemplate = ({ items, canAdd, onAddClick, }) => {
|
|
17
17
|
const { t } = useTranslation();
|
|
18
|
-
return (
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
},
|
|
39
|
-
}, children: [children, _jsx(Box, { display: "flex", width: "50px", alignItems: "center", justifyContent: "center", children: index !== 0 && (_jsx(IconButton, { "aria-label": t('actions.remove_filter'), onClick: buttonsProps.onRemoveItem, sx: { mt: 2 }, className: "rjsf-array-item-remove", children: _jsx(FontAwesomeIcon, { icon: faTimes }) })) })] })] }, itemKey));
|
|
18
|
+
return (_jsx(_Fragment, { children: items === null || items === void 0 ? void 0 : items.map((element, index) => {
|
|
19
|
+
return (_jsxs(Box, { children: [index > 0 && (_jsx(Typography, { sx: {
|
|
20
|
+
width: 'calc(100% - 50px)',
|
|
21
|
+
textAlign: 'center',
|
|
22
|
+
fontWeight: 'bold',
|
|
23
|
+
}, children: t('commons.or').toUpperCase() })), _jsxs(Box, { sx: {
|
|
24
|
+
display: 'flex',
|
|
25
|
+
'& .form-group.field.field-object': {
|
|
26
|
+
display: 'flex',
|
|
27
|
+
flex: 1,
|
|
28
|
+
},
|
|
29
|
+
'& label': {
|
|
30
|
+
display: 'none',
|
|
31
|
+
},
|
|
32
|
+
// This is necessary to remove the gap of Tags label. RJSF render nested objects with multi label levels.
|
|
33
|
+
'.MuiGrid-root > .form-group.field.field-object > .MuiFormControl-root > .MuiGrid-root.MuiGrid-container.MuiGrid-spacing-xs-2': {
|
|
34
|
+
marginTop: '-8px!important',
|
|
35
|
+
},
|
|
36
|
+
}, children: [element.children, _jsx(Box, { display: "flex", width: "50px", alignItems: "center", justifyContent: "center", children: index !== 0 && (_jsx(IconButton, { "aria-label": t('actions.remove_filter'), onClick: element.onDropIndexClick(element.index), sx: { mt: 2 }, children: _jsx(FontAwesomeIcon, { icon: faTimes }) })) })] }), _jsx(Box, { display: "flex", my: 2, children: canAdd && index === items.length - 1 && (_jsx(Button, { "aria-label": t('aria_labels.add_filter_in_or'), variant: "text", color: "primary", onClick: onAddClick, startIcon: _jsx(FontAwesomeIcon, { icon: faPlus }), children: t('actions.add_alternative') })) })] }, element.key));
|
|
37
|
+
}) }));
|
|
40
38
|
};
|
|
41
39
|
const widgets = {
|
|
42
40
|
CheckboxWidget: SelectWidget,
|
|
@@ -153,9 +151,9 @@ export const FiltersDialog = ({ schema, data = initialFormData, onClose, }) => {
|
|
|
153
151
|
},
|
|
154
152
|
uiSchema: {
|
|
155
153
|
'ui:grid': {
|
|
156
|
-
field: {
|
|
157
|
-
operator: {
|
|
158
|
-
value: {
|
|
154
|
+
field: { xs: 4, sm: 4 },
|
|
155
|
+
operator: { xs: 4, sm: 4 },
|
|
156
|
+
value: { xs: 4, sm: 4 },
|
|
159
157
|
},
|
|
160
158
|
field: {
|
|
161
159
|
'ui:readonly': true,
|
|
@@ -177,12 +175,11 @@ export const FiltersDialog = ({ schema, data = initialFormData, onClose, }) => {
|
|
|
177
175
|
}));
|
|
178
176
|
const uiSchema = {
|
|
179
177
|
'ui:ArrayFieldTemplate': ArrayFieldTemplate,
|
|
180
|
-
'ui:ArrayFieldItemTemplate': ArrayFieldItemTemplate,
|
|
181
178
|
items: {
|
|
182
179
|
'ui:grid': {
|
|
183
|
-
field: {
|
|
184
|
-
operator: {
|
|
185
|
-
value: {
|
|
180
|
+
field: { xs: 4, sm: 4 },
|
|
181
|
+
operator: { xs: 4, sm: 4 },
|
|
182
|
+
value: { xs: 4, sm: 4 },
|
|
186
183
|
},
|
|
187
184
|
value: {},
|
|
188
185
|
},
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { useMemo, useState } from 'react';
|
|
3
3
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
4
4
|
import { faPlus } from '@fortawesome/free-solid-svg-icons/faPlus';
|
|
5
|
-
import uniq from '
|
|
5
|
+
import { uniq } from '../../../../utils/arrays';
|
|
6
6
|
import { useQuery } from '@tanstack/react-query';
|
|
7
7
|
import { Stack } from '@mui/material';
|
|
8
8
|
export function useTagActions(rjstContext, data) {
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import get from 'lodash/get';
|
|
3
3
|
import invokeMap from 'lodash/invokeMap';
|
|
4
|
-
import isArray from 'lodash/isArray';
|
|
5
4
|
import { UiOption, JsonTypes, widgetFactory, formatTimestamp } from '../utils';
|
|
6
5
|
import { Truncate } from '../../../../Truncate';
|
|
7
6
|
import { Typography } from '@mui/material';
|
|
@@ -36,7 +35,7 @@ const TxtWidget = widgetFactory('Txt', [
|
|
|
36
35
|
variant: UiOption.string,
|
|
37
36
|
})(({ value, schema, uiSchema }) => {
|
|
38
37
|
var _a;
|
|
39
|
-
let displayValue = isArray(value)
|
|
38
|
+
let displayValue = Array.isArray(value)
|
|
40
39
|
? getArrayValue(value, uiSchema)
|
|
41
40
|
: value === null || value === void 0 ? void 0 : value.toString();
|
|
42
41
|
if (DATE_TIME_FORMATS.includes((_a = schema === null || schema === void 0 ? void 0 : schema.format) !== null && _a !== void 0 ? _a : '')) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
2
|
+
import { toArray } from '../../../../utils/arrays';
|
|
3
3
|
import { JsonTypes } from './utils';
|
|
4
4
|
import { typeWidgets } from './Formats';
|
|
5
5
|
import { getSchemaFormat, getSubSchemaFromRefScheme } from '../../schemaOps';
|
|
@@ -38,7 +38,7 @@ export const Widget = ({ value, resource, schema = {}, extraFormats, uiSchema, }
|
|
|
38
38
|
}
|
|
39
39
|
const processedValue = getValue(value, schema, uiSchema);
|
|
40
40
|
const subSchema = getSubSchemaFromRefScheme(schema);
|
|
41
|
-
const types = (subSchema === null || subSchema === void 0 ? void 0 : subSchema.type) != null ?
|
|
41
|
+
const types = (subSchema === null || subSchema === void 0 ? void 0 : subSchema.type) != null ? toArray(subSchema.type) : [];
|
|
42
42
|
if (processedValue == null && !types.includes(JsonTypes.null)) {
|
|
43
43
|
return null;
|
|
44
44
|
}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import isEmpty from 'lodash/isEmpty';
|
|
2
1
|
import { rjstJsonSchemaPick } from '../schemaOps';
|
|
3
2
|
export const rjstDefaultPermissions = {
|
|
4
3
|
read: [],
|
|
@@ -10,7 +9,7 @@ export const rjstRunTransformers = (data, transformers, context) => {
|
|
|
10
9
|
if (!data) {
|
|
11
10
|
return data;
|
|
12
11
|
}
|
|
13
|
-
if (!transformers ||
|
|
12
|
+
if (!transformers || Object.keys(transformers).length === 0) {
|
|
14
13
|
return data;
|
|
15
14
|
}
|
|
16
15
|
const transformEntry = (entry) => {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { getPropertyScheme } from './schemaOps';
|
|
2
|
-
import
|
|
2
|
+
import { toArray } from '../../utils/arrays';
|
|
3
3
|
import get from 'lodash/get';
|
|
4
4
|
import { JsonTypes } from './components/Widget/utils';
|
|
5
5
|
export const DEFAULT_ITEMS_PER_PAGE = 50;
|
|
@@ -119,7 +119,7 @@ const sortFn = (a, b, ref) => {
|
|
|
119
119
|
return diff(aa, bb);
|
|
120
120
|
};
|
|
121
121
|
export const getSortingFunction = (schemaKey, schemaValue) => {
|
|
122
|
-
const types =
|
|
122
|
+
const types = toArray(schemaValue.type);
|
|
123
123
|
const refScheme = getPropertyScheme(schemaValue);
|
|
124
124
|
const splitRefScheme = (refScheme === null || refScheme === void 0 ? void 0 : refScheme[0]) ? splitPath(refScheme[0]) : null;
|
|
125
125
|
if (types.includes(JsonTypes.string)) {
|
|
@@ -1,8 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import find from 'lodash/find';
|
|
4
|
-
import startsWith from 'lodash/startsWith';
|
|
5
|
-
import isEmpty from 'lodash/isEmpty';
|
|
6
3
|
import { Button, Stack, TextField, Typography } from '@mui/material';
|
|
7
4
|
import { Callout } from '../Callout';
|
|
8
5
|
import { useTranslation } from '../../hooks/useTranslations';
|
|
@@ -13,7 +10,7 @@ const RESERVED_NAMESPACES = ['io.resin.', 'io.balena.'];
|
|
|
13
10
|
const newTagValidationRules = (t, key, existingTags) => {
|
|
14
11
|
return [
|
|
15
12
|
{
|
|
16
|
-
test: () => !key
|
|
13
|
+
test: () => !key,
|
|
17
14
|
message: t('fields_errors.tag_name_cannot_be_empty'),
|
|
18
15
|
},
|
|
19
16
|
{
|
|
@@ -21,7 +18,7 @@ const newTagValidationRules = (t, key, existingTags) => {
|
|
|
21
18
|
message: t('fields_errors.tag_names_cannot_contain_whitespace'),
|
|
22
19
|
},
|
|
23
20
|
{
|
|
24
|
-
test: () => RESERVED_NAMESPACES.some((reserved) => startsWith(
|
|
21
|
+
test: () => RESERVED_NAMESPACES.some((reserved) => key.startsWith(reserved)),
|
|
25
22
|
message: t(`fields_errors.some_tag_keys_are_reserved`, {
|
|
26
23
|
namespace: RESERVED_NAMESPACES.join(', '),
|
|
27
24
|
}),
|
|
@@ -53,9 +50,7 @@ export const AddTagForm = ({ itemType, existingTags, overridableTags = [], addTa
|
|
|
53
50
|
return hasErrors;
|
|
54
51
|
};
|
|
55
52
|
const checkTagOverwrites = async () => {
|
|
56
|
-
const overridableTag = find(
|
|
57
|
-
tag_key: tagKey,
|
|
58
|
-
});
|
|
53
|
+
const overridableTag = overridableTags.find((tag) => tag.tag_key === tagKey);
|
|
59
54
|
if (!overridableTag) {
|
|
60
55
|
return true;
|
|
61
56
|
}
|
|
@@ -5,7 +5,6 @@ import { faUndo } from '@fortawesome/free-solid-svg-icons/faUndo';
|
|
|
5
5
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
6
6
|
import { AddTagForm } from './AddTagForm';
|
|
7
7
|
import sortBy from 'lodash/sortBy';
|
|
8
|
-
import toString from 'lodash/toString';
|
|
9
8
|
import { faPencilAlt } from '@fortawesome/free-solid-svg-icons/faPencilAlt';
|
|
10
9
|
import { getResourceTagSubmitInfo, groupResourcesByTags, } from './tag-management-service';
|
|
11
10
|
import partition from 'lodash/partition';
|
|
@@ -186,9 +185,10 @@ export const TagManagementDialog = ({ items, itemType, titleField, tagField, can
|
|
|
186
185
|
setTags(tags.slice());
|
|
187
186
|
};
|
|
188
187
|
const getItemTitle = (item) => {
|
|
188
|
+
var _a;
|
|
189
189
|
const title = typeof titleField === 'function'
|
|
190
190
|
? titleField(item)
|
|
191
|
-
:
|
|
191
|
+
: `${(_a = item[titleField]) !== null && _a !== void 0 ? _a : ''}`;
|
|
192
192
|
return title || `(${t('no_data.no_name_set')})`;
|
|
193
193
|
};
|
|
194
194
|
return (_jsxs(DialogWithCloseButton, { open: true, title: _jsxs(Stack, { children: [_jsxs(Typography, { variant: "h3", mt: 0, mb: 10, children: [items.length > 1 && _jsxs("span", { children: [t('labels.shared'), " "] }), t('labels.tags')] }), _jsx(CollectionSummary, { items: items.map(getItemTitle).sort(), itemsType: t('resource.' + itemType, { count: items.length }), maxVisibleItemCount: 10 })] }), children: [_jsxs(DialogContent, { children: [_jsx(AddTagForm, { itemType: itemType, existingTags: tags, overridableTags: partialTags, addTag: addTag, t: t }), _jsxs(Table, { children: [_jsxs(TableHead, { children: [_jsx(TableCell, {}), _jsx(TableCell, { children: t('labels.tag_name') }), _jsx(TableCell, { children: t('labels.value') }), _jsx(TableCell, {})] }), _jsx(TableBody, { children: !tags.length ? (_jsxs(TableRow, { children: [_jsx(TableCell, {}), _jsx(TableCell, { children: t(`errors.no_tags_for_selected_itemtype`, {
|
|
@@ -1,12 +1,9 @@
|
|
|
1
|
-
import keys from 'lodash/keys';
|
|
2
|
-
import flatMap from 'lodash/flatMap';
|
|
3
|
-
import map from 'lodash/map';
|
|
4
1
|
import groupBy from 'lodash/groupBy';
|
|
5
2
|
export const TAGS_COLUMN_KEY = 'Tags';
|
|
6
3
|
export const getTagKeyValueComposite = (tagKey, value) => `${tagKey}: ${value}`;
|
|
7
4
|
export const getResourceTags = (item, tagField) => { var _a; return ((_a = (tagField in item ? item[tagField] : null)) !== null && _a !== void 0 ? _a : []); };
|
|
8
5
|
export const groupResourcesByTags = (items, tagField) => {
|
|
9
|
-
const resourceTagInfos = flatMap(
|
|
6
|
+
const resourceTagInfos = items.flatMap((item) => {
|
|
10
7
|
const tags = getResourceTags(item, tagField);
|
|
11
8
|
return tags.map((tag) => ({
|
|
12
9
|
tag_key_value: getTagKeyValueComposite(tag.tag_key, tag.value),
|
|
@@ -16,13 +13,15 @@ export const groupResourcesByTags = (items, tagField) => {
|
|
|
16
13
|
}));
|
|
17
14
|
});
|
|
18
15
|
const tagsByTagKeyValue = groupBy(resourceTagInfos, 'tag_key_value');
|
|
19
|
-
const tagsWithItems =
|
|
16
|
+
const tagsWithItems = Object.keys(tagsByTagKeyValue)
|
|
17
|
+
.sort()
|
|
18
|
+
.map((tagKeyValue) => {
|
|
20
19
|
const tags = tagsByTagKeyValue[tagKeyValue];
|
|
21
20
|
const firstTag = tags[0];
|
|
22
21
|
return {
|
|
23
22
|
tag_key: firstTag.tag_key,
|
|
24
23
|
value: firstTag.value,
|
|
25
|
-
items: map(
|
|
24
|
+
items: tags.map((tag) => tag.item),
|
|
26
25
|
};
|
|
27
26
|
});
|
|
28
27
|
return tagsWithItems;
|
package/dist/index.d.ts
CHANGED
|
@@ -92,5 +92,6 @@ export * as MaterialDataGrid from '@mui/x-data-grid';
|
|
|
92
92
|
export { enqueueSnackbar, closeSnackbar } from 'notistack';
|
|
93
93
|
export { useRandomUUID } from './hooks/useRandomUUID';
|
|
94
94
|
export { token } from './utils/token';
|
|
95
|
+
export { uniq, toArray } from './utils/arrays';
|
|
95
96
|
export * as designTokens from '@balena/design-tokens';
|
|
96
97
|
export * as ReactQuery from '@tanstack/react-query';
|
package/dist/index.js
CHANGED
|
@@ -53,5 +53,6 @@ export * as MaterialDataGrid from '@mui/x-data-grid';
|
|
|
53
53
|
export { enqueueSnackbar, closeSnackbar } from 'notistack';
|
|
54
54
|
export { useRandomUUID } from './hooks/useRandomUUID';
|
|
55
55
|
export { token } from './utils/token';
|
|
56
|
+
export { uniq, toArray } from './utils/arrays';
|
|
56
57
|
export * as designTokens from '@balena/design-tokens';
|
|
57
58
|
export * as ReactQuery from '@tanstack/react-query';
|
package/dist/theme.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { PaletteColorOptions, TypographyStyle } from '@mui/material';
|
|
2
|
+
import type { TypographyStyleOptions } from '@mui/material/styles/createTypography';
|
|
2
3
|
import type { ColorTokens, ShapeTokens, SpacingTokens, TypographyTokens } from '@balena/design-tokens';
|
|
3
4
|
import { type IconDefinition } from '@fortawesome/free-solid-svg-icons';
|
|
4
5
|
export type Severity = 'info' | 'success' | 'warning' | 'danger';
|
|
@@ -44,16 +45,16 @@ declare module '@mui/material/styles' {
|
|
|
44
45
|
codeSm: TypographyStyle;
|
|
45
46
|
}
|
|
46
47
|
interface TypographyVariantsOptions {
|
|
47
|
-
bodyLg:
|
|
48
|
-
body:
|
|
49
|
-
bodySm:
|
|
50
|
-
titleLg:
|
|
51
|
-
title:
|
|
52
|
-
titleSm:
|
|
53
|
-
display:
|
|
54
|
-
codeLg:
|
|
55
|
-
code:
|
|
56
|
-
codeSm:
|
|
48
|
+
bodyLg: TypographyStyleOptions | undefined;
|
|
49
|
+
body: TypographyStyleOptions | undefined;
|
|
50
|
+
bodySm: TypographyStyleOptions | undefined;
|
|
51
|
+
titleLg: TypographyStyleOptions | undefined;
|
|
52
|
+
title: TypographyStyleOptions | undefined;
|
|
53
|
+
titleSm: TypographyStyleOptions | undefined;
|
|
54
|
+
display: TypographyStyleOptions | undefined;
|
|
55
|
+
codeLg: TypographyStyleOptions | undefined;
|
|
56
|
+
code: TypographyStyleOptions | undefined;
|
|
57
|
+
codeSm: TypographyStyleOptions | undefined;
|
|
57
58
|
}
|
|
58
59
|
interface TypeText {
|
|
59
60
|
primary: string;
|
package/dist/theme.js
CHANGED
|
@@ -1152,7 +1152,7 @@ export const theme = createTheme({
|
|
|
1152
1152
|
},
|
|
1153
1153
|
},
|
|
1154
1154
|
},
|
|
1155
|
-
|
|
1155
|
+
MuiGrid2: {
|
|
1156
1156
|
// We should only apply this spacing to Grid components with `container`
|
|
1157
1157
|
// But MUI does not currently support that for defaultProps
|
|
1158
1158
|
// See: https://github.com/mui/material-ui/issues/34812
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@balena/ui-shared-components",
|
|
3
|
-
"version": "15.2.3-build-
|
|
3
|
+
"version": "15.2.3-build-drop-some-lodash-for-native-alternatives-9e9fabf4a86078fc34348c4aac2a6320be175a84-1",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"files": [
|
|
@@ -18,15 +18,15 @@
|
|
|
18
18
|
"@emotion/styled": "^11.10.6",
|
|
19
19
|
"@fortawesome/free-solid-svg-icons": "^7.1.0",
|
|
20
20
|
"@fortawesome/react-fontawesome": "^3.1.0",
|
|
21
|
-
"@mui/lab": "
|
|
22
|
-
"@mui/material": "^
|
|
23
|
-
"@mui/styled-engine-sc": "^
|
|
24
|
-
"@mui/x-data-grid": "^7.
|
|
21
|
+
"@mui/lab": "6.0.0-beta.24",
|
|
22
|
+
"@mui/material": "^6.3.1",
|
|
23
|
+
"@mui/styled-engine-sc": "^6.3.1",
|
|
24
|
+
"@mui/x-data-grid": "^7.23.5",
|
|
25
25
|
"@react-google-maps/api": "^2.18.1",
|
|
26
|
-
"@rjsf/core": "^
|
|
27
|
-
"@rjsf/mui": "^
|
|
28
|
-
"@rjsf/utils": "^
|
|
29
|
-
"@rjsf/validator-ajv8": "^
|
|
26
|
+
"@rjsf/core": "^5.24.1",
|
|
27
|
+
"@rjsf/mui": "^5.24.1",
|
|
28
|
+
"@rjsf/utils": "^5.24.1",
|
|
29
|
+
"@rjsf/validator-ajv8": "^5.24.1",
|
|
30
30
|
"@tanstack/react-query": "^5.64.2",
|
|
31
31
|
"@types/jest": "^29.5.14",
|
|
32
32
|
"ajv": "^8.17.1",
|
|
@@ -45,7 +45,6 @@
|
|
|
45
45
|
"react-dom": "^18.2.0",
|
|
46
46
|
"react-dropzone": "^14.2.3",
|
|
47
47
|
"react-helmet": "^6.1.0",
|
|
48
|
-
"react-is": "^18.2.0",
|
|
49
48
|
"react-markdown": "^10.0.0",
|
|
50
49
|
"react-router-dom": "^6.28.0",
|
|
51
50
|
"remark-breaks": "^4.0.0",
|
|
@@ -135,10 +134,9 @@
|
|
|
135
134
|
},
|
|
136
135
|
"homepage": "https://github.com/balena-io/ui-shared-components#readme",
|
|
137
136
|
"versionist": {
|
|
138
|
-
"publishedAt": "2025-11-
|
|
137
|
+
"publishedAt": "2025-11-11T19:21:40.926Z"
|
|
139
138
|
},
|
|
140
139
|
"overrides": {
|
|
141
|
-
"storybook": "$storybook"
|
|
142
|
-
"react-is": "^18.2.0"
|
|
140
|
+
"storybook": "$storybook"
|
|
143
141
|
}
|
|
144
142
|
}
|