fix(rwa): fix wallet connect

packages/apps/dev-wallet/src/modules/communication/communication.provider.tsx

@@ -172,6 +172,8 @@ export const CommunicationProvider: FC<
             requestId={requestId}
             plugin={plugin}
             onDone={() => {
+              const request = requests.get(requestId);
+              request?.reject(request.payload);
               setUiComponent(null);
             }}
           />,

packages/apps/dev-wallet/src/modules/plugins/components/SignRequestDialog.tsx

@@ -22,8 +22,8 @@ export function SignRequestDialog({
 
   return (
     <FocussedPageLayout>
-      <Dialog isOpen={isOpened}>
-        <DialogHeader>{`Sign Request from ${plugin.name}`} </DialogHeader>
+      <Dialog isOpen={isOpened} onOpenChange={close}>
+        <DialogHeader>{`Sign Request from ${plugin.name}`}</DialogHeader>
         <DialogContent>
           <SignRequest requestId={requestId} onAbort={close} onSign={close} />
         </DialogContent>

packages/apps/rwa-demo/src/app/(app)/styles.css.ts

@@ -18,3 +18,9 @@ export const logoClass = style({
 globalStyle('body', {
   overflowY: 'hidden',
 });
+
+// fix to make sure the wallet connect modal is ALWAYS on top
+globalStyle('wcm-modal', {
+  position: 'relative',
+  zIndex: 99999999999,
+});

packages/apps/rwa-demo/src/components/AssetForm/AssetStepperForm.tsx

@@ -72,14 +72,13 @@ export const AssetStepperForm: FC<IProps> = ({ handleDone }) => {
 
     const tx = await submitContract(data);
 
-    setIsPending(false);
-
     if (tx) {
       const createdAsset = await addAsset({
         contractName: data.contractName,
         namespace: data.namespace,
       });
 
+      setIsPending(false);
       setIsSuccess(true);
       setStep(STEPS.DONE);
 

packages/apps/rwa-demo/src/components/AssetsList/AssetsList.tsx

@@ -46,7 +46,6 @@ export const AssetsList: FC<{ init?: boolean }> = ({ init }) => {
           }
         />
         <SectionCardBody>
-          {isAllowed.toString()}
           <CompactTable
             variant="open"
             fields={[

packages/apps/rwa-demo/src/components/TableFormatters/FormatSelectAsset.tsx

@@ -3,22 +3,27 @@ import {
   useEventSubscriptionSubscription,
 } from '@/__generated__/sdk';
 import type { IAsset } from '@/contexts/AssetContext/AssetContext';
+import { TXTYPES } from '@/contexts/TransactionsContext/TransactionsContext';
 import { useAsset } from '@/hooks/asset';
+import { useTransactions } from '@/hooks/transactions';
 import { getAsset } from '@/utils/getAsset';
 import { MonoFindInPage, MonoWarning } from '@kadena/kode-icons';
 import { Button } from '@kadena/kode-ui';
 import type { ICompactTableFormatterProps } from '@kadena/kode-ui/patterns';
 import { useNotifications } from '@kadena/kode-ui/patterns';
 import { useEffect, useState } from 'react';
 import { TransactionPendingIcon } from '../TransactionPendingIcon/TransactionPendingIcon';
+import { TransactionTypeSpinner } from '../TransactionTypeSpinner/TransactionTypeSpinner';
 
 export interface IActionProps {}
 
 export const FormatSelectAsset = () => {
   const Component = ({ value }: ICompactTableFormatterProps) => {
     const [hasError, setHasError] = useState(false);
+    const [isCreatingContract, setIsCreatingContract] = useState(false);
 
-    const { setAsset } = useAsset();
+    const { getTransactions, transactions } = useTransactions();
+    const { setAsset, asset: currentAsset } = useAsset();
     const { addNotification } = useNotifications();
     const asset = value as unknown as IAsset | undefined;
 
@@ -35,6 +40,17 @@ export const FormatSelectAsset = () => {
       },
     });
 
+    useEffect(() => {
+      if (!asset?.uuid || !currentAsset?.uuid) return;
+      if (asset.uuid !== currentAsset.uuid || transactions.length === 0) {
+        setIsCreatingContract(false);
+        return;
+      }
+
+      const creatingContractTx = getTransactions(TXTYPES.CREATECONTRACT);
+      setIsCreatingContract(!!creatingContractTx);
+    }, [asset?.uuid, transactions.length, currentAsset?.uuid]);
+
     useEffect(() => {
       if (loading) return;
       if (data?.events.edges.length === 0) {
@@ -54,30 +70,33 @@ export const FormatSelectAsset = () => {
       window.location.href = '/';
     };
 
-    if (loading) {
+    if (loading || (hasError && isCreatingContract)) {
       return (
         <Button
           isDisabled
           isCompact
           variant="outlined"
           title="creation transaction pending"
-        >
-          <TransactionPendingIcon />
-        </Button>
+          startVisual={
+            <TransactionTypeSpinner
+              type={TXTYPES.CREATECONTRACT}
+              fallbackIcon={<TransactionPendingIcon />}
+            />
+          }
+        />
       );
     }
 
-    if (hasError) {
+    if (hasError && !isCreatingContract) {
       return (
         <Button
           isDisabled
           isCompact
           variant="outlined"
           title="asset not found"
           aria-label="asset not found"
-        >
-          <MonoWarning />
-        </Button>
+          startVisual={<MonoWarning />}
+        />
       );
     }
 

packages/apps/rwa-demo/src/components/admin/OrganisationInfoForm/OrganisationInfoForm.tsx

@@ -87,7 +87,6 @@ export const OrganisationInfoForm: FC<IProps> = ({ organisationId }) => {
 
     if (reload === false) return;
 
-    console.log('reload');
     // eslint-disable-next-line @typescript-eslint/no-floating-promises
     init(organisationId);
   }, [organisationId, reload]);

packages/apps/rwa-demo/src/contexts/TransactionsContext/TransactionsContext.ts

@@ -1,3 +1,4 @@
+import type { IAddContractProps } from '@/services/createContract';
 import type { ICommandResult } from '@kadena/client';
 import { createContext } from 'react';
 
@@ -57,6 +58,7 @@ export interface ITransactionsContext {
   transactions: ITransaction[];
   addTransaction: (
     request: Omit<ITransaction, 'uuid'>,
+    newAsset?: IAddContractProps,
   ) => Promise<ITransaction>;
   getTransactions: (type: ITxType | ITxType[]) => ITransaction[];
   txsButtonRef?: HTMLButtonElement | null;
@@ -65,6 +67,8 @@ export interface ITransactionsContext {
   setTxsAnimationRef: (value: HTMLDivElement) => void;
   isActiveAccountChangeTx: boolean; //checks if the agentroles for this user are being changed. if so, stop all permissions until the tx is resolved
   removeTransaction: (data: ITransaction) => Promise<void>;
+  showTransactionDialog: () => void;
+  hideTransactionDialog: () => void;
 }
 
 export const TransactionsContext = createContext<ITransactionsContext | null>(

packages/apps/rwa-demo/src/hooks/useSubmit2Chain.test.ts → packages/apps/rwa-demo/src/hooks/__tests__/useSubmit2Chain.test.ts

@@ -2,7 +2,7 @@ import { TXTYPES } from '@/contexts/TransactionsContext/TransactionsContext';
 import { EVENT_NAMES } from '@/utils/analytics';
 import { renderHook } from '@testing-library/react';
 import { afterEach, describe, expect, it, vi } from 'vitest';
-import { useSubmit2Chain } from './useSubmit2Chain';
+import { useSubmit2Chain } from './../useSubmit2Chain';
 
 // Mock all dependencies
 vi.mock('./account', () => ({
@@ -109,7 +109,7 @@ describe('useSubmit2Chain', () => {
     const { result } = renderHook(() => useSubmit2Chain());
 
     const chainFunction = vi.fn().mockResolvedValue(undefined);
-    const { useNotifications } = await import('./notifications');
+    const { useNotifications } = await import('./../notifications');
     const mockAddNotification =
       vi.mocked(useNotifications).mock.results[0].value.addNotification;
 
@@ -160,7 +160,7 @@ describe('useSubmit2Chain', () => {
       hash: 'test-hash',
     });
 
-    const { useAccount } = await import('./account');
+    const { useAccount } = await import('./../account');
     const mockSign = vi.mocked(useAccount).mock.results[0].value.sign;
 
     await result.current.submit2Chain(
@@ -189,7 +189,7 @@ describe('useSubmit2Chain', () => {
       throw new Error('Test error message');
     });
 
-    const { useNotifications } = await import('./notifications');
+    const { useNotifications } = await import('./../notifications');
     const mockAddNotification =
       vi.mocked(useNotifications).mock.results[0].value.addNotification;
 
@@ -233,7 +233,7 @@ describe('useSubmit2Chain', () => {
       hash: 'test-hash',
     });
 
-    const { useTransactions } = await import('./transactions');
+    const { useTransactions } = await import('./../transactions');
     const mockAddTransaction =
       vi.mocked(useTransactions).mock.results[0].value.addTransaction;
 
@@ -268,7 +268,7 @@ describe('useSubmit2Chain', () => {
 
   it('should send notification when asset is not found and skipAssetCheck is not true', async () => {
     // Override asset mock to return undefined
-    vi.mocked(await import('./asset')).useAsset.mockReturnValueOnce({
+    vi.mocked(await import('./../asset')).useAsset.mockReturnValueOnce({
       asset: undefined,
       assets: [],
       paused: false,
@@ -279,17 +279,16 @@ describe('useSubmit2Chain', () => {
       getAsset: vi.fn(),
       maxCompliance: vi.fn(),
       investors: [],
-      initFetchInvestors: vi.fn(),
       investorsIsLoading: false,
       agents: [],
-      initFetchAgents: vi.fn(),
       agentsIsLoading: false,
+      assetStore: {},
     });
 
     const { result } = renderHook(() => useSubmit2Chain());
 
     const chainFunction = vi.fn();
-    const { useNotifications } = await import('./notifications');
+    const { useNotifications } = await import('./../notifications');
     const mockAddNotification =
       vi.mocked(useNotifications).mock.results[0].value.addNotification;
 
@@ -327,7 +326,7 @@ describe('useSubmit2Chain', () => {
 
   it('should proceed when skipAssetCheck is true even when asset is undefined', async () => {
     // Override asset mock to return undefined
-    vi.mocked(await import('./asset')).useAsset.mockReturnValueOnce({
+    vi.mocked(await import('./../asset')).useAsset.mockReturnValueOnce({
       asset: undefined,
       assets: [],
       paused: false,
@@ -338,11 +337,10 @@ describe('useSubmit2Chain', () => {
       getAsset: vi.fn(),
       maxCompliance: vi.fn(),
       investors: [],
-      initFetchInvestors: vi.fn(),
       investorsIsLoading: false,
       agents: [],
-      initFetchAgents: vi.fn(),
       agentsIsLoading: false,
+      assetStore: {},
     });
 
     const { result } = renderHook(() => useSubmit2Chain());
@@ -383,7 +381,7 @@ describe('useSubmit2Chain', () => {
 
     const chainFunction = vi.fn().mockResolvedValue(txPayload);
 
-    const { useAccount } = await import('./account');
+    const { useAccount } = await import('./../account');
     const mockSign = vi.mocked(useAccount).mock.results[0].value.sign;
     mockSign.mockResolvedValue({
       ...txPayload,

packages/apps/rwa-demo/src/hooks/createContract.ts

@@ -15,7 +15,8 @@ export const useCreateContract = () => {
   const { userToken } = useUser();
   const { organisation } = useOrganisation();
   const [isAllowed, setIsAllowed] = useState(false);
-  const { addTransaction } = useTransactions();
+  const { addTransaction, hideTransactionDialog, showTransactionDialog } =
+    useTransactions();
   const { addNotification } = useNotifications();
 
   const submit = async (
@@ -88,6 +89,7 @@ export const useCreateContract = () => {
     }
 
     try {
+      showTransactionDialog();
       const signedTransaction = await sign(tx);
 
       if (!signedTransaction) {
@@ -118,32 +120,35 @@ export const useCreateContract = () => {
 
       const client = getClient();
       const res = await client.submit(signedTransaction);
+      hideTransactionDialog();
+      await addTransaction(
+        {
+          ...res,
+          type: TXTYPES.CREATECONTRACT,
+          accounts: [account?.address!],
+        },
+        data,
+      );
 
-      await addTransaction({
-        ...res,
-        type: TXTYPES.CREATECONTRACT,
-        accounts: [account?.address!],
-      });
-
-      const dataResult = await client.listen(res);
-
-      // if the contract already exists, go to that contract
-      if (dataResult.result.status === 'failure') {
-        if (
-          (dataResult.result.error as any)?.message?.includes(
-            '"PactDuplicateTableError',
-          )
-        ) {
-          window.location.href = `/assets/create/${data.namespace}/${data.contractName}`;
-          return false;
-        }
-        return false;
-      }
-
-      addNotification({
-        intent: 'positive',
-        message: `Contract ${data.contractName} created successfully`,
-      });
+      // const dataResult = await client.listen(res);
+
+      // // if the contract already exists, go to that contract
+      // if (dataResult.result.status === 'failure') {
+      //   if (
+      //     (dataResult.result.error as any)?.message?.includes(
+      //       '"PactDuplicateTableError',
+      //     )
+      //   ) {
+      //     window.location.href = `/assets/create/${data.namespace}/${data.contractName}`;
+      //     return false;
+      //   }
+      //   return false;
+      // }
+
+      // addNotification({
+      //   intent: 'positive',
+      //   message: `Contract ${data.contractName} created successfully`,
+      // });
 
       return true;
     } catch (e: any) {

packages/apps/rwa-demo/src/hooks/useSubmit2Chain.ts

@@ -29,7 +29,8 @@ interface IOptions {
 
 export const useSubmit2Chain = () => {
   const { account, sign } = useAccount();
-  const { addTransaction } = useTransactions();
+  const { addTransaction, showTransactionDialog, hideTransactionDialog } =
+    useTransactions();
   const { asset } = useAsset();
   const { addNotification } = useNotifications();
 
@@ -58,9 +59,10 @@ export const useSubmit2Chain = () => {
     }
 
     let res: ITransactionDescriptor | undefined = undefined;
-    const tx: IUnsignedCommand | undefined = undefined;
+    let tx: IUnsignedCommand | undefined = undefined;
     try {
-      const tx = await options.chainFunction(account!, asset!);
+      showTransactionDialog();
+      tx = await options.chainFunction(account!, asset!);
 
       if (!tx) {
         addNotification(
@@ -123,6 +125,8 @@ export const useSubmit2Chain = () => {
           },
         },
       );
+    } finally {
+      hideTransactionDialog();
     }
   };