Giter VIP home page Giter VIP logo

argent-x's Introduction


⬇️ Get Argent X for Starknet today:

Quality Gate Status Technical Debt Coverage


🌈 Table of contents

🧒 Example dapp

You can try the extension using our example dapp hosted at:

https://argentlabs.github.io/argent-x/

The example dapp is also contained in this repository.

🌐 Usage with your dapp

If you want to use this Starknet Wallet extension with your dapp, the easiest way is to checkout the starknetkit package

# starknet.js is a peer dependency
pnpm add starknetkit starknet
import { connect } from "starknetkit"

// Let the user pick a wallet (on button click)
const starknet = connect()

if (!starknet) {
  throw Error("User rejected wallet selection or silent connect found nothing")
}

// (optional) connect the wallet
await starknet.enable()

// Check if connection was successful
if(starknet.isConnected) {
    // If the extension was installed and successfully connected, you have access to a starknet.js Signer object to do all kinds of requests through the user's wallet contract.
    starknet.account.execute({ ... })
} else {
    // In case the extension wasn't successfully connected you still have access to a starknet.js Provider to read starknet states and sent anonymous transactions
    starknet.provider.callContract( ... )
}

Checkout starknet.js to learn more about how to use Provider and Signer.

🚀 Install from sources

First clone this repository on your machine then run:

pnpm run setup  # setup dependencies
pnpm build  # run build process for all packages

Now you need to load the locally built chrome extension into your browser, by loading an unpacked extension from path packages/extension/dist:

Chrome

  1. Open the Extension Management page by navigating to chrome://extensions.
  2. Enable Developer Mode by clicking the toggle switch next to Developer mode.
  3. Click the Load unpacked button and select the extension directory.

Chrome screenshot of setup

Source

Firefox

  1. Open the Extension Management page by navigating to about:debugging#/runtime/this-firefox
  2. Select the manifest.json from the dist folder

Source

👩🏾‍💻 Development

To contribute to this repository please read the contributing guidelines first.

To setup the repo on your machine just run:

pnpm run setup # setup dependencies
pnpm dev   # run build process for all packages in watch mode

This project contains 3 packages:

package description
extension Argent X extension
get-starknet npm module to get started with starknet.js and Argent X quickly
dapp example dapp for testing purposes and example for dapps how to use get-starknet

To test changes made to the extension package you need to load the local unpacked extension into Chrome as described above. Changes are shown after reopening the extension. Changes to background.js are just shown after a complete restart of the Chrome process.

🧪 Testing

Setup

Some tests require starknet-devnet to be available at http://127.0.0.1:5050/. If tests are run without then you may see errors including connect ECONNREFUSED 127.0.0.1:5050.

Run devnet locally

For convenience this service can be started with Docker desktop running;

  • For ARM computers (e.g. Mac computers with Apple silicon)

    docker run -it -p 5050:5050 shardlabs/starknet-devnet:latest-arm-seed0
  • Otherwise

    docker run -it -p 5050:5050 shardlabs/starknet-devnet:latest-seed0

Run tests

pnpm test      # run unit tests for all packages
pnpm test:e2e  # run end-to-end tests for all packages

Tools to help with testing

See also /docs/tools-for-local-testing.md

✏️ Contributing

Everyone is welcome to contribute. Please take a moment to review the contributing guidelines.

❤️ Family and friends

Since this project would not have been possible without starknet.js, we would like to say a big thank you to all starknet.js contributors and @0xs34n for starting it.

One more thank you to the StarkWare Team.

👨🏼‍🎨 Authors and license

Argent and contributors.

See the included License.md file.

argent-x's People

Contributors

0xs34n avatar anthony-urbina avatar bluecco avatar canlopes avatar delaaxe avatar dependabot[bot] avatar dhruvkelawala avatar diegodelrieu avatar gergold avatar graemeblackwood avatar gregoryguillou avatar ismaeldm95 avatar janek26 avatar jasonzhouu avatar jgresham avatar juniset avatar kankan-0 avatar mortimr avatar omahs avatar simonheys avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

argent-x's Issues

Support for multiple transactions

Currently it looks like sending two transactions through argent-x results in one failing due to reusing the same nonce against the account contract. Ideally the transactions would be queued with incremental nonces similar to how metamask handles this.

Improve UX for hiding tokens

To be consistent across the UI, the HideTokenScreen should reuse the existing ConfirmScreen (without going through the Actions flow)

Problem downloading a backup file

Nothing happens when a backup file is loaded..
I press as usual to select a file on the PC, I choose...that's it...
and lacks the ability to open the wallet in a separate full-fledged window
Screenshot_4
.

Token address voyager link and copy

Similar to account addresses. Should be available on a Token's details screen.

accountaddress

Without this, I think two tokens with same name and symbol can't be distinguished in the UI.

Delete accounts

Localhost accounts can quickly clutter the ui and so should be deletable

Request: auto-lock options

The wallet is auto-locked when the popup loses focus. For convenience there could be an option to toggle auto-lock or specify an amount of time.

Improve settings UX

The settings screen is becoming cluttered and could be split up in more screens.

Figma design also available for motivated contributors.

Accounts do not have an __execute__ method

Hello Argent X team!

So I am trying to use my argentx-created account sign transactions on Goerli Testnet. My understanding is that account contracts are to have __execute__ methods so you can sign a transaction locally and delegate it to the account to send. This is how starknet.py works as well (the client I am using).

However, things are failing because the account contract does not seem to have an __execute__ method, so I cannot use my argentx accounts in my Python scripts.

I uninstalled and installed a new wallet.

Hello! You have come up with a very unfortunate and bad system for accessing the wallet.
https://www.argent.xyz/faq/
I used your testnet wallet https://app.testnet.jediswap.xyz/
I spent about 1 month testing.
Today I turned on the computer and there is no access to the wallet.
Of course, I deleted the file a long time ago, but I have a password. But for some reason your wallet is not restored by password.
There is no such function, and requires the creation of a new wallet.
I uninstalled and installed a new wallet.
My old wallet address: 0x039f29f00b9df8cce5ca1db4568d22d23121090561b5c67e8def6067cf9cc822
What should I do to regain access to it???
I know the wallet address, I know the password.
https://www.argent.xyz/faq/

Sincerely, Anatoly Konstantinov.

Extension send transaction window content does not fill space

Hi, I noticed that when I send a transaction the window content does not fill all available space. I use a tiling window manager so the window is by default bigger than the default size.

It would be nice if the content fills the extra space, I attached a screenshot where you can see the problem.

2021-11-12-205850_3840x1080_scrot

Add link to source code in dapp

Some people are only given the link to the test dapp so we should make it easy for them to find the /packages/dapp folder in this repo

Overwrite existing keystore

When adding a second account, we're asked to download another keystore file that contains both accounts.

Ideally the extension would overwrite the existing keystore, but it's unclear if we can do this without requesting additional permissions.

Disconnect feature

  • Users should be able to add a disconnect button from the their dapp
  • Should be in the test dapp as an example

Ledger Nano S support integration: unable to detect HID device

Hello,

I am currently working on Ledger Nano S integration. I would like to understand why I cannot see Nano S device as HID device when I call await navigator.hid.requestDevice({filters:[]}); from the console ? Same for await navigator.hid.getDevices().
Tried to figure out where it might come from (extension permission ?), but I am running out of ideas...
Any clue ?
Thanks,
Kind regards,
Jerome

UX Blocker: Token List Reloads Infinitely

When I try to use this wallet, I get an infinite loading spinner bug every time I open it for some reason. I believe this occurs only after I do my first mint test transaction.

I can "fix" the issue by setting a timeout/lifespan to usePromise in components/Account/TokenList.tsx on line 35

  const tokenDetails: TokenDetails[] = usePromise(
    async (tokens: string[], walletAddress: string) =>
      Promise.all(
        tokens.map((address) =>
          fetchTokenDetails(address, walletAddress, networkId),
        ),
      ),
    [tokens, walletAddress],
    5000 // Infinity, <----- edited this to "fix"
  )

Video of issue

spinny.mp4

"Fixed"
fixed

Cannot create account on mainnet - error 500

I'm trying to switch to mainnet and create an account but it fails with an error, status code 500. Is this expected behavior? I am able to create a functioning account on the testnet without issue.

System config: Macbook Pro M1 Pro (2021), macOS 12.2, Brave 1.35.101 arm64

Screen Shot 2022-02-14 at 11 09 56 AM Screen Shot 2022-02-14 at 11 10 09 AM

Accounts showing as "deploying" even though they're deployed on StarkNet

Hi team!

I've had this issue for quite a while now. I've deployed several accounts through Argent X and they're all confirmed but the Argent X wallet doesn't show them as deployed but still as deploying. I can still interact with the deployed accounts and sign transactions but the status is never updated.
This happens both on Testnet and Mainnet.

Wallet addresses on Testnet

  • 0x1c2b3e201db633e64ff70a865f695ea2ca6b0ac78e989338e19b0406b51406
  • 0x328bf36c8604ecaa2e6acc7aab8cbdebee5eab75e05e6ecc9bc42f099da8a2a
  • 0x6ba796796e8438babd53c73c130b2d303172458037fbd932ef60caa9d75b07a
  • 0x46f78066d78cc2b97e40bc5e39c7e0a0204e80e2d94a2b5148840ab372411fa

Wallet addresses on Mainnet
-0x3eea9f6a4f70934d1dc5038c8761a53af617125b423e8742238519d2e1a519b

  • 0x1e9283ca0fb375eb5577ce09cccae5a3409fed69587ef59232d3706bc8b0d32
  • 0x6e68fabe0b3fbadf3d8841eeadf7ffcb44b28012aede87b18feca73649155ea

image
image

Decrypting wallet password takes a long time

Screen Shot 2021-11-14 at 7 34 47 AM

Argent X uses ethers.js to encrypt and decrypt passwords. This specific function is taking a long time to decrypt:

          const l1 = await ethers.Wallet.fromEncryptedJson(
            keyStore,
            event.data.password,
            (progress) =>
              useProgress.setState({ progress, text: "Decrypting ..." }),
          )

Which really reduces the UX for the user.

Possible solutions

  1. According to the ethers.js docs here, we can fix it by changing scrypt.N value which is not recommended.

  2. We could reduce the times that Argent X asks the user to decrypt the password.

  3. We can use MetaMask's encrypt/decrypt function - though I'm not sure why they don't believe long decryption times is a feature and not a bug. More details on MetaMask security here

Preauthorized sites

A common pattern with dapps is to have the wallet automatically connect when the user visits the website, but only if the user previously connected to it. This is to avoid firing the wallet connection window on first connect.

I propose the following:

  • Add a isPreauthorized(): boolean method to the signer interface. This method returns true if the current site is in the list of connected sites and calling enable() would not show a confirmation window to the user.

Password woes

Tried signing in to my Argent X accounts on various browsers, passwords are all showing as invalid.
Attempted to restore accounts with Json files, these are accepted, but then asks for password again.
Is there any way to get around this loop?
Thanks in advance.

Is there a character limit on passwords? @2.X

I set up ArgentX on 3/5, backed up the json and uninstalled the extension.
Today I downloaded and installed ArgentX 2.3, but when I enter my password on restore, it says "Wrong password".
My password had 256 digits, is it possible that if it is too long it is internally registered as short?

Can't recover wallet on Linux

I might be totally wrong as this can be a particularity of my setup.

Can anyone actually drop a file in that space?
In order to drag starknet-backup.json you likely need to click somewhere else, which closes the dialogue and makes restarting the process a necessity. The process itself (browsing, selecting the backup file) does nothing for me, but not working is less annoying than "promising" me a drag-and-drop experience and not delivering. (test environment: Ubuntu / Chromium / v1.1.0)

image

Timeout when signing transactions

We see briq users occasionally getting Timeout errors. The symptoms show up as follows:
Capture d’écran 2022-02-17 à 18 21 27

So far as I can tell, this is coming from this line in the code. I'm not sure if it's a network issue that doesn't get forwarded, or an Argent-specific timeout. Regardless, it seems wrong that this fails with a string instead of an Error.

Wrong injected starknet on window

In my app, I'm using starknet.js as one of the dependencies so in my package.json file, starknet is on version 2.7.1.
In @argent/get-starknet, starknet is on version 2.5.0 (as a peer dependency).
For some reason, the injected starknet on the window got the peer dependency version instead of mine, i.e., pulls starknet from the /dist in @argent/get-starknet and not from my app's bundle.

No starknet found in window 1.1.0

I am trying to get 1.1.0 to work correctly with https://github.com/fracek/starknet-react-example but getting Unhandled Rejection (Error): no starknet found in window

However, according to console I do see starknet properly injected into the window object

When attempting to test using the playground package, I see a similar issue:

On first load in a fresh tab, the above error pops up. After dismissing the error I can proceed without issue and sign transactions. I can even reload the page and the issue does not occur. However, if I open a new tab again I am greeted with the no starknet found in window error, which can be dismissed.

Accounts changed event is not fired

I noticed that even if my application subscribes to the accountsChanged event (using starknet.on('accountsChanged', cb), my callback is never called.

Not enough to import old wallets

Good afternoon, I am testing various projects with Argent X StarkNet Wallet and encountered the following error when loading an older version of Wallet
~\Desktop\argent-extension-v2.3.0
Error
Manifest file is missing or unreadable
Manifest could not be loaded.
I need to install the old version based on your instructions, because now I don't know how it will affect my participation in various projects with the change of the old address to the new one

List of connected sites

It would be nice to see a list of all the sites that are connected to an account and manage connections individually. Currently, it is only possible to reset all connections.

Improve naming

Generally, good codebases always use the same words to refer to the same concepts. It makes things quicker to understand and easier to look up and navigate.

Currently, we're using:

  • Both keystore and backup to refer to the same concept. We should pick one and stick to it.
  • Both whitelist and pre-authorization interchangeably, there should be only one.
  • Wallet / Account / Signer, which should eventually match StarkNet's nomenclature.

In addition, it would be ideal if the naming in code matches what's displayed in UI and otherwise communicated to users, but this may not always be strictly possible.

Name Account

As a user I want to be able to change the name of my account, to label them.

AC:

  • Name changes do not need to be stored in backup files.
  • I can change the displayed name of an account.

Make all address mappings network specific

There are multiple places in the code where we use an account address as the key of an object/mapping.

If a same address can be valid on multiple networks at the same time, we should make sure to also index the network name in the key.

Request: Manually save json

If possible it would be great to be able to manually save the json. At the moment, if for some reason you don't save the json when prompted after adding a new wallet, it looks like there is no way to get the 'save json' window back other than adding yet another wallet

signMessage is hard to use from code

The signMessage API of the argent-X signer (I mean the in-browser JS code of the extension) requires passing a TypedData struct, of the following format:

{
     domain: {
       name: "Example DApp",
       chainId: mainnet ? 1 : 3,
       version: "0.0.1",
     },
     types: {
       StarkNetDomain: [
         { name: "name", type: "felt" },
         { name: "chainId", type: "felt" },
         { name: "version", type: "felt" },
       ],
       Message: [{ name: "message", type: "felt" }],
     },
     primaryType: "Message",
     message: {
       "message": "some_short_string"
     }
}

This is un-necessarily complex: the wallet should probably just take a message (possibly a domain name?).
Furthermore, the UI fails to report errors if the wrong type of data is passed (it simply hangs).
The UI also shows the whole struct when signing the message, but I assume that is somewhat related to this unexpected behaviour in the first place.


Edit: I should note that starknet.js Signer also expects TypedData, so maybe the API should instead be abstracted there somewhat?

Create a wallet with Argent X on the locally running devnet?

Hello all!
How can I connect and create a wallet with Argent X on the locally running devnet?

I have a devnet running correctly on my machine. I go to ArgentX extension, select localhost network, tap + to create a wallet since there is none, but I always get "RangeError: Maximum call stack size exceeded".

I am trying to interact with a contract deployed on devnet, so I need to have ArgentX setup on localhost to interact with it.

Am I doing something wrong?
Thanks!

Improve backup flow UX

Currently the keystore file is download automatically upon changes to it, which isn't ideal from a user perspective.

We have designs in Figma which should be implemented to make the UX around this smoother.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.