Fix delete hook and some refactor.

Better package loading experience.
Merge pull request #282 from XRPLF/feat/bundle-xrpl
2023-02-10 14:43:51 +05:30 · 2023-02-09 22:15:22 +05:30 · 2023-02-09 20:22:43 +05:30 · 2023-02-09 15:41:06 +05:30 · 2023-02-07 14:32:06 +05:30 · 2023-02-07 14:15:07 +05:30
25 changed files with 4061 additions and 1919 deletions
--- a/.env.example
+++ b/.env.example
@@ -5,7 +5,8 @@ GITHUB_ID=""
 NEXT_PUBLIC_COMPILE_API_ENDPOINT="http://localhost:9000/api/build"
 NEXT_PUBLIC_COMPILE_API_BASE_URL="http://localhost:9000"
 NEXT_PUBLIC_LANGUAGE_SERVER_API_ENDPOINT="ws://localhost:9000/language-server/c"
-NEXT_PUBLIC_TESTNET_URL="hooks-testnet-v2.xrpl-labs.com"
-NEXT_PUBLIC_DEBUG_STREAM_URL="hooks-testnet-v2-debugstream.xrpl-labs.com"
-NEXT_PUBLIC_EXPLORER_URL="hooks-testnet-v2-explorer.xrpl-labs.com"
-NEXT_PUBLIC_SITE_URL=http://localhost:3000
+NEXT_PUBLIC_TESTNET_URL="hooks-testnet-v3.xrpl-labs.com"
+NEXT_PUBLIC_DEBUG_STREAM_URL="hooks-testnet-v3-debugstream.xrpl-labs.com"
+NEXT_PUBLIC_EXPLORER_URL="hooks-testnet-v3-explorer.xrpl-labs.com"
+NEXT_PUBLIC_NETWORK_ID="21338"
+NEXT_PUBLIC_SITE_URL="http://localhost:3000"
--- a/.gitignore
+++ b/.gitignore
@@ -33,3 +33,7 @@ yarn-error.log*
 # vercel
 .vercel
 .vscode
+
+# yarn
+.yarnrc.yml
+.yarn/
--- a/components/Accounts.tsx
+++ b/components/Accounts.tsx
@@ -33,6 +33,7 @@ import { addFunds } from '../state/actions/addFaucetAccount'
 import { deleteHook } from '../state/actions/deployHook'
 import { capitalize } from '../utils/helpers'
 import { deleteAccount } from '../state/actions/deleteAccount'
+import { xrplSend } from '../state/actions/xrpl-client'

 export const AccountDialog = ({
  activeAccountAddress,
@@ -301,7 +302,7 @@ const Accounts: FC<AccountProps> = props => {
    const fetchAccInfo = async () => {
      if (snap.clientStatus === 'online') {
        const requests = snap.accounts.map(acc =>
-          snap.client?.send({
+          xrplSend({
            id: `hooks-builder-req-info-${acc.address}`,
            command: 'account_info',
            account: acc.address
@@ -329,7 +330,7 @@ const Accounts: FC<AccountProps> = props => {
          }
        })
        const objectRequests = snap.accounts.map(acc => {
-          return snap.client?.send({
+          return xrplSend({
            id: `hooks-builder-req-objects-${acc.address}`,
            command: 'account_objects',
            account: acc.address
--- a/components/Dialog.tsx
+++ b/components/Dialog.tsx
@@ -15,7 +15,7 @@ const contentShow = keyframes({
  '100%': { opacity: 1 }
 })
 const StyledOverlay = styled(DialogPrimitive.Overlay, {
-  zIndex: 10000,
+  zIndex: 3000,
  backgroundColor: blackA.blackA9,
  position: 'fixed',
  inset: 0,
--- a/components/RunScript/index.tsx
+++ b/components/RunScript/index.tsx
@@ -21,7 +21,7 @@ import { saveFile } from '../../state/actions/saveFile'
 import { getErrors, getTags } from '../../utils/comment-parser'
 import toast from 'react-hot-toast'

-const generateHtmlTemplate = (code: string, data?: Record<string, any>) => {
+const generateHtmlTemplate = async (code: string, data?: Record<string, any>) => {
  let processString: string | undefined
  const process = { env: { NODE_ENV: 'production' } } as any
  if (data) {
@@ -29,8 +29,10 @@ const generateHtmlTemplate = (code: string, data?: Record<string, any>) => {
      process.env[key] = data[key]
    })
  }
+
  processString = JSON.stringify(process)

+  const libs = (await import("xrpl-accountlib/dist/browser.hook-bundle.js")).default;
  return `
  <html>
  <head>
@@ -72,7 +74,9 @@ const generateHtmlTemplate = (code: string, data?: Record<string, any>) => {

      window.addEventListener('error', windowErrorHandler);
    </script>
-
+    <script>
+      ${libs}
+    </script>
    <script type="module">
      ${code}
    </script>
@@ -100,6 +104,7 @@ const RunScript: React.FC<{ file: IFile }> = ({ file: { content, name } }) => {
  const [fields, setFields] = useState<Fields>({})
  const [iFrameCode, setIframeCode] = useState('')
  const [isDialogOpen, setIsDialogOpen] = useState(false)
+  const [isLoading, setIsLoading] = useState(false)

  const getFields = useCallback(() => {
    const inputTags = ['input', 'param', 'arg', 'argument']
@@ -127,16 +132,31 @@ const RunScript: React.FC<{ file: IFile }> = ({ file: { content, name } }) => {
    return fields
  }, [content])

-  const runScript = useCallback(() => {
+  const runScript = useCallback(async () => {
+    setIsLoading(true);
    try {
+      // Show loading toast only after 1 second, otherwise skip it.
+      let loaded = false
+      let toastId: string | undefined;
+      setTimeout(() => {
+        if (!loaded) {
+          toastId = toast.loading('Loading packages, may take a few seconds...', {
+            position: 'bottom-center',
+          })
+        }
+      }, 1000)
+
      let data: any = {}
      Object.keys(fields).forEach(key => {
        data[key] = fields[key].value
      })
-      const template = generateHtmlTemplate(content, data)
-
+      const template = await generateHtmlTemplate(content, data)
      setIframeCode(template)

+      loaded = true
+      if (toastId) {
+        toast.dismiss(toastId)
+      }
      state.scriptLogs = [{ type: 'success', message: 'Started running...' }]
    } catch (err) {
      state.scriptLogs = [
@@ -145,6 +165,7 @@ const RunScript: React.FC<{ file: IFile }> = ({ file: { content, name } }) => {
        { type: 'error', message: err?.message || 'Could not parse template' }
      ]
    }
+    setIsLoading(false);
  }, [content, fields, snap.scriptLogs])

  useEffect(() => {
@@ -174,11 +195,11 @@ const RunScript: React.FC<{ file: IFile }> = ({ file: { content, name } }) => {

  const isDisabled = Object.values(fields).some(field => field.required && !field.value)

-  const handleRun = useCallback(() => {
+  const handleRun = useCallback(async () => {
    if (isDisabled) return toast.error('Please fill in all the required fields.')

    state.scriptLogs = []
-    runScript()
+    await runScript();
    setIsDialogOpen(false)
  }, [isDisabled, runScript])

@@ -279,7 +300,7 @@ const RunScript: React.FC<{ file: IFile }> = ({ file: { content, name } }) => {
              <DialogClose asChild>
                <Button outline>Cancel</Button>
              </DialogClose>
-              <Button variant="primary" isDisabled={isDisabled} onClick={handleRun}>
+              <Button variant="primary" isDisabled={isDisabled || isLoading} isLoading={isLoading} onClick={handleRun}>
                Run script
              </Button>
            </Flex>
--- a/content/transactions.json
+++ b/content/transactions.json
@@ -245,5 +245,14 @@
      }
    },
    "Sequence": 12
+  },
+  {
+    "TransactionType": "Invoke",
+    "Fee": "12"
+  },
+  {
+    "TransactionType": "UriToken",
+    "Fee": "12",
+    "URI": "697066733A2F2F516D614374444B5A4656767666756676626479346573745A626851483744586831364354707631686F776D424779"
  }
 ]
--- a/next.config.js
+++ b/next.config.js
@@ -12,7 +12,7 @@ module.exports = {
      config.resolve.fallback.fs = false
    }
    config.module.rules.push({
-      test: /\.md$/,
+      test: [/\.md$/, /hook-bundle\.js$/],
      use: 'raw-loader'
    })
    return config
--- a/package.json
+++ b/package.json
@@ -8,7 +8,8 @@
    "start": "next start",
    "lint": "next lint",
    "format": "prettier --write .",
-    "postinstall": "patch-package"
+    "postinstall": "patch-package && yarn run postinstall-postinstall",
+    "postinstall-postinstall": "./node_modules/.bin/browserify -r ripple-binary-codec -r ripple-keypairs -r ripple-address-codec -r ripple-secret-codec -r ./node_modules/xrpl-accountlib/dist/index.js:xrpl-accountlib -o node_modules/xrpl-accountlib/dist/browser.hook-bundle.js"
  },
  "dependencies": {
    "@codingame/monaco-jsonrpc": "^0.3.1",
@@ -64,9 +65,9 @@
    "valtio": "^1.2.5",
    "vscode-languageserver": "^7.0.0",
    "vscode-uri": "^3.0.2",
-    "wabt": "1.0.16",
-    "xrpl-accountlib": "^1.5.2",
-    "xrpl-client": "^1.9.4"
+    "wabt": "^1.0.30",
+    "xrpl-accountlib": "^1.6.1",
+    "xrpl-client": "^2.0.2"
  },
  "devDependencies": {
    "@types/dinero.js": "^1.9.0",
@@ -75,6 +76,7 @@
    "@types/lodash.xor": "^4.5.6",
    "@types/pako": "^1.0.2",
    "@types/react": "17.0.31",
+    "browserify": "^17.0.0",
    "eslint": "7.32.0",
    "eslint-config-next": "11.1.2",
    "raw-loader": "^4.0.2",
--- a/pages/develop/[[...slug]].tsx
+++ b/pages/develop/[[...slug]].tsx
@@ -150,6 +150,7 @@ const Home: NextPage = () => {

  const activeFile = snap.files[snap.active] as IFile | undefined
  const activeFileExt = getFileExtention(activeFile?.name)
+  const canCompile = activeFileExt === 'c' || activeFileExt === 'wat'
  return (
    <Split
      direction="vertical"
@@ -162,7 +163,7 @@ const Home: NextPage = () => {
    >
      <main style={{ display: 'flex', flex: 1, position: 'relative' }}>
        <HooksEditor />
-        {activeFileExt === 'c' && (
+        {canCompile && (
          <Hotkeys
            keyName="command+b,ctrl+b"
            onKeyDown={() => !snap.compiling && snap.files.length && compileCode(snap.active)}
--- a/patches/ripple-binary-codec+1.4.2.patch
+++ b/patches/ripple-binary-codec+1.4.2.patch
--- a/raw-loader.d.ts
+++ b/raw-loader.d.ts
@@ -2,3 +2,8 @@ declare module '*.md' {
  const content: string
  export default content
 }
+
+declare module '*.hook-bundle.js' {
+  const content: string
+  export default content
+}
--- a/state/actions/compileCode.ts
+++ b/state/actions/compileCode.ts
@@ -15,6 +15,11 @@ import { ref } from 'valtio'
 export const compileCode = async (activeId: number) => {
  // Save the file to global state
  saveFile(false, activeId)
+  const file = state.files[activeId]
+  if (file.name.endsWith('.wat')) {
+    return compileWat(activeId)
+  }
+
  if (!process.env.NEXT_PUBLIC_COMPILE_API_ENDPOINT) {
    throw Error('Missing env!')
  }
@@ -26,7 +31,6 @@ export const compileCode = async (activeId: number) => {
  // Set loading state to true
  state.compiling = true
  state.logs = []
-  const file = state.files[activeId]
  try {
    file.containsErrors = false
    let res: Response
@@ -72,7 +76,7 @@ export const compileCode = async (activeId: number) => {

      // Import wabt from and create human readable version of wasm file and
      // put it into state
-      const ww = (await import('wabt')).default()
+      const ww = await (await import('wabt')).default()
      const myModule = ww.readWasm(new Uint8Array(bufferData), {
        readDebugNames: true
      })
@@ -122,3 +126,46 @@ export const compileCode = async (activeId: number) => {
    file.containsErrors = true
  }
 }
+
+export const compileWat = async (activeId: number) => {
+  if (state.compiling) return;
+  const file = state.files[activeId]
+  state.compiling = true
+  state.logs = []
+  try {
+    const wabt = await (await import('wabt')).default()
+    const module = wabt.parseWat(file.name, file.content);
+    module.resolveNames();
+    module.validate();
+    const { buffer } = module.toBinary({
+      log: false,
+      write_debug_names: true,
+    });
+
+    file.compiledContent = ref(buffer)
+    file.lastCompiled = new Date()
+    file.compiledValueSnapshot = file.content
+    file.compiledWatContent = file.content
+
+    toast.success('Compiled successfully!', { position: 'bottom-center' })
+    state.logs.push({
+      type: 'success',
+      message: `File ${state.files?.[activeId]?.name} compiled successfully. Ready to deploy.`,
+      link: Router.asPath.replace('develop', 'deploy'),
+      linkText: 'Go to deploy'
+    })
+  } catch (err) {
+    console.log(err)
+    let message = "Error compiling WAT file!"
+    if (err instanceof Error) {
+      message = err.message
+    }
+    state.logs.push({
+      type: 'error',
+      message
+    })
+    toast.error(`Error occurred while compiling!`, { position: 'bottom-center' })
+    file.containsErrors = true
+  }
+  state.compiling = false
+}
--- a/state/actions/deployHook.tsx
+++ b/state/actions/deployHook.tsx
@@ -8,6 +8,7 @@ import { ref } from 'valtio'
 import estimateFee from '../../utils/estimateFee'
 import { SetHookData } from '../../utils/setHook'
 import ResultLink from '../../components/ResultLink'
+import { xrplSend } from './xrpl-client'

 export const sha256 = async (string: string) => {
  const utf8 = new TextEncoder().encode(string)
@@ -64,9 +65,6 @@ export const prepareDeployHookTx = async (
  if (!activeFile?.compiledContent) {
    return
  }
-  if (!state.client) {
-    return
-  }
  const HookNamespace = (await sha256(data.HookNamespace)).toUpperCase()
  const hookOnValues: (keyof TTS)[] = data.Invoke.map(tt => tt.value)
  const { HookParameters } = data
@@ -87,196 +85,184 @@ export const prepareDeployHookTx = async (
  //     }
  //   }
  // });
-  if (typeof window !== 'undefined') {
-    const tx = {
-      Account: account.address,
-      TransactionType: 'SetHook',
-      Sequence: account.sequence,
-      Fee: data.Fee,
-      Hooks: [
-        {
-          Hook: {
-            CreateCode: arrayBufferToHex(activeFile?.compiledContent).toUpperCase(),
-            HookOn: calculateHookOn(hookOnValues),
-            HookNamespace,
-            HookApiVersion: 0,
-            Flags: 1,
-            // ...(filteredHookGrants.length > 0 && { HookGrants: filteredHookGrants }),
-            ...(filteredHookParameters.length > 0 && {
-              HookParameters: filteredHookParameters
-            })
-          }
+  if (typeof window === 'undefined') return
+  const tx = {
+    Account: account.address,
+    TransactionType: 'SetHook',
+    Sequence: account.sequence,
+    Fee: data.Fee,
+    NetworkID: process.env.NEXT_PUBLIC_NETWORK_ID,
+    Hooks: [
+      {
+        Hook: {
+          CreateCode: arrayBufferToHex(activeFile?.compiledContent).toUpperCase(),
+          HookOn: calculateHookOn(hookOnValues),
+          HookNamespace,
+          HookApiVersion: 0,
+          Flags: 1,
+          // ...(filteredHookGrants.length > 0 && { HookGrants: filteredHookGrants }),
+          ...(filteredHookParameters.length > 0 && {
+            HookParameters: filteredHookParameters
+          })
        }
-      ]
-    }
-    return tx
+      }
+    ]
  }
+  return tx
 }

-/* deployHook function turns the wasm binary into
- * hex string, signs the transaction and deploys it to
- * Hooks testnet.
+/*
+ * Turns the wasm binary into hex string, signs the transaction and deploys it to Hooks testnet.
 */
 export const deployHook = async (account: IAccount & { name?: string }, data: SetHookData) => {
-  if (typeof window !== 'undefined') {
-    const activeFile = state.files[state.active]?.compiledContent
-      ? state.files[state.active]
-      : state.files.filter(file => file.compiledContent)[0]
-    state.deployValues[activeFile.name] = data
-    const tx = await prepareDeployHookTx(account, data)
-    if (!tx) {
-      return
-    }
-    if (!state.client) {
-      return
-    }
-    const keypair = derive.familySeed(account.secret)
+  const activeFile = state.files[state.active]?.compiledContent
+    ? state.files[state.active]
+    : state.files.filter(file => file.compiledContent)[0]
+  state.deployValues[activeFile.name] = data

-    const { signedTransaction } = sign(tx, keypair)
-    const currentAccount = state.accounts.find(acc => acc.address === account.address)
-    if (currentAccount) {
-      currentAccount.isLoading = true
-    }
-    let submitRes
+  const tx = await prepareDeployHookTx(account, data)
+  if (!tx) {
+    return
+  }
+  const keypair = derive.familySeed(account.secret)
+  const { signedTransaction } = sign(tx, keypair)

-    try {
-      submitRes = await state.client?.send({
-        command: 'submit',
-        tx_blob: signedTransaction
+  const currentAccount = state.accounts.find(acc => acc.address === account.address)
+  if (currentAccount) {
+    currentAccount.isLoading = true
+  }
+
+  let submitRes
+  try {
+    submitRes = await xrplSend({
+      command: 'submit',
+      tx_blob: signedTransaction
+    })
+
+    const txHash = submitRes.tx_json?.hash
+    const resultMsg = ref(
+      <>
+        [<ResultLink result={submitRes.engine_result} />] {submitRes.engine_result_message}{' '}
+        {txHash && (
+          <>
+            Transaction hash:{' '}
+            <Link
+              as="a"
+              href={`https://${process.env.NEXT_PUBLIC_EXPLORER_URL}/${txHash}`}
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              {txHash}
+            </Link>
+          </>
+        )}
+      </>
+    )
+    if (submitRes.engine_result === 'tesSUCCESS') {
+      state.deployLogs.push({
+        type: 'success',
+        message: 'Hook deployed successfully ✅'
      })
-
-      const txHash = submitRes.tx_json?.hash
-      const resultMsg = ref(
-        <>
-          [<ResultLink result={submitRes.engine_result} />] {submitRes.engine_result_message}{' '}
-          {txHash && (
-            <>
-              Transaction hash:{' '}
-              <Link
-                as="a"
-                href={`https://${process.env.NEXT_PUBLIC_EXPLORER_URL}/${txHash}`}
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                {txHash}
-              </Link>
-            </>
-          )}
-        </>
-      )
-      if (submitRes.engine_result === 'tesSUCCESS') {
-        state.deployLogs.push({
-          type: 'success',
-          message: 'Hook deployed successfully ✅'
-        })
-        state.deployLogs.push({
-          type: 'success',
-          message: resultMsg
-        })
-      } else if (submitRes.engine_result) {
-        state.deployLogs.push({
-          type: 'error',
-          message: resultMsg
-        })
-      } else {
-        state.deployLogs.push({
-          type: 'error',
-          message: `[${submitRes.error}] ${submitRes.error_exception}`
-        })
-      }
-    } catch (err) {
-      console.log(err)
+      state.deployLogs.push({
+        type: 'success',
+        message: resultMsg
+      })
+    } else if (submitRes.engine_result) {
      state.deployLogs.push({
        type: 'error',
-        message: 'Error occurred while deploying'
+        message: resultMsg
+      })
+    } else {
+      state.deployLogs.push({
+        type: 'error',
+        message: `[${submitRes.error}] ${submitRes.error_exception}`
      })
    }
-    if (currentAccount) {
-      currentAccount.isLoading = false
-    }
-    return submitRes
+  } catch (err) {
+    console.error(err)
+    state.deployLogs.push({
+      type: 'error',
+      message: 'Error occurred while deploying'
+    })
  }
+  if (currentAccount) {
+    currentAccount.isLoading = false
+  }
+  return submitRes
 }

 export const deleteHook = async (account: IAccount & { name?: string }) => {
-  if (!state.client) {
-    return
-  }
  const currentAccount = state.accounts.find(acc => acc.address === account.address)
  if (currentAccount?.isLoading || !currentAccount?.hooks.length) {
    return
  }
-  if (typeof window !== 'undefined') {
-    const tx = {
-      Account: account.address,
-      TransactionType: 'SetHook',
-      Sequence: account.sequence,
-      Fee: '100000',
-      Hooks: [
-        {
-          Hook: {
-            CreateCode: '',
-            Flags: 1
-          }
+  const tx = {
+    Account: account.address,
+    TransactionType: 'SetHook',
+    Sequence: account.sequence,
+    Fee: '100000',
+    NetworkID: process.env.NEXT_PUBLIC_NETWORK_ID,
+    Hooks: [
+      {
+        Hook: {
+          CreateCode: '',
+          Flags: 1
        }
-      ]
-    }
-
-    const keypair = derive.familySeed(account.secret)
-    try {
-      // Update tx Fee value with network estimation
-      const res = await estimateFee(tx, account)
-      tx['Fee'] = res?.base_fee ? res?.base_fee : '1000'
-    } catch (err) {
-      // use default value what you defined earlier
-      console.log(err)
-    }
-    const { signedTransaction } = sign(tx, keypair)
-
-    if (currentAccount) {
-      currentAccount.isLoading = true
-    }
-    let submitRes
-    const toastId = toast.loading('Deleting hook...')
-    try {
-      submitRes = await state.client.send({
-        command: 'submit',
-        tx_blob: signedTransaction
-      })
-
-      if (submitRes.engine_result === 'tesSUCCESS') {
-        toast.success('Hook deleted successfully ✅', { id: toastId })
-        state.deployLogs.push({
-          type: 'success',
-          message: 'Hook deleted successfully ✅'
-        })
-        state.deployLogs.push({
-          type: 'success',
-          message: `[${submitRes.engine_result}] ${submitRes.engine_result_message} Validated ledger index: ${submitRes.validated_ledger_index}`
-        })
-        currentAccount.hooks = []
-      } else {
-        toast.error(`${submitRes.engine_result_message || submitRes.error_exception}`, {
-          id: toastId
-        })
-        state.deployLogs.push({
-          type: 'error',
-          message: `[${submitRes.engine_result || submitRes.error}] ${
-            submitRes.engine_result_message || submitRes.error_exception
-          }`
-        })
      }
-    } catch (err) {
-      console.log(err)
-      toast.error('Error occurred while deleting hook', { id: toastId })
+    ]
+  }
+  const keypair = derive.familySeed(account.secret)
+  try {
+    // Update tx Fee value with network estimation
+    const res = await estimateFee(tx, account)
+    tx['Fee'] = res?.base_fee || '1000'
+  } catch (err) {
+    console.error(err)
+  }
+  const { signedTransaction } = sign(tx, keypair)
+  if (currentAccount) {
+    currentAccount.isLoading = true
+  }
+  let submitRes
+  const toastId = toast.loading('Deleting hook...')
+  try {
+    submitRes = await xrplSend({
+      command: 'submit',
+      tx_blob: signedTransaction
+    })
+
+    if (submitRes.engine_result === 'tesSUCCESS') {
+      toast.success('Hook deleted successfully ✅', { id: toastId })
+      state.deployLogs.push({
+        type: 'success',
+        message: 'Hook deleted successfully ✅'
+      })
+      state.deployLogs.push({
+        type: 'success',
+        message: `[${submitRes.engine_result}] ${submitRes.engine_result_message} Validated ledger index: ${submitRes.validated_ledger_index}`
+      })
+      currentAccount.hooks = []
+    } else {
+      toast.error(`${submitRes.engine_result_message || submitRes.error_exception}`, {
+        id: toastId
+      })
      state.deployLogs.push({
        type: 'error',
-        message: 'Error occurred while deleting hook'
+        message: `[${submitRes.engine_result || submitRes.error}] ${
+          submitRes.engine_result_message || submitRes.error_exception
+        }`
      })
    }
-    if (currentAccount) {
-      currentAccount.isLoading = false
-    }
-    return submitRes
+  } catch (err) {
+    console.log(err)
+    toast.error('Error occurred while deleting hook', { id: toastId })
+    state.deployLogs.push({
+      type: 'error',
+      message: 'Error occurred while deleting hook'
+    })
  }
+  if (currentAccount) {
+    currentAccount.isLoading = false
+  }
+  return submitRes
 }
--- a/state/actions/fetchFiles.ts
+++ b/state/actions/fetchFiles.ts
@@ -61,6 +61,7 @@ export const fetchFiles = async (gistId: string) => {
      // default priority is undefined == 0
      const extPriority: Record<string, number> = {
        c: 3,
+        wat: 3,
        md: 2,
        h: -1
      }
--- a/state/actions/sendTransaction.ts
+++ b/state/actions/sendTransaction.ts
@@ -1,66 +0,0 @@
-import { derive, sign } from 'xrpl-accountlib'
-
-import state from '..'
-import type { IAccount } from '..'
-
-interface TransactionOptions {
-  TransactionType: string
-  Account?: string
-  Fee?: string
-  Destination?: string
-  [index: string]: any
-}
-interface OtherOptions {
-  logPrefix?: string
-}
-
-export const sendTransaction = async (
-  account: IAccount,
-  txOptions: TransactionOptions,
-  options?: OtherOptions
-) => {
-  if (!state.client) throw Error('XRPL client not initalized')
-
-  const { Fee = '1000', ...opts } = txOptions
-  const tx: TransactionOptions = {
-    Account: account.address,
-    Sequence: account.sequence,
-    Fee, // TODO auto-fillable default
-    ...opts
-  }
-  const { logPrefix = '' } = options || {}
-  try {
-    const signedAccount = derive.familySeed(account.secret)
-    const { signedTransaction } = sign(tx, signedAccount)
-    const response = await state.client.send({
-      command: 'submit',
-      tx_blob: signedTransaction
-    })
-    if (response.engine_result === 'tesSUCCESS') {
-      state.transactionLogs.push({
-        type: 'success',
-        message: `${logPrefix}[${response.engine_result}] ${response.engine_result_message}`
-      })
-    } else {
-      state.transactionLogs.push({
-        type: 'error',
-        message: `${logPrefix}[${response.error || response.engine_result}] ${
-          response.error_exception || response.engine_result_message
-        }`
-      })
-    }
-    const currAcc = state.accounts.find(acc => acc.address === account.address)
-    if (currAcc && response.account_sequence_next) {
-      currAcc.sequence = response.account_sequence_next
-    }
-  } catch (err) {
-    console.error(err)
-    state.transactionLogs.push({
-      type: 'error',
-      message:
-        err instanceof Error
-          ? `${logPrefix}Error: ${err.message}`
-          : `${logPrefix}Something went wrong, try again later`
-    })
-  }
-}
--- a/state/actions/sendTransaction.tsx
+++ b/state/actions/sendTransaction.tsx
@@ -4,6 +4,7 @@ import state from '..'
 import type { IAccount } from '..'
 import ResultLink from '../../components/ResultLink'
 import { ref } from 'valtio'
+import { xrplSend } from './xrpl-client'

 interface TransactionOptions {
  TransactionType: string
@@ -21,20 +22,19 @@ export const sendTransaction = async (
  txOptions: TransactionOptions,
  options?: OtherOptions
 ) => {
-  if (!state.client) throw Error('XRPL client not initalized')
-
  const { Fee = '1000', ...opts } = txOptions
  const tx: TransactionOptions = {
    Account: account.address,
    Sequence: account.sequence,
-    Fee, // TODO auto-fillable default
+    Fee,
+    NetworkID: process.env.NEXT_PUBLIC_NETWORK_ID,
    ...opts
  }
  const { logPrefix = '' } = options || {}
  try {
    const signedAccount = derive.familySeed(account.secret)
    const { signedTransaction } = sign(tx, signedAccount)
-    const response = await state.client.send({
+    const response = await xrplSend({
      command: 'submit',
      tx_blob: signedTransaction
    })
--- a/state/actions/xrpl-client.ts
+++ b/state/actions/xrpl-client.ts
@@ -0,0 +1,7 @@
+import { XrplClient } from 'xrpl-client';
+import state from '..';
+
+export const xrplSend = async(...params: Parameters<XrplClient['send']>) => {
+    const client = await state.client.ready()
+    return client.send(...params);
+}
--- a/state/index.ts
+++ b/state/index.ts
@@ -78,7 +78,7 @@ export interface IState {
  splits: {
    [id: string]: SplitSize
  }
-  client: XrplClient | null
+  client: XrplClient
  clientStatus: 'offline' | 'online'
  mainModalOpen: boolean
  mainModalShowed: boolean
@@ -113,7 +113,7 @@ let initialState: IState = {
    tabSize: 2
  },
  splits: {},
-  client: null,
+  client: undefined!, // set below only.
  clientStatus: 'offline' as 'offline',
  mainModalOpen: false,
  mainModalShowed: false,
@@ -153,9 +153,9 @@ const state = proxy<IState>({
 })
 // Initialize socket connection
 const client = new XrplClient(`wss://${process.env.NEXT_PUBLIC_TESTNET_URL}`)
+state.client = ref(client);

 client.on('online', () => {
-  state.client = ref(client)
  state.clientStatus = 'online'
 })

--- a/utils/estimateFee.ts
+++ b/utils/estimateFee.ts
@@ -1,6 +1,7 @@
 import toast from 'react-hot-toast'
 import { derive, sign } from 'xrpl-accountlib'
-import state, { IAccount } from '../state'
+import { IAccount } from '../state'
+import { xrplSend } from '../state/actions/xrpl-client'

 const estimateFee = async (
  tx: Record<string, unknown>,
@@ -22,7 +23,7 @@ const estimateFee = async (
    const keypair = derive.familySeed(account.secret)
    const { signedTransaction } = sign(copyTx, keypair)

-    const res = await state.client?.send({ command: 'fee', tx_blob: signedTransaction })
+    const res = await xrplSend({ command: 'fee', tx_blob: signedTransaction })
    if (res && res.drops) {
      return res.drops
    }
--- a/utils/hookOnCalculator.ts
+++ b/utils/hookOnCalculator.ts
@@ -29,17 +29,15 @@ export const tts = {
 export type TTS = typeof tts

 const calculateHookOn = (arr: (keyof TTS)[]) => {
-  let start = '0x000000003e3ff5bf'
+  let s = '0x3e3ff5bf'
  arr.forEach(n => {
-    let v = BigInt(start)
-    v ^= BigInt(1) << BigInt(tts[n as keyof TTS])
-    let s = v.toString(16)
-    let l = s.length
-    if (l < 16) s = '0'.repeat(16 - l) + s
-    s = '0x' + s
-    start = s
+    let v = BigInt(s)
+    v ^= BigInt(1) << BigInt(tts[n])
+    s = "0x" + v.toString(16)
  })
-  return start.substring(2)
+  s = s.replace('0x', '')
+  s = s.padStart(64, '0')
+  return s
 }

 export default calculateHookOn
--- a/utils/libwabt.js
+++ b/utils/libwabt.js
--- a/xrpl-hooks-docs/docs.ts
+++ b/xrpl-hooks-docs/docs.ts
@@ -22,6 +22,7 @@ import hooksFloatManipPure from './md/hooks-float-manip-pure.md'
 import hooksFloatOnePure from './md/hooks-float-one-pure.md'
 import hooksFloatPure from './md/hooks-float-pure.md'
 import hooksGuardCalled from './md/hooks-guard-called.md'
+import hooksGuardCallNonConst from './md/hooks-guard-call-non-const.md'
 import hooksGuardInFor from './md/hooks-guard-in-for.md'
 import hooksGuardInWhile from './md/hooks-guard-in-while.md'
 import hooksHashBufLen from './md/hooks-hash-buf-len.md'
@@ -70,6 +71,7 @@ const docs: { [key: string]: string } = {
  'hooks-float-one-pure': hooksFloatOnePure,
  'hooks-float-pure': hooksFloatPure,
  'hooks-guard-called': hooksGuardCalled,
+  'hooks-guard-call-non-const': hooksGuardCallNonConst,
  'hooks-guard-in-for': hooksGuardInFor,
  'hooks-guard-in-while': hooksGuardInWhile,
  'hooks-hash-buf-len': hooksHashBufLen,
--- a/xrpl-hooks-docs/md/hooks-guard-call-non-const.md
+++ b/xrpl-hooks-docs/md/hooks-guard-call-non-const.md
@@ -0,0 +1,6 @@
+# hooks-guard-call-non-const
+
+Only compile-time constants can be used as an argument in loop GUARD call. This check warns if a non compile-time constant is used. 
+It also checks whether a compile-time constant is used as a first argument of `_g()` call and whether it is a unique value. If not - it warns.
+
+[Read more](https://xrpl-hooks.readme.io/v2.0/docs/loops-and-guarding)
--- a/xrpl-hooks-docs/md/hooks-guard-in-for.md
+++ b/xrpl-hooks-docs/md/hooks-guard-in-for.md
@@ -1,14 +1,35 @@
 # hooks-guard-in-for

-A guard is a marker that must be placed in your code at the top of each loop. Consider the following for-loop in C:
+Consider the following for-loop in C:

 ```c
-  #define GUARD(maxiter) _g(__LINE__, (maxiter)+1)
-
-  for (int i = 0; GUARD(3), i < 3; ++i)
+#define GUARD(maxiter) _g(__LINE__, (maxiter)+1)
+for (int i = 0; GUARD(3), i < 3; ++i)
 ```

-<BR/>
-This is the only way to satisfy the guard rule when using a for-loop in C.
+To satisfy the guard rule when using a for-loop in C guard should be 
+placed either in the condition part of the loop, or as a first call in loop body, e.g.
+
+```c
+for(int i = 0; i < 3; ++i) {
+  GUARD(3);
+}
+```
+
+In case of nested loops, the guard limit value should be 
+multiplied by a number of iterations in each loop, e.g.
+
+```c
+for(int i = 0; GUARD(3), i < 3; ++i) {
+  for (int j = 0; GUARD(17), j < 5; ++j)
+}
+```
+
+```
+(most descendant loop iterations + 1) * (each parent loops iterations) - 1
+```
+
+This check will warn if the GUARD call is missing and also it will propose a GUARD value based on the for loop initial value,
+the increment and loop condition.

 [Read more](https://xrpl-hooks.readme.io/v2.0/docs/loops-and-guarding)
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
muzam1l	43c83d0de6	Fix delete hook and some refactor.	2023-02-10 14:43:51 +05:30
muzam1l	6bb407cb0f	Better package loading experience.	2023-02-09 22:15:22 +05:30
muzamil	d7b29ba809	Merge pull request #282 from XRPLF/feat/bundle-xrpl Bundle patched `xrpl-accountlib` and expose through require syntax.	2023-02-09 20:22:43 +05:30
muzam1l	ca81d8ad41	Bundle xrpl-accountlib and expose throw require syntax.	2023-02-09 15:41:06 +05:30
muzam1l	a7e59d7b73	Add UriToken transaction.	2023-02-07 14:32:06 +05:30
muzam1l	8f6b28cef5	Add Invoke transaction type.	2023-02-07 14:15:07 +05:30
muzam1l	c1815f272b	refactor.	2023-02-07 14:00:57 +05:30
muzam1l	76871a8041	Testnet v3.	2023-02-06 21:09:11 +05:30
mariopil	d2033c8035	Hooks docs update (#279 ) * Added hooks-guard-call-non-const checker doc, updated hooks-guard-in-for doc.	2023-01-09 13:43:32 +01:00
muzamil	48daf1c5c8	Merge pull request #278 from XRPLF/feat/compile-wat Increase wat file priority in sorting.	2022-12-07 15:03:40 +05:30
muzam1l	a3365e4beb	Increase wat file priority in sorting.	2022-12-07 15:02:09 +05:30
muzamil	45d813cdad	Merge pull request #277 from XRPLF/feat/compile-wat Compile raw wat files.	2022-12-07 14:46:05 +05:30
muzam1l	911416aa2f	Compile wat files.	2022-12-07 13:31:59 +05:30
muzamil	2d836af9ed	Merge pull request #276 from XRPLF/feat/flags-ui Transaction flags UI.	2022-11-01 17:14:44 +05:30