Merge branch 'develop' of https://github.com/bigcapitalhq/client into develop

src/containers/TransactionsLocking/TransactionsLockingAlerts.js

@@ -0,0 +1,15 @@
+import React from 'react';
+
+const cancelUnlockingPartialAlert = React.lazy(() =>
+  import('../Alerts/TransactionLocking/cancelUnlockingPartialAlert'),
+);
+
+/**
+ * Transactions alerts.
+ */
+export default [
+  {
+    name: 'cancel-unlocking-partail',
+    component: cancelUnlockingPartialAlert,
+  },
+];

src/containers/TransactionsLocking/TransactionsLockingList.js

@@ -12,6 +12,8 @@ import {
 } from './components';
 import { useTransactionsLockingContext } from './TransactionsLockingProvider';
 import withDialogActions from 'containers/Dialog/withDialogActions';
+import withAlertsActions from 'containers/Alert/withAlertActions';
+
 import {
   validateMoveToFullLocking,
   validateMoveToPartialLocking,
@@ -21,18 +23,35 @@ function Paragraph({ className, children }) {
   return <p className={clsx('paragraph', className)}>{children}</p>;
 }
 
-function TransactionsLockingList({ items, onlock, onUnlock, onUnlockPartial }) {
-  return items.map(({ is_enabled, module, formatted_module, description }) => (
-    <TransactionLockingContent
-      name={formatted_module}
-      module={module}
-      description={description}
-      isEnabled={is_enabled}
-      onLock={onlock}
-      onUnlockPartial={onUnlockPartial}
-      onEditLock={onlock}
-    />
-  ));
+function TransactionsLockingList({
+  items,
+  onLock,
+  onUnlock,
+  onUnlockPartial,
+  onCancel,
+}) {
+  return items.map(
+    ({
+      is_enabled,
+      is_partial_unlock,
+      module,
+      formatted_module,
+      description,
+    }) => (
+      <TransactionLockingContent
+        name={formatted_module}
+        module={module}
+        description={description}
+        isEnabled={is_enabled}
+        isPartialUnlock={is_partial_unlock}
+        onLock={onLock}
+        onUnlockFull={onUnlock}
+        onUnlockPartial={onUnlockPartial}
+        onEditLock={onLock}
+        onCancle={onCancel}
+      />
+    ),
+  );
 }
 
 function TransactionsLockingFull({ onLock, onUnlock, onUnlockPartial }) {
@@ -137,11 +156,13 @@ function TransactionsLockingAlert() {
 function TransactionsLockingBodyJsx({
   // #withDialogActions
   openDialog,
+
+  // #withAlertsActions
+  openAlert,
 }) {
   const {
     transactionsLocking: { modules },
     isTransactionLockingLoading,
-
     transactionLockingType,
   } = useTransactionsLockingContext();
 
@@ -159,25 +180,35 @@ function TransactionsLockingBodyJsx({
     openDialog('unlocking-partial-transactions', { module: module });
   };
 
+  // Handle cancel.
+  const handleCancelUnlockingPartail = (module) => {
+    openAlert('cancel-unlocking-partail', { module: module });
+  };
+
   return !isTransactionLockingLoading ? (
     transactionLockingType === 'partial' ? (
       <TransactionsLockingList
         items={modules}
-        onlock={handleLockingTransactions}
+        onLock={handleLockingTransactions}
         onUnlock={handleUnlockTransactions}
         onUnlockPartial={handleUnlockingPartial}
+        onCancel={handleCancelUnlockingPartail}
       />
     ) : (
-      <TransactionsLockingFull />
+      <TransactionsLockingFull
+        onLock={handleLockingTransactions}
+        onUnlockPartial={handleUnlockingPartial}
+      />
     )
   ) : (
     <TransactionLockingSkeletonList />
   );
 }
 
-const TransactionsLockingBody = R.compose(withDialogActions)(
-  TransactionsLockingBodyJsx,
-);
+const TransactionsLockingBody = R.compose(
+  withAlertsActions,
+  withDialogActions,
+)(TransactionsLockingBodyJsx);
 
 /**
  * Transactions locking list.

src/containers/TransactionsLocking/components.js

@@ -46,6 +46,7 @@ export const TransactionLockingContent = ({
   onEditLock,
   onUnlockFull,
   onUnlockPartial,
+  onCancle,
 }) => {
   const handleLockClick = (event) => {
     safeInvoke(onLock, module, event);
@@ -60,6 +61,9 @@ export const TransactionLockingContent = ({
   const handleUnlockFull = (event) => {
     safeInvoke(onUnlockFull, module, event);
   };
+  const handleCanclel = (event) => {
+    safeInvoke(onCancle, module, event);
+  };
 
   return (
     <TransactionLockingWrapp isEnabled={isEnabled}>
@@ -85,7 +89,7 @@ export const TransactionLockingContent = ({
         </TransLockingContent>
 
         <TransLockingActions>
-          <If condition={!isEnabled}>
+          <If condition={!isEnabled && !isPartialUnlock}>
             <Button
               small={true}
               minimal={true}
@@ -96,7 +100,7 @@ export const TransactionLockingContent = ({
             </Button>
           </If>
 
-          <If condition={isEnabled}>
+          <If condition={isEnabled && !isPartialUnlock}>
             <Button
               small={true}
               minimal={true}
@@ -110,6 +114,7 @@ export const TransactionLockingContent = ({
               content={
                 <Menu>
                   <MenuItem text="Full unlock" onClick={handleUnlockFull} />
+
                   <MenuItem
                     text="Partial unlock"
                     onClick={handleUnlockPartial}
@@ -124,6 +129,17 @@ export const TransactionLockingContent = ({
               </Button>
             </Popover2>
           </If>
+
+          <If condition={isPartialUnlock}>
+            <Button
+              small={true}
+              minimal={true}
+              intent={Intent.PRIMARY}
+              onClick={handleCanclel}
+            >
+              Cancel
+            </Button>
+          </If>
         </TransLockingActions>
       </TransLockingInner>
     </TransactionLockingWrapp>