feat: item-duplicate

client/src/containers/Items/ItemForm.js

@@ -58,7 +58,8 @@ function ItemForm({
     createItemMutate,
     editItemMutate,
     submitPayload,
-    isNewMode
+    isNewMode,
+    isDuplicateMode,
   } = useItemFormContext();
 
   // History context.
@@ -95,7 +96,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')) {
@@ -116,9 +121,10 @@ function ItemForm({
       AppToaster.show({
         message: formatMessage(
           {
-            id: isNewMode
+            id:
-              ? 'the_item_has_been_created_successfully'
+              isNewMode || isDuplicateMode
-              : 'the_item_has_been_edited_successfully',
+                ? 'the_item_has_been_created_successfully'
+                : 'the_item_has_been_edited_successfully',
           },
           {
             number: itemId,
@@ -143,7 +149,7 @@ function ItemForm({
         setErrors({ ..._errors });
       }
     };
-    if (isNewMode) {
+    if (isNewMode || isDuplicateMode) {
       createItemMutate(form).then(onSuccess).catch(onError);
     } else {
       editItemMutate([itemId, form]).then(onSuccess).catch(onError);

client/src/containers/Items/ItemFormFloatingActions.js

@@ -16,7 +16,7 @@ export default function ItemFormFloatingActions() {
   const history = useHistory();
 
   // Item form context.
-  const { setSubmitPayload, isNewMode } = useItemFormContext();
+  const { setSubmitPayload, isNewMode, isDuplicateMode } = useItemFormContext();
 
   // Formik context.
   const { isSubmitting } = useFormikContext();
@@ -46,7 +46,7 @@ export default function ItemFormFloatingActions() {
         type="submit"
         className={'btn--submit'}
       >
-        {isNewMode ? <T id={'save'} /> : <T id={'edit'} />}
+        {isNewMode || isDuplicateMode ? <T id={'save'} /> : <T id={'edit'} />}
       </Button>
 
       <Button

client/src/containers/Items/ItemFormProvider.js

@@ -1,5 +1,6 @@
 import React, { useEffect, createContext, useState } from 'react';
 import { useIntl } from 'react-intl';
+import { useLocation, useParams } from 'react-router-dom';
 import DashboardInsider from 'components/Dashboard/DashboardInsider';
 import {
   useItem,
@@ -16,6 +17,7 @@ const ItemFormContext = createContext();
  * Accounts chart data provider.
  */
 function ItemFormProvider({ itemId, ...props }) {
+  const { state } = useLocation();
   // Fetches the accounts list.
   const { isFetching: isAccountsLoading, data: accounts } = useAccounts();
 
@@ -38,6 +40,7 @@ function ItemFormProvider({ itemId, ...props }) {
 
   // Detarmines whether the form new mode.
   const isNewMode = !itemId;
+  const isDuplicateMode = state?.action == 'duplicate';
 
   // Provider state.
   const provider = {
@@ -47,6 +50,7 @@ function ItemFormProvider({ itemId, ...props }) {
     itemsCategories,
     submitPayload,
     isNewMode,
+    isDuplicateMode,
 
     isAccountsLoading,
     isItemsCategoriesLoading,
@@ -54,7 +58,7 @@ function ItemFormProvider({ itemId, ...props }) {
 
     createItemMutate,
     editItemMutate,
-    setSubmitPayload
+    setSubmitPayload,
   };
 
   // Format message intl.
@@ -65,9 +69,9 @@ function ItemFormProvider({ itemId, ...props }) {
 
   // Changes the page title in new and edit mode.
   useEffect(() => {
-    !isNewMode
+    isNewMode || isDuplicateMode
-      ? changePageTitle(formatMessage({ id: 'edit_item_details' }))
+      ? changePageTitle(formatMessage({ id: 'new_item' }))
-      : changePageTitle(formatMessage({ id: 'new_item' }));
+      : changePageTitle(formatMessage({ id: 'edit_item_details' }));
   }, [changePageTitle, isNewMode, formatMessage]);
 
   return (

client/src/containers/Items/ItemsDataTable.js

@@ -95,6 +95,10 @@ function ItemsDataTable({
     openDialog('inventory-adjustment', { itemId: id });
   };
 
+  const handleDuplicate = ({ id }) => {
+    history.push(`/items/${id}/duplicate`, { action: 'duplicate' });
+  };
+
   // Cannot continue in case the items has empty status.
   if (isEmptyStatus) {
     return <ItemsEmptyStatus />;
@@ -131,6 +135,7 @@ function ItemsDataTable({
           onInactivateItem: handleInactiveItem,
           onActivateItem: handleActivateItem,
           onMakeAdjustment: handleMakeAdjustment,
+          onDuplicate: handleDuplicate,
         }}
         noResults={'There is no items in the table yet.'}
         {...tableProps}

client/src/containers/Items/components.js

@@ -79,10 +79,10 @@ export function ItemsActionMenuList({
     onActivateItem,
     onMakeAdjustment,
     onDeleteItem,
+    onDuplicate,
   },
 }) {
   const { formatMessage } = useIntl();
- 
   return (
     <Menu>
       <MenuItem
@@ -122,9 +122,13 @@ export function ItemsActionMenuList({
         onClick={safeCallback(onDeleteItem, original)}
         intent={Intent.DANGER}
       />
+      <MenuItem
+        text={formatMessage({ id: 'duplicate' })}
+        onClick={safeCallback(onDuplicate, original)}
+      />
     </Menu>
   );
-};
+}
 
 export const ItemsActionsTableCell = (props) => {
   return (
@@ -137,7 +141,6 @@ export const ItemsActionsTableCell = (props) => {
   );
 };
 
-
 /**
  * Retrieve all items table columns.
  */
@@ -199,4 +202,4 @@ export const useItemsTableColumns = () => {
     ],
     [formatMessage],
   );
-}
+};

client/src/lang/en/index.js

@@ -965,5 +965,6 @@ export default {
   running_balance: 'Running balance',
   payment_via_voucher: 'Payment via voucher',
   voucher_number: 'Voucher number',
-  voucher: 'Voucher'
+  voucher: 'Voucher',
+  duplicate:'Duplicate'
 };

client/src/routes/dashboard.js

@@ -74,6 +74,13 @@ export default [
     }),
     breadcrumb: 'Edit Item',
   },
+  {
+    path: `/items/:id/duplicate`,
+    component: LazyLoader({
+      loader: () => import('containers/Items/ItemFormPage'),
+    }),
+    breadcrumb: 'Duplicate Item',
+  },
   {
     path: `/items/new`,
     component: LazyLoader({