appsmithorg / appsmith

Platform to build admin panels, internal tools, and dashboards. Integrates with 25+ databases and any API.
https://www.appsmith.com
Apache License 2.0
34.64k stars 3.74k forks source link

[Feature]: Either provide an option to expose window object or support Web3 functionalities directly as a feature #18351

Open davidliudev opened 1 year ago

davidliudev commented 1 year ago

Is there an existing issue for this?

Summary

In order to access Web3 functionalities provided by popular wallet extensions, such as Metamask, we need to have the capability to access window object to access the extension features.

Why should this be worked on?

We found many good use cases that Appsmith could be used for quick internal tools for blockchain related functionalities, such as Airdrop, Wallet operations, calling smart contract functionalities in EVM etc.

However, in order to use many of these functionalities, for example, call wallet extension to transfer Eth to another wallet, we need to be able to call functions that is injected by the Metamask extension in window object.

dilippitchika commented 1 year ago

Hey @davidliudev can you add a few documentation links for us to understand how these functionalities are dependent on window objects?

davidliudev commented 1 year ago

Hi @dilippitchika here is the link to Metamask docs:

https://docs.metamask.io/guide/getting-started.html#basic-considerations

image

Details can be found here: https://docs.metamask.io/guide/ethereum-provider.html#table-of-contents

davidliudev commented 1 year ago

Note that not only Metamask injects the ethereum this way, but also other wallets as well. This is currently already drafted here as the standard https://eips.ethereum.org/EIPS/eip-1193

And we assume many Web3 project and startups will benefit from Appsmith if we could do these Web3 operations easily. Currently we have to write our own tools via traditional FE development which is slow and tedious

cripsisxyz commented 1 year ago

+1 , I'm in love with appsmith, but my use case is also working with web3 wallets. This time with a Chia Wallet that work exactly in the same way: image

I link another request in which access to the window object had already been requested: https://github.com/appsmithorg/appsmith/issues/9978

appsmith would be perfect with this functionality

Nikhil-Nandagopal commented 1 year ago

@davidliudev would an option to simply whitelist the functions you would like to inject solve this problem?

cripsisxyz commented 1 year ago

Answering for my use case, I think is a good approach to have the ability to choose which window objects to interact with to keep others safe

davidliudev commented 1 year ago

Yes. That should work for my usecase. Better to make it configurable on which function to whitelist as there might be smaller differences depending on the wallet implementation

roo-oliv commented 1 year ago

Hi there! Any news on this issue? I really need this whitelist feature.

bharath31 commented 1 year ago

@allrod5 we're working on a POC to allow whitelisting of window objects. I can share more updates by the end of next week.

filipesmedeiros commented 1 year ago

Hey! Dropping by just to let you know that we're investigating using Appsmith for internal tooling and we also hit this barrier. We have no way of accessing Metamask since it's hidden by Appsmith. We'd love to do it, since otherwise I have found very few drawbacks with the app <3

bharath31 commented 1 year ago

Update: Our POC to expose the window object is successful and here's a deploy preview- https://ce-21160.dp.appsmith.com/

Please take the deploy preview out for a spin and share your feedback. This will help us fine-tune the product experience.

Note:

filipesmedeiros commented 1 year ago

@bharath31 I can't login with Google on that preview, says the redirect URL is mismatching?

cripsisxyz commented 1 year ago

@bharath31 same problem than @filipesmedeiros, cannot directly signup or login with google SSO

filipesmedeiros commented 1 year ago

Ah and trying to sign up with email/pass gives a Captcha error for some reason ahah

bharath31 commented 1 year ago

@filipesmedeiros @cripsisxyz added sign-in instructions to my previous comment. Please use web3demo@appsmith.com web3demo@appsmith

cripsisxyz commented 1 year ago

Done basic tests:

I'll be playing a while longer to test more advanced features.

image

It works like a charm! So there is no concept of whitelist? Can all window objects be accessed?

Thank you for the effort appsmith team <3

bharath31 commented 1 year ago

@cripsisxyz thanks for the feedback! The ability to whitelist window objects will be available on the main release.

filipesmedeiros commented 1 year ago

I see an apparent bug. When trying to do the basic "connect to Metamask flow" (window.ethereum.request({ method: 'eth_requestAccounts' })), I get this error: Error occurred while evaluating trigger onClick, SyntaxError: "undefined" is not valid JSON.

Screenshot 2023-01-20 at 10 34 51
bharath31 commented 1 year ago

@filipesmedeiros could you share a link to your app? I was able to connect to my Metamask wallet using the following code snippet:

myFun1: () => {
    const MMSDK = new MetaMaskSDK()
    const ethereum = MMSDK.getProvider()
    let accounts = ethereum.request({method: 'eth_requestAccounts'})
}

Loom demo: https://www.loom.com/share/8ab0808633364b4a9a6a283bbe715c6e

filipesmedeiros commented 1 year ago

Ok, I think it was an error on my side, thanks!

cripsisxyz commented 1 year ago

@bharath31 it seems this feature is not working in https://release.app.appsmith.com/ . Do we know when this functionality will be merged?

bharath31 commented 1 year ago

@cripsisxyz this feature is still on our backlog as we are finalizing the product specs. I'd like to get your thoughts on the whitelisting scope:

Would you prefer whitelisting window objects at an app level or at a workspace level?

cc: @filipesmedeiros @allrod5 @davidliudev

cripsisxyz commented 1 year ago

@bharath31 In my opinion at app level to don't loose the connection with wallet across the diferrent views on the app, ty

roo-oliv commented 1 year ago

App level seems more flexible to me. I'm not aware of other implications but I understand that it would be better if each developer can whitelist the window object for their app rather than having the workspace manager to whitelist it or not and the only option being to whitelist it to all the apps in the workspace or none.

5hanth commented 1 year ago

hope this whitelist option also allows Nostr to work. Are we expecting a release preview with a concluded spec anytime soon? I can help test the preview with these web3 libs.

filipesmedeiros commented 1 year ago

@bharath31 I'd say page makes more sense for us also!

cripsisxyz commented 1 year ago

hello, any update for this? thank you

bharath31 commented 1 year ago

hello, any update for this? thank you

@cripsisxyz We've commenced working on this after a brief pause. I'll be able to share release timelines by the first week of August.

here's the link to the new DP we're testing- https://appsmith-1ajnxvy1d-get-appsmith.vercel.app/

cripsisxyz commented 1 year ago

hello, any update for this? thank you

bharath31 commented 1 year ago

@cripsisxyz unfortunately, we hit some roadblocks with the production implementation and had to pause our efforts. You can fork our deploy preview branch to use window operations for apps that need to access the window object.

cripsisxyz commented 1 year ago

hello @bharath31, Do you have any instructions to build docker on that poc/window-access branch? I have tried many ways since my fork but I have not succeeded. Thank youu

bharath31 commented 1 year ago

hello @bharath31, Do you have any instructions to build docker on that poc/window-access branch? I have tried many ways since my fork but I have not succeeded. Thank youu

tagging @arunvjn from our team to help you with this

cripsisxyz commented 1 year ago

hello @arunvjn Can you give me some advice? tyy

arunvjn commented 1 year ago

@cripsisxyz Can you try forking the changes from this PR ?

cripsisxyz commented 1 year ago

I haven't achieved it because the process after forking the repository is not clear to me. Once forked, do I have to trigger the 'Build Deploy Preview' action? Or should I create a release and initiate the Docker build? Or simply 'Test, build, and push Docker Image'? @arunvjn ty for the efforts <3

These are my attempts: https://github.com/cripsisxyz/appsmith/actions

cripsisxyz commented 1 year ago

hello! any prevision of when this would be released? :) ty

dorinburcea commented 8 months ago

hello! any prevision of when this would be released? :) ty

Hello, tried even latest release but seems does not support the use of window object

z-one commented 3 months ago

come on!The main release does not support the window object! some window PC deploy can not access either!