FRKT

No-Code tools for Web2 & 3.
FRKT(/furɪkt/) provides a frictionless UX for any app.

This repo is build for ETHOnline 2023.

Demo is here.

About this project

🤔 Problem

When I was thinking about dApps ideas, I always ran into two onboarding UX issues. User's wallet and initial gas-fee.

💡 Solution

Based on Account Abstraction by Biconomy (we can also use other AA stack) and MPC by Lit protocol, we wrap protocols, smart contracts, and other APIs etc. And we made integrating them together as a toolkit. This toolkit provides Zapier or IFTTT like functionality with embedded widgets into any app.

🏓 Workflow

[App owner] Setup App, Select a recipe to use, Generate widget code in FRKT dashboard
[App owner] Install widget code into apps. (paste 1 javascript file & script tag)
[App users] When the application user opens the widget.
1. Create a user's wallet (a. Google Oauth or b. webauthn).
2. Execute function in a widget (gas-less tx by AA).

Architecture link here

Folder structure

├── apps
│   ├── dashboard      -> 🛠️ Dashboard frontend
│   ├── demo           -> ⚽ Demo app frontend
│   ├── frkt-subgraph  -> 📈 Subgraph for widget
│   ├── widget         -> 👓 Widget
│   └── www            -> ✈️ Landing page (frkt.io)
├── packages
│   ├── contracts      -> 🎩 Smart contracts
│   └── common         -> Common libs
...

🎩 Contracts

Smart contracts for FRKT widget.

Hardhat
Ethers.js

🛠️ Dashboard

Dashborad for generationg widget code.

Next.js (React, TypeScript)
Tailwind CSS
Hosted on Vercel
Vercel Postgres

⚽ Demo

FRKT widget integration demo app. -> FRKT demos

Vite (React, TypeScript)
Tailwind CSS, daisyUI
Firebase Hosting, Firebase Auth(Google OAuth)

👓 Widget

Widget component for recipes.

Next.js (React, TypeScript)
Tailwind CSS
Hosted on Vercel
Vercel Postgres

✈️ Landing page

FRKT LP

Hono, Vite (React, TypeScript)
Tailwind CSS
Hosted on Cloudflare Pages

Techs

Applied Prizes

Safe

Safe{Core} Account Abstraction SDK

Our team developed the SignContract widget with the Safe{Core} Account Abstraction SDK built in.

protocol-kit code is here
relay-kit code is here

Relay Transaction Task ID is 0x8d6ae383814cd4ca70aa72c042e9aaf6db517c6107258bb1c69dde2554bec659
safe-core-sdk-types code is here

Lit Protocol

Programmatic Signing with the Lit JS SDK V3

Our team developed authbypass, the most prominent feature of this product, using LitProtocol SDK V3.

GoogleAuth and WebAuthn are supported so that users can implement their preferred authentication method.
- claming key with Google Auth code is here
- mint PKP with WebAuthn code is here

Filecoin

DWeb It The PDF file of the contract used in the SignContract Widget was uploaded to IPFS using Web3.storage.When creating the recipe, the file was uploaded, the IPFS link was set to the smart contract, and the information was stored in The Graph protocol.

Contract file data on IPFS

code is here

Polygon

Best Public Good with Account Abstraction or Gasless transactions on Polygon

Our team has developed a gasless cross-chain NFT that combines the capabilities of Biconomy and ChainLink CCIP to mint from the Avalanche testnet to the Polygon testnet.

For UX optimization, we combined LitProtocol MPC and AA technologies to allow users to create wallets without being aware of the blockchain. All the user has to do is log in and press a button just like in existing apps.

Avalanche testnet's Sender Contract is here

Polygon testnet's Reciver Contract is here

【OpenSea】Minted NFT (on Polygon testnet)

code of account abstraction implementation is here

Scroll

Deploy on Scroll Our team deployed SignContract on Scroll Alpha.

deployed Contract is here

The Graph

New Subgraph

Our team deployed a new subgraph to index SignContract data deployed in Base Goerli. This subgraph makes it possible to centrally manage multiple contracts with a single contract.

Subgraph's API endpoint is here

sample Query

query MyQuery {
  signContractCreateds(
    orderBy: signId
    orderDirection: desc
    where: { signId: "1" }
  ) {
    appId
    name
    receipeId
    required
    safeAddress
    signId
    uri
    owners
  }
  changeApproveStatuses(
    orderBy: signId
    orderDirection: desc
    where: { signId: "1" }
  ) {
    appId
    receipeId
    signId
    approveStatus
  }
  signatureAddeds(
    orderBy: signId
    orderDirection: desc
    where: { signId: "1" }
  ) {
    appId
    receipeId
    signId
    signature
  }
}

Chainlink

use Chainlink CCIP

Our team has developed a gasless cross-chain NFT that combines the capabilities of Biconomy and Litprotocol to mint from the Avalanche testnet to the Polygon testnet.

Avalanche testnet's Sender Contract is here

Polygon testnet's Reciver Contract is here

【OpenSea】Minted NFT (on Polygon testnet)

CCIP Explorer's link

solidity's code of CCIP Contract implementation is here(sender side)

frontend's code of CCIP Contract implementation is here

PushProtocol

Pushing Boundaries Award (Most Creative Idea Using Push Protocol)

Our product is designed to allow the developer to set the paymaster for each app, so we developed a GatTankChatbot that uses the PushProtocol SDK to notify developer when the paymaster's balance gets low so that we do not run out of paymaster.

code of pushprotocol implementation is here

yujiym / frkt