orc-shared 5.9.0-dev.8 → 5.10.0-dev.1

package/src/components/MaterialUI/MenuButtons.js

@@ -0,0 +1,106 @@
+import React from "react";
+import { makeStyles } from "@material-ui/core/styles";
+import Menu from "@material-ui/core/Menu";
+import MenuItem from "@material-ui/core/MenuItem";
+import Divider from "./DataDisplay/Divider";
+import DividerProps from "./DataDisplay/dividerProps";
+import Icon from "./DataDisplay/Icon";
+import Button from "@material-ui/core/Button";
+
+const useMenuStyles = makeStyles(theme => ({
+	menuItem: {
+		fontFamily: theme.typography.fontFamily,
+		textTransform: "none",
+		color: theme.palette.text.primary,
+		borderRadius: 0,
+		"&:hover": {
+			borderRadius: 0,
+			boxShadow: "none",
+			backgroundColor: theme.palette.primary.light,
+		},
+		"&:focus, &:active, &.Mui-focusVisible": {
+			borderRadius: 0,
+			boxShadow: "none",
+			outline: "none",
+		},
+	},
+	menu: {
+		border: `${theme.spacing(0.1)} solid ${theme.palette.primary.main}`,
+	},
+	arrowIcon: {
+		width: theme.spacing(1),
+		height: theme.spacing(1),
+	},
+}));
+
+const StyledMenu = props => {
+	const classes = useMenuStyles();
+
+	return (
+		<Menu
+			elevation={0}
+			getContentAnchorEl={null}
+			anchorOrigin={{
+				vertical: "bottom",
+				horizontal: "left",
+			}}
+			transformOrigin={{
+				vertical: "top",
+				horizontal: "left",
+			}}
+			classes={{ paper: classes.menu }}
+			{...props}
+		/>
+	);
+};
+
+const MenuButton = ({ options, label }) => {
+	const [anchorEl, setAnchorEl] = React.useState(null);
+	const classes = useMenuStyles();
+
+	const handleClick = event => {
+		setAnchorEl(event.currentTarget);
+	};
+
+	const handleClose = () => {
+		setAnchorEl(null);
+	};
+
+	const dividerProps = new DividerProps();
+	dividerProps.set(DividerProps.propNames.light, true);
+	dividerProps.set(DividerProps.propNames.variant, "middle");
+	const allDisabled = options?.every(o => o.disabled) ?? true;
+	return (
+		<>
+			<Button
+				aria-haspopup="true"
+				variant="outlined"
+				color="primary"
+				disabled={allDisabled}
+				onClick={handleClick}
+				endIcon={<Icon id="chevron-down" className={classes.arrowIcon} />}
+			>
+				{label}
+			</Button>
+			<StyledMenu anchorEl={anchorEl} open={Boolean(anchorEl)} onClose={handleClose}>
+				{options?.map(({ key, component, disabled, action }, index) => (
+					<div key={key}>
+						<MenuItem
+							onClick={() => {
+								handleClose();
+								action?.();
+							}}
+							disabled={disabled}
+							classes={{ root: classes.menuItem }}
+						>
+							{component}
+						</MenuItem>
+						{index < options.length - 1 && <Divider dividerProps={dividerProps} />}
+					</div>
+				))}
+			</StyledMenu>
+		</>
+	);
+};
+
+export default MenuButton;

package/src/components/MaterialUI/MenuButtons.test.js

@@ -0,0 +1,74 @@
+import React from "react";
+import MenuButton from "./MenuButtons";
+import Button from "@material-ui/core/Button";
+import Menu from "@material-ui/core/Menu";
+import Icon from "./DataDisplay/Icon";
+import sinon from "sinon";
+import ReactDOM from "react-dom";
+
+describe("MenuButton", () => {
+	it("Renders MenuButton with no options", () => {
+		const menuItems = [
+			{
+				disabled: true,
+			},
+			{
+				disabled: true,
+			},
+		];
+
+		const component = <MenuButton label={<p>Label</p>} options={menuItems} />;
+
+		const expected = (
+			<>
+				<Button disabled={true} variant="outlined" color="primary" endIcon={<Icon id="chevron-down" />}>
+					<p>Label</p>
+				</Button>
+				<Menu open={false}></Menu>
+			</>
+		);
+
+		expect(component, "when mounted", "to satisfy", expected);
+	});
+
+	it("Renders MenuButton with all options disabled", () => {
+		const component = <MenuButton label={<p>Label</p>} />;
+
+		const expected = (
+			<>
+				<Button disabled={true} variant="outlined" color="primary" endIcon={<Icon id="chevron-down" />}>
+					<p>Label</p>
+				</Button>
+				<Menu open={false}></Menu>
+			</>
+		);
+
+		expect(component, "when mounted", "to satisfy", expected);
+	});
+
+	it("Call option set in menu item", () => {
+		const menuItems = [
+			{
+				action: sinon.spy().named("action"),
+			},
+		];
+
+		const container = document.createElement("div");
+		document.body.appendChild(container);
+		ReactDOM.render(<MenuButton options={menuItems} />, container);
+
+		const clickEvent = new MouseEvent("click", {
+			bubbles: true,
+			cancelable: false,
+		});
+
+		const button = container.querySelector("button");
+		button.dispatchEvent(clickEvent);
+
+		const items = document.querySelectorAll(".MuiListItem-root");
+		expect(items, "to have length", 1);
+
+		items[0].dispatchEvent(clickEvent);
+		expect(menuItems[0].action, "was called");
+	});
+});

package/src/components/MaterialUI/Navigation/DropDownMenu.js

@@ -47,6 +47,13 @@ const DropDownMenu = ({ payload, menuItems, children, dropDownMenuProps = new Dr
 		setAnchorEl(null);
 	};
 
+	// Even though we do nothing, we need to avoid mouse event propagation when the mouse
+	// button is released after hovering out the menu
+	const onMainMenuClick = event => {
+		event.preventDefault();
+		event.stopPropagation();
+	};
+
 	const onMenuItemClick = (action, itemContext) => event => {
 		onClose(event);
 		action(payload, itemContext);
@@ -76,6 +83,7 @@ const DropDownMenu = ({ payload, menuItems, children, dropDownMenuProps = new Dr
 				classes={{ paper: classes.menu }}
 				id="scope-menu"
 				open={isOpened}
+				onClick={onMainMenuClick}
 				onClose={onClose}
 				autoFocus={autoFocus}
 				anchorEl={anchorEl}

package/src/components/MaterialUI/Navigation/DropDownMenu.test.js

@@ -8,6 +8,7 @@ import Icon from "../DataDisplay/Icon";
 import DropDownMenu from "./DropDownMenu";
 import { ignoreConsoleError } from "../../../utils/testUtils";
 import { TestWrapper, createMuiTheme } from "./../../../utils/testUtils";
+import Menu from "@material-ui/core/Menu";
 
 describe("DropDownMenu", () => {
 	let store, menuItems, container;
@@ -92,4 +93,27 @@ describe("DropDownMenu", () => {
 		expect(menuItems[0].action, "to have calls satisfying", [{ args: [payload, "aContext"] }]);
 		expect(menuItems[1].action, "to have calls satisfying", [{ args: [payload, "myContext"] }]);
 	});
+
+	it("should handle onClick event on the menu", () => {
+		const payload = "payload";
+
+		const component = (
+			<Provider store={store}>
+				<DropDownMenu payload={payload} menuItems={menuItems} />
+			</Provider>
+		);
+
+		const mountedComponent = mount(component);
+
+		const event = {
+			preventDefault: sinon.spy().named("preventDefault"),
+			stopPropagation: sinon.spy().named("stopPropagation"),
+		};
+
+		const dropDownMenu = mountedComponent.find(Menu).at(0);
+		dropDownMenu.invoke("onClick")(event);
+
+		expect(event.preventDefault, "was called");
+		expect(event.stopPropagation, "was called");
+	});
 });

package/src/components/Registry.js

@@ -0,0 +1,42 @@
+import React from "react";
+import InformationItem from "./MaterialUI/DataDisplay/PredefinedElements/InformationItem";
+import sharedMessages from "../sharedMessages";
+import { useIntl } from "react-intl";
+import Box from "@material-ui/core/Box";
+import { makeStyles } from "@material-ui/core/styles";
+
+const useStyles = makeStyles(theme => ({
+	registry: {
+		"& > div + div": {
+			marginTop: theme.spacing(2),
+		},
+	},
+}));
+
+const Registry = ({ dateCreated, createdBy, lastModifiedDate, lastModifiedBy, additionalContent = [] }) => {
+	const { formatDate } = useIntl();
+	const classes = useStyles();
+
+	const created = formatDate(dateCreated);
+	const lastModified = formatDate(lastModifiedDate);
+	0;
+	const registry = (
+		<Box className={classes.registry} display="flex" flexDirection="column">
+			{dateCreated !== undefined && <InformationItem label={sharedMessages.created} children={created} />}
+			{createdBy !== undefined && <InformationItem label={sharedMessages.createdBy} children={createdBy} />}
+			{lastModifiedDate !== undefined && (
+				<InformationItem label={sharedMessages.lastModified} children={lastModified} />
+			)}
+			{lastModifiedBy !== undefined && (
+				<InformationItem label={sharedMessages.lastModifiedBy} children={lastModifiedBy} />
+			)}
+			{additionalContent.map((c, index) => (
+				<InformationItem key={"additional" + index} label={c.label} children={c.content} />
+			))}
+		</Box>
+	);
+
+	return registry;
+};
+
+export default Registry;

package/src/components/Registry.test.js

@@ -0,0 +1,85 @@
+import React from "react";
+import InformationItem from "./MaterialUI/DataDisplay/PredefinedElements/InformationItem";
+import sharedMessages from "~/sharedMessages";
+import Box from "@material-ui/core/Box";
+import Registry from "./Registry";
+import { TestWrapper, createMuiTheme, extractMessages } from "../utils/testUtils";
+
+const messages = extractMessages(sharedMessages);
+const theme = createMuiTheme();
+
+describe("Registry", () => {
+	it("Renders Registry correctly", () => {
+		const created = "2020-10-06T16:21:55.5700000Z";
+		const createdBy = "Somebody";
+		const lastModified = "2020-10-06T16:21:55.5700000Z";
+		const lastModifiedBy = "OOE@oco";
+
+		const component = (
+			<TestWrapper intlProvider={{ messages }} stylesProvider muiThemeProvider={{ theme }}>
+				<Registry
+					dateCreated={created}
+					createdBy={createdBy}
+					lastModifiedDate={lastModified}
+					lastModifiedBy={lastModifiedBy}
+				/>
+			</TestWrapper>
+		);
+
+		const expected = (
+			<TestWrapper intlProvider={{ messages }} stylesProvider muiThemeProvider={{ theme }}>
+				<Box display="flex" flexDirection="column">
+					<InformationItem label={sharedMessages.created} children="10/6/2020" />
+					<InformationItem label={sharedMessages.createdBy} children={createdBy} />
+					<InformationItem label={sharedMessages.lastModified} children="10/6/2020" />
+					<InformationItem label={sharedMessages.lastModifiedBy} children={lastModifiedBy} />
+				</Box>
+			</TestWrapper>
+		);
+
+		expect(component, "when mounted", "to satisfy", expected);
+	});
+
+	it("Renders Registry correctly with additional content", () => {
+		const created = "2020-10-06T16:21:55.5700000Z";
+		const createdBy = "Somebody";
+		const lastModified = "2020-10-06T16:21:55.5700000Z";
+		const lastModifiedBy = "OOE@oco";
+
+		const component = (
+			<TestWrapper intlProvider={{ messages }} stylesProvider muiThemeProvider={{ theme }}>
+				<Registry
+					dateCreated={created}
+					createdBy={createdBy}
+					lastModifiedDate={lastModified}
+					lastModifiedBy={lastModifiedBy}
+					additionalContent={[
+						{
+							label: sharedMessages.about,
+							content: "some date",
+						},
+						{
+							label: sharedMessages.help,
+							content: "Hugh Mann",
+						},
+					]}
+				/>
+			</TestWrapper>
+		);
+
+		const expected = (
+			<TestWrapper intlProvider={{ messages }} stylesProvider muiThemeProvider={{ theme }}>
+				<Box display="flex" flexDirection="column">
+					<InformationItem label={sharedMessages.created} children="10/6/2020" />
+					<InformationItem label={sharedMessages.createdBy} children={createdBy} />
+					<InformationItem label={sharedMessages.lastModified} children="10/6/2020" />
+					<InformationItem label={sharedMessages.lastModifiedBy} children={lastModifiedBy} />
+					<InformationItem label={sharedMessages.about} children={"some date"} />
+					<InformationItem label={sharedMessages.help} children={"Hugh Mann"} />
+				</Box>
+			</TestWrapper>
+		);
+
+		expect(component, "when mounted", "to satisfy", expected);
+	});
+});

package/src/requests

@@ -0,0 +1,34 @@
+createCustomerLookupTypeDefinitionRequest
+createEntityTypeRequest
+createOrderLookupTypeDefinitionRequest
+deleteTaskInfoRequest
+getApplicationModules
+getAuthorizedApplicationsRequest
+getCountriesRequest
+getCustomerDefinitionsRequest
+getCustomerLookupRequest
+getCustomerLookupsRequest
+getOrderDefinitionRequest
+getOrderLookupRequest
+getOrderLookupsRequest
+getProductDefinitionsRequest
+getProductLookupsRequest
+getProfileAttributeGroupsRequest
+getRequesterTasksInfoRequest
+getScopeExtendedConfigurationRequest
+getSupportedCulturesRequest
+getTaskExecutionLogsRequest
+getTaskInfoRequest
+getTimeZonesRequest
+getUserApplicationRequest
+getUserCultureRequest
+getUserPermissionsRequest
+getUserScopeRequest
+getUserScopeTreeRequest
+getVersionInfoRequest
+saveUserApplicationRequest
+saveUserCultureRequest
+signOutRequest
+updateCustomerLookupTypeDefinitionRequest
+updateEntityTypeRequest
+updateOrderLookupTypeDefinitionRequest

package/src/sharedMessages.js

@@ -279,6 +279,26 @@ const sharedMessages = defineMessages({
 		id: "orc-shared.valueTypeWrapperFalse",
 		defaultMessage: "False",
 	},
+	registry: {
+		id: "orc-shared.registry",
+		defaultMessage: "Registry",
+	},
+	created: {
+		id: "orc-shared.created",
+		defaultMessage: "Date Created",
+	},
+	createdBy: {
+		id: "orc-shared.createdBy",
+		defaultMessage: "Created By",
+	},
+	lastModified: {
+		id: "orc-shared.lastModified",
+		defaultMessage: "Last Modified",
+	},
+	lastModifiedBy: {
+		id: "orc-shared.lastModifiedBy",
+		defaultMessage: "Last Modified By",
+	},
 });
 
 export default sharedMessages;

package/src/translations/en-US.json

@@ -14,6 +14,8 @@
 	"orc-shared.confirmation": "Confirmation",
 	"orc-shared.copyright": "© {year} Orckestra Technologies Inc.",
 	"orc-shared.copyrightTermsNotice": "This computer program is protected by copyright laws and international treaties. Unauthorized reproduction or redistribution of this program, or any portion of it, may result in severe civil and criminal penalties, and will be prosecuted to the maximum extent possible under the law. Orckestra is a trademark of Orckestra Technologies Inc. All other trademarks are property of the respective owners.",
+	"orc-shared.created": "Date Created",
+	"orc-shared.createdBy": "Created By",
 	"orc-shared.dataTypeBoolean": "Yes/No Choice",
 	"orc-shared.dataTypeDate": "Date/Calendar",
 	"orc-shared.dataTypeDecimal": "Decimal Number",
@@ -37,6 +39,8 @@
 	"orc-shared.inactive": "Inactive",
 	"orc-shared.internetExplorerWarningContent": "You are using a browser that we no longer support. For a better experience with our HTML web applications, we recommend you to use the latest version of one of the following browsers:",
 	"orc-shared.internetExplorerWarningTitle": "Improve your experience",
+	"orc-shared.lastModified": "Last Modified",
+	"orc-shared.lastModifiedBy": "Last Modified By",
 	"orc-shared.needToRefresh": "You are not authorized to execute a request. Click refresh to reload the application.",
 	"orc-shared.next": "Next",
 	"orc-shared.no": "No",
@@ -46,6 +50,7 @@
 	"orc-shared.orcSharedVersion": "Orc-Shared Framework {version}",
 	"orc-shared.preferences": "Preferences",
 	"orc-shared.refresh": "Refresh",
+	"orc-shared.registry": "Registry",
 	"orc-shared.remove": "Remove",
 	"orc-shared.save": "Save",
 	"orc-shared.scopeChangeWithOpenedTabsConfirmation": "One or more entities opened will be closed. Would you like to change scope now?",

package/src/translations/fr-CA.json

@@ -14,6 +14,8 @@
 	"orc-shared.confirmation": "Confirmation",
 	"orc-shared.copyright": "© {year} Technologies Orckestra Inc.",
 	"orc-shared.copyrightTermsNotice": "Avertissement: Ce programme est protégé par la loi relative au droit d'auteur et par les conventions internationales. Toute reproduction ou distribution partielle ou totale du logiciel, par quelque moyen que ce soit, est strictement interdite. Toute personne ne respectant pas ces dispositions se rendra coupable du délit de contrefaçon et sera passible des sanctions pénales prévues par la loi. Orckestra est une marque de commerce déposée et détenue par Technologies Orckestra Inc. Toutes les autres marques de commerce sont la propriété de leurs détenteurs respectifs.",
+	"orc-shared.created": "Date de création",
+	"orc-shared.createdBy": "Créé par",
 	"orc-shared.dataTypeBoolean": "Choix Oui/Non",
 	"orc-shared.dataTypeDate": "Date/Calendrier",
 	"orc-shared.dataTypeDecimal": "Nombre décimal",
@@ -37,6 +39,8 @@
 	"orc-shared.inactive": "Inactif",
 	"orc-shared.internetExplorerWarningContent": "Vous utilisez un navigateur qui n'est plus supporté. Pour assurer une expérience optimale de nos applications web HTML, nous vous recommendons d'utiliser la dernière version des navigateurs suivants:",
 	"orc-shared.internetExplorerWarningTitle": "Améliorez votre expérience",
+	"orc-shared.lastModified": "Dernière date de modification",
+	"orc-shared.lastModifiedBy": "Modifié par",
 	"orc-shared.needToRefresh": "Vous n'êtes pas autorisé à effectuer une requête. Veuillez cliquer sur Rafraîchir pour rafraîchir l’application.",
 	"orc-shared.next": "Suivant",
 	"orc-shared.no": "Non",
@@ -46,6 +50,7 @@
 	"orc-shared.orcSharedVersion": "Infrastructure Orc-Shared {version}",
 	"orc-shared.preferences": "Préférences",
 	"orc-shared.refresh": "Rafraîchir",
+	"orc-shared.registry": "Régistre",
 	"orc-shared.remove": "Retirer",
 	"orc-shared.save": "Sauvegarder",
 	"orc-shared.scopeChangeWithOpenedTabsConfirmation": "Une ou plusieurs entités ouvertes seront fermées. Voulez-vous vraiment changer de Scope?",

package/src/utils/propertyBagHelper.js

@@ -18,6 +18,8 @@ export const customDataType = {
 	carrierProviderSelector: "CarrierProviderSelector",
 	routingProviderSelector: "RoutingProviderSelector",
 	multipleCarrierProvidersSelector: "MultipleCarrierProvidersSelector",
+	serviceLevelSelector: "ServiceLevelSelector",
+	percentageDecimal: "PercentageDecimal",
 };
 
 const tieredAttributeTypes = [customDataType.priceTieredRateTable, customDataType.quantityTieredRateTable];
@@ -72,14 +74,16 @@ export const toJsonCargo = (attribute, value) => {
 				case customDataType.money:
 					return createJsonCargo(jsonCargoType.double, Number(formatNumber(value, 2)));
 				case customDataType.moneyDecimal:
+				case customDataType.percentageDecimal:
 					return createJsonCargo(jsonCargoType.decimal, Number(formatNumber(value, 2)));
 				case customDataType.priceTieredRateTable:
 				case customDataType.quantityTieredRateTable:
 					return createTieredTableJsonCargo(value);
 				case customDataType.password:
-				case customDataType.carrierProviderSelector: // To be properly handled when user story 61801 will be addressed
-				case customDataType.routingProviderSelector: // To be properly handled when user story 61801 will be addressed
-				case customDataType.multipleCarrierProvidersSelector: // To be properly handled when user story 61801 will be addressed
+				case customDataType.carrierProviderSelector:
+				case customDataType.routingProviderSelector:
+				case customDataType.multipleCarrierProvidersSelector:
+				case customDataType.serviceLevelSelector:
 					return value;
 				default:
 					throw new Error(`toJsonCargo: attribute.customDataType ${attribute.customDataType} is not implemented`);