Implement GTC Orders (#481)

This PR makes all orders Good 'Till Cancelled (GTC) orders. If you place an order it will stay pending and keep re-broadcasting the order every 10 minutes until it either matches or the user cancels it.

Author: lukechilds

app/locales/en-US/swap.json

@@ -44,7 +44,9 @@
 		"matched": "Matched",
 		"reverted": "Reverted",
 		"pending": "Pending",
-		"unmatched": "Unmatched"
+		"open": "Open",
+		"unmatched": "Unmatched",
+		"cancelled": "Cancelled"
 	},
 	"statusInformation": {
 		"reverted": "The swap was reverted due to connectivity issues."

app/renderer/api.js

@@ -190,6 +190,7 @@ export default class Api {
 
 		return this.request({
 			method: opts.type,
+			gtc: 1,
 			base: opts.baseCurrency,
 			rel: opts.quoteCurrency,
 			basevolume: opts.amount,

app/renderer/components/SwapList.js

@@ -83,7 +83,7 @@ const SwapHeader = props => (
 	</div>
 );
 
-const SwapItem = ({style, swap}) => (
+const SwapItem = ({style, swap, showCancel}) => (
 	<div className={`row ${swap.orderType}`} style={style}>
 		<div className="timestamp">{formatDate(swap.timeStarted, 'HH:mm DD/MM/YY')}</div>
 		<div className="pairs">{swap.baseCurrency}/{swap.quoteCurrency}</div>
@@ -93,13 +93,11 @@ const SwapItem = ({style, swap}) => (
 			<div className="status__icon" data-status={swap.status}>{swap.statusFormatted}</div>
 		</div>
 		<div className="buttons">
-			{/* Disabled until marketmaker v2
-				See: https://github.com/atomiclabs/hyperdex/issues/262#issuecomment-396587751showCancel
-				&&
+			{showCancel && (
 				<div className="cancel">
 					<CancelButton swap={swap}/>
 				</div>
-			*/}
+			)}
 			<div className="view">
 				<SwapDetails swap={swap}/>
 			</div>

app/renderer/components/SwapList.scss

@@ -116,13 +116,17 @@
 		}
 	}
 
-	@media (min-width: 1260px) {
+	@media (min-width: 1280px) {
 		.row {
 			grid-template-areas: 'timestamp pairs base-amount quote-amount status buttons';
-			grid-template-columns: 16% 14% 23% 20%;
+			grid-template-columns: 14% 0% 23% 23%;
 			justify-content: unset;
 			white-space: unset;
 
+			.pairs {
+				display: none;
+			}
+
 			.base-amount {
 				justify-self: start;
 			}
@@ -132,7 +136,7 @@
 			}
 
 			.status {
-				justify-self: center;
+				justify-self: end;
 			}
 
 			.buttons {
@@ -141,6 +145,16 @@
 		}
 	}
 
+	@media (min-width: 1480px) {
+		.row {
+			grid-template-columns: 14% 15% 21% 21%;
+
+			.pairs {
+				display: block;
+			}
+		}
+	}
+
 	.timestamp {
 		color: var(--text-color);
 	}

app/renderer/swap-db.js

@@ -4,8 +4,9 @@ import cryptoPouch from 'crypto-pouch';
 import Emittery from 'emittery';
 import PQueue from 'p-queue';
 import roundTo from 'round-to';
-import {subDays, isPast, addMinutes} from 'date-fns';
+import {subDays, isAfter} from 'date-fns';
 import appContainer from 'containers/App';
+import {appTimeStarted} from '../constants';
 import swapTransactions from './swap-transactions';
 import {translate} from './translate';
 
@@ -227,14 +228,13 @@ class SwapDB {
 			}
 		});
 
-		// Treat swaps pending for more than 5 minutes as failed.
-		// https://github.com/jl777/SuperNET/issues/775#issuecomment-397557568
-		const timedOut = swap.status === 'pending' && isPast(addMinutes(swap.timeStarted, 5));
-		if (timedOut) {
+		// Show open orders from previous session as cancelled
+		const cancelled = swap.status === 'pending' && isAfter(appTimeStarted, swap.timeStarted);
+		if (cancelled) {
 			swap.status = 'failed';
 			swap.error = {
 				code: undefined,
-				message: t('timedOut'),
+				message: undefined,
 			};
 		}
 
@@ -252,15 +252,22 @@ class SwapDB {
 		}
 
 		if (swap.status === 'failed') {
-			if (swap.error.code === -9999 || timedOut) {
+			if (swap.error.code === -9999) {
 				swap.statusFormatted = t('status.unmatched').toLowerCase();
 			}
+			if (swap.error.code === -9998 || cancelled) {
+				swap.statusFormatted = t('status.cancelled').toLowerCase();
+			}
 			if (swap.transactions.find(tx => tx.stage === 'alicereclaim')) {
 				swap.statusFormatted = t('status.reverted').toLowerCase();
 				swap.statusInformation = t('statusInformation.reverted');
 			}
 		}
 
+		if (swap.status === 'pending') {
+			swap.statusFormatted = t('status.open').toLowerCase();
+		}
+
 		return swap;
 	}
 

app/renderer/views/Exchange/Swaps.js

@@ -33,7 +33,7 @@ const TabView = ({component}) => (
 );
 
 const All = () => (
-	<SwapList swaps={exchangeContainer.state.swapHistory} limit={swapLimit}/>
+	<SwapList swaps={exchangeContainer.state.swapHistory} limit={swapLimit} showCancel/>
 );
 
 const Split = () => {
@@ -45,7 +45,7 @@ const Split = () => {
 	);
 
 	return (
-		<SwapList swaps={filteredData} limit={swapLimit}/>
+		<SwapList swaps={filteredData} limit={swapLimit} showCancel/>
 	);
 };
 

app/renderer/views/Trades.scss

@@ -62,6 +62,10 @@
 					justify-content: unset;
 					white-space: unset;
 
+					.pairs {
+						display: block;
+					}
+
 					.base-amount {
 						justify-self: start;
 					}