fix: remove web3 (#968)

* Update StakingServiceTab.vue

* remove web3

* fix

* lint fix

.maintain/docker/build-image.sh

@@ -8,7 +8,7 @@ pushd .
 PROJECT_ROOT=`git rev-parse --show-toplevel`
 cd $PROJECT_ROOT
 
-IMAGE_NAME=debionetwork/debio-customer-ui
+IMAGE_NAME=rixelanya/debio-customer-ui
 
 # Build the image
 echo "Building ${IMAGE_NAME}:latest docker image, hang on!"

src/common/lib/balance-format.js

@@ -1,12 +1,10 @@
-import store from "@/store"
-
-const web3 = store.getters["metamask/getWeb3"]
+import Web3 from "web3"
 
 export async function fromEther(balance) {
-  const formatedBalance = web3.utils.fromWei(String(balance), "ether")
+  const formatedBalance = Web3.utils.fromWei(String(balance), "ether")
   return formatedBalance
 }
 
 export async function toEther(balance) {
-  return web3.utils.toWei(String(balance), "ether")
+  return Web3.utils.toWei(String(balance), "ether")
 }

src/views/Dashboard/Customer/Home/GeneticData/GeneticAnalysisList.vue

@@ -57,7 +57,6 @@ export default {
       api: (state) => state.substrate.api,
       wallet: (state) => state.substrate.wallet,
       lastEventData: (state) => state.substrate.lastEventData,
-      web3: (state) => state.metamask.web3,
       mnemonicData: (state) => state.substrate.mnemonicData
     })
   },

src/views/Dashboard/Customer/Home/GeneticData/GeneticDataList.vue

@@ -48,6 +48,7 @@ import { pencilIcon, trashIcon } from "@debionetwork/ui-icons"
 import { queryGeneticDataByOwnerId, removeGeneticData, removeGeneticDataFee} from "@debionetwork/polkadot-provider"
 import { errorHandler } from "@/common/lib/error-handler"
 import ConfirmationDialog from "@/common/components/Dialog/ConfirmationDialog"
+
 import Web3 from "web3"
 
 

src/views/Dashboard/Customer/Home/GeneticData/RequestAnalysis/AnalystDetail.vue

@@ -167,7 +167,6 @@ export default {
       api: (state) => state.substrate.api,
       wallet: (state) => state.substrate.wallet,
       walletBalance: (state) => state.substrate.walletBalance,
-      web3: (state) => state.metamask.web3,
       mnemonicData: (state) => state.substrate.mnemonicData,
       lastEventData: (state) => state.substrate.lastEventData,
       selectedGeneticData: (state) => state.geneticData.selectedData,

src/views/Dashboard/Customer/Home/GeneticData/RequestAnalysis/PaymentCard.vue

@@ -112,7 +112,6 @@ import { setGeneticAnalysisPaid } from "@/common/lib/polkadot-provider/command/g
 import { formatUSDTE } from "@/common/lib/price-format.js"
 import Web3 from "web3"
 
-
 export default {
   name: "PaymentCard",
 
@@ -247,6 +246,7 @@ export default {
       let unit
       currency === "USDT" || currency === "USDT.e" ?unit = "mwei" : unit = "ether"
 
+
       const formatedBalance = Web3.utils.fromWei(String(val.replaceAll(",", "")), unit)
       return Number(formatedBalance).toLocaleString("en-US")
     },

src/views/Dashboard/Customer/Home/GeneticData/RequestAnalysis/SelectServiceAnalyst.vue

@@ -74,6 +74,7 @@ import {
   queryGeneticAnalystByAccountId, 
   queryGeneticAnalystQualificationsByHashId } from "@debionetwork/polkadot-provider"
 import ImportantDialog from "./Information.vue"
+import Web3 from "web3"
 
 export default {
   name: "SelectServiceAnalyst",
@@ -130,7 +131,7 @@ export default {
       const handleDescription = async (description) => {
         try {
           if (typeof description === "string" && description.startsWith("0x")) {
-            return this.web3.utils.hexToUtf8(description);
+            return Web3.utils.hexToUtf8(description);
           }
           const regex = /^(https:\/\/ipfs.debio.network\/ipfs\/)/;
           if (regex.test(description)) {

src/views/Dashboard/Customer/Home/MyTest/OrderHistoryDetail.vue

@@ -214,8 +214,7 @@ export default {
 
   computed: {
     ...mapState({
-      api: (state) => state.substrate.api,
-      web3: (state) => state.metamask.web3
+      api: (state) => state.substrate.api
     }),
 
     computeDifferenceAmount() {

src/views/Dashboard/Customer/Home/MyTest/StakingServiceTab.vue

@@ -7,7 +7,7 @@
     )
       template(v-slot:[`item.id`]="{ item }")
         .customer-staking-tab__id
-          div {{ "N/A" }}
+          div {{ formatId(item.request.hash) }}
 
       template(v-slot:[`item.country`]="{ item }")
         .customer-staking-tab__country
@@ -182,7 +182,6 @@ export default {
     ...mapState({
       api: (state) => state.substrate.api,
       pair: (state) => state.substrate.wallet,
-      web3: (state) => state.metamask.web3,
       lastEventData: (state) => state.substrate.lastEventData,
       mnemonicData: (state) => state.substrate.mnemonicData,
       polkadotWallet: (state) => state.substrate.polkadotWallet

src/views/Dashboard/Customer/Home/MyTest/index.vue

@@ -193,6 +193,7 @@ import { queryDnaSamples, queryDnaTestResults, unstakeRequest, unstakeRequestFee
 import { getDNACollectionProcess } from "@/common/lib/api"
 import { ORDER_STATUS_DETAIL } from "@/common/constants/status"
 import PaymentDialog from "@/common/components/Dialog/PaymentDialog"
+import Web3 from "web3"
 
 export default {
   name: "MyTest",
@@ -244,8 +245,7 @@ export default {
       wallet: (state) => state.substrate.wallet,
       lastEventData: (state) => state.substrate.lastEventData,
       mnemonicData: (state) => state.substrate.mnemonicData,
-      stakingId: (state) => state.lab.stakingId,
-      web3: (state) => state.metamask.web3
+      stakingId: (state) => state.lab.stakingId
     }),
 
     userAddress() {
@@ -305,7 +305,7 @@ export default {
 
     await this.fetchOrderList()
     const txWeight = await unstakeRequestFee(this.api, this.wallet, this.stakingId)
-    this.txWeight = this.web3.utils.fromWei(String(txWeight.partialFee), "ether")
+    this.txWeight = Web3.utils.fromWei(String(txWeight.partialFee), "ether")
   },
 
   async created() {

src/views/Dashboard/Customer/Home/PaymentHistory/Details.vue

@@ -106,7 +106,7 @@ import { mapState } from "vuex"
 import getEnv from "@/common/lib/utils/env"
 import { formatUSDTE } from "@/common/lib/price-format.js"
 import { getMenstrualSubscriptionById, getMenstrualSubscriptionPrices} from "@/common/lib/polkadot-provider/query/menstrual-subscription";
-
+import Web3 from "web3"
 
 // NOTE: Use anchor tag with "noreferrer noopener nofollow" for security
 let timeout
@@ -130,8 +130,7 @@ export default {
     ...mapState({
       api: (state) => state.substrate.api,
       rating: (state) => state.rating.rate,
-      lastEventData: (state) => state.substrate.lastEventData,
-      web3: (state) => state.metamask.web3
+      lastEventData: (state) => state.substrate.lastEventData
     }),
 
     computeProviderName() {
@@ -311,7 +310,7 @@ export default {
     formatPrice(price, currency) {
       let unit
       currency === "USDT" || currency === "USDTE" ? unit = "mwei" : unit = "ether"
-      const formatedPrice = this.web3.utils.fromWei(String(price.replaceAll(",", "")), unit)
+      const formatedPrice = Web3.utils.fromWei(String(price.replaceAll(",", "")), unit)
       return parseFloat(formatedPrice)
     },
 

src/views/Dashboard/Customer/Home/PaymentHistory/index.vue

@@ -57,7 +57,6 @@ import { getOrderList } from "@/common/lib/api"
 import { formatPrice, formatUSDTE } from "@/common/lib/price-format.js"
 import { getMenstrualSubscriptionPrices } from "@/common/lib/polkadot-provider/query/menstrual-subscription"
 
-
 export default {
   name: "CustomerPaymentHistory",
 
@@ -81,7 +80,6 @@ export default {
   computed: {
     ...mapState({
       api: (state) => state.substrate.api,
-      web3: (state) => state.metamask.web3,
       lastEventData: (state) => state.substrate.lastEventData
     })
   },

src/views/Dashboard/Customer/Home/Phr/Create.vue

@@ -206,6 +206,7 @@ import { generalDebounce } from "@/common/lib/utils"
 import errorMessage from "@/common/constants/error-messages"
 import { uploadFile, getFileUrl } from "@/common/lib/pinata-proxy"
 import { fileTextIcon, alertIcon, pencilIcon, trashIcon, eyeOffIcon, eyeIcon } from "@debionetwork/ui-icons"
+import Web3 from "web3"
 
 const englishAlphabet = val => (val && /^[A-Za-z0-9!@#$%^&*\\(\\)\-_=+:;"',.\\/? ]+$/.test(val)) || errorMessage.INPUT_CHARACTER("English alphabet")
 
@@ -256,7 +257,6 @@ export default {
       wallet: (state) => state.substrate.wallet,
       lastEventData: (state) => state.substrate.lastEventData,
       mnemonicData: (state) => state.substrate.mnemonicData,
-      web3: (state) => state.metamask.web3,
       walletBalance: (state) => state.substrate.walletBalance
     }),
 
@@ -298,7 +298,7 @@ export default {
         this.txWeight = "Calculating..."
 
         const txWeight = await registerElectronicMedicalRecordFee(this.api, this.wallet, val)
-        this.txWeight = `${Number(this.web3.utils.fromWei(String(txWeight.partialFee), "ether")).toFixed(4)} DBIO`
+        this.txWeight = `${Number(Web3.utils.fromWei(String(txWeight.partialFee), "ether")).toFixed(4)} DBIO`
       }, 500)
     }
   },

src/views/Dashboard/Customer/Home/Phr/Edit.vue

@@ -215,7 +215,7 @@ import {
   updateElectronicMedicalRecord,
   registerElectronicMedicalRecordFee
 } from "@debionetwork/polkadot-provider";
-
+import Web3 from "web3"
 import {
   uploadFile,
   getFileUrl,
@@ -291,7 +291,6 @@ export default {
       wallet: (state) => state.substrate.wallet,
       lastEventData: (state) => state.substrate.lastEventData,
       mnemonicData: (state) => state.substrate.mnemonicData,
-      web3: (state) => state.metamask.web3,
       walletBalance: (state) => state.substrate.walletBalance
     }),
 
@@ -599,7 +598,7 @@ export default {
         this.phr
       );
       this.txWeight = `${Number(
-        this.web3.utils.fromWei(String(txWeight.partialFee), "ether")
+        Web3.utils.fromWei(String(txWeight.partialFee), "ether")
       ).toFixed(4)} DBIO`;
     },
 

src/views/Dashboard/Customer/Home/Phr/MenstrualCalendar/SubscriptionSetting.vue

@@ -191,6 +191,7 @@ import {
 } from "@/common/lib/polkadot-provider/command/menstrual-subscription";
 import { formatPrice } from "@/common/lib/price-format";
 import { getConversion } from "@/common/lib/api";
+import Web3 from "web3"
 
 export default {
   name: "SubscriptionSetting",
@@ -237,7 +238,6 @@ export default {
     ...mapState({
       api: (state) => state.substrate.api,
       wallet: (state) => state.substrate.wallet,
-      web3: (state) => state.metamask.web3,
       lastEventData: (state) => state.substrate.lastEventData,
       walletBalance: (state) => state.substrate.walletBalance
     })
@@ -501,7 +501,7 @@ export default {
         this.subscription?.currency
       );
       this.txWeight = `${Number(
-        this.web3.utils.fromWei(String(txWeight.partialFee), "ether")
+        Web3.utils.fromWei(String(txWeight.partialFee), "ether")
       ).toFixed(8)} DBIO`;
     },
 

src/views/Dashboard/Customer/Home/Phr/MenstrualCalendar/index.vue

@@ -185,6 +185,7 @@ import {
 import { formatPrice } from "@/common/lib/price-format";
 import { generalDebounce } from "@/common/lib/utils";
 import { getConversion } from "@/common/lib/api";
+import Web3 from "web3"
 
 export default {
   name: "MenstrualCalendar",
@@ -255,7 +256,6 @@ export default {
     ...mapState({
       api: (state) => state.substrate.api,
       wallet: (state) => state.substrate.wallet,
-      web3: (state) => state.metamask.web3,
       lastEventData: (state) => state.substrate.lastEventData,
       walletBalance: (state) => state.substrate.walletBalance
     })
@@ -416,7 +416,7 @@ export default {
         this.subscription.currency
       );
       this.txWeight = `${Number(
-        this.web3.utils.fromWei(String(txWeight.partialFee), "ether")
+        Web3.utils.fromWei(String(txWeight.partialFee), "ether")
       ).toFixed(8)} DBIO`;
     },
 

src/views/Dashboard/Customer/Home/Phr/SecondOpinion/RequestPage/GrantAccessPHR.vue

@@ -304,6 +304,7 @@ import { fileTextIcon, alertIcon, pencilIcon, trashIcon, eyeOffIcon, eyeIcon } f
 import { web3Enable, web3Accounts, web3FromAddress } from "@polkadot/extension-dapp"
 import localStorage from "@/common/lib/local-storage"
 import getEnv from "@/common/lib/utils/env"
+import Web3 from "web3"
 
 
 const englishAlphabet = val => (val && /^[A-Za-z0-9!@#$%^&*\\(\\)\-_=+:;"',.\\/? ]+$/.test(val)) || errorMessage.INPUT_CHARACTER("English alphabet")
@@ -378,7 +379,6 @@ export default {
       wallet: (state) => state.substrate.wallet,
       lastEventData: (state) => state.substrate.lastEventData,
       mnemonicData: (state) => state.substrate.mnemonicData,
-      web3: (state) => state.metamask.web3,
       walletBalance: (state) => state.substrate.walletBalance
     }),
 
@@ -428,7 +428,7 @@ export default {
         this.txWeight = "Calculating..."
 
         const txWeight = await registerElectronicMedicalRecordFee(this.api, this.wallet, val)
-        this.txWeight = `${Number(this.web3.utils.fromWei(String(txWeight.partialFee), "ether")).toFixed(4)} DBIO`
+        this.txWeight = `${Number(Web3.utils.fromWei(String(txWeight.partialFee), "ether")).toFixed(4)} DBIO`
       }, 500)
     }
   },

src/views/Dashboard/Customer/Home/Phr/index.vue

@@ -120,6 +120,7 @@ import CryptoJS from "crypto-js";
 import Kilt from "@kiltprotocol/sdk-js";
 import { u8aToHex } from "@polkadot/util";
 import { errorHandler } from "@/common/lib/error-handler";
+import Web3 from "web3"
 
 export default {
   name: "CustomerPHR",
@@ -187,8 +188,7 @@ export default {
       wallet: (state) => state.substrate.wallet,
       mnemonicData: (state) => state.substrate.mnemonicData,
       lastEventData: (state) => state.substrate.lastEventData,
-      loadingData: (state) => state.auth.loadingData,
-      web3: (state) => state.metamask.web3
+      loadingData: (state) => state.auth.loadingData
     })
   },
 
@@ -329,7 +329,7 @@ export default {
         item.id
       );
       this.txWeight = `${Number(
-        this.web3.utils.fromWei(String(txWeight.partialFee), "ether")
+        Web3.utils.fromWei(String(txWeight.partialFee), "ether")
       ).toFixed(4)} DBIO`;
     },
 

src/views/Dashboard/Customer/Home/RequestTest/AgreementDialog.vue

@@ -158,6 +158,7 @@ import errorMessage from "@/common/constants/error-messages"
 import {errorHandler} from "@/common/lib/error-handler"
 import { getLocations, getStates, getCities, getCategories } from "@/common/lib/api"
 import { alertIcon } from "@debionetwork/ui-icons"
+import Web3 from "web3"
 
 
 export default {
@@ -207,7 +208,6 @@ export default {
       setCity: (state) => state.lab.city,
       setCategory: (state) => state.lab.category,
       lastEventData: (state) => state.substrate.lastEventData,
-      web3: (state) => state.metamask.web3,
       walletBalance: (state) => state.substrate.walletBalance
     }),
 
@@ -230,7 +230,7 @@ export default {
     await this.getServiceCategory()
 
     const txWeight = await createRequestFee(this.api, this.pair, this.country, this.state, this.city, this.category)
-    this.txWeight = this.web3.utils.fromWei(String(txWeight.partialFee), "ether")
+    this.txWeight = Web3.utils.fromWei(String(txWeight.partialFee), "ether")
   },
 
   watch: {

src/views/Dashboard/Customer/Home/RequestTest/Checkout/PaymentCheckout.vue

@@ -34,7 +34,6 @@ export default {
   computed: {
     ...mapState({
       api: (state) => state.substrate.api,
-      web3: (state) => state.metamask.web3,
       dataService: (state) => state.testRequest.products
     })
   },

src/views/Dashboard/Customer/Home/RequestTest/PaymentDetailCard.vue

@@ -176,6 +176,7 @@ import { createOrder } from "@/common/lib/polkadot-provider/command/order";
 import { formatUSDTE } from "@/common/lib/price-format.js";
 import { processRequest } from "@/common/lib/polkadot-provider/command/service-request";
 import PaymentDialog from "@/common/components/Dialog/PaymentDialog"
+import Web3 from "web3"
 export default {
   name: "PaymentDetailCard",
 
@@ -249,7 +250,6 @@ export default {
       dataService: (state) => state.testRequest.products,
       metamaskWalletAddress: (state) => state.metamask.metamaskWalletAddress,
       stakingData: (state) => state.lab.stakingData,
-      web3: (state) => state.metamask.web3,
       lastEventData: (state) => state.substrate.lastEventData,
       usdtBalance: (state) => state.substrate.usdtBalance,
       polkadotWallet: (state) => state.substrate.polkadotWallet
@@ -321,7 +321,7 @@ export default {
         this.wallet,
         this.dataService.serviceId
       );
-      this.txWeight = this.web3.utils.fromWei(
+      this.txWeight = Web3.utils.fromWei(
         String(txWeight.partialFee),
         "ether"
       );

src/views/Dashboard/Customer/Home/RequestTest/SelectServicePage/SelectService.vue

@@ -86,7 +86,6 @@ export default {
   computed: {
     ...mapState({
       api: (state) => state.substrate.api,
-      web3: (state) => state.metamask.web3,
       wallet: (state) => state.substrate.wallet,
       country: (state) => state.lab.country,
       city: (state) => state.lab.city,