astarnetwork / astar-apps

The official Astar Network portal for accessing your tokens and other native features!

Astar Portal

Astar Portal App - the application for using everything that Astar Network offers. This project is made with Vue 3 + TypeScript + Quasar.

Usage

Ensure that you have Yarn and Node.js 18.x.

# install the dependencies
yarn

# run the local dev page
yarn dev

# build the project
yarn build

E2E Testing

For E2E testing, we utilize chopsticks and playwright to mandatorily write test cases that test all of business logic.

Setup chopsticks

npx @acala-network/chopsticks@latest xcm -p=tests/chopsticks/astar.yml -p=tests/chopsticks/acala.yml -r=tests/chopsticks/polkadot.yml

Running tests locally in debug mode

• Start the portal (the portal should run on http://localhost:8080)

• You need to be familiar with Playwright generator by running codegen

yarn playwright:codegen

• Run the following

yarn playwright

• debug each file individually

yarn playwright tests/dappstaking-transactions.spec.ts

Running test in CI mode

• Start the portal (the portal should run on http://localhost:8080)

• Run the following

BASE_URL='http://localhost:8080' yarn playwright:ci

Write test cases

• Create test file or added test cases on existing file in /tests
  • Simple UI e2e testing : (assets).spec.ts
  • Native Transaction e2e testing : (assets)-transactions.spec.ts
  • EVM Transaction e2e testing : (assets)-transactions-evm.spec.ts

astar-apps's Issues

UI Modification

This is a small issue and the priority is not high. But I would like to fix it to make it more professional.

Inconsistency between ECDSA Extension and Metamask

Describe the bug
The SDN balance of my MM account is not reflected on the Astar Portal, and vice versa. They show up under two different accounts with different addresses.

Expected behavior
I am supposed to get the same account address on both interfaces, but this is not the case.

Screenshots
Different balance views:

Different account addresses:
-ECDSA extension

-MM wallet

Desktop (please complete the following information)

• Device: Laptop
• OS: Windows 10
• Browser: Chrome

Additional information
I did a check on Shiden's Subscan and the ECDSA account shows up as a Shiden address that is different from the one on MM.
How can I access the ECDSA account from MM with Shiden RPC and vice versa?

Firebase database query exceeded, cause Store access error

I think the project is using Firebase free package ,
it shows error when i access Store feature on portal. Images are attached.

Please fix this asap. We should switch to use “Pay as you go” feature to prevent this error happen again.

i reported on telegram group too.

Thanks.

Choose account box available on all views: Balance, Store..

If I have multiple accounts I need to go to Balance view to switch my account before I can stake, it would be more user friendly if I can do it right away from Store view.

I propose make this change wallet box available on all views.

Also if I refresh the browser page from Store view it's navigating me to the same Store view, but my account changed to the first one which is available in my polkadot.js chrome extension, that's why it would be good to see which account is currently selected for staking on Store view.

Add % Slider Bar

Adding a % slider bar & max button can be useful.

Format broken

@bobo-kovacevic

When I put a long explanation in the Description textbox, the format is broken.

Bottom icons not clickable, e.g. Discord, Twitter, etc.

None of these icons are clickable:

Claimed amount is 0 after claiming

I Pressed Claim button for PolkaEx app, transaction was successful. But claimed amount is shown 0.

I tried to Claim second time, but got error:

Claimed in this Era error prevention

It would be good to see somewhere on Claim popup window that claim already happened this Era.

Because currently I can claim, but after that i got error:

Address display/select cross page

Currently, the address selection/balance view is only available from the balance page.

It would be nice to have this box (including the balance) on every pages, on the top right for example.
Adding the verified identity would also be a useful extra.

[Feature suggestion] Users can see the dapps store page when they connect to custom network.

Motivation
Currently, users cannot see the dapps store page when they connect to custom network. As of now, sometimes Shiden network is unstable so users want to switch to the other RPC endpoint via custom network option. But in this case, users cannot see the dapps stores, so that they cannot stake their token on registered dapps.

Suggested Solution
using rpc.system.chain() as keys to fetch the registered dapps from firebase.

[Bug report] Won't update the `Balance` after completed transfar

Describe the bug
The balance has not been updated after completed the transfer transaction.

Demo: https://www.loom.com/share/79a339a126e34311afc073b63f81ed86

To Reproduce
Please refer to the attached demo video

Expected behavior

A clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots to help explain your problem.

=Before transfer=

=After transfer=

Desktop (please complete the following information)

• Mac
• Chrome
• 94.0.4606.81 (Official Build) (x86_64)

Staked but no proof is shown.

I have staked 5 SBY on Anyswap test dApp. However, nothing has occurred.

Mismatch Amount (Transferable and Locked)

In the dApp store, it seems that I have locked 10 SBY and Polkadot.js shows that I have locked 10 SBY. However, on the Astar portal, all tokens are transferable.

[Bug report] Need max number of staker indication

Describe the bug

A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior

A clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information)

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (please complete the following information)

• Device: [e.g. samsung ]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional information

Add any other information about the problem here.

when I'm trying to staking again there is a bug in the system please fix it good job

Transfer SDN Failed

Hi
I have 2 accounts with SDN 1 on https://polkadot.js.org/ drop from eth lock for PLM and another one on portal.astar.network also drop fro ETH lock for PLM on default ledger wallet.
I transfered PLM from https://polkadot.js.org/ to my portal.astar.network wallet to store them on ledger.
This transfer was successful.

Than I tried to tranfer 2 SDN back to https://polkadot.js.org/ wallet and failed to do it .

Dont know what to do.

ScreenCapture_2021-8-30.11.54.29.mp4

When I click on Send To , this icon appear ,it sends on the same address even if wrote another.

Unstake and Claim buttons available even if there is no stake amount

I can press Unstake and Claim buttons for PolkaEx app and also can sign transaction, but I don't have any staked amount.

I would expect to disable these buttons. Also it is possible to unstake 0 amount.

Error for metamask address during staking

Describe the bug
I have selected my Metamask account on balance view:

When I want to Stake, I choose my Metamask address from dropdown list on Stake popup window:

I got this error:

Expected behavior
All validations of wrong addresses should be on step where Metamask account is connected to portal, but not received after stake transaction is signed.

Desktop (please complete the following information)

• Browser chrome
• Version 94.0.4606.71

View is hangs when close polkadot.js chrome extension

I pressed Stake button and get polkadot.js extension window to sign the transaction:

But after that I close polkadot.js window using corner X button. After that portal window is hangs and only browser refresh helps to get back.

Note: If I press Cancel on polkadot.js extension, then works as expected and transaction is cancelled.

Stake but my balance did'nt decrease

i was stake 5 my SBYs and my balance did'nt decreased but my stake at Standard Protocol is increased and just get my SBY for fee

Recommendation Inputs for UI

On Register dApp section, please add notes such as :

• square format
• max / min pixel
• file format, jpg, png, others

On Information Box :

• Kindly add header About, Contract Address and Website Link in info box, and several lines also good (see picture
  
  attch)

I cannot see my balance on the portal when I am connected with Metamask

I can see the SDN in Metamask but I am not able to see them via the portal Astar.
The balance is always empty.
Shiden network is selected both in the portal and in metamask and the status is connected (green) both as well.

[Bug report] Total stake SDN of Dapp not updated after I add my SDN to stake

Describe the bug
I stake SDN and I saw the number of total stake not update

To Reproduce
ex. total stake is 66, and I add more 100 SDN

1.Go to stake SDN
2.It show 'Your stake' but It does not updated to 'Total stake'

Expected behavior
It should show the 'total stake' number include mine that just staked
166 not 100 as (see the attached image)

Screenshots

Desktop (please complete the following information)

• macOD 11.5.2
• Chrome
• Version 94.0.4606.71

Staked but there is still Transferable amount

Try testing sending to another account

And Dark mode automatically turns on, can't turn on light mode

Sort dApps in the DApp Store

A suggestion is that the DApp Store should sort by pledge amount,The larger the amount of pledge, the DAPP will be in the front, so as to motivate the DAPP

dApp staking UI controls transferable balance instead of total balance

While a user tries to stake more than his transferable balance, he gets a warning message telling him that the transaction risks to fail. In this case, he thinks that he can not stake more than his transferable balance.

The correct behaviour is to estimate maximum amount to be staked from [transferable balance] + [vesting locked balance] - [dApp stake locked balance]

In this example, user has a balance of 220 SDN that he can stake, the portal estimates a maximum stakable amount of 35 SDN.

[Bug report] App shows an odd icon to smaller screeen devices

Describe the bug

Not sure if this is an UI bug. Please advise what expected to see at this point.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior

A clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information)

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Smartphone (please complete the following information)

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional information

Add any other information about the problem here.

Inconsistent side menu button size

The Balance button on the nav/menu is much bigger compared to the others.

Show number of nominators on dApp staking

Actually, we can't see how many nominators are staking on a dApp, neither the limit.
This brings to an error while sending extrinsic when an dApp is oversubscribed.

The portal should displayed number of nonimator and limit on each dApp with the format [nominators/limit] (ex: 128/128)
When the limit is reached, the stake button should be disabled, preventing user from sending an extrinsic that will fail.

[Bug report] Full account balance stake "lock"

Step 1- dapp Stake all your account balance.

Step 2 - Try to unstake your tokens

https://user-images.githubusercontent.com/83981055/137465348-ec5fa5c0-671c-4524-97dd-1c15b378f76c.png

i think full account balance stake must not be allowed, because user wont be able to unestake anymore.

account cant even claim vested tokens in this situation:

https://user-images.githubusercontent.com/83981055/137465731-505b039d-ebee-441f-ab07-55251327b442.png

solved this "lock" by getting SDN from another account.

proposed solutions:

1- warn the user about this.

2 - Dont allow user to stake all balance or keep small amount to ensure user can unstake.

UX workflow issues with staker number limit

I shouldn't have to go through the staking operations + wait 12sec for block confirmation before getting an error related to an oversubscribed DApp.

This info should be displayed inside the DApp card on the Store dashboard, so that users don't waste time and/or end up frustrated. 😵‍💫

[Bug report] "Your Stake" dApp numbers incorrect on portal.astar.network

dApp staking shows incorrect numbers against dApp on https://portal.astar.network/#/store/discover-dapps after staking twice to same dApp.

To Reproduce

1. Using polkadot.js wallet extension
2. Stake 10kSDN against Community Rewards Program - https://shiden.subscan.io/extrinsic/499376-3
3. Observe correct number against "Your stake" (10kSDN)
4. Make an additional stake of 90kSDN against same dApp - https://shiden.subscan.io/extrinsic/499461-3
5. Observe incorrect number against "Your stake":
   

Expected behavior
"Your stake" should be 10k+90kSDN = 100kSDN. What it's actually showing is 27.9999 kSDN which also happens to be the remaining balance of SDN in my account i.e. SDN that I have not yet staked.

Desktop (please complete the following information)

• OS: Windows 10
• Browser Brave
• Version 1.30.89 Chromium: 94.0.4606.81 (Official Build) (64-bit)

Unused unstake button displayed and Units of measurement confuse the user

1. Please use only the SBY measurement, the kSBY or mSBY units are just confusing.

2. The UNSTAKE button, despite not having a stakin, is still displayed.

3. Show APY.

4. Use a different font size to see numbers as they are very small.

5. Use only two decimal places in numbers.

[Feature suggestion] Display minimum staking value for dApps Staking

Motivation

Describe the need or frustration that motivated you to make this suggestion.

It is difficult for the users staking on dApps Store to know what is the minimum required tokens for staking.

Suggested Solution

Describe your suggested solution to the need or frustration that you are experiencing.

You can get the dApps Staking minimum staking value as a chain const with the following API

await api.consts.dappsStaking.minimumStakingAmount;

We should make the default staking value the minimum staking value instead of 0, and show a warning message or disable the staking button if the input value is below the minimum value.

You can also add the current nominators and the maximum number of nominators with a similar method.

Alternatives

Describe any alternative solutions or features you considered and why you believe your suggested
solution is preferable.

Additional Information

Provide any additional information that you believe may help us evaluate your suggestion.

Dark/Light Mode

The dark mode is not enabled but during my night it automatically becomes the dark mode

Shinden airdrop

https://twitter.com/Gabrielbramast1/status/1447580354550714375

SDN ADDRES : aRhKUTmw5JJMqfXBxaoSoGuefXV3gGn82As6ZymWWAsPvzD

1 click RPC add for MetaMask

It would be very useful to have a 1 click RPC add function for MetaMask, making it easy for users to add Shiden/Shibuya network to onboard the EVM part.

Long loading time

When I stake SBY on a dApp, the loading time is too long (more than minutes)

[Bug report] Vue.js devtools can't detect the app

Describe the bug

Can't use Vue.js devtools in localhost.

To Reproduce
Steps to reproduce the behavior:

1. Install extension on Chrome
2. Run the app via yarn dev

Expected behavior

A clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information)

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Extension version: 5.3.4
Chrome version: 94.0.4606.71 (Official Build) (x86_64)

Smartphone (please complete the following information)

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional information

Add any other information about the problem here.

[Bug report] Metamask send all funds bug

Metamask ... it is impossible to send all funds from the metamask account ... transaction cost is 0.1 SBN fee - so when sending all funds - the transaction will be successful - but will only charge 0.1 SBN fee.

Add senders drop down to register dapp dialog.

User should be able to select account used to register a dapp

Switch from wallet in dApp store

Motivation
If you use multiple accounts, you have to go first to your balance before seeing staking amount of that wallet.

Suggested Solution
Make it possible to easily switch from wallet in the dApp store page

Alternatives
/

Additional Information
/

No rewards are shown!

As you can see here, i have staked 10 SBY on PolkaEx

But there is no reward I can get.

Resolve package dependencies warning message

yarn install v1.22.15
[1/5] Validating package.json...
[2/5] Resolving packages...
[3/5] Fetching packages...
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[4/5] Linking dependencies...
warning " > @polkadot/[email protected]" has unmet peer dependency "@polkadot/x-randomvalues@*".
warning " > @polkadot/[email protected]" has unmet peer dependency "@polkadot/ui-settings@*".
warning " > [email protected]" has unmet peer dependency "webpack@>=5".
warning " > [email protected]" has unmet peer dependency "vue@^3.0.0".
warning " > [email protected]" has unmet peer dependency "vue@>=3".
warning " > [email protected]" has unmet peer dependency "vue@^3.0.2".
warning " > @babel/[email protected]" has unmet peer dependency "@babel/core@>=7.11.0".
warning " > @tailwindcss/[email protected]" has incorrect peer dependency "tailwindcss@^1.0".
warning " > [email protected]" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
[5/5] Building fresh packages...
Done in 57.06s.

Address the project package dependency warnings.
There are some packages that cannot be resolved like [email protected] which needs vue@^3.0.0 while [email protected] needs vue@^3.0.2. In this case, you might want to update the package or ignore the warning message.

Can't switch metamask account after metamask is connected.

I can Connect to Metamask from Balance view:

Once Metamask is connected I can't switch account in dapp portal anymore even I have more then one account in my Metamask:

But when I switched account in Metamask my address is not updated in dapp portal.

Expected behavior
Account selected in metamask always should match the account selected in dapp portal.

Desktop (please complete the following information)

• Browser chrome
• Version 94.0.4606.71

Add network status indication

Motivation
Portal users don't have information about network status and can't know if their transaction will pass or not.

Suggested Solution
Add the current block time under the network status bar and mark it red if the block time is more than 10 times the average

Add feature to view addresses on Subscan.

If it is possible to add an "Explorer" feature on the Portal so that users can conveniently check wallet addresses or transactions on Subscan.
In the future we will use Portal to do many things so this can be a useful feature.

The feature to transfer tokens fails silently

In the balance of the portal , I think you should display the staked balance and you should deduce this amount from transferable balance.
Because the user cannot transfert the tokens when they are staked.
If the user try to do it, the operation fails silently: the UI displays the operation is succeeded but fortunately no token is transfered.

UI workflow issues with staking account selection

If I try to select an account that is already selected, the UI becomes un-responsive and I'm stuck. I have to close the modal/reload the whole page to overcome this issue.

If I click "stake" from this view, the Polkadot-JS modal pops up, even though I haven't even set a value for the SBY to be staked!

I think a better UX would be to close the modal automatically upon selecting a wallet, including clicking on a wallet that is already selected. 👀

Dapps Staking - SDN

Team need to restrict minimum SDN required for Dapps staking. It will help SDN holders and also increase total nominators from 128 to 500.. 128 is very less it will help to creat scam projects in Shiden network.. example :- Dapps team can stake with their own 128 wallet with each 0.1 SDN