Implement Escrow Contract Interaction via SDK

[meshackyaro]

Description

This issue aims to address the implementation of Implement Escrow Contract Interaction via SDK.

The core objective is to: Sign and submit the Soroban transaction when a gig is accepted.

By completing this feature, we will ensure that the TrustFlow protocol maintains its high standards for security, usability, and decentralized logic. This issue requires careful attention to the Frontend architecture and adherence to the existing project conventions.

When picking up this issue, please ensure you document any new dependencies or architectural decisions made during development.

Component

Frontend

Difficulty

🟡 Medium

Tasks

• Review Next.js App Router structure
• Implement the UI components for: Implement Escrow Contract Interaction via SDK
• Ensure responsive design using Tailwind CSS or standard modules
• Add caching for npm dependencies in CI
• Run npm run lint and npm run typecheck
• Run npm run build to verify production bundling

Acceptance Criteria

• Feature accurately implements the objective: Sign and submit the Soroban transaction when a gig is accepted.
• Any PR that introduces TypeScript/Rust errors is automatically blocked
• CI pipeline runs in under 3 minutes per PR
• Code is properly reviewed and approved by codeowners

Estimated Time

4-8 hours

[meshackyaro]

Integration Points

The Create Gig Wizard is ready for smart contract integration!

File to update: pages/create-gig.tsx

Look for the handleSubmit function (line ~103):

const handleSubmit = () => {
  if (validateStep()) {
    toast.success('Gig created successfully!')
    console.log('Gig data:', formData)
    // HERE: Add Soroban contract call to create escrow
  }
}

Form data structure:

• formData.title - Gig title
• formData.description - Full description
• formData.category - Category
• formData.totalBudget - Total XLM amount
• formData.milestones - Array of milestone objects with title, amount, duration

What you need to do:

1. Import the Soroban SDK contract bindings
2. Sign transaction with Freighter (requires Integrate @stellar/freighter-api #21)
3. Submit escrow creation to contract
4. Handle success/error states with toast notifications
5. Redirect to dashboard on success

The validation and UI flow are complete - just needs the blockchain layer!