LPD-48899 Add CX and Fragment types to app table

is-solutions-delivery · Feb 28, 2025 · 5fbc137 · 5fbc137
1 parent 55d8c2f
commit 5fbc137
Show file tree

Hide file tree

Showing 15 changed files with 108 additions and 59 deletions.
diff --git a/...etplace-workspace/client-extensions/liferay-marketplace-custom-element/src/enums/Order.ts b/...etplace-workspace/client-extensions/liferay-marketplace-custom-element/src/enums/Order.ts
@@ -15,12 +15,24 @@ export enum ORDER_CUSTOM_FIELDS {
 
 export enum ORDER_TYPES {
 	ADDONS = 'ADDONS',
-	DXPAPP = 'DXPAPP',
+	CLIENT_EXTENSION = 'CLIENT_EXTENSION',
 	CLOUDAPP = 'CLOUDAPP',
+	DXPAPP = 'DXPAPP',
+	FRAGMENT = 'FRAGMENT',
 	SOLUTIONS7 = 'SOLUTIONS7',
 	SOLUTIONS30 = 'SOLUTIONS30',
 }
 
+export const ORDER_TYPES_LABELS: {[key: string]: string} = {
+	[ORDER_TYPES.ADDONS]: 'Add-Ons',
+	[ORDER_TYPES.CLIENT_EXTENSION]: 'Client Extension',
+	[ORDER_TYPES.CLOUDAPP]: 'Cloud',
+	[ORDER_TYPES.DXPAPP]: 'DXP',
+	[ORDER_TYPES.FRAGMENT]: 'Fragment',
+	[ORDER_TYPES.SOLUTIONS7]: 'Solutions 7',
+	[ORDER_TYPES.SOLUTIONS30]: 'Solutions 30',
+};
+
 export enum ORDER_WORKFLOW_STATUS_CODE {
 	CANCELLED = 8,
 	COMPLETED = 0,

diff --git a/...ace-workspace/client-extensions/liferay-marketplace-custom-element/src/enums/OrderType.ts b/...ace-workspace/client-extensions/liferay-marketplace-custom-element/src/enums/OrderType.ts
diff --git a/...e-workspace/client-extensions/liferay-marketplace-custom-element/src/enums/ProductType.ts b/...e-workspace/client-extensions/liferay-marketplace-custom-element/src/enums/ProductType.ts
@@ -4,7 +4,15 @@
  */
 
 export enum ProductType {
+	CLIENT_EXTENSION = 'client-extension',
 	CLOUD = 'cloud',
 	DXP = 'dxp',
-	FRAGMENTS = 'fragments',
+	FRAGMENT = 'fragment',
 }
+
+export const ProductTypeLabels: {[key: string]: string} = {
+	[ProductType.CLIENT_EXTENSION]: 'Client Extension',
+	[ProductType.CLOUD]: 'Cloud',
+	[ProductType.DXP]: 'DXP',
+	[ProductType.FRAGMENT]: 'Fragment',
+};
diff --git a/...feray-marketplace-custom-element/src/pages/AdministratorDashboard/pages/Metrics/index.tsx b/...feray-marketplace-custom-element/src/pages/AdministratorDashboard/pages/Metrics/index.tsx
@@ -45,8 +45,10 @@ const Metrics = () => {
 			HeadlessCommerceAdminOrderImpl.getOrders(
 				new URLSearchParams({
 					filter: SearchBuilder.in('orderTypeExternalReferenceCode', [
+						ORDER_TYPES.CLIENT_EXTENSION,
 						ORDER_TYPES.CLOUDAPP,
 						ORDER_TYPES.DXPAPP,
+						ORDER_TYPES.FRAGMENT,
 					]),
 					nestedFields: 'account,orderItems',
 					pageSize: '30',

diff --git a/...e-custom-element/src/pages/CustomerDashboard/components/OrderDetailsStatusDescription.tsx b/...e-custom-element/src/pages/CustomerDashboard/components/OrderDetailsStatusDescription.tsx
@@ -8,7 +8,7 @@ import classNames from 'classnames';
 
 import purchasedAppIcon from '../../../assets/icons/purchased_app_icon.svg';
 import OrderStatus from '../../../components/OrderStatus';
-import {OrderType} from '../../../enums/OrderType';
+import {ORDER_TYPES} from '../../../enums/Order';
 
 enum OrderAppTypeEnum {
 	DXPAPP = 'DXP APP',
@@ -21,11 +21,11 @@ type OrderDetailsStatusDescriptionProps = {
 };
 
 const getOrderDetailsType = (orderTypeExternalReferenceCode: string) => {
-	if (orderTypeExternalReferenceCode === OrderType.DXP) {
+	if (orderTypeExternalReferenceCode === ORDER_TYPES.DXPAPP) {
 		return OrderAppTypeEnum.DXPAPP;
 	}
 
-	if (orderTypeExternalReferenceCode === OrderType.CLOUD) {
+	if (orderTypeExternalReferenceCode === ORDER_TYPES.CLOUDAPP) {
 		return OrderAppTypeEnum.CLOUDAPP;
 	}
 };

diff --git a/...-marketplace-custom-element/src/pages/CustomerDashboard/components/PurchasedAppsTable.tsx b/...-marketplace-custom-element/src/pages/CustomerDashboard/components/PurchasedAppsTable.tsx
@@ -14,8 +14,7 @@ import OrderStatus, {
 } from '../../../components/OrderStatus';
 import Table from '../../../components/Table/Table';
 import {Analytics} from '../../../core/Analytics';
-import {ORDER_TYPES} from '../../../enums/Order';
-import {OrderType} from '../../../enums/OrderType';
+import {ORDER_TYPES, ORDER_TYPES_LABELS} from '../../../enums/Order';
 import {PRODUCT_IMAGE_FALLBACK_CATEGORIES} from '../../../enums/Product';
 import i18n from '../../../i18n';
 import {getProductImageFallback} from '../../../utils/productUtils';
@@ -91,10 +90,11 @@ const AppsTable: React.FC<AppsTableProps> = ({items}) => {
 				},
 				{
 					key: 'orderTypeExternalReferenceCode',
-					render: (orderTypeExternalReferenceCode) =>
-						orderTypeExternalReferenceCode === OrderType.DXP
-							? 'DXP'
-							: 'Cloud',
+					render: (orderTypeExternalReferenceCode) => {
+						return ORDER_TYPES_LABELS[
+							orderTypeExternalReferenceCode
+						];
+					},
 					title: i18n.translate('app-type'),
 				},
 				{
@@ -165,7 +165,7 @@ const AppsTable: React.FC<AppsTableProps> = ({items}) => {
 
 									<ClayDropDown.ItemList>
 										{orderTypeExternalReferenceCode ===
-											OrderType.DXP &&
+											ORDER_TYPES.DXPAPP &&
 											!isFreeApp && (
 												<>
 													<ClayTooltipProvider>
@@ -224,7 +224,7 @@ const AppsTable: React.FC<AppsTableProps> = ({items}) => {
 										)}
 
 										{orderTypeExternalReferenceCode ===
-											OrderType.DXP && (
+											ORDER_TYPES.DXPAPP && (
 											<ClayTooltipProvider>
 												<ClayDropDown.Item
 													data-tooltip-align="left"

diff --git a/...feray-marketplace-custom-element/src/pages/CustomerDashboard/pages/Apps/App/AppOutlet.tsx b/...feray-marketplace-custom-element/src/pages/CustomerDashboard/pages/Apps/App/AppOutlet.tsx
@@ -14,8 +14,10 @@ import {
 
 import Navbar, {NavbarProps} from '../../../../../components/Navbar';
 import {PageRenderer} from '../../../../../components/Page';
-import {ORDER_WORKFLOW_STATUS_CODE} from '../../../../../enums/Order';
-import {OrderType} from '../../../../../enums/OrderType';
+import {
+	ORDER_TYPES,
+	ORDER_WORKFLOW_STATUS_CODE,
+} from '../../../../../enums/Order';
 import useGetProductByOrderId from '../../../../../hooks/useGetProductByOrderId';
 import i18n from '../../../../../i18n';
 import getProductPriceModel from '../../../../GetApp/utils/getProductPriceModel';
@@ -113,7 +115,7 @@ const AppOutlet = () => {
 
 				if (
 					placedOrder.orderTypeExternalReferenceCode ===
-					OrderType.CLOUD
+					ORDER_TYPES.CLOUDAPP
 				) {
 					const isDownloadableCloud =
 						product?.productSpecifications.some((specification) => {
@@ -144,7 +146,8 @@ const AppOutlet = () => {
 				}
 
 				if (
-					placedOrder.orderTypeExternalReferenceCode === OrderType.DXP
+					placedOrder.orderTypeExternalReferenceCode ===
+					ORDER_TYPES.DXPAPP
 				) {
 					return [
 						...tabs,

diff --git a/...rketplace-custom-element/src/pages/CustomerDashboard/pages/Apps/App/Licenses/Licenses.tsx b/...rketplace-custom-element/src/pages/CustomerDashboard/pages/Apps/App/Licenses/Licenses.tsx
@@ -20,7 +20,6 @@ import {Statuses as OrderStatuses} from '../../../../../../components/OrderStatu
 import StatusCell from '../../../../../../components/Table/StatusCell';
 import Table from '../../../../../../components/Table/Table';
 import {useMarketplaceContext} from '../../../../../../context/MarketplaceContext';
-import {OrderType} from '../../../../../../enums/OrderType';
 import useGetProductByOrderId from '../../../../../../hooks/useGetProductByOrderId';
 import i18n from '../../../../../../i18n';
 import provisioningOAuth2 from '../../../../../../services/oauth/Provisioning';
@@ -33,6 +32,7 @@ import TitleSubtitleHeader from '../../../../components/TitleSubtitleHeader';
 import useLicenseActions from './useLicensesActions';
 
 import './Licenses.scss';
+import {ORDER_TYPES} from '../../../../../../enums/Order';
 
 type OutletContext = ReturnType<typeof useGetProductByOrderId>;
 
@@ -61,7 +61,7 @@ const Licenses = () => {
 	const product = outletContext?.product;
 
 	const keyType =
-		placedOrder?.orderTypeExternalReferenceCode === OrderType.DXP
+		placedOrder?.orderTypeExternalReferenceCode === ORDER_TYPES.DXPAPP
 			? 'On-Premise'
 			: 'Cloud';
 

diff --git a/...sions/liferay-marketplace-custom-element/src/pages/CustomerDashboard/pages/Apps/index.tsx b/...sions/liferay-marketplace-custom-element/src/pages/CustomerDashboard/pages/Apps/index.tsx
@@ -10,6 +10,7 @@ import {useState} from 'react';
 import {DashboardPage} from '../../../../components/DashBoardPage/DashboardPage';
 import {DashboardEmptyTable} from '../../../../components/DashboardTable/DashboardEmptyTable';
 import Page from '../../../../components/Page';
+import {ORDER_TYPES} from '../../../../enums/Order';
 import {Liferay} from '../../../../liferay/liferay';
 import {getSiteURL} from '../../../../utils/site';
 import {useCustomerDashboardOutletContext} from '../../CustomerDashboardOutlet';
@@ -27,7 +28,12 @@ const Apps = () => {
 	} = usePurchasedOrders({
 		accountId: selectedAccount?.id as number,
 		channelId: Number(Liferay.CommerceContext.commerceChannelId),
-		orderTypeExternalReferenceCodes: ['CLOUDAPP', 'DXPAPP'],
+		orderTypeExternalReferenceCodes: [
+			ORDER_TYPES.CLIENT_EXTENSION,
+			ORDER_TYPES.CLOUDAPP,
+			ORDER_TYPES.DXPAPP,
+			ORDER_TYPES.FRAGMENT,
+		],
 		page,
 		pageSize: 10,
 	});

diff --git a/...ensions/liferay-marketplace-custom-element/src/pages/GetApp/utils/getProductOrderTypes.ts b/...ensions/liferay-marketplace-custom-element/src/pages/GetApp/utils/getProductOrderTypes.ts
@@ -3,12 +3,20 @@
  * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
  */
 
+import {ProductType} from '../../../enums/ProductType';
+
+const productTypeERC: {[key: string]: {}} = {
+	[ProductType.CLIENT_EXTENSION]: {externalReferenceCode: 'CLIENT_EXTENSION'},
+	[ProductType.CLOUD]: {externalReferenceCode: 'CLOUDAPP'},
+	[ProductType.DXP]: {externalReferenceCode: 'DXPAPP'},
+	[ProductType.FRAGMENT]: {externalReferenceCode: 'FRAGMENT'},
+};
+
 export function getProductOrderTypes(productSpecificationValue: any) {
-	return {
-		externalReferenceCode:
-			productSpecificationValue.toLowerCase() === 'cloud'
-				? 'CLOUDAPP'
-				: 'DXPAPP',
-		name: {},
-	} as OrderType;
+	const productSpecification = productSpecificationValue.toLowerCase();
+
+	return (
+		(productTypeERC[productSpecification] as OrderType) ||
+		({externalReferenceCode: 'NOTYPE'} as OrderType)
+	);
 }
diff --git a/...iferay-marketplace-custom-element/src/pages/GetApp/utils/getProductSpecificationValues.ts b/...iferay-marketplace-custom-element/src/pages/GetApp/utils/getProductSpecificationValues.ts
@@ -6,10 +6,11 @@
 export function getProductSpecificationValues(
 	productSpecifications: DeliveryProductSpecification[]
 ) {
-	const productSpecification = productSpecifications.find(
-		({value}) =>
-			value.toLowerCase() === 'cloud' || value.toLowerCase() === 'dxp'
-	) as DeliveryProductSpecification;
+	const validValues = ['client-extension', 'cloud', 'dxp', 'fragment'];
+
+	const productSpecification = productSpecifications.find(({value}) => {
+		return validValues.includes(value.toLowerCase());
+	}) as DeliveryProductSpecification;
 
 	return productSpecification?.value ?? '';
 }
diff --git a/...ray-marketplace-custom-element/src/pages/PublisherDashboard/PublisherDashboardPageUtil.ts b/...ray-marketplace-custom-element/src/pages/PublisherDashboard/PublisherDashboardPageUtil.ts
@@ -3,6 +3,7 @@
  * SPDX-License-Identifier: LGPL-2.1-or-later OR LicenseRef-Liferay-DXP-EULA-2.0.0-2023-06
  */
 
+import {ProductTypeLabels} from '../../enums/ProductType';
 import {Liferay} from '../../liferay/liferay';
 
 export function formatDate(date: string) {
@@ -26,18 +27,11 @@ export function getProductTypeFromSpecifications(
 ) {
 	let productType = 'no type';
 
-	specifications.forEach((specification: ProductSpecification) => {
+	for (const specification of specifications) {
 		if (specification.specificationKey === 'type') {
 			productType = specification.value.en_US;
 
-			if (productType === 'cloud') {
-				productType = 'Cloud';
-			}
-			else if (productType === 'dxp') {
-				productType = 'DXP';
-			}
+			return ProductTypeLabels[productType] ?? productType;
 		}
-	});
-
-	return productType;
+	}
 }
diff --git a/...ard/pages/Apps/AppCreationFlow/ProvideAppBuildPage/constants/offeringTypesDescriptions.ts b/...ard/pages/Apps/AppCreationFlow/ProvideAppBuildPage/constants/offeringTypesDescriptions.ts
@@ -49,7 +49,7 @@ export const offeringTypesDescription = {
 			label: i18n.translate('liferay-saas'),
 		},
 	],
-	[ProductType.FRAGMENTS]: [
+	[ProductType.FRAGMENT]: [
 		{
 			description: i18n.translate(
 				'the-dxp-app-is-module-based-and-is-compatible-with-7-4-builds-of-liferay-dxp'

diff --git a/...blisherDashboard/pages/Apps/AppCreationFlow/ProvideAppBuildPage/constants/productTypes.ts b/...blisherDashboard/pages/Apps/AppCreationFlow/ProvideAppBuildPage/constants/productTypes.ts
@@ -29,6 +29,6 @@ export const ProductTypeOptions: ProductTypeOption[] = [
 		description:
 			'Modular components, built with HTML, CSS, and JavaScript, offer extensible and reusable elements or collections of elements for constructing content pages and templates.',
 		label: i18n.translate('fragment-collection-of-fragments'),
-		value: ProductType.FRAGMENTS,
+		value: ProductType.FRAGMENT,
 	},
 ];
diff --git a/...xtensions/liferay-marketplace-site-initializer/site-initializer/commerce-order-types.json b/...xtensions/liferay-marketplace-site-initializer/site-initializer/commerce-order-types.json
@@ -2,7 +2,7 @@
 	{
 		"active": true,
 		"description": {
-			"en_US": "Designates that the order is an Add-On"
+			"en_US": "Designates that the order is an add-on"
 		},
 		"displayOrder": 0,
 		"externalReferenceCode": "ADDONS",
@@ -14,7 +14,7 @@
 	{
 		"active": true,
 		"description": {
-			"en_US": "Designates that the order contains a free or paid Cloud app."
+			"en_US": "Designates that the order contains a free or paid cloud app."
 		},
 		"displayOrder": 0,
 		"externalReferenceCode": "CLOUDAPP",
@@ -23,6 +23,18 @@
 		},
 		"neverExpire": true
 	},
+	{
+		"active": true,
+		"description": {
+			"en_US": "Designates that the order contains a free or paid client extension."
+		},
+		"displayOrder": 1,
+		"externalReferenceCode": "CLIENT_EXTENSION",
+		"name": {
+			"en_US": "Client Extension"
+		},
+		"neverExpire": true
+	},
 	{
 		"active": true,
 		"description": {
@@ -38,9 +50,21 @@
 	{
 		"active": true,
 		"description": {
-			"en_US": "Designates that the order contains an LXC 60-day project order."
+			"en_US": "Designates that the order contains a free or paid fragment."
 		},
 		"displayOrder": 2,
+		"externalReferenceCode": "FRAGMENT",
+		"name": {
+			"en_US": "Fragment"
+		},
+		"neverExpire": true
+	},
+	{
+		"active": true,
+		"description": {
+			"en_US": "Designates that the order contains an LXC 60-day project order."
+		},
+		"displayOrder": 3,
 		"externalReferenceCode": "PROJECT60",
 		"name": {
 			"en_US": "Project - 60 days"
@@ -52,7 +76,7 @@
 		"description": {
 			"en_US": "Designates that the order contains a 7-day solution trial."
 		},
-		"displayOrder": 3,
+		"displayOrder": 4,
 		"externalReferenceCode": "SOLUTIONS7",
 		"name": {
 			"en_US": "Solutions - 7 day trial"
@@ -64,7 +88,7 @@
 		"description": {
 			"en_US": "Designates that the order contains a 30-day solution trial."
 		},
-		"displayOrder": 4,
+		"displayOrder": 5,
 		"externalReferenceCode": "SOLUTIONS30",
 		"name": {
 			"en_US": "Solutions - 30 day trial"
@@ -76,7 +100,7 @@
 		"description": {
 			"en_US": "Designates that the order contains a 30-day cloud app trial."
 		},
-		"displayOrder": 5,
+		"displayOrder": 6,
 		"externalReferenceCode": "CLOUDAPP30",
 		"name": {
 			"en_US": "Cloud App - 30 day trial"
@@ -88,7 +112,7 @@
 		"description": {
 			"en_US": "Designates that the order contains a 30-day DXP app trial."
 		},
-		"displayOrder": 6,
+		"displayOrder": 7,
 		"externalReferenceCode": "DXPAPP30",
 		"name": {
 			"en_US": "DXP App - 30 day trial"