Twitter Tipping Dapplet

Get tips on Twitter in NEAR tokens.
The Tipping Dapplet Bot
The Twitter profile connected to NEAR account
The Tipping button in the Twitter post

Inspiration

The idea for the Tipping dapplet came from our desire to help community managers.

As a young project, we ourselves are well aware of the challenges one faces when trying to build, motivate, and develop a community. It is hard to argue that financial rewards are highly sought after by community members, especially in crypto.

We wanted to create a tool that would make financial rewards fast, easy, and even a little fun, thereby stimulating activity and growth in communities.

What it does

The Tipping Dapplet is a browser extension that lets users leave and receive tips for Twitter posts. Twitter was an obvious choice due to the platform’s popularity with the crypto community. The extension incorporates a «tip» button into the usual Twitter interface that allows users to donate NEAR tokens to other users.

How it works

The Tipping Dapplet is a module that works on top of the Dapplets platform.

We have thoroughly explained how to create Dapplets that work together with NEAR Protocol in this tutorial: https://learnnear.club/dapplets-x-near-example/

Thanks to our friends from Learn NEAR Club we were able to learn how to create dapps in the NEAR framework, this includes the development of smart contracts, working with them from the command line and the frontend.

The dashboard https://tippingdapplet.com was created on the basis of the CoreUI React library https://github.com/coreui/coreui-free-react-admin-template

Challenges we ran into

Oracle for linked accounts

In order for the extension to work, you had to link your NEAR and Twitter accounts, but naturally, you had to prove that you are their owner. The NEAR Wallet is not able to cryptographically sign text messages. Usually, this is the standard way of proving you are the owner of the private key without gas expenses. This meant we had to modify the account connection process.

Our solution - We request that Twitter users add their NEAR Wallet name to their profile name (i.e. "John Smith (john.near)") - this proves they own the Twitter account. We also ask users to send a transaction to the smart contract with the link to their Twitter profile - this proves they own the NEAR account.

To automatically validate this, we’ve created an oracle that parses Twitter account names and checks if they have a NEAR account in them. If the parsing is successful, a record is made in the contract that the two accounts are connected to each other.

The oracle needs to cover the transaction costs, this is why we ask the users to send a small stake. This also works as anti-spam protection. To protect the oracle from attacks it doesn’t have any open APIs to the public internet. All the requests for profile validation are received from the smart contract.

Dapplets on NEAR Mainnet

Before the Tipping Dapplet was created dapplets were not able to work on Mainnet web. We had to add mainnet smart contract support to the Dapplets Extension.

However, when trying to send the transaction, the NEAR Wallet would display an "Unknown App" message, which scared the users.

This happened because the NEAR Wallet works with DApps, which are usually websites. The Tipping dapplet however, works as a browser extension. To fix this issue we had to inspect the original wallet code and find where it gets the app name from. Understanding the mechanism behind the NEAR Wallet allowed us to find a solution to this problem.

Dashboard

In order to see the Tipping Dapplet’s stats we also created a dashboard: https://tippingdapplet.com

However, the smart contract does not save any statistics as this would mean higher gas fees for the users.

With this in mind, we decided to use an API that is offered by the NEAR Explorer. It is public but undocumented. An initial-code analysis and a bit of reverse engineering allowed us to understand which functions the API provides and how they should be summoned. Thanks to this, we were able to derive statistics from our smart contract with a single request and relatively quickly create the dashboard, without the need to caсhe data.

UX design

When creating the Tipping Dapplet we wanted to make the UX design as minimalistic as possible. One of the main challenges when creating an extension is minimizing the disruption of the user experience. People are very much adapted to Twitter as it is, and seeing the interface change drastically would likely put them off the extension.

This is why we made sure to keep everything clear, small, and minimal. We ensured only the necessary functionality was present to keep the users from getting distracted.

What we learned

One aspect we are most proud of is how fast we were able to create the Tipping dapplet.

We had to learn how to write centralized oracles by using node.js и puppeteer. We had to write an economic smart contract on NEAR Protocol and deploy it on Mainnet. We explored undocumented NEAR Explorer API which works on WAMP protocol.

All these things were relatively new to us, yet we managed to think quickly, deal with the challenges that were presented to us.

Besides simply learning new skills and code, we learned that with a great goal in mind we are motivated to be innovative and find creative solutions.

Proud of

The Tipping Dapplet is one of the most successful dapplets since the beginning of our project and we are naturally very proud of that. It warms our hearts to see so many users get to experience what we call augmented web (some call it web3) first-hand and express their joy. It’s nice to see people even outside of our community using the dapp exactly for its intended purpose and finding it helpful. We believe that the Tipping Dapplet is a small but significant step in the history of the internet and we are proud to be a part of it.

What's next for Twitter Tipping Dapplet

The Tipping Dapplet is still new and there are ways it can be further developed and improved.

The most desired update is undoubtedly mobile browser integration. The possibility to integrate the Tipping dapplet into other websites besides Twitter (i.e. Medium) would also provide communities with more variation in terms of communication outlets. Currently, the function of notifying users about incoming tips is executed by a Twitter bot. However, this system can also be adjusted and improved with an increase in users.

Currently, the dapplet is used by several communities. We truly believe it is a great and simple tool and hope to see it widely adopted by many community managers worldwide.