Merge pull request #1801 from trilitech/send-message-when-estimation-…

…completed

Send message to Embed Component when fee estimation completed

apps/embed-iframe/src/OperationModalContent.tsx

@@ -29,7 +29,7 @@ import { getDAppByOrigin } from "./ClientsPermissions";
 const SIGN_TIMEOUT = 5 * 60 * 1000; // 5 minutes
 
 export const OperationModalContent = () => {
-  const { onClose, isLoading, setIsLoading, estimatedOperations } = useOperationModalContext();
+  const { onClose, setIsLoading, estimatedOperations } = useOperationModalContext();
   const { getNetwork, getUserData, getDAppOrigin } = useEmbedApp();
 
   const color = useColor();
@@ -113,7 +113,7 @@ export const OperationModalContent = () => {
                   Fee:
                 </Text>
                 <Text color={color("900")} data-testid="fee" size="xs">
-                  {isLoading ? "..." : prettyTezAmount(totalFee(estimatedOperations!.estimates))}
+                  {prettyTezAmount(totalFee(estimatedOperations!.estimates))}
                 </Text>
               </Flex>
             </Flex>

apps/embed-iframe/src/operationModalHooks.tsx

@@ -2,7 +2,13 @@ import type { PartialTezosOperation } from "@airgap/beacon-types";
 import { Center, Modal, ModalCloseButton, ModalContent } from "@chakra-ui/react";
 
 import { OperationModalContent } from "./OperationModalContent";
-import { sendOperationErrorResponse, toSocialAccount, toTezosNetwork } from "./utils";
+import {
+  sendComputationErrorResponse,
+  sendOperationErrorResponse,
+  sendResponse,
+  toSocialAccount,
+  toTezosNetwork,
+} from "./utils";
 import { useOperationModalContext } from "./OperationModalContext";
 import { ModalLoadingOverlay } from "./ModalLoadingOverlay";
 import { estimate, getErrorContext, toAccountOperations } from "@umami/core";
@@ -42,11 +48,11 @@ export const useOperationModal = () => {
           accountOperations,
           toTezosNetwork(getNetwork()!)
         );
-
         setEstimatedOperations(estimatedOperations);
         onOpen();
+        sendResponse({ type: "computation_completed_response" });
       } catch (error) {
-        sendOperationErrorResponse(getErrorContext(error).description);
+        sendComputationErrorResponse(getErrorContext(error).description);
         onClose();
       }
     },

apps/embed-iframe/src/utils.ts

@@ -13,6 +13,14 @@ export const sendLoginErrorResponse = (errorMessage: string) => {
   });
 };
 
+export const sendComputationErrorResponse = (errorMessage: string) => {
+  sendResponse({
+    type: "computation_completed_response",
+    error: "operation_failed",
+    errorMessage,
+  });
+};
+
 export const sendOperationErrorResponse = (errorMessage: string) => {
   sendResponse({
     type: "operation_response",