[GoodBounty]: Finalize Governance Dashboard Components PR

[L03TJ3]

Summary

Pick up the existing AI-generated PR for the Governance homepage components and make it ready
for human review. Create a new branch from: copilot/plan-governance-homepage-components
when you create a pull-request the target branch should also be that branch (not main)

Source items:

• Parent issue: [Feature]: Governance homepage components #46 [Feature]: Governance homepage components #
• Plan issue: [PLAN] Governance homepage components #47 [PLAN] Governance homepage components
• PR to finalize: Add governance homepage presentational components #49 Add governance homepage presentational components

The PR already adds:

• @goodwidget/governance-widget
• standalone presentational components for impact, balance, proposal, and funding-distribution UI
• Storybook stories under examples/storybook/src/stories/governance-widget/
• Playwright widget coverage under tests/widgets/governance-widget/

Focus on the remaining merge-readiness gaps, confirm the branch against the parent issue and plan issue, and leave the PR in a clean review state. make sure that the code is clean and maintanable. and visually the components should align with the shared screenshots.

there is also a figma and interactive stitch preview you can click through:
(figma has some additional comments)
https://www.figma.com/design/xsk5EiF6CvStA9mtdbA9OR/GoodWidget-Library?node-id=2311-3&p=f

https://stitch.withgoogle.com/projects/1959701114157262308?pli=1

Contributor task

• Claim the bounty with an ETA.
• Check out PR #49 and run it locally from the PR branch.
• Compare the implementation against issue #46, plan issue #47, ARCHITECTURE.md,
  docs/demo-environment.md, docs/qa-guide.md, and
  docs/architecture/theming-contract.md.
• Fix remaining gaps in implementation, verification, PR metadata, and review evidence.
• Refresh screenshots/videos if UI changes.
• Leave a handoff comment with what changed, what was tested, and remaining risks.

Known finish-work to verify or fix

• Remove web-only rendering from the shared governance package.
  packages/governance-widget/src/governanceComponents.tsx currently renders voter avatars with a
  raw <img> element. This package is meant to live in the cross-platform widget system, so the
  avatar implementation should be made compatible with the supported runtime targets instead of
  depending on a browser-only tag.
• The PR description should reference issue #46 and plan issue #47, and include a checklist
  mirroring the acceptance criteria covered by this branch.
• Re-verify Storybook and Playwright from a clean server/process.
  The governance stories are present in a fresh Storybook build and the widget Playwright suite
  passes against a clean build, but contributors should rerun verification from a clean local
  Storybook process and make sure the committed evidence matches the actual PR branch output.
• Confirm package-boundary discipline.
  Keep governance-specific composites local to packages/governance-widget unless a primitive is
  clearly reusable and intentionally promoted to packages/ui.
• Confirm the components match the requested UI.
  Do not introduce wallet, subgraph, contract, or runtime integration in this PR.
• Make the it modular. the upcoming main GoodReserveWidget.tsx will be the final ui. all these components should be split into their own respective files.

Scope checks

• PR #49 still solves the issue #46 requirements for presentational governance homepage components.
• The implementation follows plan issue #47 or clearly explains any deviation.
• Existing repo patterns and package boundaries are respected.
• Main happy paths and important edge states work for:
  ImpactCard, BalanceCard, AlignmentVotingProposalCard,
  OptimisticVotingProposalCard, and FundingDistributionChart.
• Storybook covers the expected light, dark, mobile, long-content, and empty/variant states.
• Playwright covers the main flows and the committed screenshots reflect the current branch output.
• Desktop and mobile layouts are usable.
• The PR description links the source issues and includes test evidence.

Required commands

pnpm install
pnpm run build
pnpm run lint
pnpm --filter @goodwidget/storybook build-storybook
pnpm test:demo tests/widgets/governance-widget

If a command cannot be run or fails for reasons outside this PR, document why in the handoff.

Current verification notes from review:

• pnpm run build passed on the PR branch after install.
• pnpm test:demo tests/widgets/governance-widget passed against a clean Storybook build.
• pnpm run lint currently fails in packages/core/src/provider.tsx with an existing
  @typescript-eslint/no-empty-object-type error that is outside the governance package. Confirm
  whether that failure is already known on the branch and document it explicitly if it remains
  unchanged.

[SineMag]

Hi @L03TJ3.. claiming this bounty. Available immediately, ETA 3 days.

I've reviewed #46, #47, and PR #49. Clear on the scope: fixing the <img> cross-platform issue, splitting components into separate files, visual alignment with Figma/Stitch, and clean Storybook + Playwright evidence.

[edehvictor]

Hi @L03TJ3, I'd like to take this on.

I'm an active contributor in the GoodDollar ecosystem and I've worked on this repo before, so I'm familiar with how the GoodWidget packages are structured, the package-boundary expectations, and the Storybook/Playwright verification flow.

I've gone through #50, the parent issue #46, the plan in #47, and the current PR #49. The scope is clear to me: keep the governance work presentational, clean up the component structure, keep the implementation inside packages/governance-widget, and verify the UI against the Figma/Stitch references.

My first pass would focus on the concrete finish-work called out in the issue: fixing the cross-platform avatar rendering issue, splitting the large governance component file into focused modules, checking light/dark and mobile layouts for the Impact, Balance, Proposal, and Funding Distribution components, then refreshing Storybook/Playwright evidence for tests/widgets/governance-widget.

ETA: 12-24 hours from assignment.

[HushLuxe]

Hi @L03TJ3
I'd like to take on this issue. As an active contributor, I am confident I can deliver a solid, production-ready completion for the Governance Dashboard

Thank you.

[eldwin-easynet-world]

I picked up the concrete finish-work from this bounty and submitted PR #52:

#52

Scope delivered:

• split the governance widget implementation into focused component/type/primitive/utility modules;
• replaced the browser-only voter avatar <img> with React Native Image;
• kept the package boundary presentational only, with no wallet/subgraph/contract/runtime integration.

Validation completed:

• corepack pnpm --filter @goodwidget/storybook... build
• STORYBOOK_DISABLE_TELEMETRY=1 corepack pnpm --filter @goodwidget/storybook build-storybook
• pnpm test:demo tests/widgets/governance-widget — 11 passed
• git diff --check
• no remaining <img> / old governanceComponents imports in the governance widget surface

Payment details can be provided privately after maintainer acceptance.

[L03TJ3]

Hey you are assigned @edehvictor

[L03TJ3]

@eldwin-easynet-world Hey, since its your first time contributing please read up on our goodbounties program: https://docs.gooddollar.org/for-developers/contributing/open-source-contributors/contributor-role

We prefer requesting to be assigned before doing any work.
besides that, the task is to also visually align with shared design references and your PR does not show any indication of having done that work

(like running the tests and generating the screenshots to proof that with test screenshots)

[eldwin-easynet-world]

Thanks for clarifying, and apologies for not following the GoodBounties assignment flow before opening PR #52. I have read the contributor role docs. Since @edehvictor is assigned, I will not continue pushing on the bounty unless you explicitly want anything from PR #52 reused or reviewed separately. You are welcome to close PR #52 if it is not useful for the assigned implementation. If you do want to keep any part of it as reference, I can also add the missing visual/test screenshot evidence there, but I understand that the bounty work should stay with the assigned contributor.

[edehvictor]

Thanks @L03TJ3, I appreciate the assignment.

I've started working on this now and will keep the scope aligned with #50, #46, #47, and PR #49. I'll follow up with a handoff once the fixes and verification are ready.

[Olisehgenesis]

Hi @L03TJ3 , claiming this bounty as Contributor.
Available now, ETA 12-24 hours.
I’ve reviewed #50, #46, #47, and #49 and I’m aligned with scope and acceptance criteria.