npm - @orchestrator-ui/orchestrator-ui-components - Versions diffs - 4.2.0 → 5.1.0 - Mend

@orchestrator-ui/orchestrator-ui-components 4.2.0 → 5.1.0

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.

Files changed (44) hide show

package/.turbo/turbo-build.log +8 -8
package/.turbo/turbo-lint.log +1 -1
package/.turbo/turbo-test.log +6 -6
package/CHANGELOG.md +26 -0
package/dist/index.d.ts +2115 -336
package/dist/index.js +2147 -1670
package/dist/index.js.map +1 -1
package/package.json +2 -2
package/src/components/WfoBadges/WfoSubscriptionStatusBadge/WfoSubscriptionStatusBadge.tsx +6 -5
package/src/components/WfoBadges/WfoWorkflowTargetBadge/WfoWorkflowTargetBadge.tsx +1 -0
package/src/components/WfoButtonComboBox/WfoButtonComboBox.tsx +79 -0
package/src/components/WfoButtonComboBox/index.ts +1 -0
package/src/components/WfoButtonComboBox/styles.ts +28 -0
package/src/components/WfoForms/formFields/SubscriptionSummaryField.tsx +1 -1
package/src/components/WfoForms/formFields/commonStyles.ts +2 -0
package/src/components/WfoForms/formFields/index.ts +1 -0
package/src/components/WfoPydanticForm/Footer.tsx +75 -34
package/src/components/WfoPydanticForm/Row.tsx +2 -2
package/src/components/WfoPydanticForm/WfoPydanticForm.tsx +99 -8
package/src/components/WfoPydanticForm/fields/Checkbox.tsx +22 -0
package/src/components/WfoPydanticForm/fields/Divider.tsx +17 -0
package/src/components/WfoPydanticForm/fields/Label.tsx +23 -0
package/src/components/WfoPydanticForm/fields/Summary.tsx +125 -0
package/src/components/WfoPydanticForm/fields/Text.tsx +28 -0
package/src/components/WfoPydanticForm/fields/index.ts +5 -0
package/src/components/WfoSubscription/WfoInSyncField.tsx +2 -2
package/src/components/WfoSubscription/WfoSubscription.tsx +3 -2
package/src/components/WfoSubscription/WfoSubscriptionActions/WfoSubscriptionActions.tsx +3 -3
package/src/components/WfoSubscription/WfoSubscriptionDetailTree.tsx +64 -14
package/src/components/WfoSubscription/utils/utils.spec.ts +121 -0
package/src/components/WfoSubscription/utils/utils.ts +42 -6
package/src/configuration/version.ts +1 -1
package/src/contexts/TreeContext.tsx +16 -0
package/src/icons/WfoExclamationTriangle.tsx +29 -0
package/src/icons/index.ts +1 -0
package/src/messages/en-GB.json +2 -0
package/src/messages/nl-NL.json +2 -0
package/src/pages/metadata/WfoTasksPage.tsx +11 -26
package/src/pages/metadata/WfoWorkflowsPage.tsx +11 -12
package/src/rtk/endpoints/index.ts +1 -0
package/src/rtk/endpoints/metadata/tasks.ts +9 -4
package/src/rtk/endpoints/metadata/workflows.ts +10 -5
package/src/rtk/endpoints/startOptions.ts +9 -3
package/src/types/types.ts +7 -3

package/src/components/WfoPydanticForm/fields/Summary.tsx ADDED Viewed

@@ -0,0 +1,125 @@
+import React from 'react';
+import type { PydanticFormElement } from 'pydantic-forms';
+import { EuiFlexItem, EuiFormRow, EuiText } from '@elastic/eui';
+import { tint } from '@elastic/eui';
+import { css } from '@emotion/react';
+import type { WfoTheme } from '@orchestrator-ui/orchestrator-ui-components';
+import { getCommonFormFieldStyles } from '@/components/WfoForms/formFields/commonStyles';
+import { useWithOrchestratorTheme } from '@/hooks';
+export const getStyles = ({ theme }: WfoTheme) => {
+    const toShadeColor = (color: string) => tint(color, 0.9);
+    const summaryFieldStyle = css({
+        'div.emailMessage': {
+            td: {
+                color: theme.colors.text,
+            },
+            p: {
+                color: theme.colors.text,
+            },
+            html: {
+                marginLeft: '-10px',
+            },
+        },
+        'section.table-summary': {
+            marginTop: '20px',
+            width: '100%',
+            td: {
+                padding: '10px',
+                verticalAlign: 'top',
+            },
+            'td:not(:first-child):not(:last-child)': {
+                borderRight: `1px solid ${theme.colors.lightestShade}`,
+            },
+            '.label': {
+                fontWeight: 'bold',
+                color: theme.colors.lightestShade,
+                backgroundColor: theme.colors.primary,
+                borderRight: `2px solid ${theme.colors.lightestShade}`,
+                borderBottom: `1px solid ${theme.colors.lightestShade}`,
+            },
+            '.value': {
+                backgroundColor: toShadeColor(theme.colors.primary),
+                borderBottom: `1px solid ${theme.colors.lightestShade}`,
+            },
+        },
+    });
+    return {
+        summaryFieldStyle: summaryFieldStyle,
+    };
+};
+export const Summary: PydanticFormElement = ({ pydanticFormField }) => {
+    const { summaryFieldStyle } = useWithOrchestratorTheme(getStyles);
+    const { formRowStyle } = useWithOrchestratorTheme(getCommonFormFieldStyles);
+    const { id, title, description } = pydanticFormField;
+    const uniforms = pydanticFormField.schema.uniforms;
+    const summaryData = uniforms?.data as unknown as {
+        headers: string[][];
+        labels: string[];
+        columns: string[][];
+    };
+    const headers = summaryData?.headers as string[][];
+    const labels = summaryData?.labels as string[];
+    const columns = summaryData?.columns || [];
+    const extraColumnsData = columns.filter((_, index) => index !== 0);
+    const rows = columns[0].map((row, index) => (
+        <tr key={index}>
+            {labels && <td className={`label`}>{labels[index]}</td>}
+            <td className={`value`}>
+                {typeof row === 'string' && row.includes('<!doctype html>') ? (
+                    <div
+                        className="emailMessage"
+                        dangerouslySetInnerHTML={{ __html: row }}
+                    ></div>
+                ) : (
+                    row
+                )}
+            </td>
+            {extraColumnsData &&
+                extraColumnsData.map((_, idx) => (
+                    <td className={`value`} key={idx}>
+                        {extraColumnsData[idx][index]}
+                    </td>
+                ))}
+        </tr>
+    ));
+    const tableHeader =
+        !headers || headers.length === 0 ? null : (
+            <tr>
+                {labels && <th />}
+                {headers.map((header, idx) => (
+                    <th key={idx}>{header}</th>
+                ))}
+            </tr>
+        );
+    return (
+        <EuiFlexItem css={[summaryFieldStyle, formRowStyle]}>
+            <section>
+                <EuiFormRow
+                    label={description}
+                    labelAppend={<EuiText size="m">{title}</EuiText>}
+                    id={id}
+                    fullWidth
+                >
+                    <section className="table-summary">
+                        <table id={`${id}-table`}>
+                            <thead>{tableHeader}</thead>
+                            <tbody>{rows}</tbody>
+                        </table>
+                    </section>
+                </EuiFormRow>
+            </section>
+        </EuiFlexItem>
+    );
+};

package/src/components/WfoPydanticForm/fields/Text.tsx ADDED Viewed

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { PydanticFormControlledElement } from 'pydantic-forms';
+import { EuiFieldText } from '@elastic/eui';
+import { useWithOrchestratorTheme } from '@/hooks';
+import { getFormFieldsBaseStyle } from '@/theme';
+export const Text: PydanticFormControlledElement = ({
+    onChange,
+    value,
+    disabled,
+}) => {
+    const { formFieldBaseStyle } = useWithOrchestratorTheme(
+        getFormFieldsBaseStyle,
+    );
+    return (
+        <EuiFieldText
+            css={formFieldBaseStyle}
+            disabled={disabled}
+            onChange={(event) => onChange(event.target.value)}
+            value={value ?? ''}
+            fullWidth
+        />
+    );
+};

package/src/components/WfoPydanticForm/fields/index.ts CHANGED Viewed

@@ -1 +1,6 @@
 export * from './TextArea';
+export * from './Text';
+export * from './Label';
+export * from './Divider';
+export * from './Checkbox';
+export * from './Summary';

package/src/components/WfoSubscription/WfoInSyncField.tsx CHANGED Viewed

@@ -26,10 +26,10 @@ export const WfoInSyncField = ({ subscriptionDetail }: WfoInSyncFieldProps) => {
     const { theme } = useOrchestratorTheme();
     const [inSync, setInSync] = useState<boolean>(subscriptionDetail.insync);
     const lastTaskRunDate = getLatestTaskDate(
-        subscriptionDetail.processes.page,
+        subscriptionDetail.processes?.page,
     );
     const lastUncompletedProcess = getLastUncompletedProcess(
-        subscriptionDetail.processes.page,
+        subscriptionDetail?.processes?.page,
     );
     const [setSubscriptionInSync, { isLoading }] =
         useSetSubscriptionInSyncMutation();

package/src/components/WfoSubscription/WfoSubscription.tsx CHANGED Viewed

@@ -102,10 +102,11 @@ export const WfoSubscription = ({ subscriptionId }: WfoSubscriptionProps) => {
                             />
                         )}
                         {selectedTab === SubscriptionDetailTab.PROCESSES_TAB &&
-                            data && (
+                            data &&
+                            subscriptionDetail.processes?.page && (
                                 <WfoProcessesTimeline
                                     subscriptionDetailProcesses={
-                                        subscriptionDetail.processes.page
+                                        subscriptionDetail.processes?.page
                                     }
                                 />
                             )}

package/src/components/WfoSubscription/WfoSubscriptionActions/WfoSubscriptionActions.tsx CHANGED Viewed

@@ -238,16 +238,16 @@ export const WfoSubscriptionActions: FC<WfoSubscriptionActionsProps> = ({
                             PolicyResource.SUBSCRIPTION_VALIDATE +
                                 subscriptionId,
                         ) &&
-                        subscriptionActions.system && (
+                        subscriptionActions.validate && (
                             <>
                                 <MenuBlock title={t('tasks')}></MenuBlock>
-                                {subscriptionActions.system.map(
+                                {subscriptionActions.validate.map(
                                     (action, index) => (
                                         <MenuItem
                                             key={`s_${index}`}
                                             action={action}
                                             index={index}
-                                            target={WorkflowTarget.SYSTEM}
+                                            target={WorkflowTarget.VALIDATE}
                                             isTask={true}
                                         />
                                     ),

package/src/components/WfoSubscription/WfoSubscriptionDetailTree.tsx CHANGED Viewed

@@ -2,9 +2,22 @@ import React, { useState } from 'react';
 import { useTranslations } from 'next-intl';
-import { EuiCallOut, EuiFlexGroup, EuiFlexItem, EuiText } from '@elastic/eui';
+import {
+    EuiCallOut,
+    EuiFlexGroup,
+    EuiFlexItem,
+    EuiSelectableOption,
+    EuiText,
+} from '@elastic/eui';
+import { EuiSelectableOptionCheckedType } from '@elastic/eui/src/components/selectable/selectable_option';
-import { PATH_SUBSCRIPTIONS, WfoLoading, WfoTextAnchor } from '@/components';
+import {
+    PATH_SUBSCRIPTIONS,
+    WfoLoading,
+    WfoTextAnchor,
+    mapProductBlockInstancesToEuiSelectableOptions,
+} from '@/components';
+import { WfoButtonComboBox } from '@/components/WfoButtonComboBox';
 import { TreeContext, TreeContextType } from '@/contexts';
 import { useOrchestratorTheme, useWithOrchestratorTheme } from '@/hooks';
 import {
@@ -21,6 +34,8 @@ import { WfoSubscriptionProductBlock } from './WfoSubscriptionProductBlock';
 import { getSubscriptionDetailStyles } from './styles';
 import { getProductBlockTitle } from './utils';
+const EUI_OPTION_CHECKED_STATE_ON: EuiSelectableOptionCheckedType = 'on';
 interface WfoSubscriptionDetailTreeProps {
     productBlockInstances: ProductBlockInstance[];
     subscriptionId: Subscription['subscriptionId'];
@@ -38,8 +53,14 @@ export const WfoSubscriptionDetailTree = ({
     const { productBlockTreeWidth } = useWithOrchestratorTheme(
         getSubscriptionDetailStyles,
     );
-    const { selectedIds, expandAll, collapseAll, resetSelection, selectAll } =
-        React.useContext(TreeContext) as TreeContextType;
+    const {
+        selectedIds,
+        expandAll,
+        resetSelection,
+        selectAll,
+        selectIds,
+        deselectIds,
+    } = React.useContext(TreeContext) as TreeContextType;
     let tree: TreeBlock | null = null;
     const depthList: number[] = [];
@@ -99,7 +120,6 @@ export const WfoSubscriptionDetailTree = ({
     const toggleShowAll = () => {
         if (selectedIds.length === productBlockInstances.length) {
             resetSelection();
-            collapseAll();
         } else {
             selectAll();
             expandAll();
@@ -130,6 +150,18 @@ export const WfoSubscriptionDetailTree = ({
     const headerHeight = 265; // The height of the header part of the page that needs to be subtracted from 100vh to fit the page
+    const handleOptionChange = (changedOption: EuiSelectableOption) => {
+        if (changedOption.data?.ids === undefined) {
+            return;
+        }
+        const { checked, data } = changedOption;
+        const shouldAddIds = checked === EUI_OPTION_CHECKED_STATE_ON;
+        expandAll();
+        return shouldAddIds ? selectIds(data.ids) : deselectIds(data.ids);
+    };
     return (
         <EuiFlexGroup
             css={{
@@ -158,15 +190,33 @@ export const WfoSubscriptionDetailTree = ({
                                 </EuiText>
                             </EuiFlexItem>
                             <EuiFlexItem grow={false}>
-                                <WfoTextAnchor
-                                    text={t(
-                                        selectedIds.length ===
-                                            productBlockInstances.length
-                                            ? 'hideAll'
-                                            : 'showAll',
-                                    )}
-                                    onClick={toggleShowAll}
-                                />
+                                <EuiFlexGroup>
+                                    <WfoTextAnchor
+                                        text={t(
+                                            selectedIds.length ===
+                                                productBlockInstances.length
+                                                ? 'hideAll'
+                                                : 'showAll',
+                                        )}
+                                        onClick={toggleShowAll}
+                                    />
+                                    <WfoButtonComboBox
+                                        options={mapProductBlockInstancesToEuiSelectableOptions(
+                                            productBlockInstances,
+                                        )}
+                                        onOptionChange={handleOptionChange}
+                                        title={t('selectByNameTitle')}
+                                    >
+                                        {(togglePopover) => (
+                                            <WfoTextAnchor
+                                                text={t(
+                                                    'selectByNameButtonText',
+                                                )}
+                                                onClick={togglePopover}
+                                            />
+                                        )}
+                                    </WfoButtonComboBox>
+                                </EuiFlexGroup>
                             </EuiFlexItem>
                         </EuiFlexGroup>
                     </EuiFlexItem>

package/src/components/WfoSubscription/utils/utils.spec.ts CHANGED Viewed

@@ -3,6 +3,7 @@ import { EuiThemeComputed } from '@elastic/eui';
 import {
     FieldValue,
     ProcessStatus,
+    ProductBlockInstance,
     SubscriptionAction,
     SubscriptionDetailProcess,
     WorkflowTarget,
@@ -15,6 +16,7 @@ import {
     getProductBlockTitle,
     getWorkflowTargetColor,
     getWorkflowTargetIconContent,
+    mapProductBlockInstancesToEuiSelectableOptions,
 } from './utils';
 describe('getFieldFromProductBlockInstanceValues()', () => {
@@ -347,3 +349,122 @@ describe('getLatestTaskDate', () => {
         expect(lastTaskDate).toBe('2021-04-01T00:00:00Z');
     });
 });
+describe('mapProductBlockInstancesToEuiSelectableOptions', () => {
+    const baseProductBlockInstance: Omit<
+        ProductBlockInstance,
+        'id' | 'productBlockInstanceValues'
+    > = {
+        subscriptionInstanceId: '',
+        parent: null,
+        inUseByRelations: [],
+        subscription: {
+            subscriptionId: '',
+            description: '',
+        },
+    };
+    it('maps product block instances to EuiSelectableOptions', () => {
+        // Given
+        const productBlockInstances: ProductBlockInstance[] = [
+            {
+                ...baseProductBlockInstance,
+                id: 0,
+                productBlockInstanceValues: [
+                    {
+                        field: 'name',
+                        value: 'test1',
+                    },
+                ],
+            },
+            {
+                ...baseProductBlockInstance,
+                id: 1,
+                productBlockInstanceValues: [
+                    {
+                        field: 'name',
+                        value: 'test2',
+                    },
+                ],
+            },
+        ];
+        // When
+        const result = mapProductBlockInstancesToEuiSelectableOptions(
+            productBlockInstances,
+        );
+        // Then
+        expect(result).toEqual([
+            {
+                label: 'test1',
+                data: {
+                    ids: [0],
+                },
+            },
+            {
+                label: 'test2',
+                data: {
+                    ids: [1],
+                },
+            },
+        ]);
+    });
+    it('maps product block instances to EuiSelectableOptions and groups ids by name', () => {
+        // Given
+        const productBlockInstances: ProductBlockInstance[] = [
+            {
+                ...baseProductBlockInstance,
+                id: 0,
+                productBlockInstanceValues: [
+                    {
+                        field: 'name',
+                        value: 'test1',
+                    },
+                ],
+            },
+            {
+                ...baseProductBlockInstance,
+                id: 1,
+                productBlockInstanceValues: [
+                    {
+                        field: 'name',
+                        value: 'test2',
+                    },
+                ],
+            },
+            {
+                ...baseProductBlockInstance,
+                id: 2,
+                productBlockInstanceValues: [
+                    {
+                        field: 'name',
+                        value: 'test1',
+                    },
+                ],
+            },
+        ];
+        // When
+        const result = mapProductBlockInstancesToEuiSelectableOptions(
+            productBlockInstances,
+        );
+        // Then
+        expect(result).toEqual([
+            {
+                label: 'test1',
+                data: {
+                    ids: [0, 2],
+                },
+            },
+            {
+                label: 'test2',
+                data: {
+                    ids: [1],
+                },
+            },
+        ]);
+    });
+});

package/src/components/WfoSubscription/utils/utils.ts CHANGED Viewed

@@ -1,16 +1,20 @@
 import { TranslationValues } from 'next-intl';
-import { EuiThemeComputed } from '@elastic/eui';
+import { EuiSelectableOption, EuiThemeComputed } from '@elastic/eui';
 import {
     FieldValue,
     ProcessStatus,
+    ProductBlockDefinition,
+    ProductBlockInstance,
     SortOrder,
     SubscriptionAction,
     SubscriptionDetailProcess,
     WorkflowTarget,
 } from '@/types';
+const PRODUCT_BLOCK_NAME_FIELD: keyof ProductBlockDefinition = 'name';
 export enum SubscriptionDetailTab {
     GENERAL_TAB = 'general',
     SERVICE_CONFIGURATION_TAB = 'service-configuration',
@@ -68,6 +72,7 @@ export const getWorkflowTargetColor = (
         case WorkflowTarget.MODIFY:
             return theme.colors.primaryText;
         case WorkflowTarget.SYSTEM:
+        case WorkflowTarget.VALIDATE:
             return theme.colors.warning;
         case WorkflowTarget.TERMINATE:
             return theme.colors.danger;
@@ -84,6 +89,7 @@ export const getWorkflowTargetIconContent = (
         case WorkflowTarget.CREATE:
             return 'C';
         case WorkflowTarget.SYSTEM:
+        case WorkflowTarget.VALIDATE:
             return 'T';
         case WorkflowTarget.TERMINATE:
             return 'X';
@@ -93,9 +99,9 @@ export const getWorkflowTargetIconContent = (
 };
 export const getLastUncompletedProcess = (
-    processes: SubscriptionDetailProcess[],
+    processes?: SubscriptionDetailProcess[],
 ): SubscriptionDetailProcess | undefined => {
-    if (processes.length === 0) {
+    if (!processes || processes.length === 0) {
         return;
     }
@@ -107,13 +113,13 @@ export const getLastUncompletedProcess = (
             return dateB.getTime() - dateA.getTime();
         });
-    return uncompletedProcesses.length > 0
+    return (uncompletedProcesses && uncompletedProcesses.length) > 0
         ? uncompletedProcesses[0]
         : undefined;
 };
-export const getLatestTaskDate = (processes: SubscriptionDetailProcess[]) => {
-    if (processes.length === 0) {
+export const getLatestTaskDate = (processes?: SubscriptionDetailProcess[]) => {
+    if (!processes || processes.length === 0) {
         return '';
     }
@@ -143,3 +149,33 @@ export const sortProcessesByDate = (
         }
     });
 };
+export const mapProductBlockInstancesToEuiSelectableOptions = (
+    productBlockInstances: ProductBlockInstance[],
+): EuiSelectableOption[] => {
+    const items2Map = productBlockInstances.reduce((acc, curr) => {
+        const name = getFieldFromProductBlockInstanceValues(
+            curr.productBlockInstanceValues,
+            PRODUCT_BLOCK_NAME_FIELD,
+        ).toString();
+        if (!name) {
+            console.error('Name field is missing', curr);
+        }
+        if (acc.has(name)) {
+            acc.get(name)?.push(curr.id);
+        } else {
+            acc.set(name, [curr.id]);
+        }
+        return acc;
+    }, new Map<string, number[]>());
+    return Array.from(items2Map).map(([label, ids]) => ({
+        label,
+        data: {
+            ids,
+        },
+    }));
+};

package/src/configuration/version.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export const ORCHESTRATOR_UI_LIBRARY_VERSION = '4.2.0';
1	+ export const ORCHESTRATOR_UI_LIBRARY_VERSION = '5.1.0';

package/src/contexts/TreeContext.tsx CHANGED Viewed

@@ -12,6 +12,8 @@ export type TreeContextType = {
     collapseAll: () => void;
     resetSelection: () => void;
     selectAll: () => void;
+    selectIds: (ids: number[]) => void;
+    deselectIds: (ids: number[]) => void;
 };
 export const TreeContext = React.createContext<TreeContextType | null>(null);
@@ -39,6 +41,18 @@ export const TreeProvider: React.FC<TreeProviderProps> = ({ children }) => {
         setSelectedIds(Array.from(Array(depths.length).keys()));
     };
+    const selectIds = (ids: number[]) => {
+        setSelectedIds((prevSelectedIds) =>
+            Array.from(new Set([...prevSelectedIds, ...ids])),
+        );
+    };
+    const deselectIds = (ids: number[]) => {
+        setSelectedIds((prevSelectedIds) =>
+            prevSelectedIds.filter((id) => !ids.includes(id)),
+        );
+    };
     const expandAll = () => {
         setExpandedIds(Array.from(Array(depths.length).keys()));
     };
@@ -96,6 +110,8 @@ export const TreeProvider: React.FC<TreeProviderProps> = ({ children }) => {
                 collapseAll,
                 resetSelection,
                 selectAll,
+                selectIds,
+                deselectIds,
             }}
         >
             {children}

package/src/icons/WfoExclamationTriangle.tsx ADDED Viewed

@@ -0,0 +1,29 @@
+import React, { FC } from 'react';
+import { WfoIconProps } from './WfoIconProps';
+export const WfoExclamationTriangle: FC<WfoIconProps> = ({
+    width = 24,
+    height = 24,
+    color = '#000000',
+}) => (
+    <svg
+        width={width}
+        height={height}
+        viewBox="0 0 24 24"
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        color={color}
+    >
+        <title>icon/exclamation-circle</title>
+        <g id="Symbols" strokeWidth="1.5" fill="currentColor">
+            <g id="icon/exclamation-triangle" fill="currentColor">
+                <path
+                    fillRule="evenodd"
+                    d="M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495ZM10 5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 10 5Zm0 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+                    clipRule="evenodd"
+                />
+            </g>
+        </g>
+    </svg>
+);

package/src/icons/index.ts CHANGED Viewed

@@ -39,3 +39,4 @@ export * from './WfoActualWork';
 export * from './WfoMalfunction';
 export * from './WfoPlannedWork';
 export * from './WfoCubeFill';
+export * from './WfoExclamationTriangle';

package/src/messages/en-GB.json CHANGED Viewed

@@ -363,6 +363,8 @@
             },
             "showAll": "Show all",
             "hideAll": "Hide all",
+            "selectByNameTitle": "Select product blocks by name",
+            "selectByNameButtonText": "Select by name",
             "see": "See",
             "setInSync": "Set in Sync",
             "setInSyncQuestion": "Are you sure you want to do this? You're about to force a subscription in sync. When it's clear why the subscription is out of sync this could enable you to start or finish a change on this subscription. When you're in doubt, please consult the network automators first as running workflows on subscriptions that are not in sync can potentially do great harm to the network.",

package/src/messages/nl-NL.json CHANGED Viewed

@@ -360,6 +360,8 @@
             },
             "showAll": "Toon alles",
             "hideAll": "Verberg alles",
+            "selectByNameTitle": "Selecteer product blocks op naam",
+            "selectByNameButtonText": "Selecteer op naam",
             "see": "Bekijk",
             "setInSync": "Set in Sync",
             "setInSyncQuestion": "Weet je zeker dat je de subscription in-sync wilt zetten? Je gaat een subscription geforceerd in-sync zetten. Alleen als je zeker weet wat de reden is van out-of-sync kun je de actie uitvoeren, zodat je daarna wijzigingen kunt doorvoeren op deze subscription. Bij twijfel - check eerst bij de network automators of het in sync zetten van de subscription mogelijk schadelijke gevolgen kan hebben op het netwerk.",