\n) => () => {\n props.onRequestInvoice!(props.data.invoice, requestInvoiceButtonReference);\n};\n\nconst getDesktopRowCells = (props: IInvoicesTableRowProps, onSelectLine: () => void) => {\n const {\n data: { invoice, customer }\n } = props;\n\n const isCurrentUser =\n !StringExtensions.isNullOrWhitespace(customer.AccountNumber) && customer.AccountNumber === invoice.customerAccountNumber;\n\n const linkToInvoiceDetails = getInvoiceDetailsPageUrlSync(props.data.invoice.id, props.context.actionContext);\n const invoiceRowArialabel = format(props.resources.invoiceListSelectRadioAriaLabelText, invoice.id);\n return (\n <>\n | \n \n | \n \n \n {invoice.id}\n \n | \n \n {formatDate(props.context, invoice.invoiceDate)}\n | \n \n {invoice.customerName}\n {isCurrentUser ? {props.resources.invoiceCurrentUser} : null}\n | \n {formatAmount(props.context, invoice.amount, invoice.currencyCode)} | \n \n {formatDate(props.context, invoice.dueDate)}\n | \n {formatAmount(props.context, invoice.amountDue, invoice.currencyCode)} | \n \n {getInvoiceStatusText(props.resources, invoice.status)}\n | \n {extraActionsPopup(props)} | \n \n );\n};\n\nlet setShowPreviousActions: React.Dispatch> | undefined;\n\n/**\n * On Click view details function.\n * @param linkToInvoiceDetails -Link to invoice details.\n * @returns Go to invoice details.\n */\nconst onClickViewDetails = (linkToInvoiceDetails: string) => () => {\n if (MsDyn365.isBrowser) {\n window.location.href = linkToInvoiceDetails;\n }\n return;\n};\n\n/**\n * Toggle function.\n * @param isShowActions -Link to invoice details.\n * @param setShowActions -Link to invoice details.\n * @returns Go to invoice details.\n */\nconst toggle = (isShowActions: boolean, setShowActions: React.Dispatch>) => () => {\n const shouldShowActions = !isShowActions;\n if (shouldShowActions) {\n if (setShowPreviousActions) {\n setShowPreviousActions(false);\n }\n setShowActions(shouldShowActions);\n setShowPreviousActions = setShowActions;\n } else {\n setShowPreviousActions = undefined;\n setShowActions(shouldShowActions);\n }\n};\n\nconst extraActionsPopup = (props: IInvoicesTableRowProps): JSX.Element | null => {\n const {\n resources: {\n invoiceViewDetailsButtonAriaLabel,\n invoiceViewDetailsButtonText,\n invoiceActionsButtonTextAriaLabel,\n invoiceActionsButtonIsOnBehalfOfTextAriaLabel\n },\n data: { index }\n } = props;\n\n const [showActions, setShowActions] = useState(false);\n const isOnBehalfOfRequest = isOboRequest(props.context.request);\n\n const linkToInvoiceDetails = getInvoiceDetailsPageUrlSync(props.data.invoice.id, props.context.actionContext);\n\n const className = `${props.className}__extra-actions-cell`;\n const actionsContainerClassName = `${className}__actions-container`;\n const payInvoiceClassName = `${actionsContainerClassName}__pay-invoice`;\n return (\n \n
\n {showActions && !isOnBehalfOfRequest && (\n
\n
\n {invoiceViewDetailsButtonText}\n \n \n \n \n )}\n
\n \n | \n \n \n {invoice.id}\n \n
\n {invoice.customerName}\n | \n \n {formatDate(props.context, invoice.dueDate)}\n
\n {getInvoiceStatusText(props.resources, invoice.status)}\n | \n {extraActionsPopup(props)} | \n \n );\n};\n\nconst InvoicesTableRow: React.FC = (props: IInvoicesTableRowProps): JSX.Element => {\n const {\n data: { invoice }\n } = props;\n\n const onSelectLine = () => {\n invoice.isSelected = !invoice.isSelected;\n props.onChange();\n };\n\n let rowCells: JSX.Element;\n if (props.isMobile) {\n rowCells = getMobileRowCells(props, onSelectLine);\n } else {\n rowCells = getDesktopRowCells(props, onSelectLine);\n }\n\n return {rowCells}
;\n};\n\nexport const InvoicesTableRowComponent: React.FunctionComponent = msdyn365Commerce.createComponent<\n // @ts-expect-error\n IInvoicesTableRowComponent\n>('InvoicesTableRowComponent', { component: InvoicesTableRow });\n","/*--------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * See License.txt in the project root for license information.\r\n *--------------------------------------------------------------*/\r\n\r\nimport { Module, Node } from '@msdyn365-commerce-modules/utilities';\r\nimport * as React from 'react';\r\n\r\nimport { ICheckoutCustomerAccountPaymentViewProps } from '@msdyn365-commerce-modules/checkout/src/modules/checkout-customer-account-payment/./checkout-customer-account-payment';\r\nimport { IAccountPaymentEditViewForm } from '@msdyn365-commerce-modules/checkout/src/modules/checkout-customer-account-payment/./components/get-account-payment-form-edit-mode';\r\nimport { IAccountPaymentSummaryViewForm } from '@msdyn365-commerce-modules/checkout/src/modules/checkout-customer-account-payment/./components/get-account-payment-form-summary-mode';\r\nimport { ICheckoutCustomerAccountPaymentProps as ICheckoutCustomerAccountPaymentExtensionProps } from '../definition-extensions/checkout-customer-account-payment.ext.props.autogenerated';\r\n\r\nimport { PaymentContext, IPaymentTenderType } from '../../../modules/payment-container/context/payment-context';\r\n// import { CustomerBalances } from '@msdyn365-commerce/retail-proxy';\r\nimport MsDyn365 from \"@msdyn365-commerce/core\";\r\n\r\nexport const SummaryForm: React.FC = ({ formProps, label, paymentAmount, addPaymentButton, appliedLine, bottomBorder }) => (\r\n \r\n <>\r\n {label}\r\n {appliedLine}\r\n {bottomBorder}\r\n \r\n \r\n);\r\n\r\nexport const EditForm: React.FC = ({ formProps, inputLabel, inputAmount, customerName, customerAccountNumber, addPaymentButton, customerSince, accountCredit, alert, accountDetails, appliedLine, bottomBorder }, props) => {\r\n return (\r\n \r\n <>\r\n\r\n {customerName}\r\n {customerAccountNumber}\r\n {customerSince}\r\n {/* {accountCredit} */}\r\n {/* {accountDetails} */}\r\n {/* {inputLabel} */}\r\n {getInputLabel()}\r\n {/* {alert} */}\r\n {appliedLine}\r\n {bottomBorder}\r\n \r\n \r\n)};\r\n\r\nlet customInputLabel = '';\r\n\r\nconst getInputLabel = () => {\r\n return (\r\n \r\n {customInputLabel}\r\n \r\n );\r\n}\r\n\r\n// const getAvailableCredit = (creditBalances: CustomerBalances | undefined) => {\r\n// let availableCredit = 0;\r\n\r\n// if (!creditBalances) {\r\n// return 0;\r\n// }\r\n\r\n// if (creditBalances.InvoiceAccountCreditLimit === 0) {\r\n// availableCredit = creditBalances.CreditLimit - creditBalances.Balance - creditBalances.PendingBalance;\r\n// } else {\r\n// availableCredit = creditBalances.InvoiceAccountCreditLimit - creditBalances.InvoiceAccountBalance - creditBalances.InvoiceAccountPendingBalance;\r\n// }\r\n\r\n// return availableCredit;\r\n// };\r\n\r\nconst addPayment = async (props: ICheckoutCustomerAccountPaymentViewProps): Promise => {\r\n const checkoutState = props.data.checkout.result;\r\n\r\n if (!checkoutState) {\r\n props.context.telemetry.error('checkout state not found');\r\n return;\r\n }\r\n\r\n // const availableCredit = getAvailableCredit(props.data.creditBalances?.result);\r\n const cartTotal = (await props.data.checkout).checkoutCart.cart.TotalAmount;\r\n\r\n // console.log(availableCredit);\r\n // console.log(cartTotal);\r\n // if (cartTotal && availableCredit >= cartTotal) {\r\n if (cartTotal) {\r\n await checkoutState.updateCustomerAccountAmount({ newAmount: cartTotal });\r\n props.context.telemetry.information('customer account payment amount updated');\r\n }\r\n};\r\n\r\nconst CheckoutCustomerAccountView: React.FC> = props => {\r\n const { checkoutCustomerAccount, summaryView, editView, moduleState, id, config: { tenderType } } = props;\r\n \r\n const paymentContext = React.useContext(PaymentContext);\r\n const paymentTenderTypes: IPaymentTenderType[] = [];\r\n // console.log(props);\r\n\r\n React.useEffect(() => {\r\n tenderType?.map(tt => {\r\n paymentTenderTypes.push({ tenderTypeId: tt.tenderId, tenderName: tt.tenderName });\r\n });\r\n paymentContext.registerPaymentMethod(id, paymentTenderTypes);\r\n sessionStorage.removeItem('ON_ACCOUNT_APPLIED');\r\n customInputLabel = props.config.processedOnAccountText || '';\r\n }, []);\r\n\r\n if (MsDyn365.isBrowser) {\r\n document.querySelector('.payment-selector__button-container--on-account')?.addEventListener('click', () => {\r\n if (sessionStorage.getItem('ON_ACCOUNT_APPLIED') === '1') {\r\n return;\r\n }\r\n sessionStorage.setItem('ON_ACCOUNT_APPLIED', '1');\r\n addPayment(props);\r\n });\r\n }\r\n\r\n return (\r\n \r\n {moduleState.isReady && summaryView && }\r\n {!moduleState.isReady && editView && }\r\n \r\n );\r\n};\r\n\r\nexport default CheckoutCustomerAccountView;\r\n","/*--------------------------------------------------------------\r\n * Copyright (c) Microsoft Corporation. All rights reserved.\r\n * See License.txt in the project root for license information.\r\n *--------------------------------------------------------------*/\r\n\r\nimport { Module } from '@msdyn365-commerce-modules/utilities';\r\nimport { SalesInvoice, SimpleProduct } from '@msdyn365-commerce/retail-proxy';\r\nimport { getSimpleProductsAction, ProductInput } from '@msdyn365-commerce-modules/retail-actions';\r\nimport * as React from 'react';\r\n\r\nimport { IInvoiceDetailsViewProps } from '@msdyn365-commerce-modules/invoice-details/src/modules/invoice-details/./invoice-details';\r\nimport { InvoiceDetailsProductsComponent, InvoiceDetailsModel } from './components/invoice-details-products.component';\r\n\r\n\r\n\r\nexport const InvoiceDetailsView: React.FC = props => {\r\n const {\r\n config,\r\n header,\r\n /*products,*/\r\n paymentDetails,\r\n payInvoiceError,\r\n context,\r\n resources,\r\n typeName\r\n } = props;\r\n const baseClassName: string = 'msc-invoice-details';\r\n const [invoiceDetails, setInvoiceDetails] = React.useState();\r\n const [products, setProducts] = React.useState([]);\r\n\r\n const getInvoiceDetails = async (): Promise => {\r\n const invoice = await props.data.invoice;\r\n const invDetails = await props.data.invoiceDetails;\r\n const invoiceDetailsModel = new InvoiceDetailsModel(invoice, invDetails, products);\r\n setInvoiceDetails(invoiceDetailsModel);\r\n return invDetails;\r\n };\r\n\r\n const getProducts = async (channelId?: number): Promise => {\r\n const invDetails = await getInvoiceDetails();\r\n const invoiceLines = invDetails.SalesInvoiceLine || [];\r\n const productInputs = invoiceLines.filter(product => product.RecordId).map(product => new ProductInput(\r\n product.RecordId!, context.request.apiSettings, channelId, undefined, context.actionContext.requestContext));\r\n const simpleProductsRes = await getSimpleProductsAction(productInputs, context.actionContext);\r\n setProducts(simpleProductsRes);\r\n return getSimpleProductsAction(productInputs, context.actionContext);\r\n }\r\n\r\n const renderProducts = (): JSX.Element | null => {\r\n const { imageSettings } = config;\r\n\r\n if (!invoiceDetails) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n );\r\n }\r\n\r\n React.useEffect(() => {\r\n void getProducts();\r\n }, []);\r\n \r\n return (\r\n \r\n {header}\r\n {/* {products} */}\r\n {renderProducts()}\r\n {paymentDetails}\r\n {payInvoiceError}\r\n \r\n );\r\n};\r\n\r\nexport default InvoiceDetailsView;\r\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport * as Msdyn365 from '@msdyn365-commerce/core';\nimport { IModuleProps } from '@msdyn365-commerce-modules/utilities';\nimport classnames from 'classnames';\nimport * as React from 'react';\n\nimport { IAccountWelcomeTileData } from './account-welcome-tile.data';\nimport { IAccountWelcomeTileProps } from './account-welcome-tile.props.autogenerated';\n\nexport interface IAccountWelcomeTileViewProps extends IAccountWelcomeTileProps {\n AccountWelcomeTile: IModuleProps;\n className: string;\n heading?: React.ReactNode;\n}\n\n/**\n *\n * AccountWelcome component.\n * @extends {React.PureComponent>}\n */\nclass AccountWelcomeTile extends React.PureComponent> {\n public render(): JSX.Element {\n const { config, data } = this.props;\n const { className } = config;\n\n const accountInfo = data.accountInformation.result;\n const heading = {\n ...config.heading,\n ...{\n text: `${config.heading.text ? config.heading.text : ''} ${\n accountInfo && accountInfo.FirstName ? accountInfo.FirstName : ''\n }`\n }\n };\n\n const viewProps = {\n ...this.props,\n className,\n AccountWelcomeTile: {\n moduleProps: this.props,\n className: classnames('ms-account-welcome-tile', config.className)\n },\n heading: heading && heading.text && (\n \n )\n };\n\n return this.props.renderView(viewProps) as React.ReactElement;\n }\n\n public handleHeadingChange = (event: Msdyn365.ContentEditableEvent) => (this.props.config.heading.text = event.target.value);\n}\n\nexport default AccountWelcomeTile;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { InvoicePaidStatus, OrderInvoice } from '@msdyn365-commerce/retail-proxy';\n\nexport interface IPayableInvoice {\n readonly id: string;\n readonly canBePaid: boolean;\n}\n\n/**\n * Represents invoice data model.\n */\nexport class InvoiceModel implements IPayableInvoice {\n public id: string;\n\n public invoiceDate?: Date;\n\n public customerAccountNumber?: string;\n\n public customerName?: string;\n\n public amount?: number;\n\n public dueDate?: Date;\n\n public amountDue?: number;\n\n public status?: InvoicePaidStatus;\n\n public currencyCode?: string;\n\n public isSelected: boolean;\n\n public constructor(invoice: OrderInvoice) {\n this.id = invoice.Id || '';\n this.invoiceDate = invoice.InvoiceDate ? new Date(invoice.InvoiceDate) : undefined;\n this.customerAccountNumber = invoice.CustomerAccountNumber;\n this.customerName = invoice.CustomerName;\n this.amount = invoice.TotalAmount;\n this.dueDate = invoice.InvoiceDueDate ? new Date(invoice.InvoiceDueDate) : undefined;\n this.amountDue = invoice.AmountBalance;\n this.status = invoice.InvoicePaidStatusValue;\n this.currencyCode = invoice.CurrencyCode;\n\n this.isSelected = false;\n }\n\n public get canBePaid(): boolean {\n return this.status !== InvoicePaidStatus.Paid;\n }\n}\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { InvoicePaidStatus } from '@msdyn365-commerce/retail-proxy';\n\nexport interface IInvoiceStatusResources {\n invoiceStatusNone: string;\n invoiceStatusUnpaid: string;\n invoiceStatusPartiallyPaid: string;\n invoiceStatusPaid: string;\n}\n\nexport const getInvoiceStatusText = (resources: IInvoiceStatusResources, invoiceStatus: InvoicePaidStatus | undefined) => {\n switch (invoiceStatus) {\n case InvoicePaidStatus.None:\n return resources.invoiceStatusNone;\n\n case InvoicePaidStatus.Unpaid:\n return resources.invoiceStatusUnpaid;\n\n case InvoicePaidStatus.PartiallyPaid:\n return resources.invoiceStatusPartiallyPaid;\n\n case InvoicePaidStatus.Paid:\n return resources.invoiceStatusPaid;\n default:\n return '';\n }\n};\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nexport * from './invoice-data';\nexport * from './invoice-status';\nexport * from './pay-invoices';\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { Module } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IB2bRequestsTileViewProps } from './b2b-requests-tile';\n\nconst B2bRequestsTileView: React.FC = props => {\n const { b2bRequestsTile, heading, links } = props;\n\n return (\n \n {heading}\n {links}\n \n );\n};\n\nexport default B2bRequestsTileView;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IComponentProps, msdyn365Commerce } from '@msdyn365-commerce/core';\nimport { EnumExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { Button, Popover } from '@msdyn365-commerce-modules/utilities';\nimport React from 'react';\n\nimport { IInvoiceStatusResources } from '../helpers/invoice-status';\n\nexport interface IInvoicesFilterResources extends IInvoiceStatusResources {\n invoicesFilterShowAll: string;\n}\n\nexport interface IInvoicesFilterProps extends IComponentProps {\n className: string;\n disabled: boolean;\n\n resources: IInvoicesFilterResources;\n\n currentState: InvoicesFilterState;\n onFilterStateChanged(state: InvoicesFilterState): void;\n}\n\nexport enum InvoicesFilterState {\n ShowAll,\n Paid,\n PartiallyPaid,\n Unpaid\n}\n\nconst getInvoicesFilterStateResources = (filterState: InvoicesFilterState, resources: IInvoicesFilterResources): string => {\n switch (filterState) {\n case InvoicesFilterState.ShowAll:\n return resources.invoicesFilterShowAll;\n case InvoicesFilterState.Paid:\n return resources.invoiceStatusPaid;\n case InvoicesFilterState.PartiallyPaid:\n return resources.invoiceStatusPartiallyPaid;\n case InvoicesFilterState.Unpaid:\n return resources.invoiceStatusUnpaid;\n default:\n throw new Error('Failed to retrieve resource description for unknown invoices filter state.');\n }\n};\n\n/**\n * On Click function.\n * @param onStateClick -Invoice filter state function.\n * @param filterState -Invoice filter state.\n * @returns Set Invoice filter state.\n */\nconst onClickHandler = (onStateClick: (filterState: InvoicesFilterState) => void, filterState: InvoicesFilterState) => () => {\n onStateClick(filterState);\n};\n\nconst renderFilterStateItem = (\n filterState: InvoicesFilterState,\n resources: IInvoicesFilterResources,\n className: string,\n onStateClick: (filterState: InvoicesFilterState) => void\n): React.ReactNode => {\n const stateStringRepresentation = InvoicesFilterState[filterState];\n\n return (\n \n );\n};\n\nconst InvoicesFilter: React.FC = (props: IInvoicesFilterProps) => {\n const popoverRef = React.createRef();\n const [popoverState, setPopoverState] = React.useState(false);\n const togglePopover = React.useCallback(() => {\n setPopoverState(!popoverState);\n }, [popoverState]);\n\n const [filterState, setFilterState] = React.useState(props.currentState);\n\n const onFilterStateClick = (clickedState: InvoicesFilterState) => {\n setFilterState(clickedState);\n setPopoverState(false);\n props.onFilterStateChanged(clickedState);\n };\n\n return (\n \n
\n {getInvoicesFilterStateResources(filterState, props.resources)}\n \n \n {EnumExtensions.getEnumValues(InvoicesFilterState).map(state => {\n return renderFilterStateItem(state, props.resources, props.className, onFilterStateClick);\n })}\n \n \n {filteredInvoices.map((invoice, index) => {\n const onInvoiceSelect = onInvoiceSelectHandler(setSelectedInvoiceIndex, index);\n\n const checkboxId = `invoice__${invoice.id}`;\n const checkboxName = `invoiceSelect__${invoice.id}`;\n\n return (\n
\n \n \n
\n );\n })}\n
\n
\n
\n {email}\n
\n
\n {shouldShowSearchResults && (\n
\n {searchResultString.substring(0, invoicesFoundReplaceIndex)}\n {filteredInvoices.length}\n {searchResultString.substring(invoicesFoundReplaceIndex + 3)}\n
\n )}\n
\n \n \n
\n {invoiceOptions}\n
\n
\n
\n
\n
{invoicesListDescTitle}
\n
{amountText}
\n
{countText}
\n
\n
\n
{this.props.resources.invoiceEmptyInvoiceLinesTitle}
\n
{this.props.resources.invoiceEmptyInvoiceLinesDescription}
\n
\n \n {this.props.resources.invoiceEmptyInvoiceLinesContinueShoppingButtonText}\n \n
\n
\n
\n {this._renderMakePayment(containerHeaderClass, isOnBehalfOfRequest)}\n {this._renderInvoiceRequestButton()}\n
\n
{this._renderInvoiceErrors()}
\n
{this._renderInvoicesList(containerContentClass)}
\n
\n
{this._renderInvoiceInCartPaymentMessage()}
\n
\n
\n \n {this.props.resources.invoiceInCartPaymentMessage}\n \n
\n \n );\n }\n\n // Dismiss alert.\n private readonly _onDismiss = () => {\n this.setState({\n isOpen: false\n });\n };\n\n private _renderPagination(): JSX.Element | undefined {\n const { data, resources } = this.props;\n const invoices = data?.invoices?.result;\n if (!invoices || invoices.length < this._queryResultSettings.Paging!.Top!) {\n return undefined;\n }\n\n return (\n \n {resources.invoicesLoadMore}\n \n );\n }\n\n private async _loadMoreInvoices(): Promise {\n this.setState({ isLoading: true });\n const searchCriteria = await this._getInvoicesSearchCriteria(this.state.invoicesFilterState);\n if (this._queryResultSettings.Paging) {\n this._queryResultSettings.Paging.Skip! += this._queryResultSettings.Paging.Top!;\n }\n const newInvoices = await getInvoices(\n new GetInvoicesInput(searchCriteria, this._queryResultSettings),\n this.props.context.actionContext\n );\n this._addInvoices(newInvoices);\n }\n\n private _renderInvoiceRequestModal(): JSX.Element {\n const customer = this.props.data.customer.result;\n const {\n invoiceRequestModalCancelLabel,\n invoiceRequestModalSubmitLabel,\n invoiceRequestModalHeaderLabel,\n invoiceRequestModalSendToEmailLabel,\n invoiceRequestModalSearch,\n invoiceRequestModalInvoiceSearchDisplay,\n invoiceRequestModalSingleInvoiceSearchDisplay,\n invoiceRequestModalSearchButton\n } = this.props.resources;\n\n return (\n \n );\n }\n\n private _onToggleInvoiceRequestModal(): void {\n this.setState({\n isInvoiceRequestModalOpen: !this.state.isInvoiceRequestModalOpen\n });\n if (this.state.isInvoiceRequestModalOpen) {\n this.state.selectedButtonElement?.focus();\n }\n }\n\n /**\n * Request specific invoice function.\n */\n private readonly _onToggleInvoiceRequestParentModal = () => {\n this.setState(\n {\n selectedButtonElement: this.payInvoiceRequestReference.current\n },\n () => {\n this._onToggleInvoiceRequestModal();\n }\n );\n };\n\n private _renderInvoiceRequestButton(): JSX.Element | null {\n const { invoiceRequestButtonLabel } = this.props.resources;\n const customer = this.props.data.customer.result;\n\n if (StringExtensions.isNullOrWhitespace(customer?.Email)) {\n return null;\n }\n\n return (\n \n );\n }\n\n private _requestInvoice(invoiceId: string): void {\n this.invoiceIds.push(invoiceId);\n this._onToggleInvoiceRequestModal();\n }\n\n private _getSelectedInvoices(): InvoiceModel[] {\n let selectedInvoices = this.state.invoices.filter(invoice => invoice.isSelected);\n if (!ArrayExtensions.hasElements(selectedInvoices)) {\n selectedInvoices = this.state.invoices;\n }\n\n return selectedInvoices;\n }\n\n private _requestSpecificInvoice(\n specificInvoice: InvoiceModel,\n requestInvoiceButtonReference: React.RefObject\n ): void {\n this.state.invoices.forEach((invoice: InvoiceModel) => {\n if (invoice === specificInvoice) {\n invoice.isSelected = true;\n } else {\n invoice.isSelected = false;\n }\n });\n this.setState({\n selectedButtonElement: requestInvoiceButtonReference.current\n });\n this._onToggleInvoiceRequestModal();\n }\n}\n\nexport default InvoicesList;\n","/*!\n * Copyright (c) Microsoft Corporation.\n * All rights reserved. See LICENSE in the project root for license information.\n */\n\nimport { IOrderTemplateListViewProps, ISingleOrderTemplateViewProps } from '@msdyn365-commerce-modules/order-template';\nimport { ArrayExtensions } from '@msdyn365-commerce-modules/retail-actions';\nimport { INodeProps, Module, Node } from '@msdyn365-commerce-modules/utilities';\nimport * as React from 'react';\n\nimport { IOrderTemplateListProps, IOrderTemplateListResources } from '../definition-extensions/order-template-list.ext.props.autogenerated';\n\n/**\n * Interface for OrderTemplateImage.\n */\ninterface IOrderTemplateImage {\n props: {\n children: React.ReactElement[];\n };\n}\n\n/**\n * To render order template.\n * @param orderTemplate - The order template view props.\n * @param orderTemplateNodeProps - The order template node props.\n * @returns The JSX Element.\n */\nconst renderOrderTemplate = (orderTemplate: ISingleOrderTemplateViewProps, orderTemplateNodeProps?: INodeProps): JSX.Element | null => {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file\n const { key, addToCartButton, orderTemplateImage, orderTemplateStatusMessage, removeButton, orderTemplateName } = orderTemplate;\n\n const orderTemplateImageElement: IOrderTemplateImage = orderTemplateImage as React.ReactElement;\n const currentImageListLength = orderTemplateImageElement.props.children.length;\n const defaultNumberImagesInTile = 4;\n\n if (currentImageListLength < defaultNumberImagesInTile) {\n for (let index = 0; index < defaultNumberImagesInTile - currentImageListLength; index++) {\n orderTemplateImageElement.props.children.push();\n }\n }\n\n return (\n \n {orderTemplateName}\n {orderTemplateImage}\n {addToCartButton}\n {removeButton}\n {orderTemplateStatusMessage}\n \n );\n};\n\n/**\n * Order Template List View.\n * @param props - The view props.\n * @returns The JSX Element.\n */\nexport const OrderTemplateListViewComponent: React.FC> = props => {\n const {\n // eslint-disable-next-line @typescript-eslint/naming-convention -- Dependency from module file\n OrderTemplateList,\n OrderTemplates,\n OrderTemplate,\n status,\n statusMessage,\n heading,\n orderTemplates,\n createOrderTemplateButton,\n templateHeaderStatusMessage\n } = props;\n\n return (\n \n {heading}\n \n {status === 'SUCCESS' && (!OrderTemplates || !orderTemplates || !ArrayExtensions.hasElements(orderTemplates)) ? (\n \n
{props.resources.headingForEmptyOrderTemplateList}
\n
{props.resources.textForEmptyOrderTemplateList}
\n {createOrderTemplateButton}\n