Merge branch 'main' into localnet

zeta-chain · Aug 24, 2024 · 6ebbaff · 6ebbaff
2 parents 70c0683 + d303316
commit 6ebbaff
Show file tree

Hide file tree

Showing 18 changed files with 449 additions and 86 deletions.
diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
@@ -1,3 +1,3 @@
-* @bbbeeeee @andresaiello @fadeev @brewmaster012
+* @bbbeeeee @fadeev @brewmaster012 @zeta-chain/fullstack
 
-/src/pages/nodes/ @zeta-chain/DevOps @fadeev
+/src/pages/nodes/ @zeta-chain/DevOps @fadeev
diff --git a/src/components/shared/components/Icons/components/IconSpeechBubble.tsx b/src/components/shared/components/Icons/components/IconSpeechBubble.tsx
@@ -0,0 +1,26 @@
+import clsx from "clsx";
+import { SVGProps } from "react";
+
+const IconSpeechBubble = <T extends unknown>({
+  color,
+  ...otherProps
+}: SVGProps<T, SVGSVGElement> & { color?: string }) => (
+  <svg
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...otherProps}
+    className={clsx(otherProps?.className, { "text-grey-400 dark:text-grey-300": !otherProps?.className })}
+  >
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M2.75 4C2.75 3.58579 3.08579 3.25 3.5 3.25H19.5C21.0188 3.25 22.25 4.48122 22.25 6V16C22.25 16.4142 21.9142 16.75 21.5 16.75H14.8107L10.0303 21.5303C9.81583 21.7448 9.49324 21.809 9.21299 21.6929C8.93273 21.5768 8.75 21.3033 8.75 21V16.75H3.5C3.08579 16.75 2.75 16.4142 2.75 16V4ZM4.25 4.75V15.25H9.5C9.91421 15.25 10.25 15.5858 10.25 16V19.1893L13.9697 15.4697C14.1103 15.329 14.3011 15.25 14.5 15.25H20.75V6C20.75 5.30964 20.1904 4.75 19.5 4.75H4.25ZM7.75 10C7.75 9.58579 8.08579 9.25 8.5 9.25H8.51C8.92421 9.25 9.26 9.58579 9.26 10C9.26 10.4142 8.92421 10.75 8.51 10.75H8.5C8.08579 10.75 7.75 10.4142 7.75 10ZM11.75 10C11.75 9.58579 12.0858 9.25 12.5 9.25H12.51C12.9242 9.25 13.26 9.58579 13.26 10C13.26 10.4142 12.9242 10.75 12.51 10.75H12.5C12.0858 10.75 11.75 10.4142 11.75 10ZM15.75 10C15.75 9.58579 16.0858 9.25 16.5 9.25H16.51C16.9242 9.25 17.26 9.58579 17.26 10C17.26 10.4142 16.9242 10.75 16.51 10.75H16.5C16.0858 10.75 15.75 10.4142 15.75 10Z"
+      fill={color || "currentColor"}
+    />
+  </svg>
+);
+
+export { IconSpeechBubble };
diff --git a/src/components/shared/components/Icons/index.ts b/src/components/shared/components/Icons/index.ts
@@ -24,6 +24,7 @@ export * from "./components/IconReddit";
 export * from "./components/IconSearch";
 export * from "./components/IconServer";
 export * from "./components/IconSparkle";
+export * from "./components/IconSpeechBubble";
 export * from "./components/IconStaking";
 export * from "./components/IconSupport";
 export * from "./components/IconTelegram";

diff --git a/src/components/shared/components/Layout/components/PrevNextNavigationWrapper.tsx b/src/components/shared/components/Layout/components/PrevNextNavigationWrapper.tsx
@@ -8,6 +8,7 @@ import { selectDirectoriesByRoute, selectFlatDirectories } from "~/lib/directori
 import { countRouteSegments, getValidParentDirectory } from "~/lib/helpers/nextra";
 
 import { IconArrowNarrowRight } from "../../Icons";
+import { IconSpeechBubble } from "../../Icons";
 import { NavigationSection } from "../../NavigationSection";
 import { mainNavRoutes } from "../Layout.constants";
 
@@ -128,13 +129,32 @@ export const PrevNextNavigationWrapper: React.FC<PrevNextNavigationWrapperProps>
       {children}
 
       {shouldRenderNextSection && (
-        <div className="mb-16 mt-20 sm:mt-[120px]">
-          <NavigationSection
-            title="Continue Learning"
-            description="Continue with the next part or try a related tutorial"
-            navItems={continueLearningNavItems}
-          />
-        </div>
+        <>
+          <div className="mb-16 mt-20 sm:mt-[120px]">
+            <NavigationSection
+              title="Continue Learning"
+              description="Continue with the next part or try a related tutorial"
+              navItems={continueLearningNavItems}
+            />
+          </div>
+          <div className="grid sm:grid-cols-1 lg:grid-cols-10 py-16">
+            <div className="col-span-6 flex justify-center relative">
+              <hr className="bg-grey-100 dark:bg-grey-700 z-0 h-px border-none absolute top-1/2 -translate-y-1/2 w-full" />
+              <div className="flex flex-col gap-4 bg-white px-4 dark:bg-grey-800 z-10 relative items-center justify-center">
+                <div className="text-grey-400 dark:text-grey-300">How's your journey with ZetaChain?</div>
+                <Link
+                  target="_blank"
+                  rel="noreferrer noopener"
+                  href="https://zetachain.deform.cc/DevXfeedback"
+                  className="flex gap-1"
+                >
+                  <IconSpeechBubble className="dark:text-grey-300 text-grey-400" />
+                  <div className="text-[#00A5C6]">Let us know</div>
+                </Link>
+              </div>
+            </div>
+          </div>
+        </>
       )}
     </>
   );

diff --git a/src/pages/developers/_meta.json b/src/pages/developers/_meta.json
@@ -11,6 +11,10 @@
     "title": "Universal EVM",
     "description": "EVM enhanced with omnichain interoperability features, enabling the development of robust universal apps."
   },
+  "chains": {
+    "title": "Connected Blockchains",
+    "description": "Use Gateway to make calls to and from universal apps, deposit and withdraw tokens."
+  },
   "tutorials": {
     "title": "Tutorials",
     "description": "Step-by-step guides to help you master building on ZetaChain."

diff --git a/src/pages/developers/apps/_meta.json b/src/pages/developers/apps/_meta.json
@@ -1,6 +1,6 @@
 {
   "intro": {
     "title": "Universal App Basics",
-    "description": "What is a universal app and what makes it different"
+    "description": "Build universal apps that can be called from any blockchain"
   }
 }
diff --git a/src/pages/developers/apps/intro.mdx b/src/pages/developers/apps/intro.mdx
@@ -27,11 +27,11 @@ gain powerful omnichain capabilities.
 Here's an example universal app:
 
 ```solidity
-pragma solidity 0.8.7;
+pragma solidity 0.8.26;
 
-import "@zetachain/protocol-contracts/contracts/zevm/interfaces/zContract.sol";
+import "@zetachain/protocol-contracts/contracts/zevm/interfaces/UniversalContract.sol";
 
-contract UniversalApp is zContract {
+contract UniversalApp is UniversalContract {
     function onCrossChainCall(
         zContext calldata context,
         address zrc20,
@@ -146,8 +146,8 @@ choosing), the gas fees will be covered.
     chains
   - can trigger contract calls and token transfers to connected chains
   - can automatically handle gas for cross-chain transactions
-  - are fully compatible with EVM chains (like Ethereum and BNB), Bitcoin.
-    Support for Polygon, Solana, Cosmos (through IBC) and other chains is coming
-    soon.
+  - are fully compatible with EVM chains (like Ethereum, BNB, and Polygon),
+    Bitcoin, Solana. Support for TON and Cosmos (through IBC) and other chains
+    is coming soon.
 - Native gas and supported ERC-20 tokens are represented as ZRC-20 tokens. A
   ZRC-20 token can be permissionlessly withdrawn back to its original chain.
diff --git a/src/pages/developers/chains/_meta.json b/src/pages/developers/chains/_meta.json
@@ -0,0 +1,18 @@
+{
+  "zetachain": {
+    "title": "ZetaChain",
+    "description": "Make calls from universal apps and withdraw tokens to connected chains"
+  },
+  "evm": {
+    "title": "EVM Blockchains",
+    "description": "Make calls to universal apps and deposit tokens from Ethereum, BNB, Polygon, Base and more"
+  },
+  "solana": {
+    "title": "Solana",
+    "description": "Make calls to universal apps and deposit SOL from Solana"
+  },
+  "bitcoin": {
+    "title": "Bitcoin",
+    "description": "Make calls to universal apps and deposit BTC from Bitcoin"
+  }
+}
diff --git a/src/pages/developers/evm/bitcoin.mdx → src/pages/developers/chains/bitcoin.mdx b/src/pages/developers/evm/bitcoin.mdx → src/pages/developers/chains/bitcoin.mdx
@@ -4,6 +4,15 @@ title: Call Universal Apps from Bitcoin
 
 import { Alert } from "~/components/shared";
 
+On Bitcoin the gateway is implemented as an TSS MPC account. The private key
+securing the account is split into fragments and distributed among ZetaChain
+observer-signer validators.
+
+Bitcoin gateway supports:
+
+- depositing BTC to a universal app or an account on ZetaChain
+- depositing BTC and calling a universal app
+
 ## Overview
 
 To deposit BTC into ZetaChain's Universal EVM (and optionally call a smart

diff --git a/src/pages/developers/chains/evm.mdx b/src/pages/developers/chains/evm.mdx
@@ -0,0 +1,124 @@
+To interact with universal apps from EVM chains (like Ethereum, BNB, Polygon,
+etc.) use the EVM gateway.
+
+EVM gateway supports:
+
+- depositing gas tokens to a universal app or an account on ZetaChain
+- depositing supported ERC-20 tokens (including ZETA tokens)
+- depositing gas tokens and calling a universal app
+- depositing supported ERC-20 tokens and calling a universal app
+- calling a universal app
+
+## Deposit Gas Tokens
+
+To deposit tokens to an EOA or a universal contract call the `deposit` function
+of the Gateway contract.
+
+```solidity
+deposit(address receiver, RevertOptions calldata revertOptions) external payable;
+```
+
+The `deposit` function is payable, which means it accepts native gas tokens (for
+example, ETH on Ethereum), which will then be sent to a `receiver` on ZetaChain.
+
+The `receiver` is either an externally-owned account (EOA) or a universal app
+address on ZetaChain. Even if the receiver is a universal app contract with the
+standard `receive` function, the `deposit` function will not trigger a contract
+call. If you want to deposit and call a universal app, please, use the
+`depositAndCall` function, instead.
+
+After the deposit is processed, the receiver gets [ZRC-20
+version](/developers/tokens/zrc20) of the deposited token, for example (ZRC-20
+ETH).
+
+## Deposit ERC-20 Tokens
+
+The `deposit` function can also be used to send supported ERC-20 tokens to EOAs
+and universal apps on ZetaChain.
+
+```solidity
+deposit(address receiver, uint256 amount, address asset, RevertOptions calldata revertOptions) external;
+```
+
+Only [supported ERC-20 assets](/developers/tokens/zrc20) can be deposited. The
+receiver gets ZRC-20 version of the deposited token (for example, ZRC-20
+USDC.ETH).
+
+The `amount` is the amount and `asset` is the token address of the ERC-20 that
+is being deposited.
+
+## Deposit Gas Tokens and Call a Universal App
+
+To deposit tokens and call a universal app contract use the `depositAndCall`
+function.
+
+```solidity
+depositAndCall(address receiver, bytes calldata payload, RevertOptions calldata revertOptions) external payable;
+```
+
+After the cross-chain transaction is processed, the `onCrossChainCall` function
+of a universal app contract is executed.
+
+The `receiver` must be a universal app contract address.
+
+```solidity
+pragma solidity 0.8.7;
+
+import "@zetachain/protocol-contracts/contracts/zevm/interfaces/zContract.sol";
+
+contract UniversalApp is UniversalContract {
+    function onCrossChainCall(
+        zContext calldata context,
+        address zrc20,
+        uint256 amount,
+        bytes calldata message
+    ) external virtual override {
+        // ...
+    }
+}
+```
+
+`onCrossChainCall` receives:
+
+- `message`: value of the `payload`
+- `amount`: amount of deposited tokens
+- `zrc20`: ZRC-20 address of a the deposited tokens (for example, contract
+  address of ZRC-20 ETH)
+- `context`:
+  - `context.origin`: the original sender address on a connected chain (the EOA
+    or contract that called the Gateway)
+  - `context.chainID`: chain ID of the connected chain from which the call was
+    made
+
+When calling a universal app, the payload contains bytes passed to
+`onCrossChainCall` as `message`. You don't need to pass a function selector in
+the payload as the only function that can be called from a connected chain is
+`onCrossChainCall`.
+
+## Deposit ERC-20 Tokens and Call a Universal App
+
+`depositAndCall` can also be used to call a universal app contract and send
+ERC-20 tokens.
+
+```solidity
+depositAndCall(address receiver, uint256 amount, address asset, bytes calldata payload, RevertOptions calldata revertOptions) external;
+```
+
+The `amount` is the amount and `asset` is the token address of the ERC-20 that
+is being deposited.
+
+In the current version of the protocol only one ERC-20 asset can be deposited at
+a time.
+
+## Call a Universal App
+
+To call a universal app (without depositing tokens), use the `call` function.
+
+```solidity
+call(address receiver, bytes calldata payload, RevertOptions calldata revertOptions) external;
+```
+
+## Revert Transactions
+
+For information on `RevertOptions` refer to the [ZetaChain "Revert Transactions"
+doc](/developers/chains/zetachain#revert-transactions).
diff --git a/src/pages/developers/chains/solana.mdx b/src/pages/developers/chains/solana.mdx
@@ -0,0 +1,9 @@
+On Solana the gateway is implemented as a Solana program.
+
+Solana gateway supports:
+
+- depositing SOL to a universal app or an account on ZetaChain
+- depositing SOL and calling a universal app
+- depositing SPL tokens (coming soon)
+
+https://github.com/zeta-chain/protocol-contracts-solana/