https://gist.github.com/julien51/d38bcf8e556b6d91506897c0fb00f900

• Display a spinner while available options are loading
• Trim the option text if it's too long

Right now https://alpha.guild.xyz/agora is a valid URL, however, agora is not a guild.
The getStaticPaths of [guilds].tsx only uses guilds, but because of ISR, on the /agora request, we still fetch the data.

• Store strategy parameters in a unique field, e.g. strategyParams instead of the value field
• Map the strategyParams object to the value key (if needed) after submitting the form
• Remove the Next.js /api/strategies endpoint, it's unnecessary

• Display groups on the home page - using a Switch or even a Tabs component maybe?
• Search groups (home page)
• Group page - list guilds just like on the home page & display members like on the [guild] page
• Create guild page - with selectable and searchable guild (with dummy data for now!)
• Error animation on Create Group page
• Fix searchbar & order select spacing / layout
• Finalize submit button placement

Composition to remove ugly inner logic:
CustomizationButton
DeleteButton
(there's more but things will likely change in a way that we'll be able to just remove the affected logic from them so that's all for now)

And to remove duplication:
Layout, GroupLayout
GuildCard, GroupCard, SelectableGuildCard

Some API endpoints got removed / renamed, so we should rename them on the frontend too.

In some cases, NFT attributes aren't just plain strings / numbers. If the attribute format is "attribute_name": [0, 1], then it's a min-max attribute, and we should display it in the proper format.

Insert fun easter eggs in our UI in guild.xyz

Prize Bounty

0.25 ETH (∼ 1000 USD)

Challenge Description

Hide easter eggs in our UI, be creative and drop little animations, reactions, art in alpha.guild.xyz. Create creative Pixel Art that is only seen when a user is interacting with the page.

Submission Requirements

Fulfills the description, fits in the software stack and fits the theme of guild which is pixel art/medieval/crypto.

Judging Criteria

Fulfills the requirements, most creative and relevant to the given themes.

Winner Announcement Date

27 of November

Resources

Alpha: https://alpha.guild.xyz
Github repository: https://github.com/AgoraSpaceDAO/guild.xyz
Discord: https://discord.gg/bUEGDmy76H

Guild color + profile customization

Add an image uploader to the customization modal.

Exporting guild and group editing to [guild]/edit and [group]/edit, so browser navigation and tree-shaking will work correctly and the code is nicer

When a user provides an address in the NftFormCard component, we should check if it's available on Opensea, and if possible, list its attributes.

Exporting groups logic to groups.tsx, so it's shareable with a link, browser navigation will work correctly and the code is nicer

• Edit page: initialize form values in useForm instead of resetting the form
• NftFormCard: maybe it would be more convenient to register requirements.${index}.value0 and requirements.${index}.value1, so we don't need to conditionally register value, value.0, and value.1
• We could also add proper types to our form. E.g.: FormData type here: https://react-hook-form.com/get-started (TS section)
• Maybe we shouldn't use local state variables (like tokenDataFetched in the TokenFormCard component) for form validation, we could instead set & clear errors in useEffect with setError: https://react-hook-form.com/api/useform/seterror#main
• I think we should still wrap our custom select component in a Controller, and pass the provided props (ref, onChange, onBlur) to the select component. We'll just need to slowly rewrite the formcards to find out why could we see some "stuck" input fields in our fieldArray...
• For numeric inputs, we should use onChange properly instead of converting the input's value inside the value prop. E.g.: onChange={(newValue) => field.onChange(parseInt(newValue)), so the new value will be inserted as number in the form

FieldArray note (from the docs): inline defaultValue is required when working with useFieldArray by integrating with the value from fields object.

Optional:

• We could use the official devTools for easier debugging: @hookform/devtools
• WhitelistFormCard: https://react-hook-form.com/faqs => "How to work with modal or tab forms?"

Register ChakraReactSelect just like any other input (https://react-hook-form.com/api/usecontroller/controller/#main)

After adding the bot to a custom server, check if it's above every role, and if not display a modal that explains what to do that only closes once it has been moved to the top

A simple card with a textarea, where users can paste wallet addresses.

Show logos for tokens that're in https://tokens.coingecko.com/uniswap/all.json

We have a very similar basic fetching machine in useDeleteMachine and useJoinModalMachine, also use useSubmitMachine in EditButton for the same purpose with ugly abstractions. All of these should be replaced with immutable SWR hooks

Display access info on guild page (e.g.: Discord - {guild dc} - {channel name}

Own FormErrorMessage component to wrap Chakra's one in a Collapse so they appear and disappear smoothly

has-rock example link:
https://github.com/snapshot-labs/snapshot-strategies/tree/master/src/strategies/has-rock

On Harmony and Celo networks

We should show a modal when the user clicks on the "+ Whitelist" button, so they can paste and see whitelisted addresses in a more convenient way.

• Guilds in a specific group should use the group's theme mode
• Group page: title color should be determined dynamically (based on cover background color)
• Group page: cover color should be the picked theme color, and not the generated 500 swatch

Drawers for guild edit, role edit and role add

Integrate token-gated access to Jitsi for Guilds

Prize Bounty

1.2 ETH (∼5000 USD)

Challenge Description

Use a custom logic of NFTs, NFT traits, Snapshot strategies, POAPs or any ERC 20 tokens to gate video calls. Integrate alpha.guild.xyz’s API into Jitsi to its “create a meeting” page. On this page there should be a MetaMask integration where a message has to be signed, after signing the user should be able to choose a guild they are a part of from the API, and start a private call for that guild. The user can then send invitation links, but the recipients can only enter the call if they qualify for that guild’s requirements after signing a Metamask message.

Submission Requirements

Create a code repository for this Jitsi fork with the guild.xyz implementation that fulfills the description. It is possible to create a gated Jitsi call with guild requirements and the ones who don’t qualify can’t enter.

Judging Criteria

Fulfills the requirements in the safest way with the best UI/UX

Winner Announcement Date

27 of November

Resources

API doc: https://gist.github.com/Brunya/a49247445790baa2e8164c2771f034a7
Discord: https://discord.gg/bUEGDmy76H