GithubHelp home page GithubHelp logo

kittybest / my-badge Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 4.75 MB

My attester app built from unirep protocol.

Solidity 10.16% JavaScript 15.65% HTML 0.62% Shell 0.46% TypeScript 71.46% Circom 1.37% Dockerfile 0.16% CSS 0.11%

my-badge's Introduction

create-unirep-app

This is a demo app of a unirep attester. In this demo app, users can request reputation from the example attester. After transition, user can prove how much reputation he has.

See: Users and Attesters

1. Installation

npx create-unirep-app

Then cd into the directory that was created. There are two ways to start the example attester:

2.1 Start with one command

yarn start

Then the frontend will be running at: http://localhost:3000/

2.2 Start with each daemon

2.2.1 Start a node

yarn contracts hardhat node

2.2.2 Deploy smart contracts

in new terminal window, from root:

yarn contracts deploy

2.2.3 Start a relayer (backend)

yarn relay keys &&
yarn relay start

2.2.4 Start a frontend

in new terminal window, from root:

yarn frontend start

It will be running at: http://localhost:3000/

my-badge's People

Contributors

kittybest avatar

Stargazers

 avatar

Watchers

 avatar

my-badge's Issues

[Frontend/Relay] Sign in

Frontend

  • enlarge the input field on Join Page
  • if the user clicks the twitter/github button, will display signup error: has signed up before
  • after login, redirect to user page
  • if the user wanna update, check if there's access_token --> if yes, get rep directly, --> if no, oauth first.
  • pass isSigningUp to relay to decide whether to sign up or not

Relay

  • oauth without signup, return access_token and isSigningUp to user

[Contract] ranking

  • need a circuit that is similar to epochKey.circom, with revealing the data user has
  • new uploadReputation event to event emit (need to update app contract)
  • the relay synchronizer will process this event, and add the record to db (need to update schema)
  • the contract will check if the state_tree_root be calculated from the proof matched the current state_tree_root (refer to epochKeyProof function check, need to update app contract)
  • new apis of getTop5() and getMine(epochKey, epoch) to the relay (need to have a new router)
  • might also need a circuit that check the difference of 2 certain fields (e.g. check not only the 0th and 1st field diff, but can also check the 2nd and 3rd field diff. if you want, also can check the 2nd and 1st diff)

[Frontend] ranking

directly search from the contract:

  • top5 of each attester
  • ranking of themselves

[Relay] calculate how much rep user could get

called updateRep:

  • user passes access_token and repProof to relay
  • relay use access_token to get user's followers/subscribers/likes/stars...etc
  • transfer the web2 data to rep points (how? now maybe just 1->1)
  • calculate the difference of user's current rep and the calculated one
  • give user the rep points of the amount of difference

[Relay] Signup to certain attester

  • pass attesterId to signup
  • synchronizer is independent --> how to solve it?
  • will db be independent ?? --> how to solve it?

====== Some thoughts ======

  • single relay handles several synchronizers
  • several relay, each of them handles single synchronizer

[Frontend/Relay] User State Transition

Frontend

  • update stateTransition function
  • check if the data are correctly processed and displayed
  • disable UST button if there's no need to do it

Relay

  • receive stateTransition request which includes attesterId

[Bug] Request Title Too Large

Why?

  • querying ranking from the server after so many epochs, which leads to so many epks, will cause this problem happen.

Possible Solution

  • hash all epks together?
  • split to several requests and compare it in the frontend

[Frontend] Logout

  • remove the user-related data in localStorage (refer to: Unirep Social)
  • add button on header

[Frontend] Sign up flow

After oauth and get access_token,

  • store access_token in localStorage (ref: how to store id in userContext)
  • signup on contract (ref: userContext.signup)
  • display error message on page if there's any error being returned (ref: semanticUI - message)
    • will the buttons of twitter and github being displayed under this condition?
  • update header buttons (from join to my and logout)
  • update home page buttons on banner (from join to see my badges)

[Frontend] User Page UI

  • display correct reputation
  • add buttons to calculate current reputation and gen proof
  • add connect button

[Frontend] Connect account

it's quite similar as signup flow on JoinPage, but something's different:

  • redirectDestination should set to /user
  • how to display error?
  • button loading

[Relay] ranking

  • synchronizer should recognize the event: submit data
  • add function to accept updating user's data
  • update schema

Epoch Key is too long now

  • DO NOT USE parseInt...!!!!!
  • is there anywhere that hex num is required?
  • how to query ranking by epochkey when the epochkey is too long

NOTICE
all the epoch key stored in the db is using BigInt.toString() (instead of hex number)

[Frontend] recover identity

WHY we need this feature?

  • prevent user from losing their identity
  • more convenient to sign in through twitter/github/other web2 services

METHODS

  • 2FA as password to generate semaphore id
    • after signup through twitter/github, ask user to download google verifier and scan the QRcode on screen (or enter the long secrets)
    • then ask user to input the length-6 code and generate semaphore identity through the 2FA secrets
    • really sign up user identity to contract after this
    • next time if the user wanna log in with twitter/github, still have to input the code to re-generate the identity.

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.