fix conflicts

.github/workflows/build_and_publish.yml

@@ -70,9 +70,9 @@ jobs:
             docker-compose down
             rm .env
             echo "NEXT_PUBLIC_BOT_API_URL=${{ secrets.NEXT_PUBLIC_BOT_API_URL }}" >> .env
-            docker image prune -f
             docker-compose pull
             docker-compose up -d
+            docker image prune -f
       
       - name: Notify Telegram channel
         uses: appleboy/telegram-action@master

src/common/chainRegistry/types/index.ts

@@ -9,14 +9,6 @@ export type Asset = {
   precision: number;
 };
 
-export type AssetWithBalance = Asset & {
-  name: string;
-  balance: string;
-  assetId: number;
-  symbol: string;
-  precision: number;
-};
-
 export type Chain = {
   chainId: ChainId;
   name: string;

src/common/extrinsicService/ExtrinsicProvider.tsx

@@ -6,7 +6,7 @@ import { SubmittableResultResult } from '@polkadot/api-base/types/submittable';
 import { useExtrinsicService } from '@common/extrinsicService/ExtrinsicService';
 import { ApiTypes } from '@polkadot/api-base/types/base';
 import { KeyringPair } from '@polkadot/keyring/types';
-import { PasswordPage } from '@app/password/Password';
+import { PasswordPage } from '@/screens/password/Password';
 
 type ExtrinsicProviderContextProps = {
   estimateFee: (

src/common/providers/contextProvider.tsx

@@ -1,17 +1,24 @@
 import React, { createContext, useContext, useState } from 'react';
-import { HexString } from '../types';
+import { AssetAccount, HexString } from '../types';
 
 export interface IContext {
   publicKey?: HexString;
+  assets: AssetAccount[] | [];
   setPublicKey: React.Dispatch<React.SetStateAction<HexString | undefined>>;
+  setAssets: React.Dispatch<React.SetStateAction<AssetAccount[]>>;
 }
 
-export const GlobalContext = createContext<IContext>({ setPublicKey: () => {} });
+export const GlobalContext = createContext<IContext>({
+  assets: [],
+  setPublicKey: () => {},
+  setAssets: () => {},
+});
 
 export const GlobalStateProvider = ({ children }: { children: React.ReactNode }) => {
   const [publicKey, setPublicKey] = useState<HexString>();
+  const [assets, setAssets] = useState<AssetAccount[]>([]);
 
-  const value = { publicKey, setPublicKey };
+  const value = { publicKey, assets, setPublicKey, setAssets };
 
   return <GlobalContext.Provider value={value}>{children}</GlobalContext.Provider>;
 };

src/common/types/index.ts

@@ -20,6 +20,15 @@ export type ChainAssetAccount = {
   chainId: ChainId;
   assetId: AssetId;
   publicKey: PublicKey;
+  symbol: string;
+  name: string;
+  precision: number;
+};
+
+export type AssetAccount = ChainAssetAccount & {
+  address: Address;
+  totalBalance?: string;
+  transferableBalance?: string;
 };
 
 export type StateResolution<T> = { resolve: (value: T) => void; reject: () => void };

src/common/utils/balance.ts

@@ -1,4 +1,7 @@
 import BigNumber from 'bignumber.js';
+import { AssetAccount } from '../types';
+import { Chain } from '../chainRegistry/types';
+import { IAssetBalance } from '../balances/types';
 
 const ZERO_BALANCE = '0';
 
@@ -122,3 +125,48 @@ export const formatFiatBalance = (balance = '0', precision = 0): FormattedBalanc
     decimalPlaces,
   };
 };
+
+export const updateAssetsBalance = (prevAssets: AssetAccount[], chain: Chain, balance: IAssetBalance) => {
+  return prevAssets.map((asset) =>
+    asset?.chainId === chain.chainId
+      ? {
+          ...asset,
+          totalBalance: balance.total().toString(),
+          transferableBalance: balance.transferable().toString(),
+        }
+      : asset,
+  );
+};
+
+// async function handleSign() {
+//   extrinsicService
+//     .submitExtrinsic(polkadot.chainId, (builder) => builder.addCall(builder.api.tx.system.remark('Hello')))
+//     .then(
+//       (hash) => {
+//         alert('Success: ' + hash);
+//       },
+//       (failure) => {
+//         alert('Failed: ' + failure);
+//       },
+//     );
+// }
+
+// async function handleFee() {
+//   extrinsicService
+//     .estimateFee(polkadot.chainId, (builder) =>
+//       builder.addCall(
+//         builder.api.tx.balances.transferKeepAlive(
+//           '0xcc23ed33549e874ae7c7653fc5d95b3242dc7df5742664b4809e337a13126433',
+//           '1234',
+//         ),
+//       ),
+//     )
+//     .then(
+//       (fee) => {
+//         alert('Fee: ' + fee);
+//       },
+//       (failure) => {
+//         alert('Failed to calculate fee: ' + failure);
+//       },
+//     );
+// }

src/common/wallet/store.ts

@@ -77,11 +77,9 @@ export const resetWallet = () => {
   window.Telegram.WebApp.CloudStorage.removeItem(MNEMONIC_STORE);
 };
 
-export const initializeWalletFromCloud = (password: string, encryptedMnemonic: string): boolean => {
+export const initializeWalletFromCloud = (password: string, encryptedMnemonic: string): Wallet | null => {
   const mnemonic = AES.decrypt(encryptedMnemonic, password).toString(CryptoJS.enc.Utf8);
-  if (!mnemonic) return false;
+  if (!mnemonic) return null;
 
-  createWallet(mnemonic);
-
-  return true;
+  return createWallet(mnemonic);
 };

src/components/AssetsList/Asset.tsx

@@ -1,28 +1,33 @@
 import { cnTw } from '@/common/utils/twMerge';
 import { formatBalance } from '@/common/utils/balance';
-import Icon from '../Icon/Icon';
-import { CaptionText } from '../Typography';
+
+import { Shimmering, CaptionText, Icon } from '@/components';
 
 type Props = {
-  value: string;
   asset: any;
+  balance?: string;
+  name?: string;
   className?: string;
   showIcon?: boolean;
   imgClassName?: string;
   wrapperClassName?: string;
 };
 
-export const AssetBalance = ({ value, asset, className, imgClassName }: Props) => {
+export const AssetBalance = ({ balance, asset, name, className, imgClassName }: Props) => {
   const { precision, symbol } = asset;
-  const { formattedValue, suffix } = formatBalance(value, precision);
+  const { formattedValue, suffix } = formatBalance(balance, precision);
 
   return (
     <span className={cnTw('flex items-center gap-x-2', className)}>
-      <Icon name={symbol} size={40} alt="logo" className={imgClassName} />
+      <Icon name={symbol} size={40} alt={name} className={imgClassName} />
       <CaptionText>{symbol}</CaptionText>
-      <CaptionText>
-        {formattedValue} {suffix}
-      </CaptionText>
+      {balance === undefined ? (
+        <Shimmering width={100} height={20} />
+      ) : (
+        <CaptionText>
+          {formattedValue} {suffix}
+        </CaptionText>
+      )}
     </span>
   );
 };

src/components/AssetsList/AssetsList.tsx

@@ -1,21 +1,23 @@
-import { AssetWithBalance } from '@/common/chainRegistry/types';
+import { useGlobalContext } from '@/common/providers/contextProvider';
 import { AssetBalance } from './Asset';
 
-type Props = {
-  assets: AssetWithBalance[];
-};
+const AssetsList = () => {
+  const { assets } = useGlobalContext();
+  const sortedAssets = assets.sort((a, b) => a.symbol.localeCompare(b.symbol));
 
-const AssetsList = ({ assets }: Props) => (
-  <div className="flex flex-col gap-6 mt-4">
-    {assets.map((asset) => (
-      <AssetBalance
-        asset={asset}
-        value={asset.balance}
-        className="grid grid-cols-[50px,1fr,auto] items-center"
-        key={asset.assetId}
-      />
-    ))}
-  </div>
-);
+  return (
+    <div className="flex flex-col gap-6 mt-4">
+      {sortedAssets.map((asset) => (
+        <AssetBalance
+          asset={asset}
+          balance={asset.totalBalance}
+          className="grid grid-cols-[50px,1fr,auto] items-center"
+          name={asset.name}
+          key={asset.chainId}
+        />
+      ))}
+    </div>
+  );
+};
 
 export default AssetsList;