BTC Demo Wallet Integration

Topl · Apr 23, 2024 · ac08be3 · ac08be3
1 parent c2d99ab
commit ac08be3
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 98 deletions.
diff --git a/bridge-ui/src/controllers/PeginController.ts b/bridge-ui/src/controllers/PeginController.ts
@@ -5,7 +5,6 @@ import { SessionInformation, StartSessionResponse } from '../views/StartSession'
 export enum PeginUIState {
   InitialState,
   SessionStarted,
-  WaitingForBTC,
   MintingTBTC,
   WaitingForMint,
   MintedTBTC
@@ -17,8 +16,6 @@ function stringToPeginUIState(state: string): PeginUIState {
       return PeginUIState.InitialState;
     case "SessionStarted":
       return PeginUIState.SessionStarted;
-    case "WaitingForBTC":
-      return PeginUIState.WaitingForBTC;
     case "MintingTBTC":
       return PeginUIState.MintingTBTC;
     case "WaitingForMint":
@@ -53,10 +50,6 @@ export function sessionStarted(setSession: React.Dispatch<React.SetStateAction<S
   setSession({ isSet: true, sessionID: response.sessionID, escrowAddress: response.escrowAddress, currentState: PeginUIState.SessionStarted, redeemAddress: "", toplBridgePKey: "", redeemTemplate: "" });
 }
 
-export function btcSent(setSession: React.Dispatch<React.SetStateAction<SessionInformation>>, session: SessionInformation) {
-  setCookie("currentState", "WaitingForBTC");
-  setSession({ isSet: true, sessionID: session.sessionID, escrowAddress: session.escrowAddress, currentState: PeginUIState.WaitingForBTC, redeemAddress: "", toplBridgePKey: "", redeemTemplate: "" });
-}
 export function btcArrived(setSession: React.Dispatch<React.SetStateAction<SessionInformation>>, session: SessionInformation) {
   setCookie("currentState", "MintingTBTC");
   setSession({ isSet: true, sessionID: session.sessionID, escrowAddress: session.escrowAddress, currentState: PeginUIState.MintingTBTC, redeemAddress: "", toplBridgePKey: "", redeemTemplate: "" });

diff --git a/bridge-ui/src/views/PeginView.tsx b/bridge-ui/src/views/PeginView.tsx
@@ -1,7 +1,6 @@
 import { useOutletContext } from "react-router-dom";
 import { PeginUIState } from "../controllers/PeginController";
 import StartSession, { SessionInformation } from "./StartSession";
-import WaitingForBTC from "./WaitingForBTC";
 import WaitingForMint from "./WaitingForMint";
 import { SessionCtx } from "../Frame";
 
@@ -11,8 +10,6 @@ const currentView = (session: SessionInformation, setSession: React.Dispatch<Rea
       return StartSession(session, setSession)
     case PeginUIState.SessionStarted:
       return StartSession(session, setSession)
-    case PeginUIState.WaitingForBTC:
-      return WaitingForBTC(session, setSession)
     case PeginUIState.WaitingForMint:
       return WaitingForMint(session)
     case PeginUIState.MintingTBTC:

diff --git a/bridge-ui/src/views/StartSession.tsx b/bridge-ui/src/views/StartSession.tsx
@@ -1,5 +1,5 @@
-import { useState } from 'react';
-import { PeginUIState, btcSent, sessionStarted } from '../controllers/PeginController';
+import { useState, useEffect } from 'react';
+import { PeginUIState, sessionStarted, mintingBTC } from '../controllers/PeginController';
 
 export interface SessionInformation {
   isSet: boolean;
@@ -75,6 +75,31 @@ function StartSession(session: SessionInformation, setSession: React.Dispatch<Re
   const [hash, setHash] = useState<string>("")
   const [error, setError] = useState<string>("")
 
+  useEffect(() => {
+    const sessionPoll = setInterval(async () => { 
+      if((session.currentState == PeginUIState.SessionStarted)){
+        const response = await fetch('/api/topl-minting-status', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json'
+          },
+          body: JSON.stringify({sessionID: session.sessionID})
+        })
+        if (response.status == 200) {
+          const data = await response.json();
+          const mintStatus = (data?.mintingStatus || "") as string
+          if(mintStatus !== "MintingBTCStateReady") {
+            mintingBTC(setSession, session)
+            clearInterval(sessionPoll)
+          }
+        } else {
+          console.error(response)
+        }
+      }
+    }, 1000)
+    return () => clearInterval(sessionPoll);
+  })
+
   async function handleSubmitSha(event: React.FormEvent<HTMLFormElement>) {
     event.preventDefault();
     const startSessionRequest: StartSessionRequest = {
@@ -90,10 +115,6 @@ function StartSession(session: SessionInformation, setSession: React.Dispatch<Re
     }
   }
 
-  async function handleSubmitBTCTransferred(event: React.FormEvent<HTMLFormElement>) {
-    event.preventDefault();
-    btcSent(setSession, session);
-  }
   const style = {
     width: '25%'
   };
@@ -118,17 +139,18 @@ function StartSession(session: SessionInformation, setSession: React.Dispatch<Re
               </div>
             </div>
           </form>
-          <form className='row g-3' onSubmit={handleSubmitBTCTransferred}>
+          <div className='row g-3'>
             <div className="row">
+            <div className="mb-3">
+                <label htmlFor="sessionId" className="form-label">Session</label>
+                <input type="text" value={session.sessionID} className="form-control" id="sessionId" disabled />
+              </div>
               <div className="mb-3">
                 <label htmlFor="escrowAddress" className="form-label">Escrow Address</label>
                 <input type="text" value={session.escrowAddress} className="form-control" id="escrowAddress" disabled />
               </div>
-              <div className="mb-3">
-                <button type="submit" className="btn btn-primary mb-3" disabled={session.currentState !== PeginUIState.SessionStarted}>BTC Transferred</button>
-              </div>
             </div>
-          </form>
+          </div>
         </div>
         {alertInstructions(session.isSet)}
       </div>

diff --git a/bridge-ui/src/views/WaitingForBTC.tsx b/bridge-ui/src/views/WaitingForBTC.tsx