WIP from Wil

frequency-chain · Mar 14, 2024 · ea68a97 · ea68a97
1 parent 54cf6a1
commit ea68a97
Show file tree

Hide file tree

Showing 12 changed files with 91 additions and 269 deletions.
diff --git a/src/components/AddControlKey.svelte b/src/components/AddControlKey.svelte
@@ -1,14 +1,11 @@
 <script lang="ts">
   import { dotApi } from '$lib/stores';
   import type { ApiPromise } from '@polkadot/api';
-  import { submitAddControlKey, type SigningKey } from '$lib/connections';
-  import { onMount } from 'svelte';
-  import { isFunction } from '@polkadot/util';
-  import { isLocalhost } from '$lib/utils';
+  import { submitAddControlKey } from '$lib/connections';
+  import { getExtension } from '$lib/utils';
   import AddKeyRequirements from './AddKeyRequirements.svelte';
   import Modal from './Modal.svelte';
   import DropDownMenu from './DropDownMenu.svelte';
-  import type { web3Enable, web3FromSource } from '@polkadot/extension-dapp';
   import { user } from '$lib/stores/userStore';
   import { type Account, unusedKeyAccountsStore } from '$lib/stores/accountsStore';
   import { formatAccount } from '$lib/utils';
@@ -17,61 +14,25 @@
   export let close: () => void;
 
   let selectedAccount: Account | null;
-  let thisWeb3FromSource: typeof web3FromSource;
-  let thisWeb3Enable: typeof web3Enable;
 
   let showTransactionStatus = false;
 
-  $: isSubmitDisabled = selectedAccount?.signingKey == null || showTransactionStatus;
-
-  onMount(async () => {
-    const extension = await import('@polkadot/extension-dapp');
-    thisWeb3FromSource = extension.web3FromSource;
-    thisWeb3Enable = extension.web3Enable;
-  });
+  $: isSubmitDisabled = selectedAccount?.injectedAccount == null || showTransactionStatus;
 
   const addControlKey = async () => {
-    let endpointURI: string = $dotApi.selectedEndpoint || '';
-
-    if (!selectedAccount || !selectedAccount.signingKey) {
+    if (!selectedAccount || !selectedAccount.injectedAccount) {
       alert('Please choose a key to add.');
-    } else if (!$user.msaId || !$user.signingKey) {
+    } else if (!$user.msaId || !$user.injectedAccount) {
       alert('Invalid provider.');
     } else {
-      let newKeys: SigningKey = selectedAccount.signingKey;
-      let signingKeys: SigningKey = $user.signingKey;
       showTransactionStatus = true;
-      if (isLocalhost(endpointURI)) {
-        await submitAddControlKey(
-          $dotApi.api as ApiPromise,
-          undefined,
-          newKeys,
-          signingKeys,
-          $user.msaId,
-          endpointURI as string
-        );
-      } else {
-        if (isFunction(thisWeb3FromSource) && isFunction(thisWeb3Enable)) {
-          const extensions = await thisWeb3Enable('Frequency parachain provider dashboard: Adding Keys');
-          if (extensions.length !== 0) {
-            const injectedExtension = await thisWeb3FromSource(signingKeys.meta.source!);
-            await submitAddControlKey(
-              $dotApi.api as ApiPromise,
-              injectedExtension,
-              newKeys,
-              signingKeys,
-              $user.msaId,
-              endpointURI as string
-            );
-          } else {
-            console.error('found no extensions');
-            return;
-          }
-        } else {
-          console.error('web3FromSource is function? ', isFunction(thisWeb3FromSource));
-          console.error('web3Enable is function? ', isFunction(thisWeb3Enable));
-        }
-      }
+      await submitAddControlKey(
+        $dotApi.api as ApiPromise,
+        await getExtension($user),
+        selectedAccount,
+        $user,
+        $user.msaId
+      );
     }
   };
 

diff --git a/src/components/Capacity.svelte b/src/components/Capacity.svelte
@@ -19,7 +19,7 @@
   let errMsg: string = '';
 
   $: {
-    if (!$user.signingKey) {
+    if (!$user.injectedAccount) {
       errMsg = 'No transaction signing address selected';
     } else if (!$user.msaId) {
       errMsg = 'No MSA ID.  Please create one.';

diff --git a/src/components/CreateMsa.svelte b/src/components/CreateMsa.svelte
@@ -3,11 +3,9 @@
   import { dotApi } from '$lib/stores';
   import type { MsaInfo } from '$lib/storeTypes';
   import type { ApiPromise } from '@polkadot/api';
-  import { isLocalhost } from '$lib/utils';
+  import { getExtension } from '$lib/utils';
   import { submitCreateMsa } from '$lib/connections';
   import TransactionStatus from '$components/TransactionStatus.svelte';
-  import { isFunction } from '@polkadot/util';
-  import { onMount } from 'svelte';
   import { user } from '$lib/stores/userStore';
   import { getMsaInfo } from '$lib/polkadotApi';
   import { pageContent } from '$lib/stores/pageContentStore';
@@ -31,37 +29,12 @@
     isInProgress = false;
   };
 
-  let thisWeb3FromSource: typeof web3FromSource;
-  let thisWeb3Enable: typeof web3Enable;
-  let isInProgress = false;
-
-  onMount(async () => {
-    const extension = await import('@polkadot/extension-dapp');
-    thisWeb3FromSource = extension.web3FromSource;
-    thisWeb3Enable = extension.web3Enable;
-  });
-
   const doCreateMsa = async (_evt: Event) => {
     updateUser();
 
-    const endpoint: string | undefined = $user.network?.endpoint;
-    if (!endpoint) {
-      alert('Error connecting to endpoint.');
-      return;
-    }
     isInProgress = true;
-    const apiPromise = $dotApi.api as ApiPromise;
-    if (isLocalhost(endpoint)) {
-      await submitCreateMsa(apiPromise, undefined, endpoint, $user.signingKey!);
-    } else {
-      if (isFunction(thisWeb3FromSource) && isFunction(thisWeb3Enable)) {
-        const extensions = await thisWeb3Enable('Frequency parachain provider dashboard: Creating provider');
-        if (extensions.length !== 0) {
-          const injectedExtension = await thisWeb3FromSource($user.signingKey!.meta.source!);
-          await submitCreateMsa(apiPromise, injectedExtension, endpoint, $user.signingKey!);
-        }
-      }
-    }
+    await submitCreateMsa($dotApi.api, await getExtension($user), $user);
+    // createMsaTxnFinished()
   };
 </script>
 
@@ -81,4 +54,4 @@
     >
     <button on:click|preventDefault={cancelAction} class="btn-no-fill">Cancel</button>
   </form>
-</div>
+</div>
diff --git a/src/components/CreateProvider.svelte b/src/components/CreateProvider.svelte
@@ -1,20 +1,14 @@
 <script lang="ts">
-  import type { web3Enable, web3FromSource } from '@polkadot/extension-dapp';
   import { dotApi } from '$lib/stores';
-  import type { ApiPromise } from '@polkadot/api';
-  import { isLocalhost, providerNameToHuman } from '$lib/utils';
+  import { getExtension, providerNameToHuman } from '$lib/utils';
   import { submitCreateProvider } from '$lib/connections';
-  import TransactionStatus from '$components/TransactionStatus.svelte';
-  import { isFunction } from '@polkadot/util';
-  import { onMount } from 'svelte';
   import { user } from '$lib/stores/userStore';
   import { getMsaInfo } from '$lib/polkadotApi';
   import type { MsaInfo } from '$lib/storeTypes';
   import { pageContent } from '$lib/stores/pageContentStore';
   import LoadingIcon from '$lib/assets/LoadingIcon.svelte';
 
   export let updateUser: () => void;
-  export let txnStatuses: Array<string> = [];
   // a callback for when the user cancels this action
   export let cancelAction = () => {
     pageContent.login();
@@ -33,17 +27,8 @@
   };
 
   let newProviderName = '';
-  let thisWeb3FromSource: typeof web3FromSource;
-  let thisWeb3Enable: typeof web3Enable;
-  let showTransactionStatus = false;
   let isInProgress = false;
 
-  onMount(async () => {
-    const extension = await import('@polkadot/extension-dapp');
-    thisWeb3FromSource = extension.web3FromSource;
-    thisWeb3Enable = extension.web3Enable;
-  });
-
   const doCreateProvider = async (_evt: Event) => {
     updateUser();
 
@@ -60,41 +45,11 @@
       alert('please reconnect to an endpoint');
       return;
     }
-    clearTxnStatuses();
     showTransactionStatus = true;
     isInProgress = true;
-    const apiPromise = $dotApi.api as ApiPromise;
-    if (isLocalhost(endpointURI)) {
-      await submitCreateProvider(
-        apiPromise,
-        undefined,
-        endpointURI,
-        $user.signingKey!,
-        newProviderName,
-      );
-    } else {
-      if (isFunction(thisWeb3FromSource) && isFunction(thisWeb3Enable)) {
-        const extensions = await thisWeb3Enable('Frequency parachain provider dashboard: Creating provider');
-        if (extensions.length !== 0) {
-          const injectedExtension = await thisWeb3FromSource($user.signingKey!.meta.source!);
-          await submitCreateProvider(
-            apiPromise,
-            injectedExtension,
-            endpointURI,
-            $user.signingKey!,
-            newProviderName,
-          );
-        }
-      }
-    }
+    await submitCreateProvider($dotApi.api, await getExtension($user), $user, newProviderName);
+    // createProviderTxnFinished
   };
-
-  const createProviderAddNewTxnStatus = (txnStatus: string, txnId: string) => {
-    txnStatuses = [...txnStatuses, txnStatus];
-    return;
-  };
-
-  const clearTxnStatuses = () => (txnStatuses = new Array<string>());
 </script>
 
 <form id="create-provider" class="column text-sm">
@@ -118,4 +73,3 @@
     <button on:click|preventDefault={cancelAction} class="btn-no-fill">Cancel</button>
   </div>
 </form>
-<TransactionStatus bind:showSelf={showTransactionStatus} statuses={txnStatuses} />
diff --git a/src/components/NavItem.svelte b/src/components/NavItem.svelte
@@ -8,7 +8,7 @@
 <a
   {id}
   {href}
-  on:click|stopPropagation={onClick}
+  on:click={onClick}
   class={` flex h-[100px] items-center justify-center text-sm font-bold ${
     isActive && 'bg-bg-black-active shadow-blue-border'
   }`}

diff --git a/src/components/Provider.svelte b/src/components/Provider.svelte
@@ -22,7 +22,7 @@
   $: {
     if (!$storeChainInfo.connected) {
       errMsg = 'Not connected';
-    } else if (!$user.signingKey) {
+    } else if (!$user.injectedAccount) {
       errMsg = 'No transaction signing address selected';
     } else if (!$user.msaId) {
       errMsg = 'No MSA ID.  Please create one.';

diff --git a/src/components/RequestToBeProvider.svelte b/src/components/RequestToBeProvider.svelte
@@ -1,20 +1,15 @@
 <script lang="ts">
   import { dotApi } from '$lib/stores';
-  import { submitRequestToBeProvider, type TxnFinishedCallback } from '$lib/connections';
-  import { onMount } from 'svelte';
+  import { submitRequestToBeProvider } from '$lib/connections';
   import { defaultDotApi } from '$lib/storeTypes';
   import type { DotApi } from '$lib/storeTypes';
-  import { isFunction } from '@polkadot/util';
-  import { isLocalhost, createMailto } from '$lib/utils';
+  import { getExtension, createMailto } from '$lib/utils';
   import type { ApiPromise } from '@polkadot/api';
   import TransactionStatus from '$components/TransactionStatus.svelte';
-  import type { web3Enable, web3FromSource } from '@polkadot/extension-dapp';
   import { user } from '$lib/stores/userStore';
 
   let newProviderName = '';
   let localDotApi: DotApi = defaultDotApi;
-  let thisWeb3FromSource: typeof web3FromSource;
-  let thisWeb3Enable: typeof web3Enable;
   let showTransactionStatus = false;
   let mailTo = createMailto('hello@frequency.xyz', 'Request to be a Provider', '');
   export let txnStatuses: Array<string> = [];
@@ -25,12 +20,6 @@
     console.log('default txnFinished callback');
   };
 
-  onMount(async () => {
-    const extension = await import('@polkadot/extension-dapp');
-    thisWeb3FromSource = extension.web3FromSource;
-    thisWeb3Enable = extension.web3Enable;
-  });
-
   dotApi.subscribe((api) => (localDotApi = api));
 
   const doProposeToBeProvider = async (_evt: Event) => {
@@ -43,42 +32,9 @@
       return;
     }
     clearTxnStatuses();
-    let endpointURI: string = localDotApi.selectedEndpoint || '';
-    let signingKeys = $user.signingKey!;
     showTransactionStatus = true;
-    if (isLocalhost(endpointURI)) {
-      await submitRequestToBeProvider(
-        localDotApi.api as ApiPromise,
-        undefined,
-        endpointURI,
-        signingKeys,
-        newProviderName,
-        addNewTxnStatus,
-        txnFinished
-      );
-    } else {
-      if (isFunction(thisWeb3FromSource) && isFunction(thisWeb3Enable)) {
-        const extensions = await thisWeb3Enable('Frequency parachain provider dashboard: Proposing to be provider');
-        if (extensions.length !== 0) {
-          const injectedExtension = await thisWeb3FromSource(signingKeys.meta.source!);
-          await submitRequestToBeProvider(
-            localDotApi.api as ApiPromise,
-            injectedExtension,
-            endpointURI,
-            signingKeys,
-            newProviderName,
-            addNewTxnStatus,
-            txnFinished
-          );
-        } else {
-          console.error('found no extensions');
-          return;
-        }
-      } else {
-        console.error('web3FromSource is function? ', isFunction(thisWeb3FromSource));
-        console.error('web3Enable is function? ', isFunction(thisWeb3Enable));
-      }
-    }
+
+    await submitRequestToBeProvider(localDotApi.api as ApiPromise, await getExtension($user), $user, newProviderName);
   };
 
   const addNewTxnStatus = (txnStatus: string) => {

diff --git a/src/components/StakeForm.svelte b/src/components/StakeForm.svelte
@@ -5,8 +5,7 @@
   import type { ApiPromise } from '@polkadot/api';
   import { DOLLARS, submitStake } from '$lib/connections';
   import { onMount } from 'svelte';
-  import { isFunction } from '@polkadot/util';
-  import { formatAccount, isLocalhost } from '$lib/utils';
+  import { formatAccount, getExtension } from '$lib/utils';
   import type { web3Enable, web3FromSource } from '@polkadot/extension-dapp';
   import DropDownMenu from './DropDownMenu.svelte';
   import { type Account, allAccountsStore } from '$lib/stores/accountsStore';
@@ -42,32 +41,13 @@
   const stake = async (evt: Event) => {
     close();
     isLoading = true;
-    let endpointURI: string = $dotApi.selectedEndpoint || '';
-    if (isLocalhost(endpointURI)) {
-      await submitStake(
-        $dotApi.api as ApiPromise,
-        undefined,
-        $user.signingKey!,
-        providerId,
-        stakeAmountInPlancks,
-        endpointURI
-      );
-    } else {
-      if (isFunction(thisWeb3FromSource) && isFunction(thisWeb3Enable)) {
-        const extensions = await thisWeb3Enable('Frequency parachain provider dashboard: Adding Keys');
-        if (extensions.length !== 0) {
-          const injectedExtension = await thisWeb3FromSource($user.signingKey!.meta.source!);
-          await submitStake(
-            $dotApi.api as ApiPromise,
-            injectedExtension,
-            $user.signingKey!,
-            providerId,
-            stakeAmountInPlancks,
-            endpointURI
-          );
-        }
-      }
-    }
+    await submitStake(
+      $dotApi.api as ApiPromise,
+      await getExtension($user),
+      selectedAccount,
+      providerId,
+      stakeAmountInPlancks
+    );
     isLoading = false;
   };
 </script>