Update GoodCollective Homepage to include stats & explainer

[decentralauren]

Business Description

Current GoodCollective home page dumps people into a list of Collectives without any context for where they are or what to do! This update will add a section at the top of the page that describes GoodCollective and offers some quick stats.

Detailed Description of Functionality

Users will see this page when they navigate to gooddollar.org/goodcollective or goodcollective.xyz, whether or not they have a connected wallet. The new page contains:

• Header copy
• A short description
• A "How it works" button that links to a sub-page
• A "Donate to a Collective" button which indexes to the Collectives part of the same page (scrolls down)
• A "Create a Collective" button which directs users to our typeform
• Impact Stats, which include: Total # of pools/ Collectives, Total amount of donations (all time), Total # of wallets paid through collectives
• Another header and short description
• A list of all collectives as cards (which link to collective detail pages)

---

Technical Implementation

• [x] Add header component
• [x] add hook useSubgraphTotalStats
• [x] - move create pool button

Nice-to-have:

• [x] where possible and no time-waste, use native-base theming

Awaiting design:

• [x] How to works redirects

Design Reference

Figma link

Acceptance Criteria

Specify criteria that will be used to determine if the feature meets the requirements and functions correctly.

Test Cases

Specify the happy path and unhappy path scenarios to test to verify the feature works as expected.

[L03TJ3]

Impact Stats, which include: Total # of pools/ Collectives, Total amount of donations (all time), Total # of wallets paid through collectives

Based on above, all data needed to get to these numbers is on subgraph? @sirpy

[L03TJ3]

@decentralauren @SanaJamm still need the link for 'how it works'

[vldkhh]

verified on feature branch