.

src/app/core/interfaces/price-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { CallReturn } from './callback';
+
+export interface PriceContractMethods {
+  getLatestPrice(aggregator: number): CallReturn<any>;
+}
+
+export interface PriceContract extends Contract {
+  methods: PriceContractMethods;
+}

src/app/core/interfaces/quoterv2-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { CallReturn, SendReturn } from './callback';
+
+export interface QuoterV2ContractMethods {
+  quoteExactOutputSingle(params: string[]): CallReturn<any>
+  quoteExactInputSingle(params: string[]): CallReturn<any>
+}
+
+export interface QuoterV2Contract extends Contract {
+  methods: QuoterV2ContractMethods;
+}

src/app/core/interfaces/reward-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { SendReturn, CallReturn } from './callback';
+
+export interface RewardContractMethods {
+  shift(amount: string): SendReturn<any>;
+  withdraw(tokenId: string): SendReturn<any>;
+  harvest(tokenId: string): SendReturn<any>;
+  chainlinkPrice(): CallReturn<any>;
+  getETHAmount(amount: string): CallReturn<any>;
+  deposits(tokenId: string): CallReturn<any>;
+  incentiveKey(): CallReturn<any>;
+  incentiveId(): CallReturn<any>;
+  expiry(): CallReturn<any>;
+  
+}
+
+export interface RewardContract extends Contract {
+  methods: RewardContractMethods;
+}

src/app/core/interfaces/reward-unlocked-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { SendReturn, CallReturn } from './callback';
+
+export interface RewardUnlockedContractMethods {
+  addLiquidity(amount: string): SendReturn<any>;
+  withdraw(tokenId: string): SendReturn<any>;
+  chainlinkPrice(): CallReturn<any>;
+  getETHAmount(amount: string): CallReturn<any>;
+  deposits(tokenId: string): CallReturn<any>;
+  incentiveKey(): CallReturn<any>;
+  incentiveId(): CallReturn<any>;
+  
+}
+
+export interface RewardUnlockedContract extends Contract {
+  methods: RewardUnlockedContractMethods;
+}

src/app/core/interfaces/shifter-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { CallReturn, SendReturn } from './callback';
+
+export interface ShifterContractMethods {
+  deposit(commitment: string, encryptedNote: string, passwordHash: string): SendReturn<any>;
+
+  withdraw(
+    proof: string, 
+    root: string, 
+    nullifierHash: string,
+    recipient: string,
+    relayer: string,
+    fee: string,
+    refund: string
+    ): SendReturn<any>;
+
+  commitmentList(): CallReturn<any>;
+
+  commitments(commitment: string): CallReturn<any>;
+
+  simpleShift(amount: string, recipient: string): SendReturn<any>
+
+  getTokensForDenomination(denom: BigInt): CallReturn<any>
+
+  getCost(denom: BigInt): CallReturn<any>
+
+  isSpent(nullifierHash: string): CallReturn<any>
+
+  isSpentArray(nullifierHashes: string[]): CallReturn<any>
+
+  denomination(): CallReturn<any>
+
+  chainlinkFeed(): CallReturn<any>;
+
+  xftPool(): CallReturn<any>;
+
+  tokenPool(): CallReturn<any>;
+}
+
+export interface ShifterContract extends Contract {
+  methods: ShifterContractMethods;
+}

src/app/core/interfaces/storage-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { CallReturn, SendReturn } from './callback';
+
+export interface StorageContractMethods {
+  store(address: string, _encryptedNote: string): SendReturn<any>;
+
+  getLatestDeposit(mixer: string, address: string, passwordHash: string): CallReturn<any>;
+
+  getDeposits(mixer: string, address: string, passwordHash: string): CallReturn<any>;
+  
+  getDepositsLength(mixer: string, address: string, passwordHash: string): CallReturn<any>;
+
+  getDepositByIndex(mixer: string, address: string, passwordHash: string, index: string): CallReturn<any>;
+
+  xcrypt(data: string, key: string): CallReturn<any>;
+
+  decrypt(
+    address: string,
+    index: string,
+    key: string): CallReturn<any>;
+  }
+
+export interface StorageContract extends Contract {
+  methods: StorageContractMethods;
+}

src/app/core/interfaces/swaprouter-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { CallReturn, SendReturn } from './callback';
+
+export interface SwapRouterContractMethods {
+  //exactOutputSingle(params: string[]): SendReturn<any>
+  exactOutputSingle(params: string[]): SendReturn<any>
+}
+
+export interface SwapRouterContract extends Contract {
+  methods: SwapRouterContractMethods;
+}

src/app/core/interfaces/token-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { CallReturn, SendReturn } from './callback';
+
+export interface TokenContractMethods {
+  allowance(owner: string, spender: string): CallReturn<any>;
+
+  approve(accountAddress: string, amount: string): SendReturn<any>;
+
+  balanceOf(accountAddress: string): CallReturn<string>;
+
+  safeApprove(accountAddress: string, amount: string): SendReturn<any>
+}
+
+export interface TokenContract extends Contract {
+  methods: TokenContractMethods;
+}

src/app/core/interfaces/tokenswap-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { SendReturn } from './callback';
+
+export interface TokenSwapContractMethods {
+  upgrade(): SendReturn<any>;
+}
+
+export interface TokenSwapContract extends Contract {
+  methods: TokenSwapContractMethods;
+}

src/app/core/interfaces/v3staker-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { CallReturn, SendReturn } from './callback';
+
+export interface V3StakerContractMethods {
+  getRewardInfo(key: string[], tokenId: string): CallReturn<any>;
+  incentives(incentiveId: string): CallReturn<any>;
+}
+
+export interface V3StakerContract extends Contract {
+  methods: V3StakerContractMethods;
+}

src/app/core/interfaces/weth9-contract.ts

+import { Contract } from 'web3-eth-contract';
+import { SendReturn } from './callback';
+
+export interface Weth9ContractMethods {
+  deposit(): SendReturn<any>;
+  withdraw(amount: string): SendReturn<any>;
+  approve(spender: string, amount: string): SendReturn<any>;
+}
+
+export interface Weth9Contract extends Contract {
+  methods: Weth9ContractMethods;
+}

src/app/core/pipes/index.ts

+export * from './pipes.module';
+export * from './short-address.pipe';

src/app/core/pipes/normalize-bn.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+
+import { normalizeBN, BigNumberValue } from '../helpers';
+
+@Pipe({
+  name: 'normalizeBN'
+})
+export class NormalizeBnPipe implements PipeTransform {
+  public transform(value: BigNumberValue = '0', decimals: number = 18): number {
+    return Number(normalizeBN(value, decimals).dp(5).toString(10));
+  }
+}

src/app/core/pipes/pipes.module.ts

+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { NormalizeBnPipe } from './normalize-bn.pipe';
+import { ShortAddressPipe } from './short-address.pipe';
+
+@NgModule({
+  declarations: [
+    ShortAddressPipe,
+    NormalizeBnPipe,
+  ],
+  exports: [
+    ShortAddressPipe,
+    NormalizeBnPipe,
+  ],
+  imports: [
+    CommonModule,
+  ]
+})
+export class PipesModule {
+}

src/app/core/pipes/short-address.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+
+import { shortAddress, isTxHash, shortTxHash } from '../helpers';
+
+@Pipe({
+  name: 'shortAddress'
+})
+export class ShortAddressPipe implements PipeTransform {
+  public transform(address: string): string {
+    return isTxHash(address) ? shortTxHash(address) : shortAddress(address);
+  }
+}

src/app/core/reducer.ts

+import { Action, createReducer, on } from '@ngrx/store';
+
+import {
+  GetAllowanceSuccess,
+  GetBalancesSuccess,
+  GetLatestPriceSuccess,
+  GetXFTBalanceSuccess,
+  GetUSDBalanceSuccess,
+  SetAccountAddress,
+  SetRouterParams,
+} from './actions';
+import { RouterState } from './index';
+import { OutputParamsBalance } from './interfaces/contract-service-methods';
+import { TOKENS_MAP } from './helpers';
+import { TokensName } from './enums';
+import { Console } from 'console';
+
+export const coreKey = 'context';
+
+export interface CoreState extends RouterState {
+  accountAddress: string;
+  xftBalance: string;
+  usdBalance: string;
+  allowance: string;
+  balances: OutputParamsBalance[];
+  assetPrice: {
+    price: string;
+    decimals: number;
+  };
+}
+
+export const initialState: CoreState = {
+  accountAddress: undefined,
+  balances: undefined,
+  xftBalance: undefined,
+  usdBalance: undefined,
+  allowance: undefined,
+  assetPrice: undefined,
+  params: undefined,
+  queryParams: undefined,
+  url: undefined,
+};
+
+const _coreReducer = createReducer(
+  initialState,
+  on(SetRouterParams, (state, { url, params, queryParams }): CoreState => {
+    return { ...state, url, params, queryParams };
+  }),
+  on(SetAccountAddress, (state, { accountAddress }): CoreState => {
+    return { ...state, accountAddress };
+  }),
+  // The actual balance state modifications happen here
+  on(GetXFTBalanceSuccess, (state, { xftBalance }): CoreState => {
+    TOKENS_MAP["XFT"]["balance"] = xftBalance;
+    return { ...state, xftBalance };
+  }),
+  on(GetUSDBalanceSuccess, (state, { usdBalance }): CoreState => {
+    Object.entries(TOKENS_MAP).forEach(([key, value]) => value["zkSymbol"] === ("anonUSD")? 
+    TOKENS_MAP[key]["balance"] = usdBalance : TOKENS_MAP[key]["balance"] = "No USD");
+    return { ...state, usdBalance };
+  }),
+  on(GetLatestPriceSuccess, (state, { assetPrice }): CoreState => {
+    return { ...state, assetPrice };
+  }),
+  on(GetAllowanceSuccess, (state, { allowance }): CoreState => {
+    return { ...state, allowance };
+  }),
+  on(GetBalancesSuccess, (state, { balances }): CoreState => {
+    balances?.forEach(({ asset }) => {
+      if (asset.symbol && TOKENS_MAP[asset.symbol]) {
+        TOKENS_MAP[asset.symbol].balance = asset.amount;
+      }
+    });
+
+    return { ...state, balances };
+  }),
+);
+
+export function reducer(state: CoreState, action: Action): CoreState {
+  return _coreReducer(state, action);
+}

src/app/core/router-params.serializer.ts

+import { Params, RouterStateSnapshot } from '@angular/router';
+
+import { RouterStateSerializer } from '@ngrx/router-store';
+
+import { RouterParams, RouterState, initialRouterParamsState } from './index';
+
+export class RouterParamsSerializer implements RouterStateSerializer<RouterState> {
+  public serialize({ url, root }: RouterStateSnapshot): RouterState {
+    let route = root;
+    let queryParams: Params = {};
+    let params: RouterParams = initialRouterParamsState;
+
+    while (route.firstChild) {
+      route = route.firstChild;
+
+      params = { ...params, ...parseParams(route.params) };
+
+      queryParams = { ...queryParams, ...parseParams(route.queryParams) };
+    }
+
+    return { url, params, queryParams };
+  }
+}
+
+function parseParams(params: Params): Params {
+  const obj: Params = {};
+
+  for (const param in params) {
+    if (params.hasOwnProperty(param)) {
+      obj[param] = !params[param].startsWith('0x') && !isNaN(+params[param]) ? +params[param] : params[param];
+    }
+  }
+
+  return obj;
+}

src/app/core/selectors.ts

+import { createFeatureSelector, createSelector } from '@ngrx/store';
+
+import { coreKey, CoreState } from './reducer';
+import { normalizeBN, TOKENS_MAP, valueToBigNumber } from './helpers';
+import { Tokens, TokensName } from './enums';
+
+export const selectContextState = createFeatureSelector<CoreState>(coreKey);
+
+export const selectContext = createSelector(
+  selectContextState,
+  (context) => context,
+);
+
+export const selectAccountAddress = createSelector(
+  selectContext,
+  (state) => state.accountAddress,
+);
+
+export const selectXFTBalance = createSelector(
+  selectContext,
+  (state) => state.xftBalance,
+);
+
+export const selectUSDBalance = createSelector(
+  selectContext,
+  (state) => state.usdBalance,
+);
+
+export const selectAssetPrice = createSelector(
+  selectContext,
+  (state) => state.assetPrice,
+);
+
+export const selectAllowance = createSelector(
+  selectContext,
+  (state) => state.allowance,
+);
+
+export const selectBalances = createSelector(
+  selectContext,
+  (state) => {
+    return state?.balances?.map((balance) => {
+      return {
+        ...TOKENS_MAP[balance.asset.symbol],
+        ...balance,
+      };
+    });
+  },
+);
+
+export const selectAssets = createSelector(
+  selectBalances,
+  (balances) => {
+    return Object.values(TOKENS_MAP)
+      .filter(({ zkSymbol }) => zkSymbol !== "XFT") //TokensName.XFT)
+      .map((token) => {
+        const balance = balances?.find((b) => b.asset.symbol === token.zkSymbol);
+
+        return {
+          ...token,
+          asset: {
+            symbol: token.zkSymbol,
+            amount: balance ? balance.asset.amount : '0',
+            USD: balance ? balance.asset.USD : '0',
+            XFT: balance ? balance.asset.XFT : '0',
+          },
+          commitments: balance ? balance.commitments : [],
+        };
+      });
+  },
+);
+
+// Used in wallet component
+export const selectXFTBalancesAmount = createSelector(
+  selectBalances,
+  (balances) => {
+    const amount = balances?.map((balance) => balance.asset.XFT)
+      .reduce((prev, cur) => {
+        prev = prev.plus(cur);
+
+        return prev;
+      }, valueToBigNumber(0));
+
+    return normalizeBN(amount, 18).dp(2).toString(10);
+  },
+);
+
+export const selectTokenBySymbol = (symbol: string) => {
+  return createSelector(
+    selectBalances,
+    (balances) => balances?.find(({ asset }) => symbol === asset.symbol),
+  );
+};
+
+export const selectChartData = createSelector(
+  selectBalances,
+  (balances) => {
+    const data = balances?.map((b) => {
+      return normalizeBN(b.asset.amount, 18)
+        .dp(5)
+        .toNumber();
+    });
+
+    return {
+      labels: Object.values(Tokens).map((symbol) => ` ${ symbol }`),
+      datasets: [
+        {
+          data,
+          label: '',
+          borderWidth: 0,
+          backgroundColor: [
+            '#5800B0',
+            '#6B39FA',
+            '#A98CFF',
+            '#D1C1FE',
+          ],
+          hoverBackgroundColor: [
+            '#5800B0',
+            '#6B39FA',
+            '#A98CFF',
+            '#D1C1FE',
+          ],
+        },
+      ],
+    };
+  },
+);

src/app/core/services/base.service.ts

+import { Store } from '@ngrx/store';
+
+import { firstValueFrom } from 'rxjs';
+import { environment } from '../../../environments/environment';
+import { State } from '../index';
+
+import { CallReturn, MethodCallback, SendReturn } from '../interfaces/callback';
+import { selectAccountAddress } from '../selectors';
+
+export abstract class BaseService {
+  protected accountAddress!: string;
+
+  protected constructor(
+    protected readonly store: Store,
+  ) {
+  }
+
+  protected apiUrl(): string {
+    return environment.apiUrl;
+  }
+
+  protected async call<T = any>(method: CallReturn<T>, cb: MethodCallback = null): Promise<T> {
+    const from = await firstValueFrom(this.store.select(selectAccountAddress));
+
+    return await method.call({ from }, cb);
+  }
+
+  protected async send<T = any>(method: SendReturn<T>, cb: MethodCallback = null): Promise<T> {
+    const from = await firstValueFrom(this.store.select(selectAccountAddress));
+
+    const gas = await method.estimateGas({ from });
+
+    return await method.send({ from, gas }, cb);
+  }
+}