This page details the frontend workflow needed to create bounties, using the Web UI

Key Requirements

• Create a bounty with the following fields:
  • Title
  • Summary
  • Criteria
  • Reward
  • Currency
• Drafting a bounty creates it in the "Draft" stage, and attaches it to the user's discord or Eth address
• "Create bounty" takes to a create bounty page
  • If the user has ≥1 bounties in "Draft", show the "Drafts" screen
  • Ability to publish drafted bounties
  • Ability to share a drafted bounty, but cannot be published nor edited
  • Ability to edit a drafted bounty
• Disable Bounty Creation for guest pass users in Bankless

API

• POST, PATCH, DELETE bounties
• GET bounties with status=draft for the user

Auth

Problem: How to effectively gate routes? How to provide flexibility in route gating?

We fetch the session from Discord using OAuth, NextAuth generates the user and session in the session object, it looks like it saves that using the getSession method.

Next.js - How to Get Session Information in Server Side vs Client Side iusing Next-auth

import { getSession } from 'next-auth/client'

export async function getServerSideProps({req}) {
  let headers = {}
  const session = await getSession({ req });
  if (session) {
    headers = {Authorization: `Bearer ${session.jwt}`};
  }
}

We can then run a gating module to check:

• Are there any gates on this route?
• Are there any gates for the customer on this route?
  • Check the customer ID
  • If so, fetch the restrictions
  • Check the payload against the gating

<aside> 💡 We could create our own JWT on the server side, based on the discord session from nextAuth, how would this work if the user changes DAOs? Does it need to be regenerated?

</aside>

Example for Bankless:

• User signs in
  • This creates a session object
  • When the user changes DAO, we need to pull the auth criteria for that user
    • In Bankless' case, this will be Discord Info
• In a sense we need component gating and not just route gating
  • Disable or hide the component, based on a web call
  • The component waits for the result of the call, before rendering