fix display of contract terms rendering when already paid

src/i18n/de.po

@@ -42,13 +42,13 @@ msgstr ""
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/webex/pages/confirm-contract.tsx:141
+#: src/webex/pages/confirm-contract.tsx:142
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
 #. tslint:disable-next-line:max-line-length
-#: src/webex/pages/confirm-contract.tsx:143
+#: src/webex/pages/confirm-contract.tsx:144
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "

src/i18n/en-US.po

@@ -42,13 +42,13 @@ msgstr ""
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/webex/pages/confirm-contract.tsx:141
+#: src/webex/pages/confirm-contract.tsx:142
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
 #. tslint:disable-next-line:max-line-length
-#: src/webex/pages/confirm-contract.tsx:143
+#: src/webex/pages/confirm-contract.tsx:144
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "

src/i18n/fr.po

@@ -42,13 +42,13 @@ msgstr ""
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/webex/pages/confirm-contract.tsx:141
+#: src/webex/pages/confirm-contract.tsx:142
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
 #. tslint:disable-next-line:max-line-length
-#: src/webex/pages/confirm-contract.tsx:143
+#: src/webex/pages/confirm-contract.tsx:144
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "

src/i18n/it.po

@@ -42,13 +42,13 @@ msgstr ""
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/webex/pages/confirm-contract.tsx:141
+#: src/webex/pages/confirm-contract.tsx:142
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
 #. tslint:disable-next-line:max-line-length
-#: src/webex/pages/confirm-contract.tsx:143
+#: src/webex/pages/confirm-contract.tsx:144
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "

src/i18n/taler-wallet-webex.pot

@@ -42,13 +42,13 @@ msgstr ""
 msgid "Exchanges in the wallet:"
 msgstr ""
 
-#: src/webex/pages/confirm-contract.tsx:141
+#: src/webex/pages/confirm-contract.tsx:142
 #, c-format
 msgid "You have insufficient funds of the requested currency in your wallet."
 msgstr ""
 
 #. tslint:disable-next-line:max-line-length
-#: src/webex/pages/confirm-contract.tsx:143
+#: src/webex/pages/confirm-contract.tsx:144
 #, c-format
 msgid ""
 "You do not have any funds from an exchange that is accepted by this "

src/wallet.ts

@@ -947,7 +947,7 @@ export class Wallet {
     // First check if we already payed for it.
     const transaction = await this.q().get(Stores.transactions, proposal.contractTermsHash);
     if (transaction) {
-      return "insufficient-balance";
+      return "paid";
     }
 
     // If not already payed, check if we could pay for it.

src/webex/pages/confirm-contract.html

@@ -56,6 +56,15 @@
       font-weight: bold;
       background: #FF8A8A;
     }
+
+    .okaybox {
+      border: 1px solid;
+      display: inline-block;
+      margin: 1em;
+      padding: 1em;
+      font-weight: bold;
+      background: #00FA9A;
+    }
   </style>
 </head>
 

src/webex/pages/confirm-contract.tsx

@@ -105,6 +105,7 @@ interface ContractPromptState {
   proposal: ProposalRecord|null;
   error: string|null;
   payDisabled: boolean;
+  alreadyPaid: boolean;
   exchanges: null|ExchangeRecord[];
 }
 
@@ -153,6 +154,8 @@ class ContractPrompt extends React.Component<ContractPromptProps, ContractPrompt
         this.setState({error: msgInsufficient});
       }
       this.setState({payDisabled: true});
+    } else if (payStatus === "paid") {
+      this.setState({alreadyPaid: true, payDisabled: false, error: null});
     } else {
       this.setState({payDisabled: false, error: null});
     }
@@ -193,6 +196,7 @@ class ContractPrompt extends React.Component<ContractPromptProps, ContractPrompt
           Confirm payment
         </button>
         <div>
+          {(this.state.alreadyPaid ? <p className="okaybox">You already paid for this, clicking "Confirm payment" will not cost money again.</p> : <p />)}
           {(this.state.error ? <p className="errorbox">{this.state.error}</p> : <p />)}
         </div>
         <Details exchanges={this.state.exchanges} contractTerms={c} collapsed={!this.state.error}/>