diff --git a/client/src/containers/Items/ItemForm.js b/client/src/containers/Items/ItemForm.js index 78adb5345..16decaf0f 100644 --- a/client/src/containers/Items/ItemForm.js +++ b/client/src/containers/Items/ItemForm.js @@ -60,14 +60,14 @@ function ItemForm({ createItemMutate, editItemMutate, submitPayload, - isNewMode + isNewMode, } = useItemFormContext(); // History context. const history = useHistory(); const { formatMessage } = useIntl(); - + /** * Initial values in create and edit mode. */ @@ -97,7 +97,11 @@ function ItemForm({ // Transform API errors. const transformApiErrors = (error) => { - const { response: { data: { errors } } } = error; + const { + response: { + data: { errors }, + }, + } = error; const fields = {}; if (errors.find((e) => e.type === 'ITEM.NAME.ALREADY.EXISTS')) { @@ -118,9 +122,10 @@ function ItemForm({ AppToaster.show({ message: formatMessage( { - id: isNewMode - ? 'the_item_has_been_created_successfully' - : 'the_item_has_been_edited_successfully', + id: + isNewMode + ? 'the_item_has_been_created_successfully' + : 'the_item_has_been_edited_successfully', }, { number: itemId, @@ -151,7 +156,7 @@ function ItemForm({ editItemMutate([itemId, form]).then(onSuccess).catch(onError); } }; - + return (
{ - !isNewMode - ? changePageTitle(formatMessage({ id: 'edit_item_details' })) - : changePageTitle(formatMessage({ id: 'new_item' })); + isNewMode + ? changePageTitle(formatMessage({ id: 'new_item' })) + : changePageTitle(formatMessage({ id: 'edit_item_details' })); }, [changePageTitle, isNewMode, formatMessage]); return ( diff --git a/client/src/containers/Items/ItemsDataTable.js b/client/src/containers/Items/ItemsDataTable.js index df1a02dc3..d60463eb5 100644 --- a/client/src/containers/Items/ItemsDataTable.js +++ b/client/src/containers/Items/ItemsDataTable.js @@ -7,7 +7,6 @@ import ItemsEmptyStatus from './ItemsEmptyStatus'; import TableSkeletonRows from 'components/Datatable/TableSkeletonRows'; import TableSkeletonHeader from 'components/Datatable/TableHeaderSkeleton'; - import withItems from 'containers/Items/withItems'; import withItemsActions from 'containers/Items/withItemsActions'; import withAlertsActions from 'containers/Alert/withAlertActions'; @@ -94,6 +93,11 @@ function ItemsDataTable({ }; // Display empty status instead of the table. + const handleDuplicate = ({ id }) => { + history.push(`/items/new?duplicate=${id}`, { action: id }); + }; + + // Cannot continue in case the items has empty status. if (isEmptyStatus) { return ; } @@ -103,29 +107,23 @@ function ItemsDataTable({ columns={columns} data={items} initialState={itemsTableState} - loading={isItemsLoading} headerLoading={isItemsLoading} progressBarLoading={isItemsFetching} - noInitialFetch={true} selectionColumn={true} spinnerProps={{ size: 30 }} expandable={false} sticky={true} rowClassNames={rowClassNames} - pagination={true} manualSortBy={true} manualPagination={true} pagesCount={pagination.pagesCount} - autoResetSortBy={false} autoResetPage={true} - TableLoadingRenderer={TableSkeletonRows} TableHeaderSkeletonRenderer={TableSkeletonHeader} - ContextMenu={ItemsActionMenuList} onFetchData={handleFetchData} payload={{ @@ -134,6 +132,7 @@ function ItemsDataTable({ onInactivateItem: handleInactiveItem, onActivateItem: handleActivateItem, onMakeAdjustment: handleMakeAdjustment, + onDuplicate: handleDuplicate, }} noResults={'There is no items in the table yet.'} {...tableProps} diff --git a/client/src/containers/Items/components.js b/client/src/containers/Items/components.js index c8bd5e4a9..24af7fb21 100644 --- a/client/src/containers/Items/components.js +++ b/client/src/containers/Items/components.js @@ -79,10 +79,10 @@ export function ItemsActionMenuList({ onActivateItem, onMakeAdjustment, onDeleteItem, + onDuplicate, }, }) { const { formatMessage } = useIntl(); - return ( + } + text={formatMessage({ id: 'duplicate' })} + onClick={safeCallback(onDuplicate, original)} + /> { width: 180, }, { - id:'code', + id: 'code', Header: formatMessage({ id: 'item_code' }), accessor: 'code', className: 'code', @@ -174,7 +179,7 @@ export const useItemsTableColumns = () => { width: 150, }, { - id:'sell_price', + id: 'sell_price', Header: formatMessage({ id: 'sell_price' }), Cell: SellPriceCell, accessor: 'sell_price', @@ -182,7 +187,7 @@ export const useItemsTableColumns = () => { width: 150, }, { - id:'cost_price', + id: 'cost_price', Header: formatMessage({ id: 'cost_price' }), Cell: CostPriceCell, accessor: 'cost_price', @@ -190,7 +195,7 @@ export const useItemsTableColumns = () => { width: 150, }, { - id:'quantity_on_hand', + id: 'quantity_on_hand', Header: formatMessage({ id: 'quantity_on_hand' }), accessor: 'quantity_on_hand', Cell: QuantityOnHandCell, diff --git a/client/src/routes/dashboard.js b/client/src/routes/dashboard.js index 91a19f710..9aaf1614b 100644 --- a/client/src/routes/dashboard.js +++ b/client/src/routes/dashboard.js @@ -71,6 +71,13 @@ export default [ pageTitle: formatMessage({ id: 'edit_item' }), backLink: true, }, + { + path: `/items/new?duplicate=/:id`, + component: lazy({ + loader: () => import('containers/Items/ItemFormPage'), + }), + breadcrumb: 'Duplicate Item', + }, { path: `/items/new`, component: lazy(() => import('containers/Items/ItemFormPage')),