{"version":3,"sources":["webpack:///./obj/desktop/src/statement/components/payment-amount/desktop/payment-amount.less","webpack:///./obj/desktop/src/statement/components/statement-pay-page/desktop/statement-pay-page.less","webpack:///./obj/desktop/src/statement/components/confirm-payment/desktop/confirm-payment.less","webpack:///./obj/desktop/src/statement/components/payment-amount/mobile/payment-amount.less","webpack:///./obj/desktop/src/statement/components/payment-amount/desktop/payment-amount.tsx","webpack:///./obj/desktop/src/statement/components/statement-pay-page/desktop/statement-pay-page.tsx","webpack:///./obj/desktop/src/statement/components/statement-customer-selector/statement-customer-selector.tsx","webpack:///./obj/desktop/src/statement/components/statement-heading/desktop/statement-heading.tsx","webpack:///./obj/desktop/src/statement/components/invoice-grid-summary/desktop/invoice-grid-summary.tsx","webpack:///./obj/desktop/src/statement/components/invoice-grid/desktop/invoice-grid.tsx","webpack:///./obj/desktop/src/statement/components/statement-page/desktop/statement-page.tsx","webpack:///./obj/desktop/src/statement/components/statement-page/statement-page-container.tsx","webpack:///./obj/desktop/src/statement/components/confirm-payment/desktop/confirm-payment.tsx","webpack:///./obj/desktop/src/statement/components/payment-amount/mobile/payment-amount.tsx","webpack:///./obj/desktop/src/statement/components/amount-confirm-page/amount-confirm-page.tsx","webpack:///./obj/desktop/src/statement/components/statement-routes.tsx"],"names":["module","exports","PaymentAmount","get","outstandingBalance","splits","paymentMethodStore","paymentAmount","forEach","s","amountApplied","className","card","Section","PaymentAmountHeader","store","PaymentAmountFooter","statementBalance","props","columns","Column","bold","size","subdued","justifyContent","Item","isExpanded","setIsExpanded","invoices","setInvoices","invoiceIds","split","push","invoiceId","getInvoicesById","invoiceList","paymentAmountHeader","onClick","showInvoicesLink","length","invoiceListContainer","invoiceListHeader","map","invoice","Row","key","id","invoiceListRow","number","balance","StatementPayPageContainer","initialize","errorMessage","iframeMessageHandler","window","addEventListener","removeEventListener","errorMsg","setErrorMsg","processing","setProcessing","achInfoData","paymentAmountData","undefined","pgcardInfoData","skipIFrameMessageHandler","cardInfoData","payButtonText","setPayButtonText","payButtonIcon","setPaybuttonIcon","isPaymentMethodValid","setPaymentMethodValid","isSecurityCodeValid","setSecurityCodeValid","setConnectedAccounts","paymentMethodAction","paymentMethodSubmit","paymentMethodTypeRef","PayByBank","current","paymentType","setPaymentType","getPaymentAmount","isFullBalance","value","fullBalance","Number","customAmount","$","currentSplits","currentStatementId","init","usePaymentGateway","fullHeight","hidden","spinner","loadingMessage","status","onClose","icon","title","onSubmit","e","preventDefault","statementId","chargeType","NUMBER_1","showLoginLink","getShowLoginLink","setPaymentMethodAction","setPaymentButtonTextIcon","text","setPaymentMethodSubmit","setPaymentMethodType","paymentMethodType","nonStickyButtonWrapper","Button","type","variant","color","nextStepButton","disabled","infoFormIsValid","CreditCard","selectedPaymentMethod","form","validate","hasError","ACH","maximumAmount","valid","name","StatementCustomerSelector","customerDropdownState","customerMap","selectedCustomer","selectCustomer","searchTerm","clearSearch","getOptions","filter","selectOptions","options","some","op","i","cust","content","RenderCustomerOption","customer","addOptionsSection","sectionName","force","unpaidOptions","trigger","placeholder","onChange","data","autoFlipVertically","search","_","scrollHeight","onClickOutside","streetAddress","city","state","zip","a","formatMoney","StatementHeading","changeFilter","selectedFilter","isMultipleCustomers","overdueInvoiceCount","fixedTabs","All","Statement","pastDueTab","PastDue","tabs","alignItems","style","minWidth","fill","direction","spacing","el","width","medium","address","InvoiceGridSummary","invoiceAmountTotal","invoiceBalanceTotal","previousPaymentTotal","InvoiceGrid","gridState","filteredInvoiceCount","selectedInvoiceCount","makePayment","paymentAmountTotal","isPaymentAllowed","shouldShowDueDate","history","primary","large","selectedCount","xsmall","deselectAll","isAllRowsSelected","selectAll","sortable","tableState","selectable","resizable","scrollable","minResizableWidth","field","cell","TextCell","columnMenu","CMenuInner","DateCell","AddressCell","DueDateCell","MoneyCell","InvoiceLinkCell","src","height","Field","Input","small","event","filterEvent","operator","syntheticEvent","dataItem","isAfter","isRed","href","overflow","textOverflow","whiteSpace","StatementPage","sharp","StatementPageContainer","MultipleStatementPageContainer","ConfirmPayment","chargeStore","clientDataStore","isInitialized","confirmation","getCachedConfirmation","initializeConfirmationPage","page","srcSet","transactionNumber","transaction","authCode","paid","partialPaid","remainingBalance","amountPaid","label","remaining","email","getIsLoggedIn","signDetails","links","createTenantURL","backToSelectionPage","balanceTitle","invoiceSelectedCount","StatementAmountPageContainer","useEffect","alignSelf","full","replace","StatementRoutes","exact","path","component","allowAnonStatements"],"mappings":"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","file":"statement.bundle.js?95807feb536b5f2007cb","sourcesContent":["// extracted by mini-css-extract-plugin\nmodule.exports = {\"card\":\"_1YCkU146QuoKePpadSztgb\",\"show-invoices-link\":\"_1E_0hQ0-OkD4JUGMBTkNQs\",\"showInvoicesLink\":\"_1E_0hQ0-OkD4JUGMBTkNQs\",\"payment-amount-header\":\"_2T-WlmD2tMlfy2TphUPivO\",\"paymentAmountHeader\":\"_2T-WlmD2tMlfy2TphUPivO\",\"invoice-list-container\":\"_3I-XXuBHqVtJciZAPjGLux\",\"invoiceListContainer\":\"_3I-XXuBHqVtJciZAPjGLux\",\"invoice-list-header\":\"_3sGzmqYk5mgZ6Yab3ts3n2\",\"invoiceListHeader\":\"_3sGzmqYk5mgZ6Yab3ts3n2\",\"invoice-list-row\":\"_3Mv_D-m4mQ5N_cBuizgVae\",\"invoiceListRow\":\"_3Mv_D-m4mQ5N_cBuizgVae\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"non-sticky-button-wrapper\":\"_1M6BUjq_ZlYIrI5irftEyB\",\"nonStickyButtonWrapper\":\"_1M6BUjq_ZlYIrI5irftEyB\",\"next-step-button\":\"_27Zm37lw1HuYVT12SIjruW\",\"nextStepButton\":\"_27Zm37lw1HuYVT12SIjruW\",\"spinner\":\"_3QCGH3GAXWNhjUxjV-SqAi\",\"full-height\":\"_1OlZQ1SHlcVfnza_2BNKkH\",\"fullHeight\":\"_1OlZQ1SHlcVfnza_2BNKkH\",\"loading-message\":\"_1lbcaCmv-APjVC6-F6tUVT\",\"loadingMessage\":\"_1lbcaCmv-APjVC6-F6tUVT\",\"hidden\":\"_2wxvr2bpXFawlcd7VHxQ33\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"transaction-number\":\"_3s_gBPQgIDHLF7sS4cRlAf\",\"transactionNumber\":\"_3s_gBPQgIDHLF7sS4cRlAf\",\"balance\":\"QauJgR5MBSHa4Twmqyfmz\",\"email\":\"cyHknubserrd_0LPDQnjL\",\"sign-details\":\"I2pnyM5vlD9WpvZ6JFPav\",\"signDetails\":\"I2pnyM5vlD9WpvZ6JFPav\",\"links\":\"_3DhJrIODkL6b8MNTKcK3SI\",\"paid\":\"caH_VdpBR3uLVovp3MDCn\",\"remaining\":\"MVPE4QMctKeKmDDTyovzg\",\"label\":\"_1dGRGdWdBR93-SVAhAsy7W\",\"partial-paid\":\"_3BxXxv02xVPu-QI2rUNyxl\",\"partialPaid\":\"_3BxXxv02xVPu-QI2rUNyxl\",\"non-sticky-button-wrapper\":\"_3WQ5BwjYpPPsRVZugGTRxk\",\"nonStickyButtonWrapper\":\"_3WQ5BwjYpPPsRVZugGTRxk\",\"page\":\"_1igZF-Zeh_7SbV5u-UAwVK\",\"next-step-button\":\"_3QWzLvnMegYsKbMj327BSV\",\"nextStepButton\":\"_3QWzLvnMegYsKbMj327BSV\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"card\":\"_1YCkU146QuoKePpadSztgb\",\"show-invoices-link\":\"_1E_0hQ0-OkD4JUGMBTkNQs\",\"showInvoicesLink\":\"_1E_0hQ0-OkD4JUGMBTkNQs\",\"payment-amount-header\":\"_2T-WlmD2tMlfy2TphUPivO\",\"paymentAmountHeader\":\"_2T-WlmD2tMlfy2TphUPivO\",\"invoice-list-container\":\"_3I-XXuBHqVtJciZAPjGLux\",\"invoiceListContainer\":\"_3I-XXuBHqVtJciZAPjGLux\",\"invoice-list-header\":\"_3sGzmqYk5mgZ6Yab3ts3n2\",\"invoiceListHeader\":\"_3sGzmqYk5mgZ6Yab3ts3n2\",\"invoice-list-row\":\"_3Mv_D-m4mQ5N_cBuizgVae\",\"invoiceListRow\":\"_3Mv_D-m4mQ5N_cBuizgVae\",\"balance-title\":\"_2BSTHBMQAC_W2PtkMUybYT\",\"balanceTitle\":\"_2BSTHBMQAC_W2PtkMUybYT\",\"invoice-selected-count\":\"evByXcQKUYtajO-chm52S\",\"invoiceSelectedCount\":\"evByXcQKUYtajO-chm52S\"};","import React, { FC, useEffect, useState } from 'react';\nimport { Card, Stack, Text, Grid } from '@servicetitan/design-system';\nimport { observer } from 'mobx-react';\nimport { ChargeStore } from '../../../stores/charge.store';\nimport { formatMoney } from 'accounting';\nimport { statementContainer } from '../../../ioc';\n\nimport styles from './payment-amount.less';\nimport { Invoice, SplitInfo } from 'src/api';\nimport { SavedPaymentMethodsStore } from 'src/payment-method/stores/saved-payment-methods.store';\nimport { paymentMethodsContainer } from 'src/payment-method/ioc';\n\nexport const PaymentAmount: React.FC = observer(() => {\n    const { outstandingBalance, splits } =\n        statementContainer.get(ChargeStore)!;\n\n    const paymentMethodStore = paymentMethodsContainer.get(SavedPaymentMethodsStore);\n\n    let paymentAmount = 0;\n\n    splits.forEach(s => { paymentAmount += s.amountApplied });\n\n    return (\n        <Card className={styles.card}>\n            <Card.Section>\n                <PaymentAmountHeader\n                    splits={splits}\n                    store={paymentMethodStore} />\n                <PaymentAmountFooter\n                    outstandingBalance={outstandingBalance}\n                    statementBalance={paymentAmount}\n                />\n            </Card.Section>\n        </Card>\n    );\n});\n\ninterface PaymentAmountFooterProps {\n    outstandingBalance?: number;\n    statementBalance?: number;\n};\n\nconst PaymentAmountFooter: FC<PaymentAmountFooterProps> = (props) => (\n    <Grid columns={2}>\n        <Grid.Column>\n            <Text bold size={3}>\n                Payment Amount\n            </Text>\n            <Text subdued size={1}>\n                {props.outstandingBalance ? 'Total Outstanding Balance' :\n                    'Statement Balance'}\n            </Text>\n        </Grid.Column>\n        <Grid.Column>\n            {props.statementBalance ? (\n                <Stack justifyContent=\"space-between\">\n                    <Stack.Item />\n                    <Stack.Item>\n                        <Text size={3} bold>\n                            {formatMoney(props.statementBalance)}\n                        </Text>\n                    </Stack.Item>\n                </Stack>\n            ) : null}\n            {props.outstandingBalance ? (\n                <Stack justifyContent=\"space-between\">\n                    <Stack.Item />\n                    <Stack.Item>\n                        <Text size={3} bold>\n                            {formatMoney(props.outstandingBalance)}\n                        </Text>\n                    </Stack.Item>\n                </Stack>\n            ) : null}\n        </Grid.Column>\n    </Grid>\n);\n\ninterface PaymentAmountHeaderProps {\n    splits: SplitInfo[];\n    store: SavedPaymentMethodsStore;\n};\n\n\nconst PaymentAmountHeader: FC<PaymentAmountHeaderProps> = (props) => {\n\n    const [isExpanded, setIsExpanded] = useState(false);\n    const [invoices, setInvoices] = useState<Invoice[]>([]);\n\n    const loadInvoices = async () => {\n        const splits = props.splits;\n        const invoiceIds: string[] = [];\n\n        splits.forEach(split => invoiceIds.push(split.invoiceId!));\n        const invoiceList = await props.store.getInvoicesById(invoiceIds);\n        setInvoices(invoiceList);\n    };\n\n    const onExpand = () => {\n        setIsExpanded(!isExpanded);\n    }\n\n    useEffect(() => {\n        loadInvoices();\n    }, []);\n\n    return (\n        <>\n            <Grid columns={2} className={styles.paymentAmountHeader}>\n                <Grid.Column>\n                    <Text bold size={3}>\n                        Number of invoices\n                    </Text>\n                    <Text onClick={onExpand} subdued size={1} className={styles.showInvoicesLink}>\n                        {isExpanded ? 'Hide Invoices' : 'Show Invoices'}\n                    </Text>\n                </Grid.Column>\n                <Grid.Column>\n                    <Stack justifyContent=\"space-between\">\n                        <Stack.Item />\n                        <Stack.Item>\n                            <Text subdued size={1}>{props.splits.length} selected</Text>\n                        </Stack.Item>\n                    </Stack>\n                </Grid.Column>\n            </Grid>\n            {isExpanded && (<div className={styles.invoiceListContainer}>\n                <Grid columns={2}>\n                    <Grid.Column>\n                        <Text subdued size={1} bold className={styles.invoiceListHeader}>\n                            Invoice Number\n                        </Text>\n                        {invoices.map((invoice) =>\n                            <Grid.Row key={invoice.id}>\n                                <Text subdued size={1} className={styles.invoiceListRow}>\n                                    {invoice.number}\n                                </Text>\n                            </Grid.Row>\n                        )}\n                    </Grid.Column>\n                    <Grid.Column>\n                        <Stack justifyContent=\"space-between\">\n                            <Stack.Item />\n                            <Stack.Item>\n                                <Text subdued size={1} bold className={styles.invoiceListHeader}>\n                                    Outstanding Balance\n                                </Text>\n                            </Stack.Item>\n                        </Stack>\n                        {invoices.map((invoice) =>\n                            <Grid.Row key={invoice.id}>\n                                <Stack justifyContent=\"space-between\">\n                                    <Stack.Item />\n                                    <Stack.Item>\n                                        <Text subdued size={1} className={styles.invoiceListRow}>\n                                            {formatMoney(invoice.balance)}\n                                        </Text>\n                                    </Stack.Item>\n                                </Stack>\n                            </Grid.Row>\n                        )}\n                    </Grid.Column>\n                </Grid>\n            </div>)}\n        </>\n    )\n};\n","import * as React from 'react';\nimport { Button } from '@material-ui/core';\nimport { Banner, IconNameType, Icon, Spinner, BodyText } from '@servicetitan/design-system';\nimport { PaymentAmount } from '../../payment-amount/payment-amount';\nimport { statementContainer } from '../../../ioc';\nimport { ChargeStore } from '../../../stores/charge.store';\nimport { RouteComponentProps } from 'react-router';\nimport { RouteParams } from '../../statement-routes';\nimport { PaymentGateway } from '../../../stores/payment-gateway.store';\nimport { AchInfoFormState } from '../../../../invoice/components/ach-info/ach-info/ach-info';\nimport { observer } from 'mobx-react-lite';\n\nimport styles from './statement-pay-page.less';\nimport { PaymentMethodContainer } from 'src/invoice/components/payment-methods/desktop/payment-method-container';\nimport classnames from 'classnames';\nimport { paymentMethodsContainer } from 'src/payment-method/ioc';\nimport { SavedPaymentMethodsStore } from 'src/payment-method/stores/saved-payment-methods.store';\nimport { useEffect, useRef, useState } from 'react';\nimport { PageFooterContainer } from 'src/core/components/page-footer/page-footer';\nimport { PaymentAmountFormState } from 'src/invoice/components/payment-amount/payment-amount';\nimport { CardInfoFormState } from 'src/invoice/components/card-info/card-info/card-info';\nimport { PGCardInfoFormState } from 'src/invoice/components/card-info/pg-card-info/pg-card-info';\nimport { ConnectedBankAccount, PaymentMethodType } from 'src/invoice/types/types';\nimport { ChargeType } from 'src/api';\n\nexport const StatementPayPageContainer: React.FC<RouteComponentProps<RouteParams>> = observer(\n    ({\n        match: {\n            params: { id },\n        },\n    }) => {\n        const {\n            initialize,\n            errorMessage,\n            paymentAmount,\n            splits\n        } = statementContainer.get(ChargeStore);\n        const { iframeMessageHandler } = statementContainer.get(PaymentGateway);\n        const store = paymentMethodsContainer.get(SavedPaymentMethodsStore);\n        React.useEffect(\n            () => {\n                initialize(id);\n                window.addEventListener('message', iframeMessageHandler);\n                return () => {\n                    window.removeEventListener('message', iframeMessageHandler);\n                };\n            },\n            []\n        );\n\n        const [errorMsg, setErrorMsg] = useState(errorMessage);\n        const [processing, setProcessing] = useState(false);\n        const [achInfoData] = useState(new AchInfoFormState());\n        const [paymentAmountData] = useState(new PaymentAmountFormState(undefined,\n            paymentAmount));\n        const [pgcardInfoData] = useState(new PGCardInfoFormState({ id, skipIFrameMessageHandler: true }));\n        const [cardInfoData] = useState(new CardInfoFormState());\n        const [payButtonText, setPayButtonText] = useState('Pay');\n        const [payButtonIcon, setPaybuttonIcon] = useState<IconNameType | undefined>();\n        const [isPaymentMethodValid, setPaymentMethodValid] = useState(false);\n        const [isSecurityCodeValid, setSecurityCodeValid] = useState(false);\n        const [, setConnectedAccounts] = useState<ConnectedBankAccount[]>([]);\n        const paymentMethodAction = useRef<(() => void)>(async () => { });\n        const paymentMethodSubmit = useRef<(() => void)>(async () => { });\n        const paymentMethodTypeRef = useRef(PaymentMethodType.PayByBank);\n        const [paymentType, setPaymentType] = useState(paymentMethodTypeRef.current);\n\n        const setPaymentMethodAction = (value: () => void) => {\n            paymentMethodAction.current = value;\n        };\n\n        const setPaymentMethodSubmit = (value: () => void) => {\n            paymentMethodSubmit.current = value;\n        }\n\n        const setPaymentMethodType = (paymentMethodType: PaymentMethodType) => {\n            paymentMethodTypeRef.current = paymentMethodType;\n            setPaymentType(paymentMethodType);\n        }\n\n        const handlePaymentSubmit = async (e?: React.FormEvent<HTMLFormElement>) => {\n            if (e) {\n                e.preventDefault();\n            }\n\n            setProcessing(true);\n            await paymentMethodAction.current();\n            await paymentMethodSubmit.current();\n            setProcessing(false);\n        };\n\n        const valid = () => {\n            let infoFormIsValid = false;\n\n            const paymentMethodType = paymentType;\n\n            if (paymentMethodType === PaymentMethodType.CreditCard) {\n                if (!store.getShowLoginLink() && store.selectedPaymentMethod) {\n                    infoFormIsValid = isSecurityCodeValid;\n                } else {\n                    if (store.usePaymentGateway()) {\n                        pgcardInfoData.form.validate();\n                    } else {\n                        cardInfoData.form.validate();\n                    }\n\n                    infoFormIsValid = store.usePaymentGateway()\n                        ? pgcardInfoData && !pgcardInfoData.form.hasError\n                        : cardInfoData && !cardInfoData.form.hasError;\n                }\n            } else if (paymentMethodType === PaymentMethodType.ACH) {\n                const maximumAmount = 250000;\n                if (store.selectedPaymentMethod) {\n                    infoFormIsValid = getPaymentAmount() <= maximumAmount;\n                } else {\n                    achInfoData.form.validate();\n                    infoFormIsValid =\n                        !achInfoData.form.hasError && getPaymentAmount() <= maximumAmount;\n                }\n            } else if (paymentMethodType === PaymentMethodType.PayByBank) {\n                infoFormIsValid = true;\n            }\n\n            return paymentAmountData && !paymentAmountData.form.hasError && isPaymentMethodValid && infoFormIsValid;\n        }\n\n        const getPaymentAmount = (): number =>\n            (paymentAmountData.isFullBalance.value\n                ? paymentAmountData.fullBalance\n                : Number(paymentAmountData.customAmount.$)) || 0;\n\n        const resetError = () => {\n            setErrorMsg(undefined);\n        };\n\n        const setPaymentButtonTextIcon = (text: string, icon?: IconNameType | undefined) => {\n            setPaybuttonIcon(icon);\n            setPayButtonText(text);\n        };\n\n        useEffect(() => {\n            store.currentSplits = splits;\n            store.currentStatementId = id;\n            store.init();\n        }, [store.init]);\n\n        useEffect(() => {\n            setErrorMsg((store.usePaymentGateway()\n                ? pgcardInfoData.errorMessage\n                : cardInfoData.errorMessage)\n                || achInfoData.errorMessage);\n        }, [pgcardInfoData, achInfoData, cardInfoData]);\n\n        useEffect(() => {\n            setErrorMsg(store.errorMessage);\n        }, [store.errorMessage]);\n\n        return (\n            <>\n                <div className={processing ? styles.fullHeight : styles.hidden}>\n                    <Spinner className={styles.spinner} />\n                    <BodyText size=\"large\" className={styles.loadingMessage}>\n                        One moment please...\n                    </BodyText>\n                </div>\n                <div className={processing ? styles.hidden : 'page pay-statement-page'}>\n                    <div className=\"page-topping\">\n                        {errorMsg && (<Banner\n                            className=\"m-b-3\"\n                            status=\"critical\"\n                            onClose={() => resetError()}\n                            icon\n                            title={errorMsg}\n                        />)}\n                        <div className=\"page-title\">\n                            <h2>Pay Balance</h2>\n                        </div>\n                    </div>\n\n                    <form onSubmit={handlePaymentSubmit}>\n                        <div className=\"page-content\">\n                            <PaymentAmount />\n                            <PaymentMethodContainer\n                                splits={splits}\n                                statementId={id}\n                                chargeType={ChargeType.NUMBER_1}\n                                paymentAmountData={paymentAmountData}\n                                cardInfoData={cardInfoData}\n                                pgcardInfoData={pgcardInfoData}\n                                achInfoData={achInfoData}\n                                usePaymentGateway={store.usePaymentGateway}\n                                showLoginLink={store.getShowLoginLink()}\n                                setPaymentMethodValid={setPaymentMethodValid}\n                                setSecurityCodeValid={setSecurityCodeValid}\n                                setPaymentMethodAction={setPaymentMethodAction}\n                                setConnectedAccounts={setConnectedAccounts}\n                                setPaymentButtonTextIcon={setPaymentButtonTextIcon}\n                                setPaymentMethodSubmit={setPaymentMethodSubmit}\n                                setPaymentMethodType={setPaymentMethodType}\n                            />\n                        </div>\n\n                        <div\n                            className={classnames(\n                                'non-sticky-button-wrapper',\n                                styles.nonStickyButtonWrapper\n                            )}\n                        >\n                            <Button\n                                type=\"submit\"\n                                variant=\"contained\"\n                                color=\"primary\"\n                                className={classnames('next-step-button', styles.nextStepButton)}\n                                disabled={!valid()}\n                            >\n                                {\n                                    payButtonIcon && (\n                                        <Icon name={payButtonIcon} className=\"m-x-1\" />)\n                                }\n                                {' '}\n                                {payButtonText}\n                            </Button>\n                        </div>\n                    </form>\n\n                    <div className=\"space-filler\" />\n                    <PageFooterContainer />\n                </div>\n            </>\n        );\n    }\n);\n","import React from 'react';\nimport { observer } from 'mobx-react';\nimport {\n    AnvilSelect,\n    AnvilSelectOptionsProps,\n    BodyText,\n    Headline,\n    InputOnChangeData,\n} from '@servicetitan/design-system';\nimport { statementContainer } from 'src/statement/ioc';\nimport { StatementStore, ExtendedCustomerModel } from 'src/statement/stores/statement.store';\nimport accounting from 'accounting';\n\nconst MAX_RESULTS = 30;\n\nexport const StatementCustomerSelector: React.FC = observer(() => {\n    const {\n        customerDropdownState,\n        customerMap,\n        selectedCustomer,\n        selectCustomer,\n        searchTerm,\n        clearSearch,\n    } = statementContainer.get(StatementStore);\n\n    const getOptions = (filter: (customer: ExtendedCustomerModel) => boolean) => {\n        const selectOptions: AnvilSelectOptionsProps[] = [];\n        customerDropdownState.options.some((op: any, i: number) => {\n            const cust = customerMap.get(op.value)!;\n            if (filter(cust)) {\n                selectOptions.push({\n                    value: cust.id,\n                    text: cust.name,\n                    content: <RenderCustomerOption customer={cust} />,\n                });\n            }\n            return i >= MAX_RESULTS - selectOptions.length;\n        });\n        return selectOptions;\n    };\n\n    const addOptionsSection = (\n        options: AnvilSelectOptionsProps[],\n        sectionName: string,\n        selectOptions: AnvilSelectOptionsProps[],\n        force: boolean = false\n    ) => {\n        if (selectOptions.length > 0 || force) {\n            options.push({\n                text: sectionName,\n                options: selectOptions,\n            });\n        }\n    };\n\n    const options: AnvilSelectOptionsProps[] = [];\n    const unpaidOptions = getOptions((customer: ExtendedCustomerModel) => customer.balance > 0);\n    addOptionsSection(options, 'UNPAID', unpaidOptions);\n    if (unpaidOptions.length < MAX_RESULTS) {\n        const paidOptions = getOptions((customer: ExtendedCustomerModel) => customer.balance === 0);\n        addOptionsSection(options, 'PAID', paidOptions);\n    }\n    if (customerDropdownState.options.length > MAX_RESULTS) {\n        addOptionsSection(\n            options,\n            'Unable to find who you are looking for? Use the search above.',\n            [],\n            true\n        );\n    }\n\n    const handleSearchChange = (_: React.SyntheticEvent, data: InputOnChangeData) => {\n        searchTerm.onChange(data.value);\n    };\n\n    const handleChange = async (data: AnvilSelectOptionsProps) => {\n        await selectCustomer(data?.value);\n    };\n\n    return (\n        <AnvilSelect\n            options={options}\n            trigger={{ placeholder: 'Select customer' }}\n            onChange={handleChange}\n            autoFlipVertically={false}\n            search={{\n                onChange: handleSearchChange,\n                value: searchTerm.value,\n                placeholder: 'Search to see more customers',\n            }}\n            scrollHeight=\"50vh\"\n            value={\n                selectedCustomer && { text: selectedCustomer?.name, value: selectedCustomer?.id }\n            }\n            onClickOutside={clearSearch}\n        />\n    );\n});\n\ninterface RenderCustomerOptionProps {\n    customer: ExtendedCustomerModel;\n}\nexport const RenderCustomerOption: React.FC<RenderCustomerOptionProps> = observer(\n    ({ customer }) => {\n        const {\n            name,\n            balance,\n            address: { streetAddress, city, state, zip },\n        } = customer;\n        return (\n            <div>\n                <Headline size=\"small\">{name}</Headline>\n                <BodyText size=\"small\" subdued>\n                    {streetAddress}\n                </BodyText>\n                <BodyText size=\"small\" subdued className=\"m-b-1\">\n                    {city}, {state} {zip}\n                </BodyText>\n                <BodyText size=\"medium\">Balance Due: {accounting.formatMoney(balance)}</BodyText>\n            </div>\n        );\n    }\n);\n","import * as React from 'react';\nimport { Stack, ButtonGroup, ButtonToggle, BodyText, Icon } from '@servicetitan/design-system';\nimport { observer } from 'mobx-react';\nimport { StatementStore, InvoiceFilter } from '../../../stores/statement.store';\nimport { address } from 'src/util/formatters';\nimport { statementContainer } from '../../../ioc';\nimport { StatementCustomerSelector } from '../../statement-customer-selector/statement-customer-selector';\n\nexport const StatementHeading: React.FC = observer(() => {\n    const { selectedCustomer, changeFilter, selectedFilter, isMultipleCustomers, overdueInvoiceCount } =\n        statementContainer.get(StatementStore);\n    const handleChangeFilter = (filter: InvoiceFilter | undefined) => {\n        changeFilter(filter || InvoiceFilter.All);\n    };\n\n    const fixedTabs = [\n        {\n            text: 'Total Outstanding',\n            value: InvoiceFilter.All,\n        },\n        {\n            text: 'Statement Balance',\n            value: InvoiceFilter.Statement,\n        },\n    ]\n\n    const pastDueTab = {\n        text: 'Past Due',\n        value: InvoiceFilter.PastDue,\n    };\n\n    const tabs = !overdueInvoiceCount ? fixedTabs : [...fixedTabs, pastDueTab]\n    return (\n        <Stack alignItems=\"flex-end\">\n            <Stack.Item>\n                <ButtonGroup>\n                    <ButtonToggle\n                        style={{ minWidth: '550px' }}\n                        options={tabs}\n                        value={selectedFilter}\n                        onChange={handleChangeFilter}\n                    />\n                </ButtonGroup>\n            </Stack.Item>\n            <Stack.Item fill />\n            {!selectedCustomer && (\n                <Stack.Item>\n                    <Icon name=\"chevron_right\" size={48} className=\"m-b-1 c-blue-400\" />\n                </Stack.Item>\n            )}\n            <Stack.Item>\n                <Stack direction=\"column\" spacing=\"1\">\n                    <BodyText el=\"div\" subdued size=\"small\">\n                        Bill To\n                    </BodyText>\n                    <div style={{ width: '320px' }}>\n                        {isMultipleCustomers ? (\n                            <StatementCustomerSelector />\n                        ) : (\n                            <BodyText medium el=\"div\">\n                                {selectedCustomer?.name}\n                            </BodyText>\n                        )}\n                    </div>\n                    <BodyText size=\"medium\" el=\"div\">\n                        {selectedCustomer && address(selectedCustomer.address)}\n                    </BodyText>\n                </Stack>\n            </Stack.Item>\n            <Stack.Item />\n        </Stack>\n    );\n});\n","import { BodyText, Stack } from '@servicetitan/design-system';\nimport * as React from 'react';\nimport { observer } from 'mobx-react';\nimport { StatementStore } from '../../../stores/statement.store';\nimport { formatMoney } from 'accounting';\nimport { statementContainer } from '../../../ioc';\nimport { ChargeStore } from '../../../stores/charge.store';\n\nexport const InvoiceGridSummary: React.FC = observer(() => {\n    const { overdueInvoiceCount, invoiceAmountTotal, invoiceBalanceTotal, previousPaymentTotal } =\n        statementContainer.get(StatementStore)!;\n    statementContainer.get(ChargeStore);\n\n    return (\n        <Stack spacing=\"5\">\n            {!!overdueInvoiceCount && (\n                <Stack.Item>\n                    <BodyText el=\"div\" subdued size=\"small\">\n                        Past Due\n                    </BodyText>\n                    <BodyText el=\"div\" className=\"c-red\">\n                        {overdueInvoiceCount}\n                    </BodyText>\n                </Stack.Item>\n            )}\n            <Stack.Item className=\"ta-right\">\n                <BodyText el=\"div\" subdued size=\"small\">\n                    Total Invoiced\n                </BodyText>\n                <BodyText el=\"div\" className=\"m-r-0 p-r-0\">\n                    {formatMoney(invoiceAmountTotal)}\n                </BodyText>\n            </Stack.Item>\n            <Stack.Item className=\"ta-right\">\n                <BodyText el=\"div\" subdued size=\"small\">\n                    Total Payments\n                </BodyText>\n                <BodyText el=\"div\">{formatMoney(previousPaymentTotal)}</BodyText>\n            </Stack.Item>\n            <Stack.Item className=\"ta-right\">\n                <BodyText el=\"div\" subdued size=\"small\">\n                    Total Balance\n                </BodyText>\n                <BodyText el=\"div\">{formatMoney(invoiceBalanceTotal)}</BodyText>\n            </Stack.Item>\n            <Stack.Item fill />\n        </Stack>\n    );\n});\n","import '@servicetitan/kendo-theme';\nimport {\n    BodyText,\n    Button,\n    Stack,\n    Form,\n    InputOnChangeData,\n    TableNoRecords,\n} from '@servicetitan/design-system';\nimport * as React from 'react';\nimport { StatementStore } from '../../../stores/statement.store';\nimport { observer } from 'mobx-react';\nimport {\n    renderCustomColumnMenuFilter,\n    DateRangeColumnMenuFilter,\n    Table,\n    TableColumn,\n    TableCellProps,\n    TableFilterCellProps,\n} from '@servicetitan/table';\nimport { localeDate } from '../../../../util/formatters';\nimport { formatMoney } from 'accounting';\nimport moment from 'moment';\nimport { statementContainer } from '../../../ioc';\nimport { RouterStore } from 'src/core/stores/router.store';\n\nexport const InvoiceGrid: React.FC = observer(() => {\n    const {\n        gridState,\n        selectedCustomer,\n        filteredInvoiceCount,\n        selectedInvoiceCount,\n        makePayment,\n        paymentAmountTotal,\n        isPaymentAllowed,\n        shouldShowDueDate\n    } = statementContainer.get(StatementStore)!;\n    const { history } = statementContainer.get(RouterStore)!;\n\n    const handleSelectAll = async () => {\n        await gridState.selectAll();\n    };\n\n    const handleDeselectAll = async () => {\n        await gridState.deselectAll();\n    };\n\n    const handlePaymentClick = () => {\n        makePayment();\n        history.push(`/statement/${selectedCustomer?.id}/pay`);\n    };\n\n    return (\n        <>\n            {isPaymentAllowed && <Button\n                className=\"m-t-2\"\n                primary\n                large\n                style={{ width: 220 }}\n                disabled={paymentAmountTotal <= 0}\n                onClick={handlePaymentClick}\n            >\n                {`Pay (${formatMoney(paymentAmountTotal)})`}\n            </Button>}\n            <Stack className=\"m-b-1 m-t-3\" alignItems=\"flex-end\" spacing=\"0\">\n                <Stack.Item>\n                    {gridState.selectedCount > 0 && (\n                        <>\n                            <BodyText el=\"span\" subdued className=\"p-r-1 fs-1\">\n                                {`${selectedInvoiceCount} of ${filteredInvoiceCount} invoices selected`}\n                            </BodyText>\n                            <Button\n                                primary\n                                xsmall\n                                text\n                                className=\"fs-1 p-y-0 p-l-0\"\n                                onClick={handleDeselectAll}\n                            >\n                                Clear selection\n                            </Button>\n                            {!gridState.isAllRowsSelected && (\n                                <Button\n                                    primary\n                                    xsmall\n                                    text\n                                    className=\"fs-1 p-y-0 p-l-0\"\n                                    onClick={handleSelectAll}\n                                >\n                                    {`Select all ${filteredInvoiceCount}`}\n                                </Button>\n                            )}\n                        </>\n                    )}\n                </Stack.Item>\n                <Stack.Item fill>&nbsp;</Stack.Item>\n            </Stack>\n\n            <Table sortable tableState={gridState} selectable resizable scrollable=\"scrollable\">\n                <TableColumn\n                    width={115}\n                    minResizableWidth={25}\n                    title=\"Invoice\"\n                    field=\"invoiceNumber\"\n                    cell={TextCell}\n                    columnMenu={renderCustomColumnMenuFilter(CMenuInner())}\n                    filter=\"text\"\n                />\n                <TableColumn\n                    width={115}\n                    minResizableWidth={25}\n                    title=\"Service Date\"\n                    field=\"serviceDate\"\n                    cell={DateCell}\n                    columnMenu={DateRangeColumnMenuFilter}\n                    filter=\"date\"\n                />\n                <TableColumn\n                    width={400}\n                    minResizableWidth={25}\n                    title=\"Service Address\"\n                    field=\"serviceAddress\"\n                    cell={AddressCell}\n                    columnMenu={renderCustomColumnMenuFilter(\n                        CMenuInner('Type any street, city, or zip code')\n                    )}\n                    filter=\"text\"\n                />\n                {shouldShowDueDate && (\n                    <TableColumn\n                        width={115}\n                        minResizableWidth={25}\n                        title=\"Due Date\"\n                        field=\"dueDate\"\n                        cell={DueDateCell}\n                        columnMenu={DateRangeColumnMenuFilter}\n                        filter=\"date\"\n                    />\n                )}\n                <TableColumn\n                    width={115}\n                    minResizableWidth={25}\n                    title=\"Invoice Date\"\n                    field=\"invoiceDate\"\n                    cell={DateCell}\n                    columnMenu={DateRangeColumnMenuFilter}\n                    filter=\"date\"\n                />\n                <TableColumn\n                    width={115}\n                    minResizableWidth={25}\n                    title=\"Invoice Amt\"\n                    field=\"invoiceTotal\"\n                    cell={MoneyCell}\n                />\n                <TableColumn\n                    width={115}\n                    minResizableWidth={25}\n                    title=\"Payments\"\n                    field=\"paymentTotal\"\n                    cell={MoneyCell}\n                />\n                <TableColumn\n                    width={115}\n                    minResizableWidth={25}\n                    title=\"Balance\"\n                    field=\"invoiceBalance\"\n                    cell={MoneyCell}\n                />\n                <TableColumn\n                    width={115}\n                    minResizableWidth={25}\n                    title=\" \"\n                    field=\"invoiceId\"\n                    cell={InvoiceLinkCell}\n                />\n                <TableNoRecords>\n                    <div className=\"ta-center m-x-auto\">\n                        <img\n                            src=\"/assets/images/book.svg\"\n                            width={102}\n                            height={98}\n                            className=\"m-b-2\"\n                        />\n                        <BodyText subdued>All of your current invoices are paid!</BodyText>\n                    </div>\n                </TableNoRecords>\n            </Table>\n        </>\n    );\n});\n\nconst CMenuInner =\n    (placeholder?: string): React.FC<TableFilterCellProps> =>\n        (props: TableFilterCellProps) => {\n            const handleFilterChange = (\n                event: React.ChangeEvent<HTMLInputElement>,\n                data: InputOnChangeData\n            ) => {\n                const filterEvent = { value: data.value, operator: 'contains', syntheticEvent: event };\n                props.onChange(filterEvent);\n            };\n            return (\n                <Form>\n                    <Form.Field>\n                        <Form.Input\n                            small\n                            placeholder={placeholder}\n                            value={props.value}\n                            onChange={handleFilterChange}\n                        />\n                    </Form.Field>\n                </Form>\n            );\n        };\n\nconst DueDateCell: React.FC<TableCellProps> = ({ dataItem, field }) => {\n    const isRed = () => {\n        if (moment().isAfter(moment(dataItem[field!]))) {\n            return 'c-red';\n        }\n        return undefined;\n    };\n    return (\n        <td>\n            <BodyText el=\"span\" size=\"medium\" className={isRed()}>\n                {localeDate(dataItem[field!])}\n            </BodyText>\n        </td>\n    );\n};\n\nconst InvoiceLinkCell: React.FC<TableCellProps> = ({ dataItem, field }) => (\n    <td>\n        <Button xsmall className=\"p-0\" fill=\"none\" primary href={`invoice/${dataItem[field!]}`}>\n            Details\n        </Button>\n    </td>\n);\n\nconst DateCell: React.FC<TableCellProps> = ({ dataItem, field }) => (\n    <td>\n        <BodyText el=\"span\" size=\"medium\">\n            {localeDate(dataItem[field!])}\n        </BodyText>\n    </td>\n);\n\nconst TextCell: React.FC<TableCellProps> = ({ dataItem, field }) => (\n    <td>\n        <BodyText el=\"span\" size=\"medium\">\n            {dataItem[field!]}\n        </BodyText>\n    </td>\n);\n\nconst AddressCell: React.FC<TableCellProps> = ({ dataItem, field }) => (\n    <td>\n        <BodyText\n            el=\"span\"\n            style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}\n            size=\"medium\"\n        >\n            {dataItem[field!]}\n        </BodyText>\n    </td>\n);\n\nconst MoneyCell: React.FC<TableCellProps> = ({ dataItem, field }) => (\n    <td className=\"ta-right\">\n        <BodyText el=\"span\" size=\"medium\">\n            {formatMoney(dataItem[field!])}\n        </BodyText>\n    </td>\n);\n","import * as React from 'react';\nimport { Stack, Card, BodyText, Layout, Headline } from '@servicetitan/design-system';\nimport { StatementHeading } from '../../statement-heading/statement-heading';\nimport { InvoiceGridSummary } from '../../invoice-grid-summary/invoice-grid-summary';\nimport { InvoiceGrid } from '../../invoice-grid/invoice-grid';\nimport { statementContainer } from 'src/statement/ioc';\nimport { StatementStore } from 'src/statement/stores/statement.store';\nimport { observer } from 'mobx-react';\n\nexport const StatementPage: React.FC = observer(() => {\n    const { selectedCustomer } = statementContainer.get(StatementStore);\n    return (\n        <Layout className=\"m-x-4 m-t-1\">\n            <Stack>\n                <Headline size=\"large\">Unpaid Invoices</Headline>\n            </Stack>\n\n            <StatementHeading />\n            {selectedCustomer !== undefined ? (\n                <Card sharp>\n                    <Card.Section>\n                        <InvoiceGridSummary />\n                    </Card.Section>\n                    <Card.Section>\n                        <InvoiceGrid />\n                    </Card.Section>\n                </Card>\n            ) : (\n                <div className=\"ta-center m-x-auto m-t-5\" style={{ width: 420 }}>\n                    <img\n                        src=\"/assets/images/Assign_Accounts_TitanPhone@2x.png\"\n                        width={136}\n                        height={111}\n                        className=\"m-b-2\"\n                    />\n                    <Headline>Whose invoices would you like to see?</Headline>\n                    <BodyText subdued>\n                        Please select a customer to view and pay their unpaid invoices.\n                    </BodyText>\n                </div>\n            )}\n        </Layout>\n    );\n});\n","import * as React from 'react';\n// @ts-ignore\nimport { StatementPage } from './desktop/statement-page';\nimport { RouteComponentProps } from 'react-router';\nimport { statementContainer } from 'src/statement/ioc';\nimport { StatementStore } from 'src/statement/stores/statement.store';\nimport { RouteParams } from '../statement-routes';\n\nexport const StatementPageContainer: React.FC<RouteComponentProps<RouteParams>> = (props) => {\n    const {\n        match: {\n            params: { id },\n        },\n    } = props!;\n    const { initialize } = statementContainer.get(StatementStore)!;\n    React.useEffect(() => {\n        initialize(id);\n        return () => {};\n    }, [initialize, id]);\n\n    return <StatementPage {...props} />;\n};\n\nexport const MultipleStatementPageContainer: React.FC<RouteComponentProps<RouteParams>> = (\n    props\n) => {\n    const {\n        match: {\n            params: { id },\n        },\n    } = props!;\n    const { initialize } = statementContainer.get(StatementStore)!;\n    React.useEffect(() => {\n        initialize();\n        return () => {};\n    }, [initialize, id]);\n\n    return <StatementPage {...props} />;\n};\n","import * as React from 'react';\nimport { Button } from '@servicetitan/design-system';\nimport { statementContainer } from '../../../ioc';\nimport { ChargeStore } from '../../../stores/charge.store';\nimport { RouteComponentProps } from 'react-router';\nimport { RouteParams } from '../../statement-routes';\nimport { observer } from 'mobx-react-lite';\nimport { PageFooterContainer } from 'src/core/components/page-footer/page-footer';\nimport { paymentMethodsContainer } from 'src/payment-method/ioc';\nimport { SavedPaymentMethodsStore } from 'src/payment-method/stores/saved-payment-methods.store';\n\nimport styles from './confirm-payment.less';\nimport { currency } from 'src/util/formatters';\nimport classnames from 'classnames';\nimport { ClientDataStore } from 'src/core/stores/client-data.store';\n\nexport const ConfirmPayment: React.FC<RouteComponentProps<RouteParams>> = observer(\n    ({\n        match: {\n            params: { id },\n        },\n    }) => {\n        const chargeStore = statementContainer.get(ChargeStore);\n        const paymentMethodStore = paymentMethodsContainer.get(SavedPaymentMethodsStore);\n        const clientDataStore = paymentMethodsContainer.get(ClientDataStore);\n\n        React.useEffect(() => {\n            if(!clientDataStore.isInitialized) clientDataStore.init();\n        }, [clientDataStore.init]);\n\n        const confirmation = paymentMethodStore.getCachedConfirmation(id);\n\n        React.useEffect(() => {\n            chargeStore.initializeConfirmationPage(id);\n            return () => { };\n        }, [chargeStore.initializeConfirmationPage, id]);\n        return (\n            <div className={classnames('page', styles.page)}>\n                <div className=\"page-topping\">\n                    <div className=\"page-title\">\n                        <h2>Payment Completed.</h2>\n                    </div>\n                </div>\n                <div className=\"page-content\">\n                    <div className=\"centered-content\">\n                        <img\n                            src=\"/assets/images/confirmationIcon.png\"\n                            srcSet=\"/assets/images/confirmationIcon.png, /assets/images/confirmationIcon@2x.png 2x, /assets/images/confirmationIcon@3x.png 3x\"\n                        />\n                        <div className={styles.transactionNumber}>\n                            Confirmation #{confirmation?.transaction || chargeStore.authCode}\n                        </div>\n                        <div className={styles.balance}>\n                            <div\n                                className={classnames(styles.paid, {\n                                    [styles.partialPaid]: (confirmation?.remainingBalance || chargeStore.remainingBalance) > 0,\n                                })}\n                            >\n                                <div>{currency(confirmation?.amountPaid || chargeStore.paymentAmount)}</div>\n                                <div className={styles.label}>Amount Paid</div>\n                            </div>\n                            {(confirmation?.remainingBalance || chargeStore.remainingBalance) > 0 ? (\n                                <div className={styles.remaining}>\n                                    <div>{currency(confirmation?.remainingBalance || chargeStore.remainingBalance)}</div>\n                                    <div className={styles.label}>Remaining Balance</div>\n                                </div>\n                            ) : null}\n                        </div>\n\n                        <div className={styles.email}>\n                            You will receive an email confirmation shortly.\n                        </div>\n\n                        {!paymentMethodStore.getIsLoggedIn() && (<div className={styles.signDetails}>\n                            <p><a className={styles.links} href={clientDataStore.createTenantURL('/login')}>Create an Account</a>{' '}to save your payment information</p>\n                            <p><a className={styles.links} href={clientDataStore.createTenantURL('/login')}>Sign In</a>{' '}for a 1-click checkout in the future</p>\n                        </div>)}\n                    </div>\n                    {(confirmation?.remainingBalance || chargeStore.remainingBalance) > 0 ? (\n                        <div\n                            className={classnames(\n                                'non-sticky-button-wrapper',\n                                styles.nonStickyButtonWrapper\n                            )}\n                        >\n                            <Button\n                                className={classnames('next-step-button', styles.nextStepButton)}\n                                variant=\"contained\"\n                                color=\"primary\"\n                                onClick={() => chargeStore.backToSelectionPage(id)}\n                            >\n                                Pay Outstanding Balance\n                            </Button>\n                        </div>\n                    ) : null}\n                </div>\n                <div className=\"space-filler\" />\n                <PageFooterContainer />\n            </div>\n        );\n    }\n);\n","import React, { FC, useEffect, useState } from 'react';\nimport { Stack, Text, Grid } from '@servicetitan/design-system';\nimport { observer } from 'mobx-react';\nimport { ChargeStore } from '../../../stores/charge.store';\nimport { formatMoney } from 'accounting';\nimport { statementContainer } from '../../../ioc';\n\nimport styles from './payment-amount.less';\nimport { Invoice, SplitInfo } from 'src/api';\nimport { SavedPaymentMethodsStore } from 'src/payment-method/stores/saved-payment-methods.store';\nimport { paymentMethodsContainer } from 'src/payment-method/ioc';\n\nexport const PaymentAmount: React.FC = observer(() => {\n    const { outstandingBalance, splits } =\n        statementContainer.get(ChargeStore)!;\n\n    const paymentMethodStore = paymentMethodsContainer.get(SavedPaymentMethodsStore);\n\n    let paymentAmount = 0;\n\n    splits.forEach(s => { paymentAmount += s.amountApplied });\n\n    return (\n        <>\n            <PaymentAmountHeader\n                splits={splits}\n                store={paymentMethodStore} />\n            <PaymentAmountFooter\n                outstandingBalance={outstandingBalance}\n                statementBalance={paymentAmount}\n            />\n        </>\n    );\n});\n\ninterface PaymentAmountFooterProps {\n    outstandingBalance?: number;\n    statementBalance?: number;\n};\n\nconst PaymentAmountFooter: FC<PaymentAmountFooterProps> = (props) => (\n    <Grid columns={2}>\n        <Grid.Column>\n            <Text bold size={3}>\n                Payment Amount\n            </Text>\n            <Text subdued size={1} className={styles.balanceTitle}>\n                {props.outstandingBalance ? 'Total Outstanding Balance' :\n                    'Statement Balance'}\n            </Text>\n        </Grid.Column>\n        <Grid.Column>\n            {props.statementBalance ? (\n                <Stack justifyContent=\"space-between\">\n                    <Stack.Item />\n                    <Stack.Item>\n                        <Text size={3} bold>\n                            {formatMoney(props.statementBalance)}\n                        </Text>\n                    </Stack.Item>\n                </Stack>\n            ) : null}\n            {props.outstandingBalance ? (\n                <Stack justifyContent=\"space-between\">\n                    <Stack.Item />\n                    <Stack.Item>\n                        <Text size={3} bold>\n                            {formatMoney(props.outstandingBalance)}\n                        </Text>\n                    </Stack.Item>\n                </Stack>\n            ) : null}\n        </Grid.Column>\n    </Grid>\n);\n\ninterface PaymentAmountHeaderProps {\n    splits: SplitInfo[];\n    store: SavedPaymentMethodsStore;\n};\n\n\nconst PaymentAmountHeader: FC<PaymentAmountHeaderProps> = (props) => {\n\n    const [isExpanded, setIsExpanded] = useState(false);\n    const [invoices, setInvoices] = useState<Invoice[]>([]);\n\n    const loadInvoices = async () => {\n        const splits = props.splits;\n        const invoiceIds: string[] = [];\n\n        splits.forEach(split => invoiceIds.push(split.invoiceId!));\n        const invoiceList = await props.store.getInvoicesById(invoiceIds);\n        setInvoices(invoiceList);\n    };\n\n    const onExpand = () => {\n        setIsExpanded(!isExpanded);\n    }\n\n    useEffect(() => {\n        loadInvoices();\n    }, []);\n\n    return (\n        <>\n            <Grid columns={2} className={styles.paymentAmountHeader}>\n                <Grid.Column>\n                    <Text bold size={3}>\n                        Number of invoices\n                    </Text>\n                    <Text onClick={onExpand} subdued size={1} className={styles.showInvoicesLink}>\n                        {isExpanded ? 'Hide Invoices' : 'Show Invoices'}\n                    </Text>\n                </Grid.Column>\n                <Grid.Column>\n                    <Stack justifyContent=\"space-between\">\n                        <Stack.Item />\n                        <Stack.Item>\n                            <Text subdued size={1} className={styles.invoiceSelectedCount}>{props.splits.length} selected</Text>\n                        </Stack.Item>\n                    </Stack>\n                </Grid.Column>\n            </Grid>\n            {isExpanded && (<div className={styles.invoiceListContainer}>\n                <Grid columns={2}>\n                    <Grid.Column>\n                        <Text subdued size={1} bold className={styles.invoiceListHeader}>\n                            Invoice Number\n                        </Text>\n                        {invoices.map((invoice) =>\n                            <Grid.Row key={invoice.id}>\n                                <Text subdued size={1} className={styles.invoiceListRow}>\n                                    {invoice.number}\n                                </Text>\n                            </Grid.Row>\n                        )}\n                    </Grid.Column>\n                    <Grid.Column>\n                        <Stack justifyContent=\"space-between\">\n                            <Stack.Item />\n                            <Stack.Item>\n                                <Text subdued size={1} bold className={styles.invoiceListHeader}>\n                                    Outstanding Balance\n                                </Text>\n                            </Stack.Item>\n                        </Stack>\n                        {invoices.map((invoice) =>\n                            <Grid.Row key={invoice.id}>\n                                <Stack justifyContent=\"space-between\">\n                                    <Stack.Item />\n                                    <Stack.Item>\n                                        <Text subdued size={1} className={styles.invoiceListRow}>\n                                            {formatMoney(invoice.balance)}\n                                        </Text>\n                                    </Stack.Item>\n                                </Stack>\n                            </Grid.Row>\n                        )}\n                    </Grid.Column>\n                </Grid>\n            </div>)}\n        </>\n    )\n};\n","import { RouteComponentProps } from 'react-router';\nimport { RouteParams } from '../statement-routes';\nimport { observer } from 'mobx-react-lite';\nimport { statementContainer } from '../../ioc';\nimport { Stack, Button, Text } from '@servicetitan/design-system';\nimport React from 'react';\nimport { PaymentAmount } from '../payment-amount/mobile/payment-amount';\nimport { RouterStore } from 'src/core/stores/router.store';\nimport { ChargeStore } from 'src/statement/stores/charge.store';\n\nexport const StatementAmountPageContainer: React.FC<RouteComponentProps<RouteParams>> = observer(\n    ({\n        match: {\n            params: { id },\n        },\n    }) => {\n        const { history } = statementContainer.get(RouterStore)!;\n        const { initialize } = statementContainer.get(ChargeStore);\n        React.useEffect(() => {\n            initialize(id);\n            return () => { };\n        }, [initialize, id]);\n        const handleAmountConfirmClick = () => {\n            history.replace(`/statement/${id}/pay`);\n        };\n        return (\n            <div className=\"page\">\n                <Stack\n                    direction=\"column\"\n                    justifyContent=\"space-between\"\n                    className=\"m-y-2 page-content flex-auto\"\n                >\n                    <Stack.Item>\n                        <Stack\n                            direction=\"column\"\n                            justifyContent=\"space-between\"\n                            style={{ height: '200px' }}\n                        >\n                            <Stack.Item alignSelf=\"center\">\n                                <Text bold size={3}>\n                                    Payment Amount\n                                </Text>\n                            </Stack.Item>\n                            <Stack.Item>\n                                <PaymentAmount />\n                            </Stack.Item>\n                        </Stack>\n                    </Stack.Item>\n                    <Stack.Item>\n                        <Button\n                            full\n                            className=\"m-x-0-i m-t-2\"\n                            primary\n                            onClick={handleAmountConfirmClick}\n                        >\n                            Next\n                        </Button>\n                    </Stack.Item>\n                </Stack>\n            </div>\n        );\n    }\n);\n","import * as React from 'react';\nimport { Route, Switch } from 'react-router';\nimport { ErrorPage } from 'src/core/components/error-page/error-page';\nimport { PrivateRoute } from 'src/routes';\nimport '@servicetitan/anvil-fonts/dist/css/anvil-fonts.css';\nimport '@servicetitan/design-system/dist/system.min.css';\nimport { StatementPayPageContainer } from './statement-pay-page/statement-pay-page';\nimport {\n    StatementPageContainer,\n    MultipleStatementPageContainer,\n} from './statement-page/statement-page-container';\nimport { ConfirmPayment } from './confirm-payment/confirm-payment';\nimport { StatementAmountPageContainer } from './amount-confirm-page/amount-confirm-page';\n\nexport interface RouteParams {\n    id: string;\n}\n\nexport const StatementRoutes: React.FC = () => (\n    <Switch>\n        <Route\n            exact\n            path=\"/statement/expired-link\"\n            component={() => <ErrorPage type=\"expired-link\" />}\n        />\n        <Route exact path=\"/statement/not-found\" component={() => <ErrorPage type=\"not-found\" />} />\n        <PrivateRoute exact path=\"/statements\" component={MultipleStatementPageContainer} />\n        <PrivateRoute\n            allowAnonStatements\n            exact\n            path=\"/statement/:id\"\n            component={StatementPageContainer}\n        />\n        <PrivateRoute\n            allowAnonStatements\n            exact\n            path=\"/statement/:id/pay\"\n            component={StatementPayPageContainer}\n        />\n        <PrivateRoute\n            allowAnonStatements\n            exact\n            path=\"/statement/:id/confirm-payment/:transaction\"\n            component={ConfirmPayment}\n        />\n        <PrivateRoute\n            allowAnonStatements\n            exact\n            path=\"/statement/:id/amount\"\n            component={StatementAmountPageContainer}\n        />\n        <Route component={() => <ErrorPage type=\"not-found\" />} />\n    </Switch>\n);\n"],"sourceRoot":""}