Skip to content

refactor: extract duplicated code into shared utilities#4

Open
devin-ai-integration[bot] wants to merge 1 commit into
mainfrom
devin/1782167162-refactor-shared-utilities
Open

refactor: extract duplicated code into shared utilities#4
devin-ai-integration[bot] wants to merge 1 commit into
mainfrom
devin/1782167162-refactor-shared-utilities

Conversation

@devin-ai-integration

@devin-ai-integration devin-ai-integration Bot commented Jun 22, 2026

Copy link
Copy Markdown

Summary

Identified 5 duplicated code patterns in the frontend and refactored them into reusable shared modules:

New shared modules:

  • lib/constants.ts — single source of truth for PROTOCOL_FEE_PERCENT, USDC_DECIMALS, TASK_TYPES, and reusable Tailwind class strings (styles.input, styles.card, styles.buttonPrimary)
  • lib/fees.tscalculateCampaignCost() for display and calculateCampaignAmounts() for on-chain BigInt values (previously duplicated 3× inline in the cost summary + separately in handleCreate)
  • hooks/useCampaignContract.tsuseCampaignCount() and useCampaignActions() encapsulating repeated address + abi + functionName config
  • components/FormInput.tsx — reusable styled input (eliminates 3× repeated input class string)
  • components/CampaignCard.tsx / CostSummary.tsx — extracted card and fee breakdown display

Result: page.tsx reduced from 230 → 150 lines; all magic numbers and repeated styling consolidated. No behavioral changes.

Link to Devin session: https://app.devin.ai/sessions/d9f50441c19f4cd88146bcfdc96c9664
Requested by: @fcfsprojects


Open in Devin Review

- Add lib/constants.ts: protocol fee, USDC decimals, task types, reusable styles
- Add lib/fees.ts: calculateCampaignCost (display) and calculateCampaignAmounts (on-chain)
- Add components/FormInput.tsx: reusable styled input with label
- Add components/CampaignCard.tsx: campaign list item card
- Add components/CostSummary.tsx: fee breakdown display using shared calculation
- Add hooks/useCampaignContract.ts: encapsulates contract reads/writes
- Refactor page.tsx to consume shared modules (230 -> 150 lines)
- Add tsconfig.json with path aliases and next.config.js for build

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
@fcfsprojects fcfsprojects self-assigned this Jun 22, 2026
@devin-ai-integration

Copy link
Copy Markdown
Author

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment, CI, and merge conflict monitoring

@vercel

vercel Bot commented Jun 22, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
fcfsproject Ready Ready Preview, Comment Jun 22, 2026 10:36pm

@devin-ai-integration devin-ai-integration Bot left a comment

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

✅ Devin Review: No Issues Found

Devin Review analyzed this PR and found no potential bugs to report.

View in Devin Review to see 1 additional finding.

Open in Devin Review

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant