turbo-eth/template-web3-app

Bounty: Add Session Key Integration - 300 OP Reward

kamescg opened this issue · 1 comments

kamescg commented

image

👨‍💻 User Story

As a Web3 developer I want to craft beautiful experiences for users of my application

More specifically I want to minimize friction experienced by users in my Web3 application by minimizing signing and managing permissions overhead. Session keys (browser hot wallets) are a great way to minimize friction in Web3 applications.

The user's session keys can be given temporary smart contract permissions via the delegatable framework and/or temporary write/read access to Ceramic network data streams.

Join the Discord channel if you have any questions.

💰 Bounty Reward

The bounty reward is 300 OP tokens and TurboETH DevPass digital collectible.

TurboETH is the recipient of 18,271.88 OP Tokens from Optimism Retroactive Public Goods Funding. The OP tokens earned from the PGF program are the primary funding source for TurboETH bounties.

Bonus: 50 OP will be awarded if flux.paradigm.xyz is used to help generate the integration code. Exported conversations must be made available to be eligible for the bonus reward.

🧱 Project

Add Web3 browser session keys as a TurboETH integration.

Session keys will be given temporary read/write access controls from a root account using technologies like Sign-In With Ethereum object capabilities and Delegatable delegations.

The hook should be similar to useBurnerWallet found in Scaffold-ETH 2.

Except with 2 major changes:

  • Replace ethers with viem to manage wallet instances
  • Add support for multiple wallet instances i.e. browser session keys

Viem Documentation

Required Functionality:

  1. Browser session wallets via Ethereum private keys.
  2. Use viem to manage wallet instances.
  3. If necessary use jotai for state management.

Developer Tasks:

  • Create Hook - useSessionKey
  • Create Component - <CreateSessionKey />
  • Create Component - <DeleteSessionKey />
  • Create Component - <ListSessionKeys />

The ideal candidate will have experience with React, as well as a strong understanding of browser session management and security best practices. They should be able to create a robust, reliable, and easy-to-use hook that can be easily integrated into existing React applications.

The deliverables for this project include a fully-functional React hook that manages temporary browser session keys, as well as comprehensive documentation and test cases. The project timeline is flexible, but we expect the work to be completed within two weeks of the start date.

Potential File Structure

integrations/session-keys
├─ components/
│  ├─ create-session-key.tsx
│  ├─ delete-session-key.tsx
│  ├─ list-session-keys.tsx
├─ hooks/
│  ├─ use-session-key.ts
│  ├─ use-session-keys.ts
├─ client.ts
├─ README.md

Notice

The final integration may not resemble the proposed integration - that's O.K - a natural part of software development.

During development you might discover an original hypothesis doesn't make sense. No problem. Make a comment and clearly explain why a new approach is better than old one. Get rewarded for thinking out of the box.

The final bounty reward can be increased to match new bounty tasks.

Resources

kamescg commented

The bounty is complete -- #35

Thank you @marthendalnunes 🙏