New metaport architecture #184

dmytrotkk · 2023-08-14T17:20:01Z

Summary

This PR introduces major updates to the Metaport Widget, elevating it to version 2.0. From unifying account connections with RainbowKit to enabling multi-chain transfers, this release brings numerous new features and improvements.

Please note that this PR includes large breaking changes and users are advised to read through the changelog carefully.

A full list of tickets resolved by this PR can be found here: https://github.com/skalenetwork/metaport/milestone/4

vercel · 2023-08-14T17:20:06Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
metaport	✅ Ready (Inspect)	Visit Preview	✅ 1 resolved	Sep 22, 2023 6:53pm

TheGreatAxios · 2023-09-19T17:34:41Z

src/Metaport.tsx

+    if (el) {
+      // createRoot(el).render(<Widget config={config} />);
+    } else {
+      console.log('div with id="metaport" does not exist')
+    }
  }


No element is being created here. Confirming this is correct?
Also would say ideally due to the empty commented if, if it is correct to switch to an if only where it is more like

if (el === undefined) { console.log('div with id="metaport" does not exist') }

this one will utilised later, once we will have a standalone build of Metaport

TheGreatAxios

Majority of feedback is focused on minor cleanup and code clarity. Overhaul looks good 👍

TheGreatAxios · 2023-09-19T17:35:18Z

src/components/AddToken.tsx

+export default function AddToken(props: {
+  token: TokenData
+  destChainName: string
+  mpc: MetaportCore


suggest making this variable name metaportCore

TheGreatAxios · 2023-09-19T17:36:54Z

src/components/AmountErrorMessage.tsx

+export default function AmountErrorMessage() {
+  const amountErrorMessage = useMetaportStore((state) => state.amountErrorMessage)
+  return (
+    <Collapse in={!!amountErrorMessage || amountErrorMessage === ''} className="noMarg">


suggest changing noMarg to noMargin**

removed, this class name is obsolete

TheGreatAxios · 2023-09-19T17:37:49Z

src/components/AmountInput/AmountInput.module.scss

+    }
+
+    .tokenSymbolPlaceholder {
+        color: #979797;


Suggest moving colors to vars css file and pre-fixing all with --metaport-... if possible to avoid naming collisions

removed some of the redundant CSS

TheGreatAxios · 2023-09-19T17:38:07Z

src/components/AmountInput/AmountInput.module.scss

@@ -14,14 +24,15 @@
        border-radius: 4px 0 0 4px;
        padding: 9pt 15pt;
        font-weight: bold !important;
+        font-size: 1.3rem !important;
    }

    :global(.MuiFormControl-root) {
        width: 100%;
        // border-radius: 4px;


Remove unnecessary comment

TheGreatAxios · 2023-09-19T17:39:06Z

src/components/AmountInput/AmountInput.tsx

+  const transferInProgress = useMetaportStore((state) => state.transferInProgress)
+  const setAmount = useMetaportStore((state) => state.setAmount)
+  const amount = useMetaportStore((state) => state.amount)
+  const expandedTokens = useCollapseStore((state) => state.expandedTokens)

  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
    if (parseFloat(event.target.value) < 0) {


If no need to return an empty, suggest flipping so that the if checks if > 0 and then sets amount so that only an if is needed

TheGreatAxios · 2023-09-19T20:57:52Z

src/core/faucet.ts

+  chainName: string,
+  address: AddressType,
+  mpc: MetaportCore


suggest changing to metaportCore

TheGreatAxios · 2023-09-19T21:02:51Z

src/core/metaport.ts

+
+export const createTokensMap = (
+  chainName1: string,
+  chainName2: string | null | undefined,


Possible to reduce to this to null or undefined instead of both?

upd: null

TheGreatAxios · 2023-09-19T21:06:45Z

src/core/wagmi_network.ts

+  // return chain.rpcUrls.default.webSocket ? chain.rpcUrls.default.webSocket[0] : '';
+  return chain.rpcUrls.default.webSocket
+    ? chain.rpcUrls.default.webSocket[0]
+    : 'wss://goerli-light.eth.linkpool.io/ws' // TODO - IP!


Should this default to a goerli websocket endpoint?

updated this function to return the correct URL for different networks

TheGreatAxios · 2023-09-19T21:09:16Z

src/metadata/metaportConfigStaging.ts

+    'staging-faint-slimy-achird', // Nebula
+    'staging-perfect-parallel-gacrux', // Test Chain 1
+    'staging-severe-violet-wezen', // Test Chain 2
+    'staging-weepy-fitting-caph' // Tank War Zone


remove chain from config

TheGreatAxios · 2023-09-19T21:09:51Z

src/metadata/metaportConfigStaging.ts

+            // 'staging-faint-slimy-achird': {
+            //   hub: 'staging-legal-crazy-castor'
+            // }


Remove unused?

dmytrotkk added 9 commits August 7, 2023 19:39

New metaport architecture

2a9202b

Merge develop branch

4809ea9

Update skale-network

6e646b1

Fix path to regression icons

517e451

Comment out metamask wallet

186ba3b

Update webpack-cli, move packages to dependencies, add regression

e3e0025

Update webpack config

c467f56

Update React imports

1a28ee3

Migrate builder to rollup.js

4fea232

Split injected metaport and mp component

b7b85e7

vercel bot had a problem deploying to Preview August 14, 2023 17:35 Failure

Add chain icons support for vite

fda6a4b

vercel bot had a problem deploying to Preview August 14, 2023 18:08 Failure

Add token icons in vite build

476a9d4

vercel bot had a problem deploying to Preview August 14, 2023 18:21 Failure

Add prepare_meta script

dc2dce7

vercel bot had a problem deploying to Preview August 14, 2023 18:24 Failure

Run prettier

1f201fb

vercel bot had a problem deploying to Preview August 14, 2023 19:01 Failure

Move theming logic to metaport provider

1bee1af

vercel bot had a problem deploying to Preview August 14, 2023 21:32 Failure

Make tokenIcon exportable, add external interfaces

4c3f9d1

vercel bot had a problem deploying to Preview August 15, 2023 15:27 Failure

dmytrotkk added 2 commits August 15, 2023 16:44

Fix storybook build - add react-dom

035c133

Update vercel build command

b8d45b4

vercel bot had a problem deploying to Preview August 15, 2023 15:48 Failure

Remove reduntant scss ts modules, add transfer ETA and ETF modules

2c4c4fe

vercel bot had a problem deploying to Preview August 16, 2023 12:03 Failure

New amount input, export amount error module

de8a4c1

vercel bot deployed to Preview September 10, 2023 16:55 View deployment

Fix get ETH token balance

ef5b195

vercel bot deployed to Preview September 10, 2023 21:10 View deployment

Update prettier rules, fix routed ETH transfers

e074d18

vercel bot deployed to Preview September 11, 2023 12:07 View deployment

dmytrotkk added 2 commits September 11, 2023 13:27

Add unwrap for eth token

4dcf13b

Restructure CSS imports

c9c04fe

vercel bot deployed to Preview September 11, 2023 16:11 View deployment

Update components folder structure

b3c224d

vercel bot deployed to Preview September 11, 2023 16:15 View deployment

Integrate addToken module

f0aba33

vercel bot deployed to Preview September 11, 2023 17:46 View deployment

Add transfer history, add transaction logs

ae6ec21

vercel bot deployed to Preview September 14, 2023 18:59 View deployment

Add dynamic skale chains support, move chains metadata

788fefd

vercel bot deployed to Preview September 15, 2023 14:26 View deployment

Restructure imports

08042cb

dmytrotkk marked this pull request as ready for review September 15, 2023 16:11

vercel bot deployed to Preview September 15, 2023 16:13 View deployment

TheGreatAxios reviewed Sep 19, 2023

View reviewed changes

TheGreatAxios approved these changes Sep 19, 2023

View reviewed changes

Update submodules

2c47869

vercel bot deployed to Preview September 20, 2023 16:09 View deployment

Minor changes

e51339a

vercel bot deployed to Preview September 21, 2023 18:43 View deployment

Update WS endpoint func, general cleanup

53c91ae

vercel bot deployed to Preview September 22, 2023 18:32 View deployment

dmytrotkk merged commit 4b601c2 into develop Sep 25, 2023
5 checks passed

dmytrotkk deleted the new-metaport-architecture-rollup branch September 25, 2023 11:59

github-actions bot locked and limited conversation to collaborators Sep 25, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

New metaport architecture #184

New metaport architecture #184

dmytrotkk commented Aug 14, 2023 •

edited

Loading

vercel bot commented Aug 14, 2023 •

edited

Loading

TheGreatAxios Sep 19, 2023

dmytrotkk Sep 21, 2023

TheGreatAxios left a comment

TheGreatAxios Sep 19, 2023

TheGreatAxios Sep 19, 2023

dmytrotkk Sep 21, 2023

TheGreatAxios Sep 19, 2023

dmytrotkk Sep 21, 2023

TheGreatAxios Sep 19, 2023

TheGreatAxios Sep 19, 2023

TheGreatAxios Sep 19, 2023

TheGreatAxios Sep 19, 2023

dmytrotkk Sep 22, 2023

TheGreatAxios Sep 19, 2023

dmytrotkk Sep 22, 2023

TheGreatAxios Sep 19, 2023

dmytrotkk Sep 22, 2023

TheGreatAxios Sep 19, 2023

dmytrotkk Sep 22, 2023

New metaport architecture #184

New metaport architecture #184

Conversation

dmytrotkk commented Aug 14, 2023 • edited Loading

Summary

vercel bot commented Aug 14, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

TheGreatAxios left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dmytrotkk commented Aug 14, 2023 •

edited

Loading

vercel bot commented Aug 14, 2023 •

edited

Loading