QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-18 05:40:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'develop' into big-116-open-up-the-link-component

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2024-02-24 00:47:35 +02:00
committed by GitHub
parent 5be3ca75f4 3faeca20a9
commit ecfdba9634
383 changed files with 6841 additions and 1990 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/webapp/src/containers/Authentication/Login.tsx
View File

@@ -70,7 +70,7 @@ function LoginFooterLinks() {
<AuthFooterLinks>
{!signupDisabled && (
<AuthFooterLink>
Don't have an account? <Link to={'/auth/register'}>Sign up</Link>
<T id={'dont_have_an_account'} /> <Link to={'/auth/register'}><T id={'sign_up'} /></Link>
</AuthFooterLink>
)}
<AuthFooterLink>

2
packages/webapp/src/containers/Authentication/Register.tsx
View File

@@ -87,7 +87,7 @@ function RegisterFooterLinks() {
return (
<AuthFooterLinks>
<AuthFooterLink>
Return to <Link to={'/auth/login'}>Sign In</Link>
<T id={'return_to'} /> <Link to={'/auth/login'}><T id={'sign_in'} /></Link>
</AuthFooterLink>
<AuthFooterLink>

6
packages/webapp/src/containers/Authentication/ResetPassword.tsx
View File

@@ -5,7 +5,7 @@ import { Formik } from 'formik';
import { Intent, Position } from '@blueprintjs/core';
import { Link, useParams, useHistory } from 'react-router-dom';
import { AppToaster } from '@/components';
import { AppToaster, FormattedMessage as T } from '@/components';
import { useAuthResetPassword } from '@/hooks/query';
import AuthInsider from '@/containers/Authentication/AuthInsider';
@@ -86,11 +86,11 @@ function ResetPasswordFooterLinks() {
<AuthFooterLinks>
{!signupDisabled && (
<AuthFooterLink>
Don't have an account? <Link to={'/auth/register'}>Sign up</Link>
<T id={'dont_have_an_account'} /> <Link to={'/auth/register'}><T id={'sign_up'} /></Link>
</AuthFooterLink>
)}
<AuthFooterLink>
Return to <Link to={'/auth/login'}>Sign In</Link>
<T id={'return_to'} /> <Link to={'/auth/login'}><T id={'sign_in'} /></Link>
</AuthFooterLink>
</AuthFooterLinks>
);

6
packages/webapp/src/containers/Authentication/SendResetPassword.tsx
View File

@@ -5,7 +5,7 @@ import { Formik } from 'formik';
import { Link, useHistory } from 'react-router-dom';
import { Intent } from '@blueprintjs/core';
import { AppToaster } from '@/components';
import { AppToaster, FormattedMessage as T } from '@/components';
import { useAuthSendResetPassword } from '@/hooks/query';
import SendResetPasswordForm from './SendResetPasswordForm';
@@ -82,11 +82,11 @@ function SendResetPasswordFooterLinks() {
<AuthFooterLinks>
{!signupDisabled && (
<AuthFooterLink>
Don't have an account? <Link to={'/auth/register'}>Sign up</Link>
<T id={'dont_have_an_account'} /> <Link to={'/auth/register'}><T id={'sign_up'} /></Link>
</AuthFooterLink>
)}
<AuthFooterLink>
Return to <Link to={'/auth/login'}>Sign In</Link>
<T id={'return_to'} /> <Link to={'/auth/login'}><T id={'sign_in'} /></Link>
</AuthFooterLink>
</AuthFooterLinks>
);

5
packages/webapp/src/containers/Authentication/SendResetPasswordForm.tsx
View File

@@ -14,8 +14,7 @@ export default function SendResetPasswordForm({ isSubmitting }) {
return (
<Form>
<TopParagraph>
Enter the email address associated with your account and we'll send you
a link to reset your password.
<T id={'enter_the_email_address_associated_with_your_account'} />
</TopParagraph>
<FFormGroup name={'crediential'} label={<T id={'email_address'} />}>
@@ -29,7 +28,7 @@ export default function SendResetPasswordForm({ isSubmitting }) {
large={true}
loading={isSubmitting}
>
Reset Password
<T id={'reset_password'} />
</AuthSubmitButton>
</Form>
);

5
packages/webapp/src/containers/Drawers/CreditNoteDetailDrawer/CreditNoteDetailTableFooter.tsx
View File

@@ -1,12 +1,9 @@
// @ts-nocheck
import React from 'react';
import styled from 'styled-components';
import {
T,
TotalLines,
TotalLine,
FormatNumber,
TotalLineBorderStyle,
TotalLineTextStyle,
} from '@/components';
@@ -23,7 +20,7 @@ export default function CreditNoteDetailTableFooter() {
<CreditNoteTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'credit_note.drawer.label_subtotal'} />}
value={<FormatNumber value={creditNote.formatted_amount} />}
value={creditNote.formatted_subtotal}
/>
<TotalLine
title={<T id={'credit_note.drawer.label_total'} />}

3
packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailTableFooter.tsx
View File

@@ -8,7 +8,6 @@ import {
TotalLine,
TotalLineBorderStyle,
TotalLineTextStyle,
FormatNumber,
} from '@/components';
import { useEstimateDetailDrawerContext } from './EstimateDetailDrawerProvider';
@@ -23,7 +22,7 @@ export default function EstimateDetailTableFooter() {
<EstimateTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'estimate.details.subtotal'} />}
value={<FormatNumber value={estimate.amount} />}
value={estimate.formatted_subtotal}
borderStyle={TotalLineBorderStyle.SingleDark}
/>
<TotalLine

8
packages/webapp/src/containers/Drawers/EstimateDetailDrawer/utils.tsx
View File

@@ -2,7 +2,7 @@
import React from 'react';
import intl from 'react-intl-universal';
import { getColumnWidth } from '@/utils';
import { FormatNumberCell, TextOverviewTooltipCell } from '@/components';
import { TextOverviewTooltipCell } from '@/components';
import { useEstimateDetailDrawerContext } from './EstimateDetailDrawerProvider';
/**
@@ -35,9 +35,8 @@ export const useEstimateReadonlyEntriesColumns = () => {
},
{
Header: intl.get('quantity'),
accessor: 'quantity',
Cell: FormatNumberCell,
width: getColumnWidth(entries, 'quantity', {
accessor: 'quantity_formatted',
width: getColumnWidth(entries, 'quantity_formatted', {
minWidth: 60,
magicSpacing: 5,
}),
@@ -59,7 +58,6 @@ export const useEstimateReadonlyEntriesColumns = () => {
{
Header: intl.get('amount'),
accessor: 'total_formatted',
Cell: FormatNumberCell,
width: getColumnWidth(entries, 'total_formatted', {
minWidth: 60,
magicSpacing: 5,

5
packages/webapp/src/containers/Drawers/PaymentReceiveDetailDrawer/PaymentReceiveDetailTableFooter.tsx
View File

@@ -3,10 +3,9 @@ import React from 'react';
import styled from 'styled-components';
import {
FormatNumber,
T,
TotalLineTextStyle,
TotalLineBorderStyle,
T,
TotalLine,
TotalLines,
} from '@/components';
@@ -27,7 +26,7 @@ export default function PaymentReceiveDetailTableFooter() {
>
<TotalLine
title={<T id={'payment_receive.details.subtotal'} />}
value={<FormatNumber value={paymentReceive.amount} />}
value={paymentReceive.subtotal_formatted}
/>
<TotalLine
title={<T id={'payment_receive.details.total'} />}

12
packages/webapp/src/containers/Drawers/PaymentReceiveDetailDrawer/utils.tsx
View File

@@ -10,7 +10,7 @@ import {
MenuItem,
Menu,
} from '@blueprintjs/core';
import { Icon, FormatNumberCell } from '@/components';
import { Icon } from '@/components';
import { getColumnWidth } from '@/utils';
import { usePaymentReceiveDetailContext } from './PaymentReceiveDetailProvider';
@@ -40,9 +40,8 @@ export const usePaymentReceiveEntriesColumns = () => {
},
{
Header: intl.get('invoice_amount'),
accessor: 'invoice.balance',
Cell: FormatNumberCell,
width: getColumnWidth(entries, 'invoice.balance', {
accessor: 'invoice.total_formatted',
width: getColumnWidth(entries, 'invoice.total_formatted', {
minWidth: 60,
magicSpacing: 5,
}),
@@ -51,10 +50,9 @@ export const usePaymentReceiveEntriesColumns = () => {
},
{
Header: intl.get('amount_due'),
accessor: 'invoice.due_amount',
Cell: FormatNumberCell,
accessor: 'invoice.due_amount_formatted',
align: 'right',
width: getColumnWidth(entries, 'invoice.due_amount', {
width: getColumnWidth(entries, 'invoice.due_amount_formatted', {
minWidth: 60,
magicSpacing: 5,
}),

2
packages/webapp/src/containers/Drawers/ReceiptDetailDrawer/ReceiptDetailTableFooter.tsx
View File

@@ -23,7 +23,7 @@ export default function ReceiptDetailTableFooter() {
<ReceiptTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'receipt.details.subtotal'} />}
value={receipt.formatted_amount}
value={receipt.formatted_subtotal}
/>
<TotalLine
title={<T id={'receipt.details.total'} />}

7
packages/webapp/src/containers/Drawers/VendorCreditDetailDrawer/JournalEntriesTransactions/components.tsx
View File

@@ -13,7 +13,6 @@ export const useJournalEntriesTransactionsColumns = () => {
() => [
{
Header: intl.get('date'),
accessor: 'date',
accessor: 'formatted_date',
Cell: FormatDateCell,
width: 140,
@@ -34,15 +33,17 @@ export const useJournalEntriesTransactionsColumns = () => {
},
{
Header: intl.get('credit'),
accessor: ({ credit }) => credit.formatted_amount,
accessor: 'credit.formatted_amount',
width: 100,
className: 'credit',
align: 'right',
},
{
Header: intl.get('debit'),
accessor: ({ debit }) => debit.formatted_amount,
accessor: 'debit.formatted_amount',
width: 100,
className: 'debit',
align: 'right',
},
],
[],

3
packages/webapp/src/containers/Drawers/VendorCreditDetailDrawer/VendorCreditDetailDrawerFooter.tsx
View File

@@ -8,7 +8,6 @@ import {
TotalLine,
TotalLineBorderStyle,
TotalLineTextStyle,
FormatNumber,
} from '@/components';
import { useVendorCreditDetailDrawerContext } from './VendorCreditDetailDrawerProvider';
@@ -23,7 +22,7 @@ export default function VendorCreditDetailDrawerFooter() {
<VendorCreditTotalLines labelColWidth={'180px'} amountColWidth={'180px'}>
<TotalLine
title={<T id={'vendor_credit.drawer.label_subtotal'} />}
value={vendorCredit.formatted_amount}
value={vendorCredit.formatted_subtotal}
borderStyle={TotalLineBorderStyle.SingleDark}
/>
<TotalLine

5
packages/webapp/src/containers/Drawers/VendorCreditDetailDrawer/utils.tsx
View File

@@ -49,9 +49,8 @@ export const useVendorCreditReadonlyEntriesTableColumns = () => {
},
{
Header: intl.get('quantity'),
accessor: 'quantity',
Cell: FormatNumberCell,
width: getColumnWidth(entries, 'quantity', {
accessor: 'quantity_formatted',
width: getColumnWidth(entries, 'quantity_formatted', {
minWidth: 60,
magicSpacing: 5,
}),

6
packages/webapp/src/containers/FinancialStatements/APAgingSummary/APAgingSummary.tsx
View File

@@ -15,6 +15,8 @@ import { APAgingSummarySheetLoadingBar } from './components';
import withAPAgingSummaryActions from './withAPAgingSummaryActions';
import { compose } from '@/utils';
import { APAgingSummaryPdfDialog } from './dialogs/APAgingSummaryPdfDialog';
import { DialogsName } from '@/constants/dialogs';
/**
* A/P aging summary report.
@@ -68,6 +70,10 @@ function APAgingSummary({
<APAgingSummaryBody organizationName={organizationName} />
</FinancialStatement>
</DashboardPageContent>
<APAgingSummaryPdfDialog
dialogName={DialogsName.APAgingSummaryPdfPreview}
/>
</APAgingSummaryProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryActionsBar.tsx
View File

@@ -21,6 +21,8 @@ import withAPAgingSummary from './withAPAgingSummary';
import withAPAgingSummaryActions from './withAPAgingSummaryActions';
import { saveInvoke, compose } from '@/utils';
import { DialogsName } from '@/constants/dialogs';
import withDialogActions from '@/containers/Dialog/withDialogActions';
/**
* AP Aging summary sheet - Actions bar.
@@ -32,6 +34,9 @@ function APAgingSummaryActionsBar({
// #withARAgingSummaryActions
toggleAPAgingSummaryFilterDrawer: toggleFilterDrawerDisplay,
// #withDialogActions
openDialog,
//#ownProps
numberFormat,
onNumberFormatSubmit,
@@ -52,6 +57,11 @@ function APAgingSummaryActionsBar({
saveInvoke(onNumberFormatSubmit, numberFormat);
};
// Handle the print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.APAgingSummaryPdfPreview);
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -106,6 +116,7 @@ function APAgingSummaryActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<APAgingSummaryExportMenu />}
@@ -129,4 +140,5 @@ export default compose(
withAPAgingSummary(({ APAgingSummaryFilterDrawer }) => ({
isFilterDrawerOpen: APAgingSummaryFilterDrawer,
})),
withDialogActions
)(APAgingSummaryActionsBar);

12
packages/webapp/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryDialogs.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { DialogsName } from '@/constants/dialogs';
import { APAgingSummaryPdfDialog } from './dialogs/APAgingSummaryPdfDialog';
export function APAgingSummaryDialogs() {
return (
<>
<APAgingSummaryPdfDialog
dialogName={DialogsName.APAgingSummaryPdfPreview}
/>
</>
);
}

10
packages/webapp/src/containers/FinancialStatements/APAgingSummary/APAgingSummaryProvider.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { useMemo, createContext, useContext } from 'react';
import { useMemo, createContext, useContext } from 'react';
import FinancialReportPage from '../FinancialReportPage';
import { useAPAgingSummaryReport } from '@/hooks/query';
@@ -12,22 +12,22 @@ const APAgingSummaryContext = createContext();
*/
function APAgingSummaryProvider({ filter, ...props }) {
// Transformers the filter from to the Url query.
const query = useMemo(() => transformFilterFormToQuery(filter), [filter]);
const httpQuery = useMemo(() => transformFilterFormToQuery(filter), [filter]);
const {
data: APAgingSummary,
isLoading: isAPAgingLoading,
isFetching: isAPAgingFetching,
refetch,
} = useAPAgingSummaryReport(query, { keepPreviousData: true });
} = useAPAgingSummaryReport(httpQuery, { keepPreviousData: true });
const provider = {
APAgingSummary,
isAPAgingLoading,
isAPAgingFetching,
refetch,
query,
query: httpQuery,
httpQuery,
};
return (

11
packages/webapp/src/containers/FinancialStatements/APAgingSummary/components.tsx
View File

@@ -49,11 +49,8 @@ export function APAgingSummarySheetLoadingBar() {
*/
export function APAgingSummaryExportMenu() {
const toastKey = useRef(null);
const commonToastConfig = {
isCloseButtonShown: true,
timeout: 2000,
};
const { query } = useAPAgingSummaryContext();
const commonToastConfig = { isCloseButtonShown: true, timeout: 2000 };
const { httpQuery } = useAPAgingSummaryContext();
const openProgressToast = (amount: number) => {
return (
@@ -70,7 +67,7 @@ export function APAgingSummaryExportMenu() {
);
};
// Export the report to xlsx.
const { mutateAsync: xlsxExport } = useAPAgingSheetXlsxExport(query, {
const { mutateAsync: xlsxExport } = useAPAgingSheetXlsxExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
@@ -89,7 +86,7 @@ export function APAgingSummaryExportMenu() {
},
});
// Export the report to csv.
const { mutateAsync: csvExport } = useAPAgingSheetCsvExport(query, {
const { mutateAsync: csvExport } = useAPAgingSheetCsvExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({

39
packages/webapp/src/containers/FinancialStatements/APAgingSummary/dialogs/APAgingSummaryPdfDialog/APAgingSummaryPdfDialog.tsx Normal file
View File

@@ -0,0 +1,39 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const APAgingSummaryPdfDialogContent = lazy(
() => import('./APAgingSummaryPdfDialogContent'),
);
/**
* A/P aging summary pdf preview dialog.
* @returns {React.ReactNode}
*/
function APAgingSummaryPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'A/P Aging Summary Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<APAgingSummaryPdfDialogContent />
</DialogSuspense>
</Dialog>
);
}
export const APAgingSummaryPdfDialog = compose(withDialogRedux())(
APAgingSummaryPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/APAgingSummary/dialogs/APAgingSummaryPdfDialog/APAgingSummaryPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { useAPAgingSummaryPdf } from '@/hooks/query';
import { AnchorButton } from '@blueprintjs/core';
import { useAPAgingSummaryContext } from '../../APAgingSummaryProvider';
export default function APAgingSummaryPdfDialogContent() {
const { httpQuery } = useAPAgingSummaryContext();
const { isLoading, pdfUrl } = useAPAgingSummaryPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'AP_aging_summary.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/APAgingSummary/dialogs/APAgingSummaryPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './APAgingSummaryPdfDialog';

25
packages/webapp/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummary.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { useState, useCallback, useEffect } from 'react';
import { useCallback, useEffect } from 'react';
import moment from 'moment';
import ARAgingSummaryHeader from './ARAgingSummaryHeader';
@@ -13,6 +13,8 @@ import { ARAgingSummaryBody } from './ARAgingSummaryBody';
import withARAgingSummaryActions from './withARAgingSummaryActions';
import { useARAgingSummaryQuery } from './common';
import { ARAgingSummaryPdfDialog } from './dialogs/ARAgingSummaryPdfDialog';
import { DialogsName } from '@/constants/dialogs';
import { compose } from '@/utils';
/**
@@ -25,13 +27,16 @@ function ReceivableAgingSummarySheet({
const { query, setLocationQuery } = useARAgingSummaryQuery();
// Handle filter submit.
const handleFilterSubmit = useCallback((filter) => {
const _filter = {
...filter,
asDate: moment(filter.asDate).format('YYYY-MM-DD'),
};
setLocationQuery(_filter);
}, [setLocationQuery]);
const handleFilterSubmit = useCallback(
(filter) => {
const _filter = {
...filter,
asDate: moment(filter.asDate).format('YYYY-MM-DD'),
};
setLocationQuery(_filter);
},
[setLocationQuery],
);
// Handle number format submit.
const handleNumberFormatSubmit = (numberFormat) => {
@@ -60,6 +65,10 @@ function ReceivableAgingSummarySheet({
<ARAgingSummaryBody />
</FinancialStatement>
</DashboardPageContent>
<ARAgingSummaryPdfDialog
dialogName={DialogsName.ARAgingSummaryPdfPreview}
/>
</ARAgingSummaryProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryActionsBar.tsx
View File

@@ -17,9 +17,11 @@ import NumberFormatDropdown from '@/components/NumberFormatDropdown';
import { useARAgingSummaryContext } from './ARAgingSummaryProvider';
import withARAgingSummaryActions from './withARAgingSummaryActions';
import withARAgingSummary from './withARAgingSummary';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { compose, safeInvoke } from '@/utils';
import { ARAgingSummaryExportMenu } from './components';
import { DialogsName } from '@/constants/dialogs';
/**
* A/R Aging summary sheet - Actions bar.
@@ -31,6 +33,9 @@ function ARAgingSummaryActionsBar({
// #withReceivableAgingActions
toggleARAgingSummaryFilterDrawer: toggleDisplayFilterDrawer,
// #withDialogActions
openDialog,
// #ownProps
numberFormat,
onNumberFormatSubmit,
@@ -51,6 +56,11 @@ function ARAgingSummaryActionsBar({
safeInvoke(onNumberFormatSubmit, numberFormat);
};
// Handles the print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.ARAgingSummaryPdfPreview)
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -107,6 +117,7 @@ function ARAgingSummaryActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<ARAgingSummaryExportMenu />}
@@ -130,4 +141,5 @@ export default compose(
withARAgingSummary(({ ARAgingSummaryFilterDrawer }) => ({
isFilterDrawerOpen: ARAgingSummaryFilterDrawer,
})),
withDialogActions,
)(ARAgingSummaryActionsBar);

10
packages/webapp/src/containers/FinancialStatements/ARAgingSummary/ARAgingSummaryProvider.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { useMemo, createContext, useContext } from 'react';
import { useMemo, createContext, useContext } from 'react';
import FinancialReportPage from '../FinancialReportPage';
import { useARAgingSummaryReport } from '@/hooks/query';
import { transformFilterFormToQuery } from '../common';
@@ -11,10 +11,7 @@ const ARAgingSummaryContext = createContext();
*/
function ARAgingSummaryProvider({ filter, ...props }) {
// Transformes the filter from to the url query.
const requestQuery = useMemo(
() => transformFilterFormToQuery(filter),
[filter],
);
const httpQuery = useMemo(() => transformFilterFormToQuery(filter), [filter]);
// A/R aging summary sheet context.
const {
@@ -22,13 +19,14 @@ function ARAgingSummaryProvider({ filter, ...props }) {
isLoading: isARAgingLoading,
isFetching: isARAgingFetching,
refetch,
} = useARAgingSummaryReport(requestQuery, { keepPreviousData: true });
} = useARAgingSummaryReport(httpQuery, { keepPreviousData: true });
const provider = {
ARAgingSummary,
isARAgingLoading,
isARAgingFetching,
refetch,
httpQuery,
};
return (

6
packages/webapp/src/containers/FinancialStatements/ARAgingSummary/components.tsx
View File

@@ -53,7 +53,7 @@ export function ARAgingSummaryExportMenu() {
isCloseButtonShown: true,
timeout: 2000,
};
const { query } = useARAgingSummaryContext();
const { httpQuery } = useARAgingSummaryContext();
const openProgressToast = (amount: number) => {
return (
@@ -71,7 +71,7 @@ export function ARAgingSummaryExportMenu() {
};
// Export the report to xlsx.
const { mutateAsync: xlsxExport } = useARAgingSheetXlsxExport(query, {
const { mutateAsync: xlsxExport } = useARAgingSheetXlsxExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
@@ -90,7 +90,7 @@ export function ARAgingSummaryExportMenu() {
},
});
// Export the report to csv.
const { mutateAsync: csvExport } = useARAgingSheetCsvExport(query, {
const { mutateAsync: csvExport } = useARAgingSheetCsvExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({

39
packages/webapp/src/containers/FinancialStatements/ARAgingSummary/dialogs/ARAgingSummaryPdfDialog/ARAgingSummaryPdfDialog.tsx Normal file
View File

@@ -0,0 +1,39 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const ARAgingSummaryPdfDialogContent = lazy(
() => import('./ARAgingSummaryPdfDialogContent'),
);
/**
* Balance sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function ARAgingSummaryPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'A/R Aging Summary Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<ARAgingSummaryPdfDialogContent dialogName={dialogName} />
</DialogSuspense>
</Dialog>
);
}
export const ARAgingSummaryPdfDialog = compose(withDialogRedux())(
ARAgingSummaryPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/ARAgingSummary/dialogs/ARAgingSummaryPdfDialog/ARAgingSummaryPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { useARAgingSummaryPdf } from '@/hooks/query';
import { AnchorButton } from '@blueprintjs/core';
import { useARAgingSummaryContext } from '../../ARAgingSummaryProvider';
export default function ARAgingSummaryPdfDialogContent() {
const { httpQuery } = useARAgingSummaryContext();
const { isLoading, pdfUrl } = useARAgingSummaryPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'AR_aging_summary.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/ARAgingSummary/dialogs/ARAgingSummaryPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './ARAgingSummaryPdfDialog';

3
packages/webapp/src/containers/FinancialStatements/BalanceSheet/BalanceSheet.tsx
View File

@@ -13,6 +13,7 @@ import { useBalanceSheetQuery } from './utils';
import { compose } from '@/utils';
import withBalanceSheetActions from './withBalanceSheetActions';
import { BalanceSheetDialogs } from './BalanceSheetDialogs';
/**
* Balance sheet.
@@ -67,6 +68,8 @@ function BalanceSheet({
<BalanceSheetBody />
</FinancialStatement>
</DashboardPageContent>
<BalanceSheetDialogs />
</BalanceSheetProvider>
);
}

14
packages/webapp/src/containers/FinancialStatements/BalanceSheet/BalanceSheetActionsBar.tsx
View File

@@ -17,7 +17,9 @@ import { BalanceSheetExportMenu } from './components';
import { useBalanceSheetContext } from './BalanceSheetProvider';
import withBalanceSheet from './withBalanceSheet';
import withBalanceSheetActions from './withBalanceSheetActions';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { compose, saveInvoke } from '@/utils';
import { DialogsName } from '@/constants/dialogs';
/**
* Balance sheet - actions bar.
@@ -29,6 +31,9 @@ function BalanceSheetActionsBar({
// #withBalanceSheetActions
toggleBalanceSheetFilterDrawer: toggleFilterDrawer,
// #withDialogsActions
openDialog,
// #ownProps
numberFormat,
onNumberFormatSubmit,
@@ -50,6 +55,11 @@ function BalanceSheetActionsBar({
saveInvoke(onNumberFormatSubmit, values);
};
// Handles the pdf print button click.
const handlePdfPrintBtnSubmit = () => {
openDialog(DialogsName.BalanceSheetPdfPreview)
}
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -75,7 +85,6 @@ function BalanceSheetActionsBar({
active={balanceSheetDrawerFilter}
/>
<NavbarDivider />
<Popover
content={
<NumberFormatDropdown
@@ -108,9 +117,9 @@ function BalanceSheetActionsBar({
</Popover>
<NavbarDivider />
<Button
className={Classes.MINIMAL}
onClick={handlePdfPrintBtnSubmit}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
/>
@@ -136,4 +145,5 @@ export default compose(
balanceSheetDrawerFilter,
})),
withBalanceSheetActions,
withDialogActions
)(BalanceSheetActionsBar);

10
packages/webapp/src/containers/FinancialStatements/BalanceSheet/BalanceSheetDialogs.tsx Normal file
View File

@@ -0,0 +1,10 @@
import { DialogsName } from '@/constants/dialogs';
import { BalanceSheetPdfDialog } from './dialogs/BalanceSheetPdfDialog';
export const BalanceSheetDialogs = () => {
return (
<>
<BalanceSheetPdfDialog dialogName={DialogsName.BalanceSheetPdfPreview} />
</>
);
};

11
packages/webapp/src/containers/FinancialStatements/BalanceSheet/BalanceSheetProvider.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { createContext, useContext } from 'react';
import { createContext, useContext, useMemo } from 'react';
import FinancialReportPage from '../FinancialReportPage';
import { useBalanceSheet } from '@/hooks/query';
@@ -9,9 +9,7 @@ const BalanceSheetContext = createContext();
function BalanceSheetProvider({ filter, ...props }) {
// Transformes the given filter to query.
const query = React.useMemo(() => transformFilterFormToQuery(filter), [
filter,
]);
const httpQuery = useMemo(() => transformFilterFormToQuery(filter), [filter]);
// Fetches the balance sheet report.
const {
@@ -19,15 +17,14 @@ function BalanceSheetProvider({ filter, ...props }) {
isFetching,
isLoading,
refetch,
} = useBalanceSheet(query, { keepPreviousData: true });
} = useBalanceSheet(httpQuery, { keepPreviousData: true });
const provider = {
balanceSheet,
isFetching,
isLoading,
refetchBalanceSheet: refetch,
query,
httpQuery,
filter,
};
return (

1
packages/webapp/src/containers/FinancialStatements/BalanceSheet/BalanceSheetTable.tsx
View File

@@ -9,7 +9,6 @@ import { useBalanceSheetContext } from './BalanceSheetProvider';
import { useBalanceSheetColumns } from './components';
import { defaultExpanderReducer, tableRowTypesToClassnames } from '@/utils';
/**
* Balance sheet table.
*/

7
packages/webapp/src/containers/FinancialStatements/BalanceSheet/components.tsx
View File

@@ -96,7 +96,7 @@ export const BalanceSheetExportMenu = () => {
isCloseButtonShown: true,
timeout: 2000,
};
const { query } = useBalanceSheetContext();
const { httpQuery } = useBalanceSheetContext();
const openProgressToast = (amount: number) => {
return (
@@ -114,7 +114,7 @@ export const BalanceSheetExportMenu = () => {
};
// Export the report to xlsx.
const { mutateAsync: xlsxExport } = useBalanceSheetXlsxExport(query, {
const { mutateAsync: xlsxExport } = useBalanceSheetXlsxExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
@@ -132,8 +132,9 @@ export const BalanceSheetExportMenu = () => {
}
},
});
// Export the report to csv.
const { mutateAsync: csvExport } = useBalanceSheetCsvExport(query, {
const { mutateAsync: csvExport } = useBalanceSheetCsvExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({

39
packages/webapp/src/containers/FinancialStatements/BalanceSheet/dialogs/BalanceSheetPdfDialog/BalanceSheetPdfDialog.tsx Normal file
View File

@@ -0,0 +1,39 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const BalanceSheetPdfDialogContent = lazy(
() => import('./BalanceSheetPdfDialogContent'),
);
/**
* Balance sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function BalanceSheetPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Balance Sheet Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<BalanceSheetPdfDialogContent dialogName={dialogName} />
</DialogSuspense>
</Dialog>
);
}
export const BalanceSheetPdfDialog = compose(withDialogRedux())(
BalanceSheetPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/BalanceSheet/dialogs/BalanceSheetPdfDialog/BalanceSheetPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { useBalanceSheetPdf } from '@/hooks/query';
import { AnchorButton } from '@blueprintjs/core';
import { useBalanceSheetContext } from '../../BalanceSheetProvider';
export default function BalanceSheetPdfDialogContent() {
const { httpQuery } = useBalanceSheetContext();
const { isLoading, pdfUrl } = useBalanceSheetPdf({ ...httpQuery });
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'invoice.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/BalanceSheet/dialogs/BalanceSheetPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './BalanceSheetPdfDialog';

3
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/CashFlowStatement.tsx
View File

@@ -17,6 +17,7 @@ import {
import { useCashflowStatementQuery } from './utils';
import { compose } from '@/utils';
import { CashflowSheetDialogs } from './CashflowSheetDialogs';
/**
* Cash flow statement.
@@ -71,6 +72,8 @@ function CashFlowStatement({
<CashFlowStatementBody />
</FinancialStatement>
</DashboardPageContent>
<CashflowSheetDialogs />
</CashFlowStatementProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementActionsBar.tsx
View File

@@ -20,6 +20,8 @@ import withCashFlowStatementActions from './withCashFlowStatementActions';
import { compose, saveInvoke } from '@/utils';
import { CashflowSheetExportMenu } from './components';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { DialogsName } from '@/constants/dialogs';
/**
* Cash flow statement actions bar.
@@ -31,6 +33,9 @@ function CashFlowStatementActionsBar({
//#withCashStatementActions
toggleCashFlowStatementFilterDrawer,
// #withDialogActions
openDialog,
//#ownProps
numberFormat,
onNumberFormatSubmit,
@@ -51,6 +56,11 @@ function CashFlowStatementActionsBar({
const handleNumberFormatSubmit = (values) =>
saveInvoke(onNumberFormatSubmit, values);
// Handle print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.CashflowSheetPdfPreview);
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -115,6 +125,7 @@ function CashFlowStatementActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<CashflowSheetExportMenu />}
@@ -138,4 +149,5 @@ export default compose(
isFilterDrawerOpen: cashFlowStatementDrawerFilter,
})),
withCashFlowStatementActions,
withDialogActions,
)(CashFlowStatementActionsBar);

12
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/CashFlowStatementProvider.tsx
View File

@@ -10,27 +10,27 @@ const CashFLowStatementContext = React.createContext();
* Cash flow statement provider.
*/
function CashFlowStatementProvider({ filter, ...props }) {
// transforms the given filter to query.
const query = React.useMemo(
// Transforms the given state query to http query.
const httpQuery = React.useMemo(
() => transformFilterFormToQuery(filter),
[filter],
);
// fetch the cash flow statement report.
// Fetching the cash flow statement report.
const {
data: cashFlowStatement,
isFetching: isCashFlowFetching,
isLoading: isCashFlowLoading,
refetch: refetchCashFlow,
} = useCashFlowStatementReport(query, { keepPreviousData: true });
} = useCashFlowStatementReport(httpQuery, { keepPreviousData: true });
const provider = {
cashFlowStatement,
isCashFlowFetching,
isCashFlowLoading,
refetchCashFlow,
query,
query: httpQuery,
filter,
httpQuery,
};
return (

12
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/CashflowSheetDialogs.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { DialogsName } from '@/constants/dialogs';
import { CashflowSheetPdfDialog } from './CashflowSheetPdfDialog';
export function CashflowSheetDialogs() {
return (
<>
<CashflowSheetPdfDialog
dialogName={DialogsName.CashflowSheetPdfPreview}
/>
</>
);
}

41
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/CashflowSheetPdfDialog/CashflowSheetPdfDialog.tsx Normal file
View File

@@ -0,0 +1,41 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const CashflowSheetPdfDialogContent = lazy(
() => import('./CashflowSheetPdfDialogContent'),
);
/**
* Cashflow sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function CashflowSheetPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Cashflow Sheet Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<CashflowSheetPdfDialogContent />
</DialogSuspense>
</Dialog>
);
}
export const CashflowSheetPdfDialog = compose(withDialogRedux())(
CashflowSheetPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/CashflowSheetPdfDialog/CashflowSheetPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { AnchorButton } from '@blueprintjs/core';
import { useCashflowSheetPdf } from '@/hooks/query';
import { useCashFlowStatementContext } from '../CashFlowStatementProvider';
export default function CashflowSheetPdfDialogContent() {
const { httpQuery } = useCashFlowStatementContext();
const { isLoading, pdfUrl } = useCashflowSheetPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'invoice.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/CashflowSheetPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './CashflowSheetPdfDialog';

38
packages/webapp/src/containers/FinancialStatements/CashFlowStatement/components.tsx
View File

@@ -95,7 +95,7 @@ export function CashflowSheetExportMenu() {
isCloseButtonShown: true,
timeout: 2000,
};
const { query } = useCashFlowStatementContext();
const { httpQuery } = useCashFlowStatementContext();
const openProgressToast = (amount: number) => {
return (
@@ -113,26 +113,30 @@ export function CashflowSheetExportMenu() {
};
// Export the report to xlsx.
const { mutateAsync: xlsxExport } = useCashFlowStatementXlsxExport(query, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
message: openProgressToast(xlsxExportProgress),
...commonToastConfig,
});
} else {
AppToaster.show(
{
const { mutateAsync: xlsxExport } = useCashFlowStatementXlsxExport(
httpQuery,
{
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
message: openProgressToast(xlsxExportProgress),
...commonToastConfig,
},
toastKey.current,
);
}
});
} else {
AppToaster.show(
{
message: openProgressToast(xlsxExportProgress),
...commonToastConfig,
},
toastKey.current,
);
}
},
},
});
);
// Export the report to csv.
const { mutateAsync: csvExport } = useCashFlowStatementCsvExport(query, {
const { mutateAsync: csvExport } = useCashFlowStatementCsvExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({

41
packages/webapp/src/containers/FinancialStatements/CustomersBalanceSummary/CustomerBalancePdfDialog/CustomerBalanceSummaryPdfDialog.tsx Normal file
View File

@@ -0,0 +1,41 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const CustomerBalanceSummaryPdfDialogContent = lazy(
() => import('./CustomerBalanceSummaryPdfDialogContent'),
);
/**
* Cashflow sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function CashflowSheetPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Customer Balance Summary Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<CustomerBalanceSummaryPdfDialogContent />
</DialogSuspense>
</Dialog>
);
}
export const CustomerBalanceSummaryPdfDialog = compose(withDialogRedux())(
CashflowSheetPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/CustomersBalanceSummary/CustomerBalancePdfDialog/CustomerBalanceSummaryPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { AnchorButton } from '@blueprintjs/core';
import { useCustomerBalanceSummaryPdf } from '@/hooks/query';
import { useCustomersBalanceSummaryContext } from '../CustomersBalanceSummaryProvider';
export default function CustomerBalanceSummaryPdfDialogContent() {
const { httpQuery } = useCustomersBalanceSummaryContext();
const { isLoading, pdfUrl } = useCustomerBalanceSummaryPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'customer-balance-summary.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/CustomersBalanceSummary/CustomerBalancePdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './CustomerBalanceSummaryPdfDialog';

6
packages/webapp/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummary.tsx
View File

@@ -13,6 +13,8 @@ import { CustomersBalanceSummaryProvider } from './CustomersBalanceSummaryProvid
import { useCustomerBalanceSummaryQuery } from './utils';
import { CustomersBalanceLoadingBar } from './components';
import withCustomersBalanceSummaryActions from './withCustomersBalanceSummaryActions';
import { CustomerBalanceSummaryPdfDialog } from './CustomerBalancePdfDialog';
import { DialogsName } from '@/constants/dialogs';
/**
* Customers Balance summary.
@@ -61,6 +63,10 @@ function CustomersBalanceSummary({
<CustomerBalanceSummaryBody />
</FinancialStatement>
</DashboardPageContent>
<CustomerBalanceSummaryPdfDialog
dialogName={DialogsName.CustomerBalanceSummaryPdfPreview}
/>
</CustomersBalanceSummaryProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryActionsBar.tsx
View File

@@ -18,6 +18,8 @@ import withCustomersBalanceSummaryActions from './withCustomersBalanceSummaryAct
import { useCustomersBalanceSummaryContext } from './CustomersBalanceSummaryProvider';
import { compose, saveInvoke } from '@/utils';
import { CustomerBalanceSummaryExportMenu } from './components';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { DialogsName } from '@/constants/dialogs';
/**
* customer balance summary action bar.
@@ -32,6 +34,9 @@ function CustomersBalanceSummaryActionsBar({
//#withCustomersBalanceSummaryActions
toggleCustomerBalanceFilterDrawer,
// #withDialogActions
openDialog
}) {
const { refetch, isCustomersBalanceLoading } =
useCustomersBalanceSummaryContext();
@@ -51,6 +56,11 @@ function CustomersBalanceSummaryActionsBar({
saveInvoke(onNumberFormatSubmit, values);
};
// Handle the print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.CustomerBalanceSummaryPdfPreview);
}
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -112,6 +122,7 @@ function CustomersBalanceSummaryActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<CustomerBalanceSummaryExportMenu />}
@@ -134,4 +145,5 @@ export default compose(
isFilterDrawerOpen: customersBalanceDrawerFilter,
})),
withCustomersBalanceSummaryActions,
withDialogActions
)(CustomersBalanceSummaryActionsBar);

4
packages/webapp/src/containers/FinancialStatements/CustomersBalanceSummary/CustomersBalanceSummaryProvider.tsx
View File

@@ -29,9 +29,9 @@ function CustomersBalanceSummaryProvider({ filter, ...props }) {
CustomerBalanceSummary,
isCustomersBalanceFetching,
isCustomersBalanceLoading,
refetch,
query
query,
httpQuery: query
};
return (
<FinancialReportPage name={'customers-balance-summary'}>

3
packages/webapp/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactions.tsx
View File

@@ -14,6 +14,7 @@ import { CustomersTransactionsProvider } from './CustomersTransactionsProvider';
import { compose } from '@/utils';
import { useCustomersTransactionsQuery } from './_utils';
import { CustomersTransactionsDialogs } from './CustomersTransactionsDialogs';
/**
* Customers transactions.
@@ -65,6 +66,8 @@ function CustomersTransactions({
<CustomersTransactionsBody />
</FinancialStatement>
</DashboardPageContent>
<CustomersTransactionsDialogs />
</CustomersTransactionsProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsActionsBar.tsx
View File

@@ -20,6 +20,8 @@ import withCustomersTransactions from './withCustomersTransactions';
import withCustomersTransactionsActions from './withCustomersTransactionsActions';
import { compose, saveInvoke } from '@/utils';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { DialogsName } from '@/constants/dialogs';
/**
* Customers transactions actions bar.
@@ -34,6 +36,9 @@ function CustomersTransactionsActionsBar({
//#withCustomersTransactionsActions
toggleCustomersTransactionsFilterDrawer,
// #withDialogActions
openDialog
}) {
const { isCustomersTransactionsLoading, CustomersTransactionsRefetch } =
useCustomersTransactionsContext();
@@ -53,6 +58,11 @@ function CustomersTransactionsActionsBar({
saveInvoke(onNumberFormatSubmit, values);
};
// Handle print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.CustomerTransactionsPdfPreview)
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -114,6 +124,7 @@ function CustomersTransactionsActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<CustomersTransactionsExportMenu />}
@@ -137,4 +148,5 @@ export default compose(
isFilterDrawerOpen: customersTransactionsDrawerFilter,
})),
withCustomersTransactionsActions,
withDialogActions
)(CustomersTransactionsActionsBar);

12
packages/webapp/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsDialogs.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { DialogsName } from '@/constants/dialogs';
import { CustomerTransactionsPdfDialog } from './dialogs/CustomerTransactionsPdfDialog';
export function CustomersTransactionsDialogs() {
return (
<>
<CustomerTransactionsPdfDialog
dialogName={DialogsName.CustomerTransactionsPdfPreview}
/>
</>
);
}

9
packages/webapp/src/containers/FinancialStatements/CustomersTransactions/CustomersTransactionsProvider.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { createContext, useContext, useMemo } from 'react';
import { createContext, useContext, useMemo } from 'react';
import FinancialReportPage from '../FinancialReportPage';
import { useCustomersTransactionsReport } from '@/hooks/query';
import { transformFilterFormToQuery } from '../common';
@@ -10,9 +10,7 @@ const CustomersTransactionsContext = createContext();
* Customers transactions provider.
*/
function CustomersTransactionsProvider({ filter, ...props }) {
const query = useMemo(() => transformFilterFormToQuery(filter), [
filter,
]);
const query = useMemo(() => transformFilterFormToQuery(filter), [filter]);
// Fetches the customers transactions.
const {
@@ -29,7 +27,8 @@ function CustomersTransactionsProvider({ filter, ...props }) {
CustomersTransactionsRefetch,
filter,
query
query,
httpQuery: query,
};
return (

41
packages/webapp/src/containers/FinancialStatements/CustomersTransactions/dialogs/CustomerTransactionsPdfDialog/CustomerTransactionsPdfDialog.tsx Normal file
View File

@@ -0,0 +1,41 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const CustomerTransactionsPdfDialogContent = lazy(
() => import('./CustomerTransactionsPdfDialogContent'),
);
/**
* Cashflow sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function CashflowSheetPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Customer Tranasctions PDF Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<CustomerTransactionsPdfDialogContent />
</DialogSuspense>
</Dialog>
);
}
export const CustomerTransactionsPdfDialog = compose(withDialogRedux())(
CashflowSheetPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/CustomersTransactions/dialogs/CustomerTransactionsPdfDialog/CustomerTransactionsPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { AnchorButton } from '@blueprintjs/core';
import { useCustomersTransactionsPdfExport } from '@/hooks/query';
import { useCustomersTransactionsContext } from '../../CustomersTransactionsProvider';
export default function CashflowSheetPdfDialogContent() {
const { httpQuery } = useCustomersTransactionsContext();
const { isLoading, pdfUrl } = useCustomersTransactionsPdfExport(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'customer-transactions.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/CustomersTransactions/dialogs/CustomerTransactionsPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './CustomerTransactionsPdfDialog';

6
packages/webapp/src/containers/FinancialStatements/GeneralLedger/GeneralLedger.tsx
View File

@@ -16,6 +16,8 @@ import {
import withGeneralLedgerActions from './withGeneralLedgerActions';
import { compose } from '@/utils';
import { GeneralLedgerPdfDialog } from './dialogs/GeneralLedgerPdfDialog';
import { DialogsName } from '@/constants/dialogs';
/**
* General Ledger (GL) sheet.
@@ -61,6 +63,10 @@ function GeneralLedger({
<GeneralLedgerBody />
</FinancialStatement>
</DashboardPageContent>
<GeneralLedgerPdfDialog
dialogName={DialogsName.GeneralLedgerPdfPreview}
/>
</GeneralLedgerProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerActionsBar.tsx
View File

@@ -18,6 +18,8 @@ import { compose } from '@/utils';
import withGeneralLedger from './withGeneralLedger';
import withGeneralLedgerActions from './withGeneralLedgerActions';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { DialogsName } from '@/constants/dialogs';
/**
* General ledger - Actions bar.
@@ -28,6 +30,9 @@ function GeneralLedgerActionsBar({
// #withGeneralLedgerActions
toggleGeneralLedgerFilterDrawer: toggleDisplayFilterDrawer,
// #withDialogActions
openDialog,
}) {
const { sheetRefresh } = useGeneralLedgerContext();
@@ -41,6 +46,11 @@ function GeneralLedgerActionsBar({
sheetRefresh();
};
// Handle the print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.GeneralLedgerPdfPreview);
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -84,6 +94,7 @@ function GeneralLedgerActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<GeneralLedgerSheetExportMenu />}
@@ -107,4 +118,5 @@ export default compose(
isFilterDrawerOpen: generalLedgerFilterDrawer,
})),
withGeneralLedgerActions,
withDialogActions,
)(GeneralLedgerActionsBar);

7
packages/webapp/src/containers/FinancialStatements/GeneralLedger/GeneralLedgerProvider.tsx
View File

@@ -12,24 +12,23 @@ const GeneralLedgerContext = createContext();
*/
function GeneralLedgerProvider({ query, ...props }) {
// Transformes the report query to request query.
const requestQuery = React.useMemo(
const httpQuery = React.useMemo(
() => transformFilterFormToQuery(query),
[query],
);
const {
data: generalLedger,
isFetching,
isLoading,
refetch,
} = useGeneralLedgerSheet(requestQuery, { keepPreviousData: true });
} = useGeneralLedgerSheet(httpQuery, { keepPreviousData: true });
const provider = {
generalLedger,
sheetRefresh: refetch,
isFetching,
isLoading,
httpRequest: requestQuery
httpQuery,
};
return (
<FinancialReportPage name={'general-ledger-sheet'}>

37
packages/webapp/src/containers/FinancialStatements/GeneralLedger/components.tsx
View File

@@ -79,7 +79,7 @@ export const GeneralLedgerSheetExportMenu = () => {
isCloseButtonShown: true,
timeout: 2000,
};
const { httpRequest } = useGeneralLedgerContext();
const { httpQuery } = useGeneralLedgerContext();
const openProgressToast = (amount: number) => {
return (
@@ -97,7 +97,7 @@ export const GeneralLedgerSheetExportMenu = () => {
};
// Export the report to xlsx.
const { mutateAsync: xlsxExport } = useGeneralLedgerSheetXlsxExport(
httpRequest,
httpQuery,
{
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
@@ -118,27 +118,24 @@ export const GeneralLedgerSheetExportMenu = () => {
},
);
// Export the report to csv.
const { mutateAsync: csvExport } = useGeneralLedgerSheetCsvExport(
httpRequest,
{
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
const { mutateAsync: csvExport } = useGeneralLedgerSheetCsvExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
message: openProgressToast(xlsxExportProgress),
...commonToastConfig,
});
} else {
AppToaster.show(
{
message: openProgressToast(xlsxExportProgress),
...commonToastConfig,
});
} else {
AppToaster.show(
{
message: openProgressToast(xlsxExportProgress),
...commonToastConfig,
},
toastKey.current,
);
}
},
},
toastKey.current,
);
}
},
);
});
// Handle csv export button click.
const handleCsvExportBtnClick = () => {
csvExport();

41
packages/webapp/src/containers/FinancialStatements/GeneralLedger/dialogs/GeneralLedgerPdfDialog/GeneralLedgerPdfDialog.tsx Normal file
View File

@@ -0,0 +1,41 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const GeneralLedgerPdfDialogContent = lazy(
() => import('./GeneralLedgerPdfDialogContent'),
);
/**
* General ledger pdf preview dialog.
* @returns {React.ReactNode}
*/
function GeneralLedgerPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'General Ledger PDF Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<GeneralLedgerPdfDialogContent />
</DialogSuspense>
</Dialog>
);
}
export const GeneralLedgerPdfDialog = compose(withDialogRedux())(
GeneralLedgerPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/GeneralLedger/dialogs/GeneralLedgerPdfDialog/GeneralLedgerPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { AnchorButton } from '@blueprintjs/core';
import { useGeneralLedgerPdf } from '@/hooks/query';
import { useGeneralLedgerContext } from '../../GeneralLedgerProvider';
export default function GeneralLedgerPdfDialogContent() {
const { httpQuery } = useGeneralLedgerContext();
const { isLoading, pdfUrl } = useGeneralLedgerPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'general-ledger.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/GeneralLedger/dialogs/GeneralLedgerPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './GeneralLedgerPdfDialog';

3
packages/webapp/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetails.tsx
View File

@@ -15,6 +15,7 @@ import {
} from './components';
import { InventoryItemDetailsBody } from './InventoryItemDetailsBody';
import { InventoryItemDetailsDialogs } from './InventoryItemDetailsDialogs';
import { useInventoryValuationQuery } from './utils2';
import { compose } from '@/utils';
@@ -64,6 +65,8 @@ function InventoryItemDetails({
<InventoryItemDetailsBody />
</FinancialStatement>
</DashboardPageContent>
<InventoryItemDetailsDialogs />
</InventoryItemDetailsProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsActionsBar.tsx
View File

@@ -20,6 +20,8 @@ import withInventoryItemDetails from './withInventoryItemDetails';
import withInventoryItemDetailsActions from './withInventoryItemDetailsActions';
import { compose, saveInvoke } from '@/utils';
import { DialogsName } from '@/constants/dialogs';
import withDialogActions from '@/containers/Dialog/withDialogActions';
/**
* Inventory item details actions bar.
@@ -32,6 +34,9 @@ function InventoryItemDetailsActionsBar({
//#withInventoryItemDetails
isFilterDrawerOpen,
// #withDialogActions
openDialog,
//#withInventoryItemDetailsActions
toggleInventoryItemDetailsFilterDrawer: toggleFilterDrawer,
}) {
@@ -50,7 +55,10 @@ function InventoryItemDetailsActionsBar({
const handleNumberFormatSubmit = (values) => {
saveInvoke(onNumberFormatSubmit, values);
};
// Handle print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.InventoryItemDetailsPdfPreview);
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -112,6 +120,7 @@ function InventoryItemDetailsActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<InventoryItemDetailsExportMenu />}
@@ -135,4 +144,5 @@ export default compose(
isFilterDrawerOpen: inventoryItemDetailDrawerFilter,
})),
withInventoryItemDetailsActions,
withDialogActions,
)(InventoryItemDetailsActionsBar);

12
packages/webapp/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsDialogs.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { DialogsName } from '@/constants/dialogs';
import { InventoryItemDetailsPdfDialog } from './dialogs/InventoryItemDetailsPdfDialog';
export function InventoryItemDetailsDialogs() {
return (
<>
<InventoryItemDetailsPdfDialog
dialogName={DialogsName.InventoryItemDetailsPdfPreview}
/>
</>
);
}

2
packages/webapp/src/containers/FinancialStatements/InventoryItemDetails/InventoryItemDetailsProvider.tsx
View File

@@ -28,8 +28,8 @@ function InventoryItemDetailsProvider({ query, ...props }) {
isInventoryItemDetailsFetching,
isInventoryItemDetailsLoading,
inventoryItemDetailsRefetch,
query,
httpQuery: requestQuery
};
return (

39
packages/webapp/src/containers/FinancialStatements/InventoryItemDetails/dialogs/InventoryItemDetailsPdfDialog/InventoryItemDetailsPdfDialog.tsx Normal file
View File

@@ -0,0 +1,39 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const InventoryItemDetailsPdfDialogContent = lazy(
() => import('./InventoryItemDetailsPdfDialogContent'),
);
/**
* Inventory item details sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function InventoryItemDetailsPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Inventory Item Details Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<InventoryItemDetailsPdfDialogContent dialogName={dialogName} />
</DialogSuspense>
</Dialog>
);
}
export const InventoryItemDetailsPdfDialog = compose(withDialogRedux())(
InventoryItemDetailsPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/InventoryItemDetails/dialogs/InventoryItemDetailsPdfDialog/InventoryItemDetailsPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { useInventoryItemDetailsPdf } from '@/hooks/query';
import { AnchorButton } from '@blueprintjs/core';
import { useInventoryItemDetailsContext } from '../../InventoryItemDetailsProvider';
export default function InventoryItemDetailsPdfDialogContent() {
const { httpQuery } = useInventoryItemDetailsContext();
const { isLoading, pdfUrl } = useInventoryItemDetailsPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'inventory-item-details.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/InventoryItemDetails/dialogs/InventoryItemDetailsPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './InventoryItemDetailsPdfDialog';

5
packages/webapp/src/containers/FinancialStatements/InventoryValuation/InventoryValuation.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { useEffect, useState, useCallback } from 'react';
import { useEffect, useCallback } from 'react';
import moment from 'moment';
import { DashboardPageContent } from '@/components';
@@ -14,6 +14,7 @@ import { compose } from '@/utils';
import withInventoryValuationActions from './withInventoryValuationActions';
import withCurrentOrganization from '@/containers/Organization/withCurrentOrganization';
import { InventoryValuationDialogs } from './InventoryValuationDialogs';
/**
* Inventory valuation.
@@ -65,6 +66,8 @@ function InventoryValuation({
/>
<InventoryValuationBody />
</DashboardPageContent>
<InventoryValuationDialogs />
</InventoryValuationProvider>
);
}

18
packages/webapp/src/containers/FinancialStatements/InventoryValuation/InventoryValuationActionsBar.tsx
View File

@@ -16,10 +16,12 @@ import NumberFormatDropdown from '@/components/NumberFormatDropdown';
import withInventoryValuation from './withInventoryValuation';
import withInventoryValuationActions from './withInventoryValuationActions';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { useInventoryValuationContext } from './InventoryValuationProvider';
import { compose, saveInvoke } from '@/utils';
import { InventoryValuationExportMenu } from './components';
import { DialogsName } from '@/constants/dialogs';
function InventoryValuationActionsBar({
// #withInventoryValuation
@@ -28,27 +30,35 @@ function InventoryValuationActionsBar({
// #withInventoryValuationActions
toggleInventoryValuationFilterDrawer,
// #withDialogActions
openDialog,
// #ownProps
numberFormat,
onNumberFormatSubmit,
}) {
const { refetchSheet, isLoading } = useInventoryValuationContext();
// Handle filter toggle click.
// Handles filter toggle click.
const handleFilterToggleClick = () => {
toggleInventoryValuationFilterDrawer();
};
// Handle re-calc button click.
// Handles re-calc button click.
const handleRecalculateReport = () => {
refetchSheet();
};
// Handle number format submit.
// Handles number format submit.
const handleNumberFormatSubmit = (numberFormat) => {
saveInvoke(onNumberFormatSubmit, numberFormat);
};
// Handles the print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.InventoryValuationPdfPreview);
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -109,6 +119,7 @@ function InventoryValuationActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<InventoryValuationExportMenu />}
@@ -132,4 +143,5 @@ export default compose(
isFilterDrawerOpen: inventoryValuationDrawerFilter,
})),
withInventoryValuationActions,
withDialogActions,
)(InventoryValuationActionsBar);

12
packages/webapp/src/containers/FinancialStatements/InventoryValuation/InventoryValuationDialogs.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { DialogsName } from '@/constants/dialogs';
import { InventoryValuationPdfDialog } from './dialogs/InventoryValuationPdfDialog';
export function InventoryValuationDialogs() {
return (
<>
<InventoryValuationPdfDialog
dialogName={DialogsName.InventoryValuationPdfPreview}
/>
</>
);
}

7
packages/webapp/src/containers/FinancialStatements/InventoryValuation/InventoryValuationProvider.tsx
View File

@@ -11,7 +11,7 @@ const InventoryValuationContext = React.createContext();
*/
function InventoryValuationProvider({ query, ...props }) {
// Transformes the filter form query to request query.
const requestQuery = React.useMemo(
const httpQuery = React.useMemo(
() => transformFilterFormToQuery(query),
[query],
);
@@ -21,9 +21,7 @@ function InventoryValuationProvider({ query, ...props }) {
isFetching,
isLoading,
refetch,
} = useInventoryValuationTable(requestQuery, {
keepPreviousData: true,
});
} = useInventoryValuationTable(httpQuery, { keepPreviousData: true });
// Provider data.
const provider = {
@@ -31,6 +29,7 @@ function InventoryValuationProvider({ query, ...props }) {
isLoading,
isFetching,
refetchSheet: refetch,
httpQuery
};
return (

39
packages/webapp/src/containers/FinancialStatements/InventoryValuation/dialogs/InventoryValuationPdfDialog/InventoryValuationSheetPdfDialog.tsx Normal file
View File

@@ -0,0 +1,39 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const InventoryValuationPdfDialogContent = lazy(
() => import('./InventoryValuationSheetPdfDialogContent'),
);
/**
* Inventory valuation sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function InventoryValuationSheetPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Inventory Valuation Sheet Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<InventoryValuationPdfDialogContent dialogName={dialogName} />
</DialogSuspense>
</Dialog>
);
}
export const InventoryValuationPdfDialog = compose(withDialogRedux())(
InventoryValuationSheetPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/InventoryValuation/dialogs/InventoryValuationPdfDialog/InventoryValuationSheetPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { useInventoryValuationPdf } from '@/hooks/query';
import { AnchorButton } from '@blueprintjs/core';
import { useInventoryValuationContext } from '../../InventoryValuationProvider';
export default function InventoryValuationPdfDialogContent() {
const { httpQuery } = useInventoryValuationContext();
const { isLoading, pdfUrl } = useInventoryValuationPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'inventory-valuation-summary.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/InventoryValuation/dialogs/InventoryValuationPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './InventoryValuationSheetPdfDialog';

5
packages/webapp/src/containers/FinancialStatements/Journal/Journal.tsx
View File

@@ -15,6 +15,7 @@ import withJournalActions from './withJournalActions';
import { useJournalQuery } from './utils';
import { compose } from '@/utils';
import { JournalDialogs } from './JournalDialogs';
/**
* Journal sheet.
@@ -23,7 +24,7 @@ function Journal({
// #withJournalActions
toggleJournalSheetFilter,
}) {
const {query, setLocationQuery} = useJournalQuery();
const { query, setLocationQuery } = useJournalQuery();
// Handle financial statement filter change.
const handleFilterSubmit = useCallback(
@@ -60,6 +61,8 @@ function Journal({
<JournalBody />
</FinancialStatement>
</DashboardPageContent>
<JournalDialogs />
</JournalSheetProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/Journal/JournalActionsBar.tsx
View File

@@ -19,6 +19,8 @@ import withJournal from './withJournal';
import { compose } from '@/utils';
import { useJournalSheetContext } from './JournalProvider';
import { JournalSheetExportMenu } from './components';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { DialogsName } from '@/constants/dialogs';
/**
* Journal sheeet - Actions bar.
@@ -29,6 +31,9 @@ function JournalActionsBar({
// #withJournalActions
toggleJournalSheetFilter,
// #withDialogActions
openDialog,
}) {
const { refetchSheet } = useJournalSheetContext();
@@ -42,6 +47,11 @@ function JournalActionsBar({
refetchSheet();
};
// Handle the print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.JournalPdfPreview);
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -85,6 +95,7 @@ function JournalActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<JournalSheetExportMenu />}
@@ -108,4 +119,5 @@ export default compose(
isFilterDrawerOpen: journalSheetDrawerFilter,
})),
withJournalActions,
withDialogActions,
)(JournalActionsBar);

10
packages/webapp/src/containers/FinancialStatements/Journal/JournalDialogs.tsx Normal file
View File

@@ -0,0 +1,10 @@
import { DialogsName } from '@/constants/dialogs';
import { JournalPdfDialog } from './dialogs/JournalPdfDialog';
export function JournalDialogs() {
return (
<>
<JournalPdfDialog dialogName={DialogsName.JournalPdfPreview} />
</>
);
}

7
packages/webapp/src/containers/FinancialStatements/Journal/JournalProvider.tsx
View File

@@ -11,24 +11,23 @@ const JournalSheetContext = createContext();
*/
function JournalSheetProvider({ query, ...props }) {
// Transforms the sheet query to request query.
const requestQuery = React.useMemo(
const httpQuery = React.useMemo(
() => transformFilterFormToQuery(query),
[query],
);
const {
data: journalSheet,
isFetching,
isLoading,
refetch,
} = useJournalSheet(requestQuery, { keepPreviousData: true });
} = useJournalSheet(httpQuery, { keepPreviousData: true });
const provider = {
journalSheet,
isLoading,
isFetching,
refetchSheet: refetch,
httpQuery: requestQuery
httpQuery,
};
return (

39
packages/webapp/src/containers/FinancialStatements/Journal/dialogs/JournalPdfDialog/JournalPdfDialog.tsx Normal file
View File

@@ -0,0 +1,39 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const JournalPdfDialogContent = lazy(
() => import('./JournalPdfDialogContent'),
);
/**
* Journal sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function JournalPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Journal Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<JournalPdfDialogContent dialogName={dialogName} />
</DialogSuspense>
</Dialog>
);
}
export const JournalPdfDialog = compose(withDialogRedux())(
JournalPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/Journal/dialogs/JournalPdfDialog/JournalPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { useJournalSheetPdf } from '@/hooks/query';
import { AnchorButton } from '@blueprintjs/core';
import { useJournalSheetContext } from '../../JournalProvider';
export default function JournalSheetPdfDialogContent() {
const { httpQuery } = useJournalSheetContext();
const { isLoading, pdfUrl } = useJournalSheetPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'journal.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/Journal/dialogs/JournalPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './JournalPdfDialog';

11
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossActionsBar.tsx
View File

@@ -20,6 +20,8 @@ import withProfitLoss from './withProfitLoss';
import { compose, saveInvoke } from '@/utils';
import { useProfitLossSheetContext } from './ProfitLossProvider';
import { ProfitLossSheetExportMenu } from './components';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { DialogsName } from '@/constants/dialogs';
/**
* Profit/Loss sheet actions bar.
@@ -31,6 +33,9 @@ function ProfitLossActionsBar({
// #withProfitLossActions
toggleProfitLossFilterDrawer: toggleFilterDrawer,
// #withDialogActions
openDialog,
// #ownProps
numberFormat,
onNumberFormatSubmit,
@@ -48,6 +53,10 @@ function ProfitLossActionsBar({
const handleNumberFormatSubmit = (values) => {
saveInvoke(onNumberFormatSubmit, values);
};
// Handles the print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.ProfitLossSheetPdfPreview);
};
return (
<DashboardActionsBar>
@@ -110,6 +119,7 @@ function ProfitLossActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<ProfitLossSheetExportMenu />}
@@ -131,4 +141,5 @@ function ProfitLossActionsBar({
export default compose(
withProfitLoss(({ profitLossDrawerFilter }) => ({ profitLossDrawerFilter })),
withProfitLossActions,
withDialogActions,
)(ProfitLossActionsBar);

17
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossProvider.tsx
View File

@@ -1,7 +1,7 @@
// @ts-nocheck
import React, { createContext, useContext, useMemo } from 'react';
import FinancialReportPage from '../FinancialReportPage';
import { createContext, useContext, useMemo } from 'react';
import { useProfitLossSheet } from '@/hooks/query';
import FinancialReportPage from '../FinancialReportPage';
import { transformFilterFormToQuery } from '../common';
const ProfitLossSheetContext = createContext();
@@ -11,27 +11,22 @@ const ProfitLossSheetContext = createContext();
* @returns {React.JSX}
*/
function ProfitLossSheetProvider({ query, ...props }) {
const innerQuery = useMemo(() => {
return transformFilterFormToQuery(query);
}, [query]);
const httpQuery = useMemo(() => transformFilterFormToQuery(query), [query]);
const {
data: profitLossSheet,
isFetching,
isLoading,
refetch,
} = useProfitLossSheet(
innerQuery,
{ keepPreviousData: true },
);
} = useProfitLossSheet(httpQuery, { keepPreviousData: true });
const provider = {
profitLossSheet,
isLoading,
isFetching,
sheetRefetch: refetch,
query: innerQuery
query: httpQuery,
httpQuery,
};
return (

3
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheet.tsx
View File

@@ -15,6 +15,7 @@ import { useProfitLossSheetQuery } from './utils';
import { ProfitLossSheetProvider } from './ProfitLossProvider';
import { ProfitLossSheetAlerts, ProfitLossSheetLoadingBar } from './components';
import { ProfitLossBody } from './ProfitLossBody';
import { ProfitLossSheetDialogs } from './ProfitLossSheetDialogs';
/**
* Profit/Loss financial statement sheet.
@@ -67,6 +68,8 @@ function ProfitLossSheet({
/>
<ProfitLossBody />
</DashboardPageContent>
<ProfitLossSheetDialogs />
</ProfitLossSheetProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetDialogs.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { DialogsName } from '@/constants/dialogs';
import { ProfitLossSheetPdfDialog } from './ProfitLossSheetPdfDialog';
export function ProfitLossSheetDialogs() {
return (
<>
<ProfitLossSheetPdfDialog
dialogName={DialogsName.ProfitLossSheetPdfPreview}
/>
</>
);
}

44
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetPdfDialog/ProfitLossSheetPdfDialog.tsx Normal file
View File

@@ -0,0 +1,44 @@
// @ts-nocheck
import React, { lazy } from 'react';
import classNames from 'classnames';
import { Dialog, DialogSuspense } from '@/components';
import withDialogRedux from '@/components/DialogReduxConnect';
import { CLASSES } from '@/constants/classes';
import { compose } from '@/utils';
// Lazy loading the content.
const ProfitLossSheetPdfDialogContent = lazy(
() => import('./ProfitLossSheetPdfDialogContent'),
);
/**
* Cashflow sheet pdf preview dialog.
* @returns {React.ReactNode}
*/
function ProfitLossSheetPdfDialogRoot({ dialogName, payload, isOpen }) {
return (
<Dialog
name={dialogName}
title={'Profit/LossSheet Print Preview'}
className={classNames(CLASSES.DIALOG_PDF_PREVIEW)}
autoFocus={true}
canEscapeKeyClose={true}
isOpen={isOpen}
style={{ width: '1000px' }}
>
<DialogSuspense>
<ProfitLossSheetPdfDialogContent
dialogName={dialogName}
subscriptionForm={payload}
/>
</DialogSuspense>
</Dialog>
);
}
export const ProfitLossSheetPdfDialog = compose(withDialogRedux())(
ProfitLossSheetPdfDialogRoot,
);

45
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetPdfDialog/ProfitLossSheetPdfDialogContent.tsx Normal file
View File

@@ -0,0 +1,45 @@
// @ts-nocheck
import {
DialogContent,
PdfDocumentPreview,
FormattedMessage as T,
} from '@/components';
import { AnchorButton } from '@blueprintjs/core';
import { useProfitLossSheetPdf } from '@/hooks/query';
import { useProfitLossSheetContext } from '../ProfitLossProvider';
export default function ProfitLossSheetPdfDialogContent() {
const { httpQuery } = useProfitLossSheetContext();
const { isLoading, pdfUrl } = useProfitLossSheetPdf(httpQuery);
return (
<DialogContent>
<div className="dialog__header-actions">
<AnchorButton
href={pdfUrl}
target={'__blank'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.preview.button'} />
</AnchorButton>
<AnchorButton
href={pdfUrl}
download={'profit_loss_sheet.pdf'}
minimal={true}
outlined={true}
>
<T id={'pdf_preview.download.button'} />
</AnchorButton>
</div>
<PdfDocumentPreview
height={760}
width={1000}
isLoading={isLoading}
url={pdfUrl}
/>
</DialogContent>
);
}

1
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/ProfitLossSheetPdfDialog/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './ProfitLossSheetPdfDialog';

8
packages/webapp/src/containers/FinancialStatements/ProfitLossSheet/components.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { useRef } from 'react';
import { useRef } from 'react';
import {
Button,
Classes,
@@ -78,7 +78,7 @@ export const ProfitLossSheetExportMenu = () => {
isCloseButtonShown: true,
timeout: 2000,
};
const { query } = useProfitLossSheetContext();
const { httpQuery } = useProfitLossSheetContext();
const openProgressToast = (amount: number) => {
return (
@@ -96,7 +96,7 @@ export const ProfitLossSheetExportMenu = () => {
};
// Export the report to xlsx.
const { mutateAsync: xlsxExport } = useProfitLossSheetXlsxExport(query, {
const { mutateAsync: xlsxExport } = useProfitLossSheetXlsxExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
@@ -115,7 +115,7 @@ export const ProfitLossSheetExportMenu = () => {
},
});
// Export the report to csv.
const { mutateAsync: csvExport } = useProfitLossSheetCsvExport(query, {
const { mutateAsync: csvExport } = useProfitLossSheetCsvExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({

3
packages/webapp/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItems.tsx
View File

@@ -13,6 +13,7 @@ import { usePurchasesByItemsQuery } from './utils';
import { compose } from '@/utils';
import withPurchasesByItemsActions from './withPurchasesByItemsActions';
import { PurchasesByItemsDialogs } from './PurchasesByItemsDialogs';
/**
* Purchases by items.
@@ -67,6 +68,8 @@ function PurchasesByItems({
<PurchasesByItemsBody />
</FinancialStatement>
</DashboardPageContent>
<PurchasesByItemsDialogs />
</PurchasesByItemsProvider>
);
}

12
packages/webapp/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsActionsBar.tsx
View File

@@ -16,9 +16,11 @@ import NumberFormatDropdown from '@/components/NumberFormatDropdown';
import withPurchasesByItems from './withPurchasesByItems';
import withPurchasesByItemsActions from './withPurchasesByItemsActions';
import withDialogActions from '@/containers/Dialog/withDialogActions';
import { compose, saveInvoke } from '@/utils';
import { usePurchaseByItemsContext } from './PurchasesByItemsProvider';
import { PurchasesByItemsExportMenu } from './components';
import { DialogsName } from '@/constants/dialogs';
function PurchasesByItemsActionsBar({
// #withPurchasesByItems
@@ -27,6 +29,9 @@ function PurchasesByItemsActionsBar({
// #withPurchasesByItemsActions
togglePurchasesByItemsFilterDrawer,
// #withDialogActions
openDialog,
// #ownProps
numberFormat,
onNumberFormatSubmit,
@@ -48,6 +53,11 @@ function PurchasesByItemsActionsBar({
saveInvoke(onNumberFormatSubmit, values);
};
// Handle print button click.
const handlePrintBtnClick = () => {
openDialog(DialogsName.PurchasesByItemsPdfPreview);
};
return (
<DashboardActionsBar>
<NavbarGroup>
@@ -106,6 +116,7 @@ function PurchasesByItemsActionsBar({
className={Classes.MINIMAL}
icon={<Icon icon="print-16" iconSize={16} />}
text={<T id={'print'} />}
onClick={handlePrintBtnClick}
/>
<Popover
content={<PurchasesByItemsExportMenu />}
@@ -129,4 +140,5 @@ export default compose(
purchasesByItemsDrawerFilter,
})),
withPurchasesByItemsActions,
withDialogActions,
)(PurchasesByItemsActionsBar);

12
packages/webapp/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsDialogs.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { DialogsName } from '@/constants/dialogs';
import { PurchasesByItemsPdfDialog } from './dialogs/PurchasesByItemsDialog';
export function PurchasesByItemsDialogs() {
return (
<>
<PurchasesByItemsPdfDialog
dialogName={DialogsName.PurchasesByItemsPdfPreview}
/>
</>
);
}

15
packages/webapp/src/containers/FinancialStatements/PurchasesByItems/PurchasesByItemsProvider.tsx
View File

@@ -1,5 +1,5 @@
// @ts-nocheck
import React, { createContext, useContext } from 'react';
import React, { createContext, useContext, useMemo } from 'react';
import FinancialReportPage from '../FinancialReportPage';
import { usePurchasesByItemsTable } from '@/hooks/query';
import { transformFilterFormToQuery } from '../common';
@@ -7,26 +7,23 @@ import { transformFilterFormToQuery } from '../common';
const PurchasesByItemsContext = createContext();
function PurchasesByItemsProvider({ query, ...props }) {
// Transformes the report query to http query.
const httpQuery = useMemo(() => transformFilterFormToQuery(query), [query]);
// Handle fetching the purchases by items report based on the given query.
const {
data: purchaseByItems,
isFetching,
isLoading,
refetch,
} = usePurchasesByItemsTable(
{
...transformFilterFormToQuery(query),
},
{
keepPreviousData: true,
},
);
} = usePurchasesByItemsTable(httpQuery, { keepPreviousData: true });
const provider = {
purchaseByItems,
isFetching,
isLoading,
refetchSheet: refetch,
httpQuery,
};
return (
<FinancialReportPage name={'purchase-by-items'}>

12
packages/webapp/src/containers/FinancialStatements/PurchasesByItems/components.tsx
View File

@@ -37,11 +37,8 @@ export function PurchasesByItemsLoadingBar() {
*/
export const PurchasesByItemsExportMenu = () => {
const toastKey = useRef(null);
const commonToastConfig = {
isCloseButtonShown: true,
timeout: 2000,
};
const { query } = usePurchaseByItemsContext();
const commonToastConfig = { isCloseButtonShown: true, timeout: 2000 };
const { httpQuery } = usePurchaseByItemsContext();
const openProgressToast = (amount: number) => {
return (
@@ -57,9 +54,8 @@ export const PurchasesByItemsExportMenu = () => {
</Stack>
);
};
// Export the report to xlsx.
const { mutateAsync: xlsxExport } = usePurchasesByItemsXlsxExport(query, {
const { mutateAsync: xlsxExport } = usePurchasesByItemsXlsxExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({
@@ -78,7 +74,7 @@ export const PurchasesByItemsExportMenu = () => {
},
});
// Export the report to csv.
const { mutateAsync: csvExport } = usePurchasesByItemsCsvExport(query, {
const { mutateAsync: csvExport } = usePurchasesByItemsCsvExport(httpQuery, {
onDownloadProgress: (xlsxExportProgress: number) => {
if (!toastKey.current) {
toastKey.current = AppToaster.show({

Some files were not shown because too many files have changed in this diff Show More