QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-21 15:20:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: move approve/reject estimate buttons to more menu

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2024-01-09 22:14:10 +02:00
parent 26e104b9f1
commit 46d25dff4c
2 changed files with 91 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx
View File

@@ -42,7 +42,7 @@ function EstimateDetailActionsBar({
closeDrawer, closeDrawer,
}) { }) {
// Estimate details drawer context. // Estimate details drawer context.
const { estimateId, estimate } = useEstimateDetailDrawerContext(); const { estimateId } = useEstimateDetailDrawerContext();
// History. // History.
const history = useHistory(); const history = useHistory();
@@ -52,17 +52,6 @@ function EstimateDetailActionsBar({
history.push(`/estimates/${estimateId}/edit`); history.push(`/estimates/${estimateId}/edit`);
closeDrawer(DRAWERS.ESTIMATE_DETAILS); closeDrawer(DRAWERS.ESTIMATE_DETAILS);
}; };
// Handle cancel/confirm estimate approve.
const handleApproveEstimate = () => {
openAlert('estimate-Approve', { estimateId });
};
// Handle cancel/confirm estimate reject.
const handleRejectEstimate = () => {
openAlert('estimate-reject', { estimateId });
};
// Handle delete sale estimate. // Handle delete sale estimate.
const handleDeleteEstimate = () => { const handleDeleteEstimate = () => {
openAlert('estimate-delete', { estimateId }); openAlert('estimate-delete', { estimateId });
@@ -93,50 +82,7 @@ function EstimateDetailActionsBar({
/> />
<NavbarDivider /> <NavbarDivider />
</Can> </Can>
<Choose>
<Choose.When
condition={estimate.is_delivered && estimate.is_rejected}
>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<Button
className={Classes.MINIMAL}
icon={<Icon icon="check" />}
text={<T id={'mark_as_approved'} />}
onClick={handleApproveEstimate}
/>
</Can>
</Choose.When>
<Choose.When
condition={estimate.is_delivered && estimate.is_approved}
>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<Button
className={Classes.MINIMAL}
icon={<Icon icon="close-black" />}
text={<T id={'mark_as_rejected'} />}
onClick={handleRejectEstimate}
/>
</Can>
</Choose.When>
<Choose.When condition={estimate.is_delivered}>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<Button
className={Classes.MINIMAL}
icon={<Icon icon="check" />}
text={<T id={'mark_as_approved'} />}
onClick={handleApproveEstimate}
/>
</Can>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<Button
className={Classes.MINIMAL}
icon={<Icon icon="close-black" />}
text={<T id={'mark_as_rejected'} />}
onClick={handleRejectEstimate}
/>
</Can>
</Choose.When>
</Choose>
<Can I={SaleEstimateAction.View} a={AbilitySubject.Estimate}> <Can I={SaleEstimateAction.View} a={AbilitySubject.Estimate}>
<Button <Button
className={Classes.MINIMAL} className={Classes.MINIMAL}

113
packages/webapp/src/containers/Drawers/EstimateDetailDrawer/components.tsx
View File

@@ -1,5 +1,4 @@
// @ts-nocheck // @ts-nocheck
import React from 'react';
import { import {
Intent, Intent,
Button, Button,
@@ -9,9 +8,15 @@ import {
MenuItem, MenuItem,
Menu, Menu,
Tag, Tag,
MenuDivider,
Classes,
} from '@blueprintjs/core'; } from '@blueprintjs/core';
import * as R from 'ramda';
import { Icon, T, Choose } from '@/components'; import { Icon, T, Choose, Can } from '@/components';
import { AbilitySubject, SaleEstimateAction } from '@/constants/abilityOption';
import withAlertsActions from '@/containers/Alert/withAlertActions';
import { useEstimateDetailDrawerContext } from './EstimateDetailDrawerProvider';
/** /**
* Estimate details status. * Estimate details status.
@@ -49,25 +54,85 @@ export function EstimateDetailsStatus({ estimate }) {
); );
} }
export function EstimateMoreMenuItems({ payload: { onNotifyViaSMS } }) { export const EstimateMoreMenuItems = R.compose(withAlertsActions)(
return ( ({
<Popover // # withAlertsActions,
minimal={true} openAlert,
content={
<Menu> // # rest
<MenuItem payload: { onNotifyViaSMS },
onClick={onNotifyViaSMS} }) => {
text={<T id={'notify_via_sms.dialog.notify_via_sms'} />} const { estimateId, estimate } = useEstimateDetailDrawerContext();
/>
</Menu> // Handle cancel/confirm estimate approve.
} const handleApproveEstimate = () => {
interactionKind={PopoverInteractionKind.CLICK} openAlert('estimate-Approve', { estimateId });
position={Position.BOTTOM_LEFT} };
modifiers={{ // Handle cancel/confirm estimate reject.
offset: { offset: '0, 4' }, const handleRejectEstimate = () => {
}} openAlert('estimate-reject', { estimateId });
> };
<Button icon={<Icon icon="more-vert" iconSize={16} />} minimal={true} />
</Popover> return (
); <Popover
} minimal={true}
content={
<Menu>
<MenuItem
onClick={onNotifyViaSMS}
text={<T id={'notify_via_sms.dialog.notify_via_sms'} />}
/>
<MenuDivider />
<Choose>
<Choose.When
condition={estimate.is_delivered && estimate.is_rejected}
>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<MenuItem
className={Classes.MINIMAL}
text={<T id={'mark_as_approved'} />}
onClick={handleApproveEstimate}
/>
</Can>
</Choose.When>
<Choose.When
condition={estimate.is_delivered && estimate.is_approved}
>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<MenuItem
className={Classes.MINIMAL}
text={<T id={'mark_as_rejected'} />}
onClick={handleRejectEstimate}
/>
</Can>
</Choose.When>
<Choose.When condition={estimate.is_delivered}>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<MenuItem
className={Classes.MINIMAL}
text={<T id={'mark_as_approved'} />}
onClick={handleApproveEstimate}
/>
</Can>
<Can I={SaleEstimateAction.Edit} a={AbilitySubject.Estimate}>
<MenuItem
className={Classes.MINIMAL}
text={<T id={'mark_as_rejected'} />}
onClick={handleRejectEstimate}
/>
</Can>
</Choose.When>
</Choose>
</Menu>
}
interactionKind={PopoverInteractionKind.CLICK}
position={Position.BOTTOM_LEFT}
modifiers={{
offset: { offset: '0, 4' },
}}
>
<Button icon={<Icon icon="more-vert" iconSize={16} />} minimal={true} />
</Popover>
);
},
);